@charset "utf-8";

html { font-size:16px; scroll-behavior: smooth;}
body,div,dl,dt,dd,ul,ol,li,nav,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,blockquote,th,td,a {
    margin:0px; padding:0px;
    border-width: 0;
    text-shadow:none;
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    -o-transform-origin: left top;
    transform-origin: left top;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
b { font-weight: 600; }
img,table { margin:0px; padding:0px; border-width:0; }

a, a:link, a:active, a:visited, a:hover {
    font-size:inherit;
    font-family:inherit;
    color: inherit;
	-ms-transition: color 150ms linear;
	-moz-transition: color 150ms linear;
    -webkit-transition: color 150ms linear;
    transition: color 150ms linear;
}
a:hover {
    color: #330077;
    color: #404;
}
body {
  font-family:'Myriad Pro',Roboto,Arial,Verdana;
  font-weight: 300;
	color: #fff;
	background: #4af;
	background: #48f;
	font-size:1rem;
} 
.main {
  width: 100%;
  max-width:1680px;
  margin: 0px auto;
}

p { vertical-align: top; }
/*header { position:fixed; left:0px; top:0px; width:90%; margin: 0; padding: 15px 5%; padding-bottom:15px; background: #111; background: linear-gradient(to right, #202 0%, #111 100%); border-bottom: 2px solid #001; border-bottom: 2px solid #444; color:#fff; }
header .logo { display: inline-block; margin-left: 0px; margin-bottom:4px; padding: 0px; }
header .logo .logo-cnt {  background: url(img/ct-logo32.png) no-repeat; width:32px; height:32px; margin: 3px; margin-bottom: 0px; }
header .logo-text { 
	display: inline-block; font-size:0.9rem; line-height: 1.538rem; height:38px; vertical-align: top;
	margin-bottom: 4px; margin-left:4px;text-align: left; 
	color:#fff; padding: 1px 10px; padding-bottom: 3px; }

header .page-section { display: inline-block; vertical-align: top; margin: 2px; font-size:1rem; }

header .menu { display: inline-block; float:right; vertical-align:top; padding: 0px; text-align: right; }
header .menu ul { }
header .menu li { display: inline; margin:0px; margin-left:0px; padding:3px; }
header .menu a, header .menu a:active, header .menu a:visited, header .menu a:hover { 
	text-decoration: none;
	display:inline-block;
	background: #111; 
	font-size:1rem;
	padding: 12px 8px;
	color:fff;
	margin:0px;
	border-bottom: 2px solid #111;
}
header .menu a:hover { transition: border-color 300ms linear; border-bottom-color: #fff; color:#fff; }
*/

.resp-fs { display:block; height:100vh; }
.resp-fs .img-wrap {}
.resp-fs .img-cnt {}

.content .bgcol1 { background:#930; }
.content .txtcol1 { background:#fff; }

/*Mozilla based browsers */
::-moz-selection {
   background-color: #1ABC9C;
   color: #FFFFFF;
}
/* Works in Safari */
::selection {
   background-color: #1ABC9C;
   color: #FFFFFF;
}

.content { margin: 32px; margin-top: 100px; }
.pagemenu { padding: 24px; }
.pagemenu li { list-style: inside; }
.section {margin: 24px 0px; }
.section h1 { font-size: 1.75rem; font-weight: bold; padding: 1rem; text-align: center; margin-top:3rem; margin-bottom: 3rem; color:#fff; }
.section h2 { font-size: 1.25rem; font-weight: bold; margin: 1rem 0px; display:inline-block; border-bottom: 2px solid #dff; color:#fff; padding: 7px 3px; }
.section h3 { font-size: 1rem; font-weight: bold; margin: 0.5rem 0px; color:#fff; }
.section p { margin-bottom: 7px; }
.section .a1 { margin-bottom: 1rem; }
.section .a2 { margin-bottom: 2rem; }
.section .a3 { margin-bottom: 3rem; }
.section .a4 { margin-bottom: 4rem; }
.section .a5 { margin-bottom: 5rem; }
.section > p > img { max-width: 100%; height: auto; }
.section .example { padding: 8px 24px; padding-left:16px;  border-left: 2px solid #dff; margin: 12px 0px; }
.section .example ul li { margin-left:20px; margin-bottom: 7px; }
.section .example ol li { margin-left:25px; margin-bottom: 7px; }

.section .list { padding: 8px 24px; padding-left:16px; margin: 12px 0px; }
.section .list ul li { margin-left:20px; margin-bottom: 7px; }
.section .list ol li { margin-left:25px; margin-bottom: 7px; }


.table { margin: 0px; display: table; font-size: 1.125rem; width: 100%; }
.row {  display:table-row;  margin: 0px;  padding:8px 2px; width: 100%;  }
.table-3 .cell-1, .table-3 .cell-2, .table-3 .cell-3,
.table-2 .cell-1, .table-2 .cell-2 { border-bottom: 1px solid #8cf; padding:4px; padding-bottom:16px; }

.table-3 .title .cell-1, .table-3 .title .cell-2, .table-3 .title  .cell-3,
.table-2 .title  .cell-1, .table-2 .title  .cell-2 { padding-bottom:0px; padding-top:16px; }

.table-2 .cell-1 { display: table-cell; width: 30%; vertical-align: top; word-wrap: break-word; }
.table-2 .cell-2 { display: table-cell; width: 68%; vertical-align: top; word-wrap: break-word; }


.table-3 .cell-1 { display: table-cell; width: 19%; vertical-align: top; word-wrap: break-word; }
.table-3 .cell-2 { display: table-cell; width: auto; vertical-align: top; word-wrap:break-word;  word-break: break-all;  }
.table-3 .cell-3 { display: table-cell; width: 49%; vertical-align: top; word-wrap: break-word; }
.table-3 .cell-3 div, .table-3 .cell-3 p { word-wrap:break-word;  word-break: break-all;  }

.title { border-bottom: 1px solid #fff; font-size: 0.8rem; font-weight:bold;}
.arg-name, .arg-type, .code { font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace"; }
.code { background-color: #FFF; background: linear-gradient(to right, #fff 0%, #ddf 100%); color:#000; padding: 9px; margin-bottom: 5px; word-wrap: break-word; font-size:1.25rem; width:100%; }
span.code { display:inline-block; }
.arg-name { font-weight:bold; }
.arg-type {}

/* override styles when printing */


@media print {
  body {
    color: #000;
    background-color: #fff;
  }
	header {
		height: 0px;
		border: none;
		overflow: hidden;
	}
}


/*
.main {
  width: 100%;
  max-width:1680px;
  margin: 0px auto;
  background-color: #012;
  background-image: linear-gradient(to bottom, #080E17 0%, #2D0D51 30%, #220042 65%, #020032 100%);
}*/

/* Navigation */
header {

  width: 100%;
  height: 64px;
  background: none;
  max-width: 1680px;
  position: fixed;
  top:0px;
  background: #48f;
 transition: height 300ms ease-out, background 300ms linear;
}
/*
.header-scroll {
  transition: height 300ms ease-out, background 300ms linear;
  background: #000;
  height: 64px;
}*/

/* Coorporate Color Inline */

/*
.cibg { background:#0F1837; }
.cicol { color:#0F1837; }
*/

.logo {
  width: 32px;
  overflow: visible;
  float: left;
  margin: 15px 15px;
  margin-top: 13px;
}
nav {
  margin-right: 15px;
}
header nav ul {
  list-style: none;
  height:64px;
}
header nav ul li {
  float: right;
  color: #FFFFFF;
  font-size: 0.85rem;
  text-align: left;
  margin: 2px 10px;
  margin-left: 0;
  letter-spacing: 2px;
  font-weight: normal;
}
header ul li a, header ul li a:hover, header ul li a:active, header ul li a:visited  {
  display: inline-block;
  color: #FFFFFF;
  text-decoration: none;
  transition: color .2s linear;
  padding-top: 22px;
  
}
header ul li a:hover { transition: padding 200ms ease-out, border 200ms ease-out; padding-bottom: 4px; border-bottom: 3px solid; border-bottom-color: #fff; }

.menu-icon {
  display:inline-block;
  width: 48px;
  height: 48px;
  border-radius: 0;
  text-align: center;
  background: #111;
  vertical-align: top;
  margin-right: 16px;
  padding: 12px;
}
.menu-text {
  display:inline-block;
  vertical-align: top;
  max-width: 200px;
}

.about-popup, .docs-popup {
  padding: 0px;
  opacity: 0;
  height: 0px;
  overflow:hidden;
  position: fixed;
  right: 22px;
  top: 46px;
  color:#111;
  background: #eee;
  border-radius: 0px;
  transition: opacity 900ms ease-in-out, height 400ms ease-in-out, padding 400ms ease-in-out;
}
.about-popup p, .docs-popup p { margin-top: 0px; }
.about-btn, .docs-btn {
  position: relative;
}

.about-btn:hover .about-popup, .about-btn:active .about-popup,
.docs-btn:hover .docs-popup, .docs-btn:active .docs-popup {
  opacity: 1;
  height: 333px;
  padding: 16px;
}

.about-item, .about-item:active, .about-item:visited, .about-item:hover,
.docs-item, .docs-item:active, .docs-item:visited, .docs-item:hover  { text-decoration: none; color:#111; border:none; display: block; padding: 8px; cursor: pointer; transition: background 345ms ease-in-out, color 345ms ease-in-out; }
.about-item:hover, .docs-item:hover { background:#111; color:#eee; border-radius: 0px; }

.logo { transition: margin-left 300ms ease-out; }
.logo img { transition: width 300ms ease-out, padding 300ms ease-out; width:160px; height:auto; }

@media (min-width: 4px) and (max-width: 650px) {
  .logo { margin-left: 12px; }
  .about-popup, .docs-popup { right: 12px; }
  .logo img { width: 100px; height:auto; padding:2px 0px;  }
  nav { margin-right: 4px; }
  header ul li a, header ul li a:hover, header ul li a:active, header ul li a:visited { padding-top: 16px; }
  header { height: 54px; }
}