@import url(https://fonts.googleapis.com/css?family=Open+Sans:700,400,800);
@import url(https://fontlibrary.org/face/unicons);

html {
	height: 100%;
	margin: 0;
	font: normal 12pt 'Open Sans', Helvetica, sans-serif;		
	background-repeat: no-repeat;
	background: #333333; /* Old browsers */
	background: -moz-linear-gradient(top, #555555 0%, #000000) fixed; /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#555555), color-stop(100%,#000000)) fixed; /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #555555 0%,#000000) fixed; /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #555555 0%,#000000) fixed; /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #555555 0%,#000000) fixed; /* IE10+ */
	background: linear-gradient(to bottom, #555555 0%,#000000) fixed; /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#555555', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
}

h1, h2 {
	color: #fff;
	margin: 1px;
}
h3 {
	color: #eee;
	font-size: 12pt;
	margin: 0px;
}
b {
	font-weight: bold;
}
.extra {
	font-size: larger;
	font-weight: 800;
}
.super {
	font-size: smaller;
	font-weight: bold;
	color: #ccc;
	vertical-align: super;
}
.sub {
	font-size: 10pt !important;
	vertical-align: sub;
}
.unicon {
	font-family: 'UniCons';
	font-size: 20pt;
	font-weight: normal;
	opacity: .7;
	margin: 0px;
	padding: 5px;
	vertical-align: top;
}
#shield {
	position: fixed;
	z-index: 100;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
	background-color: #000;
	opacity: 0.5;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}
#formHeading {
	position: relative;
	left: 20px;
	top: 10px;
	width: 940px;
}
#logo {
}
#formTitleText {
	position: relative;
	left: 70px;
	top: -70px;
}
#info {
	position: relative;
	top: 10px;
	right: 80px;
	text-align: right;
	color: #eee;
	z-index: 10;
}
/*#info a {
	text-shadow: 0 0 15px #eee;
}*/
#info a {
	color: #68f;
}
#info a:visited {
	color: #b6f;
}
#main {
	position: relative;
	width: 940px;
	height: 800px;
	left: 10px;
	top: 0px;
	border: 1px solid #aaa;
	border-radius: 5px 5px 16px 16px;
	-moz-border-radius: 5px 5px 16px 16px; /* this works only in camino/firefox */
	-webkit-border-radius: 5px 5px 16px 16px; /* this is just for Safari/Chrome */
	background-color: #fff;
/*	box-shadow: 5px 5px 5px #aaa; */
	padding: 0px;
	margin: 0px;
}

#tabs {
	position: relative;
	top: -36px;
	width: 940px;
	height: 40px;
	margin: 4px;
	padding: 0px;
	z-index: 5;
}
#tabs li {
	display: inline;
	list-style: none;
}
#tabs li a {
	font: bold 16pt 'Open Sans', 'Helvetica', 'Sans-serif';
	border: 1px solid #555;
	border-bottom: none;
	padding: 3px 16px;
	margin: 2px;
	margin-top: -5px;
	color: #eee;
	background: #111;
	border-radius: 5px 5px 0px 0px;
	text-decoration: none;
}
#tabs li a.active {
	position: relative;
	top: 1px;
	color: #333;
	background: #fff;
}
#tabs li a.NA {
	text-decoration: line-through;
	color: #555;
	background: #777;
}
#disable {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 940px;
	height: 800px;
	background: black;
	opacity: .4;
	border-radius: 5px;
}
.tabContent {
	position: relative;
	top: -115px;
	float:left;
	left: 25px;
	margin: 0px;
	padding: 0px;
	padding-top: 100px;
	z-index: 1;
}
.prefix {
	font: normal 10pt 'Open Sans';
	position: relative;
	top: -20px;
	left: 10px;
	margin-bottom: 10px;
}
.questions {
	position: relative;
	top: -20px;
	float: left;
	margin: 0px;
	background: #eee;
	border-radius: 5px;
	width: 450px;
	padding-left: 20px;
}
.questions ul {
	margin: 0px;
	padding: 0px;
}
.questions ul li {
	list-style: none;
	margin: 0px;
	padding: 0px;
}
.profileField {
	width: 880px;
	height: 675px;
	padding: 0px;
}
div.profileField {
	width: 870px;
	height: 665px;
	margin: 0px;
	padding: 5px;
	overflow-y: scroll;
}
.hide {
	display: none;
}
.show {
	display: block;
}
.front {
	z-index: 10;
}
.instructions {
	position: relative;
	float: right;
	width: 380px;
	margin: 0px;
	padding-left: 25px;
	padding-right: 10px;
}
label {
	font: bold 11pt 'Open Sans';
}
.sublabel {
	font: normal 11pt 'Open Sans';
	line-height: 30px;
	vertical-align: 33%;
}
.sublabel2 {
	font: normal 10pt 'Open Sans';
	line-height: 30px;
	vertical-align: 33%;
}
.sublabel3 {
	font: normal 10pt 'Open Sans';
}
.profileLabel {
	display: inline-block;
	font: normal 12pt 'Open Sans';
	vertical-align: 50%;
	width: 195px;
}
.profileLabelsm {
    font: normal 11pt 'Open Sans';
    line-height: 30px;
    vertical-align: 33%;
    width: 195px;
    display: inline-block;
}
table {
	margin: 0px;
	padding: 0px;
}
table .sublabel {
	line-height: 10pt;
	vertical-align: middle;
	margin: 0px;
	padding: 0px;
}
td {
	vertical-align: top;
}	
.bottomborder {
	border-bottom: solid 1px #ccc;
	margin-bottom: 4px !important;
}
.topborder {
	border-top: solid 1px #ccc;
	margin-top: 4px !important;
}
input, textarea, select {
	height: 35px;
	width: 385px;
	margin: 3px;
	font: normal 11pt 'Open Sans';
}
.shorttext {
	width: 341px;
}
textarea {
	height: 33px;
	font-size: 12pt;
}
input[type=text],[type=email],textarea {
	border-radius: 5px;
	  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;

}
input[type=text]:focus,[type=email]:focus,textarea:focus {
	box-shadow: 0 0 10px #444;
}
input[type=radio],[type=checkbox] {
	width: 30px;
}
input[type=checkbox] {
	vertical-align: top;
}
input[type=submit],[type=button] {
	margin-top: 10px;
	margin-left: 30px;
	height: 40px;
	width: 200px;
}
input:required, select:required, textarea:required {
		  background-color: #cfc;
}
input[type=checkbox]:required {
  outline: 3px solid #cfc;
}
.matrixOption {
	display: inline-block;
	width: 175px;
}
.firstOption{
	width: 155px;
}
.NAoption {
	width: 95px;
}
#buttons {
	position: relative;
	top: -135px;
	left: 10px;
	clear: both;
	height: 50px;
	font: normal 14pt 'Open Sans';
}
#buttons a {
	font-weight: bold;
	font-size: 12pt;
}
#saveLink {
	padding: 2px 5px;;
	border: solid 1px #A4A4A4;
	background: #F8F8F8;
	border-radius: 2px;
	text-decoration: none;
	font: normal 12pt 'Open Sans' !important;
	color: #000;
}
#saveLink:hover {
	border: solid 1px #6D6D6D;
}
.bottomSpace {
	clear: both;
	height: 50px;
}

/*icons*/
#profiles a.icon{
	display: inline-block;
}
#profiles .icon{
	margin-right: 5px;
	width: 33px;
	height: 33px;
}
#profiles .trk{ background: transparent url(images/iconsStrip.png) -1352px 0 no-repeat; }
#profiles .tpms{ background: transparent url(images/iconsStrip.png) -1318px 0 no-repeat; }
#profiles .sms{ background: transparent url(images/iconsStrip.png) -1284px 0 no-repeat; }
#profiles .hr-rd{ background: transparent url(images/iconsStrip.png) -1250px 0 no-repeat; }
#profiles .rd{ background: transparent url(images/iconsStrip.png) -1216px 0 no-repeat; }
#profiles .exd{ background: transparent url(images/iconsStrip.png) -1182px 0 no-repeat; }
#profiles .rdr{ background: transparent url(images/iconsStrip.png) -1148px 0 no-repeat; }
#profiles .shft{ background: transparent url(images/iconsStrip.png) -1114px 0 no-repeat; }
#profiles .post{ background: transparent url(images/iconsStrip.png) -1080px 0 no-repeat; }
#profiles .bikelgt{ background: transparent url(images/iconsStrip.png) -1046px 0 no-repeat; }
#profiles .ctrlvideom{ background: transparent url(images/iconsStrip.png) -1011px 0 no-repeat; }
#profiles .ctrlaudiom{ background: transparent url(images/iconsStrip.png) -978px 0 no-repeat; }
#profiles .susp{ background: transparent url(images/iconsStrip.png) -944px 0 no-repeat; }
#profiles .fec{ background: transparent url(images/iconsStrip.png) -911px 0 no-repeat; }
#profiles .ctrlphone{ background: transparent url(images/iconsStrip.png) -877px 0 no-repeat; }
#profiles .sync{ background: transparent url(images/iconsStrip.png) -844px 0 no-repeat; }
#profiles .psa{ background: transparent url(images/iconsStrip.png) -811px 0 no-repeat; }
#profiles .cgm{ background: transparent url(images/iconsStrip.png) -778px 0 no-repeat; }
#profiles .mo2{ background: transparent url(images/iconsStrip.png) -745px 0 no-repeat; }
#profiles .rqt{ background: transparent url(images/iconsStrip.png) -712px 0 no-repeat; }
#profiles .act{ background: transparent url(images/iconsStrip.png) -679px 0 no-repeat; }
#profiles .temp{ background: transparent url(images/iconsStrip.png) -645px 0 no-repeat; }
#profiles .ctrlkeypad{ background: transparent url(images/iconsStrip.png) -611px 0 no-repeat; }
#profiles .ctrlvideo{ background: transparent url(images/iconsStrip.png) -578px 0 no-repeat; }
#profiles .ctrlgeneric{ background: transparent url(images/iconsStrip.png) -544px 0 no-repeat; }
#profiles .lev{ background: transparent url(images/iconsStrip.png) -510px 0 no-repeat; }
#profiles .ctrlaudio{ background: transparent url(images/iconsStrip.png) -476px 0 no-repeat; }
#profiles .bikectf{ background: transparent url(images/iconsStrip.png) -442px 0 no-repeat; }
#profiles .multispd{ background: transparent url(images/iconsStrip.png) -408px 0 no-repeat; }
#profiles .multigps{ background: transparent url(images/iconsStrip.png) -374px 0 no-repeat; }
#profiles .bikesc{ background: transparent url(images/iconsStrip.png) -340px 0 no-repeat; }
#profiles .geo{ background: transparent url(images/iconsStrip.png) -306px 0 no-repeat; }
#profiles .bp{ background: transparent url(images/iconsStrip.png) -272px 0 no-repeat; }
#profiles .stp{ background: transparent url(images/iconsStrip.png) -238px 0 no-repeat; }
#profiles .hrm{ background: transparent url(images/iconsStrip.png) -204px 0 no-repeat; }
#profiles .bikespd{ background: transparent url(images/iconsStrip.png) -170px 0 no-repeat; }
#profiles .footspd{ background: transparent url(images/iconsStrip.png) -136px 0 no-repeat; }
#profiles .weight{ background: transparent url(images/iconsStrip.png) -102px 0 no-repeat; }
#profiles .bikepwr{ background: transparent url(images/iconsStrip.png) -68px 0 no-repeat; }
#profiles .bikecad{ background: transparent url(images/iconsStrip.png) -34px 0 no-repeat; }
#profiles .fit{ background: transparent url(images/iconsStrip.png) 0 0 no-repeat; }

h4 {
	color: #000;
	font-size: 12pt;
	margin: 20px;
}
.response {
	width: 600px;
	margin-top: 20px;
	padding: 30px;
	border: solid 1px #aaa;
	border-radius: 5px;
	-moz-border-radius: 5px; /* this works only in camino/firefox */
	-webkit-border-radius: 5px; /* this is just for Safari/Chrome */
	background-color: #fff;
}
#fee {
	margin: 20px;
	font: bold 19pt 'Open Sans', 'Helvetica', 'Sans-serif';
}
