@charset "utf-8";
/*------------------------------------------------------

	CSS TOB: 

	1. RESETS
	2. COMMONS
	3. STRUCTURAL
	4. TYPO & LINKS
	5. MISC
		
---------------------------------------------------------*/

/*--------------------------------------------------------
	1.RESETS
--------------------------------------------------------*/
	
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/*--------------------------------------------------------
	2.COMMONS
--------------------------------------------------------*/


body {
	background: #fff;
	font: 13px/18px 'Lato',Arial, Helvetica, sans-serif;
}
/*--------------------------------------------------------
	3.STRUCTURAL 
--------------------------------------------------------*/


	/*----------------------------
	i.-- Page
	-----------------------------*/
	
.homepage, .page {
	overflow: hidden;
}
.page.desktop {
	position: relative !important;
	z-index: 6;
}
.page {
	padding-top: 100px;
}
.page .content {
	max-width: 930px;
	margin: auto;
	position: relative;
	padding-bottom: 100px;
}
.page.odd {
	background: #f4f4f5;
	background-attachment: scroll;
}
.page.even {
	background: #111;
	background-attachment: scroll;
}
/*odd*/
.page.odd {
	color: #888;
}
/*even*/
.page.even {
	color: #888;
}
/*----------------------------
	ii.-- Header
	-----------------------------*/
	
	/*inner pages*/
.header {
	width: 100%;
	height: 60px;
	line-height: 60px;
	background: #282828;
	position: fixed;
	top: 0;
	z-index: 50;
}
.header.header-main {
	display: none;
}
.header.mobileHeader {
	display: none;
}
.header .inner {
	max-width: 930px;
	margin: auto;
}
.header .logo-container {
	height: 60px;
	position: relative;
	float: left;
	margin-top: 10px
}
.header .logo-container .logo {
	position: relative;
	bottom: 0;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.46);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.46);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.46);
}
/* main menu
		----------------------------*/
		
.header .inner ul.navigation {
	position: relative;
	overflow: hidden;
	list-style: none;
	float: right;
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	font-weight:400;
	text-transform:uppercase;
	margin: 0;
}
.header .inner ul.navigation li {
	float: left;
	padding: 0 5px;
}
.header .inner ul.navigation li:last-child {
	padding-right: 0;
}
.header .inner ul.navigation li a {
	font-family: 'Lato', sans-serif;
	color: #fff;
	text-decoration: none;
	padding: 5px 10px;
}
.header .inner ul.navigation li a:hover {
	color: #ccc;
}
.header .inner ul.navigation li a.active {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	padding: 5px 10px;
	background: #333;
	color: #EEEEEE;
	padding: 5px 10px;
	text-decoration: none;
}
/* mobile menu toggle
		----------------------------*/	
		
.header .inner .mobileMenuToggle {
	height: 26px;
	width: 100%;
	float: left;
	text-align: center;
	display: none;
	margin: 19px auto 15px auto;
}
.header .inner .mobileMenuToggle a, .header .mobileMenuToggle.open a {
	width: 26px;
	height: 26px;
	float: left;
	position: relative;
	left: 50%;
	margin-left: -13px;
}
.header .inner .mobileMenuToggle a {
	background: url(../images/mobileMenu-toggle.png) center 0 no-repeat;
}
.header .inner .mobileMenuToggle.open a {
	background: url(../images/mobileMenu-toggle.png) center -26px no-repeat;
}
/*----------------------------
	iii.-- Content
	-----------------------------*/
	
	
	/*section title + teasers
	----------------------------*/
#teaser-1{
	background:#b02326;
	height:600px!important;
}
#teaser-1 .info-inner{
	margin:0;
}
#teaser-1 h1{
	font-size:45px;
	text-align:center;
	font-weight:300;
	margin-bottom:0;
}
#who .info-inner,#what .info-inner,#benefits .info-inner,#jobs .info-inner{
	text-align:left;
}
#who h2,#what h2,#benefits h2,#jobs h2{
	text-transform:uppercase;
	font-weight:300!important;
	font-size:50px!important;	
	text-align:left;	
}
#benefits{
	background-color: #5e452b;
}
#who h2{
	color:#333;
	text-shadow:0 1px 1px #f0ebcf;
	margin-top:40px;
}
#who .info-inner p,#what .info-inner p{
	color:#333;
	margin-bottom:20px;
	line-height:22px;
}
#what .info-container .info,#benefits .info-container .info,#jobs .info-container .info{
	padding:50px 0;
}
#benefits .column_one_half p{
	line-height:20px;
	width:350px;
}
#benefits .last p{
	width:400px!important;
}
#benefits .button{
	margin-top:30px;
}
.stars{
	display:block;
	height:16px;
	width:85px;
	margin:10px 0;
	background:url(../images/stars.png) no-repeat top left;
}
.divider{
	display:block;
	width:100%;
	height:5px;
	background:url(../images/divider.png)no-repeat top left;
}
.benefits{
	text-align:left;
	background:#000;
	padding:20px 2% 20px 2%;
	width:42%!important;
	margin:0!important;
}
#benefits h5{
	font-size:14px;
	color:#fff;
	font-weight:400;
	margin-bottom:0px;
	text-align:left;
}
.benefit{
	margin-bottom:20px;
}
.benefit p{
	color:#ccc;
	width:400px;
}
.joblist{
	padding-left:25px;
	margin-bottom:30px;	
}
.joblist li{
	list-style-image:url(../images/bullet.png);
	font-size:16px;
	line-height:30px;
}
.joblist li a{
	color:#39f;	
}
.joblist li a:hover{
	color:#393961;	
}
#what .info-inner p{
	color:#fff;
}
#what h2{
	color:#fff;
}
#benefits .teaser .info-container .info{
	vertical-align:top;
}
#teaser-1 h2{
	text-align:center;
	font-weight:700;
	font-size:30px;
}
#teaser-1 h1,#teaser-1 h2{
	text-shadow:0 1px 1px #333;
}
a.button{
	padding:2px 20px;
	background:#369;
	color:#fff;
	text-shadow:0 1px 1px #333;
	cursor:pointer;	
	text-align:center;
	display:inline-block;
}
a.button span{
	color:#fff;
}
a.button:hover{
	background:#000;
	color:#ccc;
}
a.button.black{
	background:#000;
	color:#999;	
}
a.button.black:hover{
	background:#282828;
}
#teaser-1 .info-inner{
	width:650px;
	text-align:center;
}
#teaser-2{
	background:#d3ceb5;	
	height:500px!important;	
}
#teaser-4{
	background-repeat:repeat-x!important;
	height:760px!important;	
}
#lilly{
	height:1000px!important;
	background:url(../images/bg-teaser-3.jpg) repeat-x -1px 0 ;
	position: relative;
}
#lilly-inner{
	background:url(../images/bg-3.jpg) no-repeat 100% 0;
	height:1000px!important;	
}
#products{
	margin-top:-265px;
}
#products h3{
	color:#fff;
	font-weight:300;
	font-size:45px;
	line-height:45px;
	width:300px;
}
#products h3 span{
	color:#060bd9;
	line-height:50px;
	font-weight:300;	
}
#products p{
	color:#999!important;
	margin-bottom: 10px!important;
	font-size: 16px;
}
.section-title {
	width: 100%;
	padding-bottom: 50px;
	margin-bottom: 50px;
}
#video{
	width:450px;
	height:300px;
	background:#fff;
	margin:80px 0 30px 0;
}
.devices{margin-top:60px}

/*odd*/
.page.odd .section-title {/*border-top:1px solid #e2e2e2;*/
	border-bottom: 1px solid #e2e2e2;
}
/*even*/
.page.even .section-title {/*border-top:1px solid #444;*/
	border-bottom: 1px solid #222;
}
.teaser {
	width: 100%;
	height: 480px;
	padding: 0;
	margin: 0;
	background-attachment: fixed;
	background-repeat: no-repeat!important;
	border-top: 5px solid rgba(0,0,0,0.2);
	border-bottom: 5px solid rgba(0,0,0,0.2);
	color: #fff;
	text-align: center;
	position: relative;
}
.info-container {
	display: table;
	max-width: 930px;
	width: 930px;	
	height: 100%;
	padding: 0 !important;
	margin: 0 auto!important;
}
/*non-repeated image*/	
.teaser.fixed {
	background-attachment: fixed;
}
.teaser.fixed-desktop {
	background-attachment: fixed !important;
}
/*repeated image*/
.teaser.scroll {
	background-attachment: scroll;
}
.teaser .info-container .info {
	display: table-cell;
	vertical-align: middle;
}
.teaser .info-container .info blockquote {
	border: none;
	margin: 0;
	padding: 0;
	font: 25px/35px 'Open Sans', sans-serif !important;
}
.teaser .info-container .info blockquote p {
	text-transform: none;
}
/*video + content*/
.teaser .info-container .info .info-inner {
	margin: auto;
}
.teaser .info-container .info .info-inner .video {
	margin: 0;
}
/*video only*/
.teaser .info-container .video {
	margin: auto;
}
.teaser .info-container .video video, .teaser .info-container .video iframe, .teaser .info-container .video object, .teaser .info-container .video embed, .teaser .info-container .video div {
	width: 100%;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
}

/*odd*/
.page.odd #folio-grid .folio-thumb-container .folio-thumb {
	border: 5px solid #ccc;/*ie8 fallback*/
	border: 5px solid rgba(0,0,0,0.3);
	-webkit-box-shadow: inset 0px 0px 0px 10px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 0px 0px 10px rgba(255,255,255,0.2);
	box-shadow: inset 0px 0px 0px 10px rgba(255,255,255,0.2);
}
/*even*/
.page.even #folio-grid .folio-thumb-container .folio-thumb {
	border: 5px solid #666;/*ie8 fallback*/
	border: 5px solid rgba(153,153,153,0.3);
	-webkit-box-shadow: inset 0px 0px 0px 10px rgba(0,0,0,0.2);
	-moz-box-shadow: inset 0px 0px 0px 10px rgba(0,0,0,0.2);
	box-shadow: inset 0px 0px 0px 10px rgba(0,0,0,0.2);
}

/*footer
	----------------------------*/	
#footer {
	position: relative;
	overflow: hidden;
	padding: 50px 0;
	z-index: 1;
}
#footer .content {
	max-width: 930px;
	margin: auto;
	text-align: center;
	display: table;
	white-space: nowrap;
}
#footer .content .logo {
	margin-bottom: 30px;
}
#footer p.copyright {
	margin-bottom: 0;
}
/*odd*/
#footer.odd {
	background: #f4f4f5 url(../images/pattern-header-banner.png);
}
#footer.odd p.copyright {
	font: 12px/14px Arial, Helvetica, sans-serif;
	color: #999;
}
/*even*/
#footer.even {
	background: #282828;
}
#footer.even p.copyright {
	font: 12px/14px Arial, Helvetica, sans-serif;
	color: #999;
}
/*even*/
#footer.even ul.socialSmall li a {
	background-image: url(../images/social-sprite-small-dark.png);
	background-repeat: no-repeat;
	float: left;
	width: 22px;
	height: 22px;
	margin-right: 5px
}
/*section buttons
	----------------------------*/
.section-button {
	float: left;
	width: 100%;
	height: 40px;
	font: 12px/12px 'Open Sans', sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
	margin: auto;
	color: #fff;
	position: absolute;
	margin-top: -44px;
}
.section-button a {
	width: 40px;
	height: 40px;
	line-height: 50px;
	position: relative;
	text-decoration: none;
	padding: 10px 20px;
}
.section-button a.page-up {
	width: 150px;
	background: url(../images/page-top.png) 0 0 no-repeat;
	color: #fff;
}
.section-button a.page-up:hover {
	color: #fff;
}
/*video
	----------------------------*/
.video {
	margin-bottom: 30px;
}
.video-js{width:450px!important;height:300px!important}
/*--------------------------------------------------------
	iv.--TYPOGRAPHY & LINKS
--------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
	font-family: 'Lato', sans-serif;
	font-weight: bold;
	margin-bottom: 30px;
}
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span {
	font-family: 'Lato', sans-serif;
	font-weight: normal;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	text-decoration: none;
	border-bottom: 0 !important;
}
a {
	color: #39f;
	text-decoration: none;
}
a:hover {
	color: #369;
}
p {
	margin-bottom: 30px;
}
/*section title*/
h1 {
	font-size: 40px;
	line-height: 40px;
}
h2 {
	font-size: 38px;
	line-height: 38px;
}
h3 {
	font-size: 35px;
	line-height: 35px;
}
h4 {
	font-size: 32px;
	line-height: 32px;
}
h5 {
	font-size: 28px;
	line-height: 28px;
}
h6 {
	font-size: 24px;
	line-height: 24px;
}
/*--------------------------------------------------------
	v.--MISC
--------------------------------------------------------*/		
		
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clear {
	float: none;
}
.left {
	float: left;
}
.right {
	float: right;
}
#message{display:none}