/* GLOBALHEADER */

#globalheader { width: 100%; padding: 0;  margin: 0 auto 10px auto; z-index: 999; white-space: nowrap;
	transition: background-color 0.6s cubic-bezier(.3, .73, .3, .74);
	text-shadow: 0 1px 2px #000, 0 1px 1px #000;
}

#globalnav {
	max-width: 898px;
	min-height: 25px;
	display: block;
	border: 0;
	padding: 0;
	padding-top: 12px;
	padding-bottom: 12px;
	overflow: hidden;
}

#globalheader ul {
	display: table;
	width: 100%;
	margin: 0 auto 0 auto;
}

#globalnav li { 
	display: table-cell;
	margin: -2px;
	width: auto;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	vertical-align: middle;
	transition: background 0.4s;
}

#globalnav #gn-megaseg { width: 30%; max-width: 230px; }
#globalnav #gn-products { width: 20%; }
#globalnav #gn-demo { width: 22%; }
#globalnav #gn-buy { width: 15%;  }
#globalnav #gn-contact { width: 13%; min-width: 0; }

#globalnav li a {
	display: block;
	line-height: 250%;
	vertical-align: middle;
	text-align: center;
	font-size: 150%;
	font-size: 3.4vmin;
	font-weight: 400;
}

#globalheader #gn-megaseg a {
	text-shadow: none;
	color: transparent;
	background: url(/images/megaseg.png?v630) no-repeat;
	background-size: 80% auto;
	background-position: center center;
	background-clip: none;
	transition: color 0s;
	transition: background-image 0.4s ease; 
}

#globalheader #gn-megaseg:hover a {
	text-shadow: none;
	color: transparent;
	background: url(/images/megaseg-fff.png) no-repeat;
	background-size: 80% auto;
	background-position: center center;
}

#globalnav #gn-contact a {
	text-shadow: none;
	color: transparent;
	background: url(/images/fidelity-media.png?v630) no-repeat;
	background-size: 45% auto;
	background-position: center center;
	transition: color 0s;
	transition: background-image 0.4s ease;
}

#globalnav #gn-contact:hover a {
	text-shadow: none;
	color: transparent;
	background: url(/images/fidelity-media-fff.png) no-repeat;
	background-size: 45% auto;
	background-position: center center;
}


/* ON STATES */

#globalheader.megaseg #gn-megaseg { transition: background 0s !important; }
#globalheader.megaseg li:hover#gn-megaseg { background: inherit !important; transition: background 0s !important; }
#globalheader.megaseg #gn-megaseg:hover a { 
	cursor: default !important;
	background: url(/images/megaseg.png) no-repeat !important;
	background-size: 80% auto !important;
	background-position: center center !important;
	transition: background 0s !important;
}
#globalheader.products #gn-products a { cursor: default; color: #fff; background: radial-gradient( rgba(255,255,255,0.11) 0%, transparent 33%) !important; }
#globalheader.demo #gn-demo a { cursor: default; color: #fff; background: radial-gradient( rgba(255,255,255,0.11) 0%, transparent 33%) !important; }
#globalheader.buy #gn-buy a { cursor: default; color: #fff; background: radial-gradient( rgba(255,255,255,0.11) 0%, transparent 33%) !important; }
#globalheader.contact #gn-contact {
	background: radial-gradient( rgba(255,255,255,0.11) 0%, transparent 33%) !important;
}
#globalheader.contact #gn-contact a { 
	cursor: default; 
	background: url(/images/fidelity-media-fff.png) no-repeat; 
	background-size: 45% auto;
	background-position: center center;
}


/* SCROLL STATES */

#globalheader.stelth {
	position: fixed;
	opacity: 0;
}
body.down #globalheader.stelth {
	position: relative;
	opacity: 0;
}
body.down #globalheader {
	position: fixed;
	top: 0;
	opacity: 1;
	background: #111111AA;
	transition: background-color 0.4s cubic-bezier(.3, .73, .3, .74);
}
body.down #globalheader { 
	-webkit-backdrop-filter: saturate(180%) blur(20px);	
	backdrop-filter:  saturate(180%) blur(20px);
}


/* PRODUCT HEADER */

#productheader { position: relative; overflow: hidden; max-width: 1024px; margin: -5px auto 0 auto; text-align: center !important; height: auto; padding-bottom: 15px}
#productheader ul {
	display: block;
	font-size: 18px; font-weight: 400; }
#productheader ul li { display: inline; margin-left: 3%; margin-right: 3%; white-space: nowrap; }
#productheader ul li a { padding: 0; line-height: 0; font-size: 2.6vmin; }
#productheader.overview #productnav #pn-overview a { color: #fff; } 
#productheader.features #productnav #pn-features a { color: #fff; } 
#productheader.userbuzz #productnav #pn-userbuzz a { color: #fff; } 
#productheader.outputs #productnav #pn-outputs a { color: #fff; } 
#productheader.controllers #productnav #pn-controllers a { color: #fff; } 
#productheader.faq #productnav #pn-faq a { color: #fff; } 
#productheader h1 a, #productheader h2 a { margin: 4px; padding: 3px; }



/* GLOBAL FOOTER */

#globalfooter { max-width: 980px; color: #999; font-size: 12px; margin: 18px auto; padding: 10px; padding-bottom: 36px; margin-top: -10px; text-align: left !important; }
#globalfooter span { display:block; font-size: 12px; font-weight: 300; letter-spacing: normal; line-height: normal; margin-bottom: +5px; }
#globalfooter p { margin-bottom: 1em; }
#globalfooter ul.piped a { padding: 0 0 0 1.5em; margin-left: 1.5em; border-left: 1px solid #888; }
#globalfooter .gf-links { float: right; margin: 0 3px 9px 0; }
#globalfooter .gf-copyright { clear: both; width: 100%; border-top: 1px solid #888; padding-top: 9px; }
#globalfooter .gf-copyright a { padding: 0 10px; }
#globalfooter .gf-copyright p { float: left; margin-left: 3px; }



#google_translate_element {
max-width: 980px; color: #888; font-size: 12px; margin: 18px auto; margin-top: -46px; padding-bottom: 36px; text-align: right !important; }


#mega-footer {
	background-color: #282828;
	color: #fff;
	margin-top: 60px;
	margin-bottom: -20px;
	clear: both;
}

#mega-footer a {
	color: var(--foot-links);
}
#mega-footer a:hover, #mega-footer a:focus {
	color: var(--foot-hover);
}
#mega-footer a:active {
	color: var(--link-hover);
}

#mega-footer .row {
	padding: 20px 10px 10px 10px;
	display: flex;
	flex-wrap: wrap;
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
}

#mega-footer .col {
	flex: 1;
	margin-right: 30px;
	min-width: 100px;
	margin-top: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
}

#mega-footer .col:first-of-type {
	min-width:  min-content;
}

#mega-footer .col:last-of-type {
	flex: 0;
	min-width: fit-content;
	margin-right: 0px;
}

#mega-footer .row span {
	font-size: .666em;
	font-weight: 600;
	margin-top: 0px;
	padding-top: 0px;
	margin-bottom: 10px;
	text-transform: uppercase;
	white-space: nowrap;
}

#mega-footer .row ul {
	list-style: none;
	padding: 0px;
	margin: 0px;
	margin-top: 1.4em;
	margin-bottom: 2em;
	font-size: .777em;
	line-height: 1.3em;
}

#mega-footer .row li {
	margin-bottom: 1.1em;
}

@media (max-width: 600px) {
	#mega-footer .col:last-of-type {
		flex: 1;
		margin-right: 30px;
	}
}

@media only screen and (max-device-width: 812px) {
	#mega-footer .row {
		padding-top: 3em;
		padding-left: 3em;
		align-content: center;
	}
	#mega-footer .col {
		flex: 1;
		flex-basis: 40%;
		margin-right: 2em;
		min-width: 200px;
		margin-top: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
	}
	#mega-footer .col:first-of-type {
		min-width:  min-content;
	}
	#mega-footer .col:last-of-type {
		flex: 1;
		flex-basis: 40%;
		margin-right: 50px;
		min-width: 200px;
  	}
  	#mega-footer .row span {
		font-size: 1.1em;
		margin-bottom: 1.666em;
  	}
	#mega-footer .row ul {
		margin-bottom: 3.33em;
	}
  	#mega-footer .row a {
		font-size: 1.666em;
		line-height: 1.33em;
  	}
	#mega-footer .row li {
		margin-bottom: 1.4em;
	}
}



/* RESET */

html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; }
ul,ol { list-style: none; }
fieldset,img { border: none; }
caption,th { text-align: left; }
table { border-collapse: collapse; border-spacing: 0; padding: 0; }



/* LAYOUT */

input, select, textarea { 
	margin: 4px;
	padding: 3px; 
	width: auto;
	background-color: #222; 
	color: #fff;
	font-size: 14px;
	border-style: solid;
	border-width: 1px;
	border-color: #999;
	vertical-align: middle;
}

input[type=button], input[type=submit] {
	font-size: 14px;
	font-weight: bolder;
	line-height: 22px;

	padding-left: 15px;
	padding-right: 15px;
	
	color: #fff;
 	height: 30px;
 	
	border-radius: 10px;
	border-color: #ccc;
	border-width: 0;

	background-attachment: initial;
	background-origin: initial;
	background-clip: initial;
	background-color: initial;
	background-position: initial;
	background-repeat: initial;
	background: #666;
		
	box-shadow: 0 1px 3px #000;
	text-shadow: 0 1px 1.5px #000;
	transition: background 0.4s;
	
	outline: none;
	cursor:pointer;
}

input[type=button]:hover, input[type=submit]:hover {
	background: #999;
	transition: background 0.2s;
}

input[type=button]:active, input[type=submit]:active {
	background: #444;
	transition: background 0.05s;
}

table { border-spacing: 5px; }

img { border: 0; }
img.left { float: left; margin: 2px 20px 16px 0; }
img.right { float: right; margin: 2px 0 16px 20px; }

iframe { border: none; }

blockquote { max-width: 666px; display: block; margin-left: auto; margin-right: auto; }


#container { max-width: 980px; padding: 10px; padding-bottom: 0; margin: auto; margin-bottom: 50px; position: relative; }

#containersplash { top: -22px; max-width: 980px; padding: 10px; padding-top: 0; padding-bottom: 0; margin: auto; margin-bottom: 50px; position: relative; }

#body-sub { max-width: 980px; padding: 0 24.5px 0 24.5px; margin: auto; margin-top: 40px; position: relative; }
#body-head { margin-bottom: 3.618em; }
#body-head h1 { color: #fff; text-align: center; margin-top: .618em; }
#body-head h2 { color: #eee; text-align: center; margin-top: .328em; }

#banner {
	display: block;
	margin: 20px 0;
	position: relative;
	padding: 0; 
	border-radius: 20px;
	overflow: hidden;
	width: 100%; max-height: 500px;
}

#banner img {
	display: block;
	width: 100%;
	height: 100%;
}

#newversion { 
	margin-bottom: -210px;
	z-index:999;
	display: block;
	position: absolute;
	top: 193px;
	left: 718px;
	width: 195px;
}


.clear { clear: both; }

.center { display: inherit; margin-left: auto; margin-right: auto; text-align: center; }

.float-right { float: right; margin-left: 15px; margin-bottom: 15px; margin-top: 7px; }

.product-item { clear: both; display: block; padding-bottom: 3.28em;}
.product-item > a > h2 { margin-bottom: .333em; }

.caption-link { text-align: center; margin-bottom: 20px; font-size: 9pt; }

.splash-box {
	display: table;
	border: 0;
	border-radius: 20px;
	resize: none;
	outline: none;
	height: auto;  
	font-size: 1.15em;
	line-height: 1.4;
	font-weight: 300;
	letter-spacing: .033em;
	text-align: left;
	overflow: hidden;
	color: #ddd;
	padding: 15px 25px 15px 25px;
	margin: 30px 0;
	filter: saturate(1) brightness(100%);
	transition: 0.666s;
}


.splash-box h2 { font-size: 1.2em; line-height: 1.4em; padding-top: 0; margin-top: 0; margin-bottom: .333em; font-weight: 400; }

.flex-parent {
	display: flex;
	width: 100%;
}
.flex-child {
	flex: 1;
	padding: 25px;
	margin: 0;
}
.flex-left {
	margin-right: 15px;
}
.flex-right {
	margin-left: 15px;
}

.imagerow-left { clear: both; }
.imagerow-right { clear: both; }
.imagerow-left img { float: left; margin:10px; padding-right: 30px; margin-left: -50px; }
.imagerow-right img { float: right; margin:10px; margin-left: 20px; margin-right: -50px; }



/* TYPE */

body {
	background-color: #141517;
	background: radial-gradient(circle at center top, #1B1C1E 20px, #141517 980px) no-repeat center top #141517;
	
	color: #ddd;
	font-family: system-ui, -apple-system, BlinkMacSystemFont, "San Francisco Display", 
    "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
    "Helvetica Neue", "Helvetica", "Arial", Verdana, sans-serif;
	font-size: 1.2em;
	font-weight: 300;
	line-height: 1.6em;
	letter-spacing: .033em;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

:root {
  --link-color: #55AAFF;
  --hover-color: #FFF;
  --foot-links: #ADDDFF;
  --foot-hover: #2997FF;
}

a { color: #55AAFF; color: var(--link-color); text-decoration: none; transition:color 0.4s; }
a:hover, a:focus { color: #fff; color: var(--hover-color); }
a:active { color: #ADDDFF; color: var(--foot-links); transition:color 0.0s; }

a.stealthLink { color: #fff; color: var(--hover-color); transition:color 0.4s; }
a.stealthLink:hover { color: #55AAFF; color: var(--link-color); }

a > h1 { color: #55AAFF; color: var(--link-color); transition:color 0.4s; }
a:hover > h1, a:focus > h1 { color: #fff; color: var(--hover-color); }

span.link { color: #55AAFF; color: var(--link-color); transition:color 0.4s; }
span.link:hover { color: #fff; color: var(--hover-color); }

p { font-size: 1.2em; 
	line-height: 1.6em; 
	margin-bottom: 1.66em; 
	letter-spacing: .0382em; 
	font-weight: 300; }

h1 { font-weight: 500; font-size: 1.8em; line-height: 1.1em; padding-bottom: 5px; margin-bottom: auto; color: #fff;  
	 -webkit-font-smoothing: antialiased;
}
h2 { font-weight: 400; font-size: 1.6em; line-height: 1.33em; margin-bottom: auto; color: #fff; 
	 -webkit-font-smoothing: antialiased;
}
h3 { font-weight: 400; font-size: 1.5em; line-height: 1.33em; margin-top: 1.666em; margin-bottom: .666em; color: #fff; 
	 -webkit-font-smoothing: antialiased;
}
h4 { font-weight: bolder; font-size: 14px; line-height: 18px; -webkit-font-smoothing: antialiased; }

code { color: #898; display: block; margin-left: 50px; word-break: break-all; }

ul { margin-bottom: 18px; list-style: none outside; }
ol { margin-bottom: 18px; list-style: decimal; margin-left: 2.5em; }
ol li { margin-top: 4px; margin-bottom: 15px; }
ul.square,
ul.square { list-style: square outside; }
ul ul.square { margin-top: 4px; margin-bottom: 5px; }

ul.square-spaced { margin-top: 10px; margin-left: 2em; margin-bottom: 2em; list-style: square outside; }
ul.square-spaced li { margin-top: 4px; margin-bottom: 1.2em; line-height: 1.5em; }

/* Tighter nested (level-two) list */
ul.square-spaced ul.square { margin-top: 4px; margin-bottom: 12px; margin-left: 2.666em; }
ul.square-spaced ul.square li { margin-top: 2px; margin-bottom: 2px; }

dl { margin-bottom: 40px; }
dt { margin-top: 20px; margin-bottom: 10px; font-size: 16px; line-height: 22px; color: #fff; }
dd { margin-left: 40px; margin-bottom: 40px; }


.medium  {
  font-size: 13px;
  font-weight: bolder;
  line-height: 19px;
  color: #ccc;
}
.bodybold {
  font-size: 14px;
  line-height: 18px;
  font-weight: bolder;
  text-align: center;
  color: #fff;
}
.mini   {
  font-size: 12px;
  font-weight: bolder;
  line-height: 17px;
  color: #ccc;
  padding-top: 4px;
  padding-left: 1px;
}

.review { display: block; color: #999; font-size: 1.333em; margin-top: 50px; line-height: 1.666em; text-align: center; margin:2.6em 3em 1.33em 3em;}
.sig { display: block; color: #ccc; font-size: 1.6em; font-style: italic; text-align: center; margin-bottom: 2.6em; margin-top: 5px; }




/* PILLED LINKS */

.pilled { display: block; zoom: 1; }
.pilled:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.pilled li { float: left; display: inline; }
.pilled a { border: 1px dashed #797c80; padding: 3px 7px; margin-right: 0.75em; border-radius: 20px; line-height: 2em;}
.pilled a.first { border: 1px solid #797c80; background-color: #3c4a5d; margin-right: 0.65em; }
.pilled a:hover, .pilled a:focus { background-color: #3a5983; border: 1px solid #797c80; }



/* PIPED LINKS */

.piped { display: block; zoom: 1; }
.piped:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.piped li { float: left; display: inline; }
.piped a { border-left: 1px solid #797c80; padding: 0 0 0 0.75em; margin-left: 0.75em; }
.piped a.first { border-left: 0 !important; padding-left: 0; margin-left: 0 !important; }
.piped a.social { border-left: 5px !important; padding-left: 18px !important; margin-left: 0 !important; }
.piped a.social:last-of-type { padding-left: 6px !important; }


.pipepad {
	width: max-content;
	padding-top:30px;
	margin-top: 0;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	align-content: center;
}
.pipepad li {
	float: none;
}



/* DOWNLOAD BUTTON */

.downloadBtn {
	background: linear-gradient(to bottom, #0b2d6e 0%, #141a37 66%);
	white-space: nowrap;
	border-radius: 17px;
	border: 2px solid #d4e2f6;
	display: block;
	cursor: pointer;
	color: #D5F2FE;
	font-weight: 400;
	font-size: 20px;
	line-height: 1.3em;
	padding: 18px 25px 18px 25px;
	text-shadow: 0 1px 1px #000;
	position: relative;
	filter: saturate(1.00) brightness(100%);
	margin-bottom: 10px;
	transition: all .33s;
	margin-left: auto;
	margin-right: auto;
	width: -webkit-max-content;
	width: max-content;
	min-width: 270px;
	text-align: left;
}
.downloadBtn input {
	text-align: center;
}
.downloadBtn span {
	font-size: 0.666em; margin: -2px; display: block;
	text-align: left;
}
.downloadBtn:hover, .downloadBtn:focus {
	border: 2px solid white;
	filter: saturate(1.33) brightness(120%);
	transition: all .666s;
}
.downloadBtn:active {
	color: #ccc;
	top: 1px;
	border: 2px solid #ccc;
	filter: saturate(1.00) brightness(110%);
	transition: all .2s;
}
.downloadBtn:before {
    background-image: url(/images/download-arrow.png);
	background-size: 50px 50px;
    display: inline-block;
    width: 50px; 
    height: 50px;
    float: left;
	margin-top: -2px;
	margin-bottom: 2px;
	margin-left: -4px;
	margin-right: 20px;
    content: "";
}



/* BUZZ CROSSFADER */

.buzz_cf {
	position: relative;
	height: 100px;
	width: 250px;
	top: 0;
	padding: 20px;
	font-size: .777em;
	line-height: 1.6em;
	font-style: italic;
	font-weight: 400;
	text-shadow: 0 2px 2px #000;
	color: #999;
}
.buzz_cf .sig {
	font-size: .888em;
	margin-left: 80px;
	padding: 5px;
	color: #777; 
}



/* TABLE */

.eventstable {
	border: 1px;
	border-color: gray;
	border-style: solid;
	max-width: auto;
	margin-left: 50px;
	margin-right: auto;
	margin-bottom: 20px;
}
.eventstable tbody tr {
	border-bottom-width: 0;
	border-bottom-color: gray;
	border-bottom-style: solid;
}
.eventstable tbody tr:nth-child(odd) { 
	background-color:#333; 
}
.eventstable td {
	border-left-width: 1px;
	border-left-color: gray;
	border-left-style: solid;
	text-align: left;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
}



/* RATE DIALOG */

#ratedialog { margin: 20px; margin-top: 15px; }
#ratedialog form {
	display: block;
	background: #333;
	background: linear-gradient(#444 20%, #333 100%);
	border: 0;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
	padding: 30px;
	box-shadow: 0 0 33px 6px #1E1E1E;
	border-radius: 33px;
}



/* LARGE SCREEN */

@media screen and (min-height: 1024px) {
	#globalnav li a {
		font-size: 150%;
	}
}

@media screen and (min-height: 1200px) {
	html { zoom: 1.5; }
}



/* SMALL SCREEN */

@media (orientation: portrait) {
  .flex-parent {
	flex-direction: column;
  }
  .flex-child {
	width: auto;
  }
  .flex-left, .flex-right { margin: 0; }
  .flex-left { margin-bottom: 20px; }
}


@media only screen and (max-device-width: 812px) { 
	html { -webkit-text-size-adjust: none; }
	#body-sub {
		padding: 3px 2.5%;
	}
	body p { font-size: 1.6em; line-height: 1.4em; margin-bottom: 1.666em; font-weight: 300; }
	body li { font-size: 18px; line-height: 1.4em; }

	body h1 { font-size: 2em; font-weight: 500; }
	body h2 { font-weight: 300; font-size: 1.8em; }
	body h3 { font-weight: 300; font-size: 1.8em; line-height: 1.4em; }
	body h4 { font-size: 1em; }
    
	xmp { word-wrap: break-word; }
    
	.splash-box {
		font-weight: 300;
		font-size: 1.6em;
		line-height: 1.4em;
	}
	
	.splash-box h2 {
		font-weight: 400;
		font-size: 1.2em;
		line-height: 1.4em;
		letter-spacing: .0382em;
		padding: 0;
	}
		
	.imagerow-right { padding-bottom: 15px;}
	.imagerow-left { padding-bottom: 15px;}
	
	.imagerow-right img { float: none; margin-left: 5%; margin-right:auto; width:100%; height:auto; }
	.imagerow-left img { float: none; margin-left: -5%; margin-right:auto; width:100%; height:auto; }
	
	.imagerow-right h2 { clear:both; padding-top: 0; }
	.imagerow-left h2 { clear:both; padding-top: 0; }
	
	.medium  {
		font-size: 17px;
		font-weight: bolder;
		line-height: 25px;
		color: #ccc;
	}
	
	#productheader {  margin-top: 10px; }
	#productheader ul {	
		display: inline; font-size: 18px; font-weight: 700; line-height: 40px; 
	}

	#globalfooter .gf-links { margin-bottom: 20px; float: unset; margin-left: auto; margin-right: auto; width: fit-content; }
	#globalfooter span { font-size: 20px; text-align: center; clear: both; }
	
	.pilled li { font-size: 1.666em; }
	.square-spaced li { font-size: 1.666em; }
	.square-spaced .square li { font-size: .666em; }
	
}