

/*Desktop Layout+

-----------------------------------------------*/


@media only screen and (min-width: 1199px)  {

	/*----------------------------
	ii.-- Header
	-----------------------------*/
	
		/* main menu
		----------------------------*/

		.header ul.navigation{display:table !important;}
		#message{display:none}
}

@media only screen and (min-width: 960px) and (max-width: 1199px) {

	/*----------------------------
	i.-- Page
	-----------------------------*/
	
	.homepage,.page{position: inherit;}
	.page .content{max-width:870px;margin:auto;position:relative;}
	.page .teaser{background-attachment:scroll; background-position:center center;}
	
	/*----------------------------
	ii.-- Header
	-----------------------------*/

	/*homepage*/
	.logo-homepage {background-attachment: inherit; position:absolute;}

	/*inner pages*/
	.header {display:block;}
	.header .inner{max-width:870px;margin:auto;}
	
	
		/* main menu
		----------------------------*/

		.header ul.navigation{display:table !important;}
	
		#message{display:none}

}

/*Mobile Layout: Landscape Container width:768px

-----------------------------------------------*/

@media only screen and (min-width: 768px) and (max-width: 959px) {



	/*----------------------------
	i.-- Page
	-----------------------------*/
	
	.homepage,.page{position: inherit;}
	.page .content{max-width:640px!important;padding-bottom:100px;}
	.page .teaser{background-attachment:scroll; background-position:center center;}
	#teaser-1{height:450px!important}
	#teaser-1 .info-inner{width:640px;padding-top: 120px}
	#teaser-1,#teaser-4{background-size: cover!important}
	#lilly-inner{background-position: 60% 0!important;height: 720px!important}
	#lilly{height:720px!important}
	.info-container{max-width: 640px!important;width:640px!important}
	.column_one_half{width:100%;}	
	#teaser-2{height:1000px!important;background-image: none!important}		
	.video-js{width:640px!important;height:427px!important}
	#video{width:640px!important;height:427px!important;margin-top: 10px!important}
	.devices{display: none}
	#products{margin-top: -20px!important}
	#products h3{width:640px!important}
	#products h3 span{color:#fff!important}
	#products p{line-height: 20px!important}
	#what h2{margin-bottom: 10px!important}
	#benefits .column_one_half p{width:auto!important}
	.benefits{width:auto!important;}
	#teaser-4{height:960px!important}
	/*----------------------------
	ii.-- Header
	-----------------------------*/
	
	/*homepage*/
	.logo-homepage {background-attachment: inherit; position:absolute;}

	/*inner pages*/
	.header {height:auto;}
	.header .inner{max-width:640px!important;margin:0 auto;}
	.header .logo-container{position:relative;margin:10px auto 20px auto;width:100%;text-align: center;}
	.header .logo-container .logo{-webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);}
	
		/* main menu
		----------------------------*/

		.header .inner ul.navigation{width:100%; text-align: center;margin:0px;padding-bottom:8px;display:table !important;}
		.header .inner ul.navigation li{ float: none !important; display: inline;}	

		

	/*----------------------------
	ii.-- Content
	-----------------------------*/	
	
	/*about
	----------------------------*/
	
	/*service breakdown*/
	.chart-container ul.chart li div{font-size:25px !important;}
	
	/*teaser
	----------------------------*/
	.teaser.fixed{background-attachment:scroll;}
	.teaser .info-container .info .info-inner{max-width:640px!important; margin:auto;}
	.teaser .info-container .video{width:640px !important;height:290px !important;}	
	.teaser .info-container .info .info-inner .video{width:307px !important;height:172px !important;}

	#message{display:none}
}


/*Mobile Layout: Landscape Container width:480px

-----------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {



	/*----------------------------
	i.-- Page
	-----------------------------*/
	#teaser-1{background-color:#b02326;background-image: none!important}
	#teaser-2{background-color: #d3ceb5;background-image: none!important}	
	#lilly{height:1100px!important}
	#lilly-inner{background-image: none!important}		
	#teaser-4{background-color: #5e452b;background-image: none!important;height:1200px!important}
	.homepage,.page{position: inherit;}
	.page .content{max-width:290px;padding-bottom:100px;}
	.page .teaser{background-attachment:scroll; background-position:center center;}
	#who h2, #what h2, #benefits h2, #jobs h2{font-size:38px!important}
	#who .info-inner p, #what .info-inner p{line-height: 21px!important}
	.joblist li{font-size:14px!important}
	.video-js{width:290px!important;height:193px!important}

	/*----------------------------
	ii.-- Header
	-----------------------------*/
	
	/*homepage*/
	.logo-homepage{width:150px;height:150px;margin:-75px 0 0 -75px;position:absolute;background-attachment:inherit;}
	
	/*inner pages*/
	.header {height:auto;display:block;}
	.header .inner{max-width:930px;margin:auto;}
	.header .logo-container{position:relative;left:50%;margin-left:-125px; float:auto;margin-top:10px;margin-bottom: 0px;}
	.header .logo-container .logo{-webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);}
	.header .logo-container .logo img{width:250px;}
	
	
		/* main menu
		----------------------------*/

		.header .inner ul.navigation{float: left; text-align: center; width: 100%;margin-top:0px;padding-bottom:5px; display:none; line-height:20px;}
		.header .inner ul.navigation li{margin:10px 0; float:none !important;}
		.header .inner ul.navigation li:first-child{margin-top:0px;}
		.header .inner ul.navigation li:last-child{padding-right:10px;}
		.page.odd .header .inner ul.navigation li a.active,.page.even .header .inner ul.navigation li a.active{padding:1px 10px;}
	
	
	/* mobile menu toggle
	----------------------------*/	
		
	.header .inner .mobileMenuToggle{display:block;margin:5px auto!important}

		
	/*----------------------------
	iii.-- Content
	-----------------------------*/	
	
	/*section title + teasers
	----------------------------*/
	
	.section-title{padding-top:50px;}
	.info-container{width:auto; margin:0px auto!important;}
	#teaser-1 .info-container{margin:60px auto!important}
	#teaser-2{height:900px!important}

	#who h2{margin-top: 40px;}
	#teaser-1{height: 400px!important}
	#teaser-1 h1{line-height: 40px;}
	.benefits{max-width:330px!important;width:auto!important;padding:20px 10px;}
	#benefits .last p{width:auto!important}
	.section-button{display:none;}
	a.button{width:100%!important; padding:10px 0!important}
	#video{margin:0 0 30px 0!important;width:290px;height:193px;}
	br.mobile{display: none}
	#products{margin-top:-10px!important}
	.devices{display:none}
	#products h3{width:290px!important;font-size:44px!important;color:#060BD9}
	
	/*teaser
	----------------------------*/
	.teaser.fixed{background-attachment:scroll;}
	.teaser .info-container .info .info-inner{max-width:290px; margin:auto;}
	.section .info-container .info .info-inner{max-width:290px; margin:auto;}	
	.teaser .info-container .info blockquote{width:auto !important;}
	.teaser .info-container .video{width:290px !important;height:163px !important;}	
	.teaser .info-container .info .info-inner .video{width:290px !important;height:163px !important; margin:auto;}


	/*--------------------------------------------------------
	TYPOGRAPHY & LINKS
	--------------------------------------------------------*/

	/*section title*/
	.section-title h1,.section-title h2,.section-title h3,.section-title h4,.section-title h5,.section-title h6{margin:0;}
	.section-title h1{font-size:65px; line-height:65px; text-align:center;}
	.section-title h2{font-size:55px;line-height:55px; text-align:center;}
	.section-title h3{font-size:45px;line-height:45px; text-align:center;}
	.section-title h4{font-size:35px;line-height:35px; text-align:center;}
	.section-title h5{font-size:30px;line-height:30px; text-align:center;}
	.section-title h6{font-size:25px;line-height:25px; text-align:center;}
	h1{font-size:32px;line-height:32px;}
	h2{font-size:30px;line-height:30px;}
	h3{font-size:28px;line-height:28px;}
	h4{font-size:26px;line-height:26px;}
	h5{font-size:24px;line-height:24px;}
	h6{font-size:22px;line-height:22px;}
	


	
	/*shortcodes*/
	.column_one_half, .column_one_third,.column_one_fourth,.column_two_thirds, .column_three_fourths{width:100%;}
		/*.last{margin-right:0 !important; clear:right;}*/
	
	#message{display:none}
}

/*Mobile Layout: Portrait Container width:320px

-----------------------------------------------*/

@media only screen and (max-width: 479px){

	/*----------------------------
	i.-- Page
	-----------------------------*/
	#teaser-1{background-color:#b02326;background-image: none!important}
	#teaser-2{background-color: #d3ceb5;background-image: none!important}	
	#lilly{height:1100px!important}
	#lilly-inner{background-image: none!important}		
	#teaser-4{background-color: #5e452b;background-image: none!important;height:1200px!important}
	.homepage,.page{position: inherit;}
	.page .content{max-width:290px;padding-bottom:100px;}
	.page .teaser{background-attachment:scroll; background-position:center center;}
	#who h2, #what h2, #benefits h2, #jobs h2{font-size:38px!important}
	#who .info-inner p, #what .info-inner p{line-height: 21px!important}
	.joblist li{font-size:14px!important}
	.video-js{width:290px!important;height:193px!important}

	/*----------------------------
	ii.-- Header
	-----------------------------*/
	
	/*homepage*/
	.logo-homepage{width:150px;height:150px;margin:-75px 0 0 -75px;position:absolute;background-attachment:inherit;}
	
	/*inner pages*/
	.header {height:auto;display:block;}
	.header .inner{max-width:930px;margin:auto;}
	.header .logo-container{position:relative;left:50%;margin-left:-125px; float:auto;margin-top:10px;margin-bottom: 0px;}
	.header .logo-container .logo{-webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);}
	.header .logo-container .logo img{width:250px;}
	
	
		/* main menu
		----------------------------*/

		.header .inner ul.navigation{float: left; text-align: center; width: 100%;margin-top:0px;padding-bottom:5px; display:none; line-height:20px;}
		.header .inner ul.navigation li{margin:10px 0; float:none !important;}
		.header .inner ul.navigation li:first-child{margin-top:0px;}
		.header .inner ul.navigation li:last-child{padding-right:10px;}
		.page.odd .header .inner ul.navigation li a.active,.page.even .header .inner ul.navigation li a.active{padding:1px 10px;}
	
	
	/* mobile menu toggle
	----------------------------*/	
		
	.header .inner .mobileMenuToggle{display:block;margin:5px auto!important}

		
	/*----------------------------
	iii.-- Content
	-----------------------------*/	
	
	/*section title + teasers
	----------------------------*/
	
	.section-title{padding-top:50px;}
	.info-container{width:auto; margin:0px auto!important;}
	#teaser-1 .info-container{margin:60px auto!important}
	#teaser-2{height:900px!important}

	#who h2{margin-top: 40px;}
	#teaser-1{height: 400px!important}
	#teaser-1 h1{line-height: 40px;}
	.benefits{max-width:330px!important;width:auto!important;padding:20px 10px;}
	#benefits .last p{width:auto!important}
	.section-button{display:none;}
	a.button{width:100%!important; padding:10px 0!important}
	#video{margin:0 0 30px 0!important;width:290px;height:193px;}
	br.mobile{display: none}
	#products{margin-top:-10px!important}
	.devices{display:none}
	#products h3{width:290px!important;font-size:44px!important;color:#060BD9}
	
	/*teaser
	----------------------------*/
	.teaser.fixed{background-attachment:scroll;}
	.teaser .info-container .info .info-inner{max-width:290px; margin:auto;}
	.section .info-container .info .info-inner{max-width:290px; margin:auto;}	
	.teaser .info-container .info blockquote{width:auto !important;}
	.teaser .info-container .video{width:290px !important;height:163px !important;}	
	.teaser .info-container .info .info-inner .video{width:290px !important;height:163px !important; margin:auto;}


	/*--------------------------------------------------------
	TYPOGRAPHY & LINKS
	--------------------------------------------------------*/

	/*section title*/
	.section-title h1,.section-title h2,.section-title h3,.section-title h4,.section-title h5,.section-title h6{margin:0;}
	.section-title h1{font-size:65px; line-height:65px; text-align:center;}
	.section-title h2{font-size:55px;line-height:55px; text-align:center;}
	.section-title h3{font-size:45px;line-height:45px; text-align:center;}
	.section-title h4{font-size:35px;line-height:35px; text-align:center;}
	.section-title h5{font-size:30px;line-height:30px; text-align:center;}
	.section-title h6{font-size:25px;line-height:25px; text-align:center;}
	h1{font-size:32px;line-height:32px;}
	h2{font-size:30px;line-height:30px;}
	h3{font-size:28px;line-height:28px;}
	h4{font-size:26px;line-height:26px;}
	h5{font-size:24px;line-height:24px;}
	h6{font-size:22px;line-height:22px;}
	


	
	/*shortcodes*/
	.column_one_half, .column_one_third,.column_one_fourth,.column_two_thirds, .column_three_fourths{width:100%;}
		/*.last{margin-right:0 !important; clear:right;}*/
	
	#message{display:none}
}
