/* 1.1 - Base Styles */
html,body { margin: 0; padding: 0; border: 0; background-color:#fff}
html { font-size: 62.5%; -webkit-touch-callout:none; -webkit-text-size-adjust:none; -ms-text-size-adjust:100%; }
body { line-height: 1.4em; font-size:13px; color: #747576; font-family: Arial, Helvetica, sans-serif }
img {
    border: 0 none;
    display:block;
    max-width: 100%;
}
section {display:block}
h1, h2, h3, h4, h5, h6 {font-family:'Roboto Condensed',Arial,Helvetica,sans-serif; margin:0; font-weight:normal}
.thin {font-weight:300}
.bold {font-weight:700}
.caps {text-transform:uppercase;}

.blue {color:#5d498b}
.black {color:#5d498b}
.right {float:right}
.left {float:left}
h1 {
	font-size:2em;
	line-height:1.4em
}
h2 {
	font-size:2em;
	font-weight:700;
	line-height:1.5em
}
h3 {
	font-size:2em;
	line-height:1.2em
}
p {
	font-family:'Roboto Condensed',Arial,Helvetica,sans-serif;
	font-size:1.3em;
	line-height:1.4em;
	margin:30px 0
}
ul.check {padding-left:0}
ul.check li {
	background:url(images/check-mark.png) no-repeat 10px 4px;
	font-family:'Roboto Condensed',Arial,Helvetica,sans-serif;
	font-size:1.2em;
	line-height:1.6em;
	list-style:none;
	margin-bottom:10px;
	padding-left:40px;
}
/* 1.2 - Grid System */
.toolbar-wrapper { width: 100%; height: auto }

#transparency > .row:before, #transparency > .row:after  { content: ""; display: table; }
#transparency > .row:after { clear: both; }
#transparency > .row { zoom: 1; margin-bottom: 0px;}

.row { margin: 0 0 30px 0; }
.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12 {
	display: block;
	float: left;
	margin-top: 0;
	margin-right: 15px;
	margin-bottom: 15;
	margin-left: 15px;
}
.inner-left { margin-left: 0px !important; }
.inner-right { margin-right: 0px !important; }

.wrapper { width: 996px; margin: 0 auto; padding: 0 15px;  }
.toolbar { width: 996px; margin: 0 auto; }
.span1 { width: 53px; }
.span2 { width: 136px; }
.span3 { width: 219px; }
.span4 { width: 302px; }
.span5 { width: 385px; }
.span6 { width: 468px; }
.span7 { width: 551px; }
.span8 { width: 634px; }
.span9 { width: 717px; }
.span10 { width: 800px; }
.span11 { width: 883px; }
.span12 { width: 966px; }

.span3.adaptive-grid {width: 219px;}
.span3.adaptive-grid:nth-child(6n+7) {clear: none;}
.span3.adaptive-grid:nth-child(4n+5) {clear: both;}

/* 1.3 - Helper classes */
.center {
	float:none;
	margin:0 auto
}
.left {float:left}
.right {float:right}

.row:before, .row:after, .clearfix:before, .clearfix:after {content:"\0020";display:block;height:0;visibility:hidden}
.clearfix:after, .row:after { clear:both; }
.clearfix, .row { zoom:1; }

.p0 { margin-bottom: 0px !important; }
.p5 { margin-bottom: 5px !important; }
.p10 { margin-bottom: 10px !important; }
.p15 { margin-bottom: 15px !important; }
.p20 { margin-bottom: 20px !important; }
.p25 { margin-bottom: 25px !important; }
.p30 { margin-bottom: 30px !important; }
.p40 { margin-bottom: 40px !important; }
.p50 { margin-bottom: 50px !important; }
.p60 { margin-bottom: 60px !important; }
.p80 { margin-bottom: 80px !important; }

.pt0 {margin-top:0 !important}
.pt20 { margin-top: 20px !important; }
.pt25 { margin-top: 25px !important; }
.pt30 {
	margin-top: 30px !important;
	text-align: center;
}
.pt40 { margin-top: 40px !important; }
.pt50 { margin-top: 50px !important; }
.pt60 { margin-top: 60px !important; }
.pt100 { margin-top: 120px !important; }
.fr { float: right !important; }
.fl { float: left !important; }
.fn { float: none !important; }

.tr { text-align: right; }
.tl { text-align: left !important; }
.tc { text-align: center !important; }

.display-table { display: table; height: 100%; }
.display-table-cell { display: table-cell; vertical-align: middle; display:inline-block; }
.table { display: table; margin: 0 auto; }
.fixed { position: fixed; }

hr.divider { margin: 15px 0; background: #333; height: 1px; border: 0; }

.boxsized {
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
}
.fixedbg {
	background-attachment:fixed;
}

/* Main Styles */

#intro {
	background:#f9f9f9 url(images/img-main.jpg) no-repeat fixed center -100px;
	background-size:cover;
	height:755px;
	-webkit-animation: fadein 3s;
    -moz-animation: fadein 3s;
    -ms-animation: fadein 3s;
    -o-animation: fadein 3s;
    animation: fadein 3s;
}
#intro div.span12 {display:none}
#intro .logo {
	margin:180px auto 60px
}
.header-holder {
	height:70px
}
#header {
	background-color:#5d498b;
	height:70px
}
#header.fixed {
	left:0;
	position:fixed;
	top:-70px;
	width:100%
}
#header img.logo {margin-top:5px}
#header nav a {
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
	color:#fff;
	font-family:'Roboto Condensed','Din','Univers',Arial,Helvetica,sans-serif;
	font-size:1.4em;
	float:left;
	padding:26px 15px;
	text-align:center;
	text-decoration:none;
	text-transform:uppercase;
}

#header nav a.span2 {
	padding:20px 10px 20px 0
}
#header nav a.active,
#header nav a:hover {
	background-color:#2AA9AA;
}
#header nav a:active {

}
#header .login {cursor:pointer;}
#mobilenav {
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
	border:2px solid #232323;
	float:right;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	padding:6px;
	margin-top:15px;
}
/* 2.1 Sections */
#section-1 {
	background:url(images/img-lab.jpg) no-repeat center center;
	background-size:cover;
	height:600px;
}
#section-2 {
	background:url(images/img-formula.jpg) no-repeat center center;
	background-size:cover;
	height:600px;
}
#section-2 h3 {margin-bottom:40px}
#section-2 table {width:100%}
#section-3 {
	background:url(images/img-about-background.jpg) no-repeat fixed center top;
	background-size:cover;
	padding-bottom:50px
}

#section-3 .intro img {
	margin:0 25px 25px 0
}
#section-3 .intro h5 {
	font-size:2.3em;
	margin-bottom:16px
}
#section-3 .intro h6 em {
	font-size:2.4em;
	font-weight:300
}
#section-3 .intro p {margin:10px 0}
#section-3 .expando {
	overflow:hidden
}
#section-3 .expando p {
	font-size:1.1em;
	line-height:1.6em;
	margin:0 0 20px
} 
#section-3 .expando .read-more a,
#section-3 .expando .read-less a {
	color:#747576;
	text-decoration:none;
}
.read-more img,
.read-less img {
	margin:0 auto
}
#section-4 {
	background-color:#232323;
	color:#fff;
	padding-bottom:50px
}
#section-4b {
	background-color:#fff;
	color:#232323;
	padding-bottom:75px
}
#section-4 input,
#section-4 textarea {
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
	border:2px solid #232323;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	margin-bottom:6px;
	padding:8px;
	width:100%
}
#section-4 input:focus,
#section-4 textarea:focus {
	border:2px solid #5d498b;
}
#section-4 textarea {
	max-width:551px;
	min-height:70px
}
#section-4 input.submit {
	background-color:#5d498b;
	border:0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color:#fff;
	cursor:pointer;
	display:inline-block;
	font-family:'Roboto Condensed','Din','Univers',Arial,Helvetica,sans-serif;
	font-size:1.4em;
	line-height:0.8em;
	margin-top:10px;
	padding:5px 20px 7px;
	text-transform:uppercase;
	width:130px
}
#section-4 input.submit:hover {
	background-color:#5d498b;
} 
#section-4 input.submit:active {
	background-color:#426399;
}
.hu {display:none}
#section-4 p.copy {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 15px;
	margin-left: 0;
}
.feedback {display:none}
#section-4 .feedback {
	color:#fff;
	font-size:12px;
	float:right;
	margin-top:10px;
	text-align:right
}
#section-4 p a {color:#fff}
.forms {padding-left:0}
.forms li {list-style:none}
.scroll {
	color:#15426a;
	font-family:'Roboto Condensed','Din','Univers',Arial,Helvetica,sans-serif;
	font-size:14px;
	text-decoration:none
}
.scroll img {margin-top:5px}
.stupidline {
	background-color:#9e9e9f;
	height:5px;
	margin:0 auto 30px;
	width:90px;
}
.spacer {
	background:url(images/img-parallax.jpg) no-repeat fixed center center;
	background-size:cover;
	padding:100px 0
}
.spacer h3 {
	color:#fff;
	font-size:2em;
	text-align:center
}
.btn {
	background-color:#5d498b;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color:#fff;
	cursor:pointer;
	display:block;
	font-family:'Oswald','Din','Univers',Arial,Helvetica,sans-serif;
	font-size:1.8em;
	margin:0 auto;
	padding:15px;
	text-align:center;
	text-decoration:none;
	width:300px;
}
.btn:hover {background-color:#5d498b;}
.btn:visited {background-color:#921b3c;}
.mobileshow {display:none}
.mobilehide {display:block}

.shade {
	background-color: rgba(255, 255, 255, 0.8);
	display:none;
	height:100%;
	position:fixed;
	width:100%;
	z-index:100000
}
.modalclose {
	background:url(images/btn-close.png) no-repeat;
	opacity:0.6;
	cursor:pointer;
	height:40px;
	position:fixed;
	right:10px;
	top:10px;
	width:40px;
	z-index:100001
}
.modalclose:hover {opacity:0.9}
.modal {
	background-color:#486ca8;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	color:#fff;
	display:none;
	height:370px;
	position:fixed;
	text-align:center;
	top:100px;
	z-index:100001
}
.modal h3 {
	font-family:'Roboto','Din','Univers',Arial,Helvetica,sans-serif;
	font-size:2.3em;
	font-weight:600;
	letter-spacing:-1px;
	margin:40px auto 20px
}
.modal .stupidline {margin:0 auto 40px}
.modal input[type="text"],
.modal input[type="password"] {
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
	border:2px solid #486ca8;
	display:block;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	margin:0 auto 10px;
	padding:10px 8px;
	width:100%
}
.modal input[type="text"]:focus,
.modal input[type="password"]:focus {
	border:2px solid #333;
}
.modal .submit {
	background-color:#003466;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	border:0;
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
	color:#fff;
	cursor:pointer;
	font-family:'Roboto Condensed','Din','Univers',Arial,Helvetica,sans-serif;
	font-size:1.4em;
	margin:0 auto;
	padding:4px 8px;
	text-transform:uppercase;
	width:100%
}
.modal .submit:hover {
	background-color:#5d498b;
}
.modal .submit:active {
	background-color:#2aa8a9;
}
.modal p {
	display:none;
	font-size:1em;
	margin:10px 0
}
.modal p a {color:#fff}
@media only screen and (min-width: 768px) and (max-width: 1026px) {
	.logo { max-width: 738px; }
	.wrapper, .toolbar { width:768px; }
	.span1 { width:34px; }
	.span2 { width:92px; }
	.span3 { width:162px; }
	.span4 { width:226px; }
	.span5 { width:290px; }
	.span6 { width:354px; }
	.span7 { width:418px; }
	.span8 { width:482px; }
	.span9 { width:546px; }
	.span10 { width:610px; }
	.span11 { width:674px; }
	.span12 { width:738px; }
}


/* 4.4 - Mobile Landscape */
@media only screen and (min-width: 510px) and (max-width: 629px) {
	.mobilehide {display:none}
	.mobileshow {display:block}
	.mobile-wrapper {display: block;}
	section#nav { display:none; }
	nav.mobile, .menu-icon { display: block; }
	nav.mobile { padding: 0; }

	.logo { max-width: 450px;  }
	.logo { margin: 0 auto; float: none; text-align: center; }
	.toolbar .search-field { display: none; }
	.wrapper, .toolbar { width:480px; font-size:0.8em }
	.span1 { width:10px; }
	.span2 { width:50px; }
	.span3 { width:90px; }
	.span4 { width:130px; }
	.span5 { width:170px; }
	.span6 { width:450px; }
	.span7 { width:250px; }
	.span8 { width:290px; }
	.span9 { width:330px; }
	.span10 { width:370px; }
	.span11 { width:410px; }
	.span12 { width:450px; }
	.toolbar {width: 100%; padding: 0 40px; box-sizing: border-box;}

	.pt20 { margin-top:10px !important; }
	.pt25 { margin-top:10px !important; }
	.pt30 { margin-top:10px !important; }
	.pt40 { margin-top:10px !important; }
	.pt50 { margin-top:10px !important; }
	.pt60 { margin-top:10px !important; }
	.tl, .tr {text-align:center !important}
	.header-holder,
	#header {height:auto}
	#section-1,
	#section-2 {
		background: rgba(255,255,255,1);
		background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(222,222,222,1)));
		background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dedede', GradientType=0 );
		height:auto;
		padding:20px 0 40px
	}
	.mobileshow {display:block}
}

/* 4.5 - Mobile Portrait */
@media only screen and (max-width: 509px){
	.mobilehide {display:none !important}
	.mobileshow {display:block}
	.right {float:none}
	.left {float:none}
	.mobile-wrapper {display: block;}
	.logo { margin: 0 auto; float: none;}
	.logo img {  display:block; margin: 0 auto; max-height: 30px; max-width: 100%; }
	section#nav { display:none; }
	nav.mobile, .menu-icon { display: block; }
	nav.mobile { padding: 0; }
	.wrapper { padding: 0;  font-size:0.8em}
	.wrapper, .toolbar { width:320px; }
	.span1,.span2,.span3,.span4,.span5,.span6,.span7,.span8,.span9,.span10,.span11,.span12, .span4.logo-wrapper { width:290px; } 
	.pt20 { margin-top: 10px !important; }
	.pt25 { margin-top: 10px !important; }
	.pt30 { margin-top: 10px !important; }
	.pt40 { margin-top: 10px !important; }
	.pt50 { margin-top: 10px !important; }
	.pt60 { margin-top: 10px !important; }
	.tl, .tr {text-align:center !important}
	.header-holder,
	#header {height:auto}
	#mobilenav {
		float:none;
		margin:0 auto 10px;
		width:100%
	}
	#section-1,
	#section-2 {
		background: rgba(255,255,255,1);
		background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(222,222,222,1)));
		background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(222,222,222,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dedede', GradientType=0 );
		height:auto;
		padding:20px 0 40px
	}
	#intro .logo {
		margin:140px auto 40px;
	}
	#intro {height:auto}
	table tr td {
		display:block;
		width:100%
	}
	select{
	font-size: 50px;
	}
	#section-4 input.submit {
		display:block;
		margin:10px auto;
		width:100%
	}
}
@keyframes fadein {
    from { opacity: 0.2; }
    to   { opacity: 1; }
}
@-moz-keyframes fadein {
    from { opacity: 0.2; }
    to   { opacity: 1; }
}
@-webkit-keyframes fadein {
    from { opacity: 0.2; }
    to   { opacity: 1; }
}

@-ms-keyframes fadein {
    from { opacity: 0.2; }
    to   { opacity: 1; }
}​

@-o-keyframes fadein {
    from { opacity: 0.2; }
    to   { opacity: 1; }
}​

address {font-style:normal}
input,
textarea {
	background-color:#cbcbcb;
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
	border:1px solid #c1c1c1;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	padding:8px 12px;
	width:100%
}
input.error,
textarea.error {border:1px solid #d70000}
.req {color:#d70000}
input:focus,
textarea:focus {
	border:1px solid #9b9b9b;
}
textarea {
	max-width:551px;
	min-height:80px
}
input.submit {
	background:#9d78f8 url(images/icon-contact-plane.png) no-repeat center 3px;
	border:0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color:#fff;
	cursor:pointer;
	display:block;
	float:left;
	font-family:Arial,Helvetica,sans-serif;
	font-size:1em;
	height:30px;
	line-height:0.8em;
	padding:60px 20px 20px;
	width:130px
}
input.submit:hover {
	background:#ab8afc url(images/icon-contact-plane.png) no-repeat center 3px;
} 

.hu {display:none}
p.copy {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin:20px 0 0
}
.feedback {display:none}
.feedback {
	color:#fff;
	font-size:12px;
	float:right;
	margin-top:10px;
	text-align:right
}
iframe {
	margin:20px 0 20px;
	width:100% !important
}
.forms {padding-left:0}
.forms.spaced li {margin-bottom:5px}
.forms.spaced textarea {min-height:90px}
.forms li {list-style:none}
.forms li.span3 {
	width:229px
}
.forms li.span4 {
	width:322px
}
