/** 2017 UPDATES **/

.panel-dark { width:100%; background:url('../nav/bg-fade-black40.png'); }
.panel-dark-inner { width:960px; margin-left:auto; margin-right:auto; padding-top:60px; padding-bottom:100px; color:#FFFFFF; font-family:myriadlight; }

.panel-left-30 { width:30%; float:left; }
.panel-left-50 { width:50%; float:left; }
.panel-left-70 { width:70%; float:left; }

.panel-right { float:left; width:25%; margin-left:5%; color:#FFFFFF; }
.panel-right h2 { color:#FFFFFF; margin:0 0 14px 0; font-size:30px; font-family:myriadlight; font-weight:normal; }
.panel-right a { color:#FFFFFF; }

.underline { height:1px; border-top:1px solid #FFFFFF; width:100%; margin-top:40px; margin-bottom:40px; opacity:0.2; }
.intro-text { font-size:18px; line-height:24px; }

@media screen and (max-width: 767px) {
	.panel-dark-inner { width:90%; }
	.panel-left-30, .panel-left-50, .panel-left-70 { width:100%; clear:both; }
	.panel-right { width:100%; clear:both; margin:0; }
	}



body { font-family:Arial, Helvetica, sans-serif; margin-left:0px; margin-top:0px; margin-right:0px; margin-bottom:0px; background:url(../images/bg_color.jpg) center top;}
.inner { background-image:url(../images/bg_repeat_1040.jpg); background-size:100%; background-repeat:repeat-y; }
.clr { clear:both; height:0;}
p { margin:0 0 12px 0; }

@font-face { font-family:myriadlight;src:url('../fonts/myriadpro_light.ttf'),  url('../fonts/myriadpro_light.eot'); }
@font-face { font-family:myriadreg;src:url('../fonts/myriadpro_regular.ttf'), url('../fonts/myriadpro_regular.eot'); }
@font-face { font-family:myriadsemi;src:url('../fonts/myriadpro_semibold.ttf'), url('../fonts/myriadpro_semibold.eot'); }

/**container**/
.container { margin:0 auto; width:960px; -webkit-transition:all 0.7s ease 0s;   -moz-transition:all 0.7s ease 0s;   -o-transition:all 0.7s ease 0s;    transition:all 0.7s ease 0s; }

a img { border:0; }


	/**landing page**/
		.lpanel { position:absolute; top:163px; width:100%; height:390px; background-color:#000000; opacity:0.4; z-index:-10; }
		.llogo { margin: 50px auto 55px auto; width:250px; }
		.lmain { width:100%; height:auto; margin-left:auto; margin-right:auto; text-align:center; color:#ffffff; }
		.lmain span { font-family:myriadsemi,arial; font-size:24px; }
		.lmain p { font-family:myriadlight,arial; font-size:20px; }
		.lsite1 { float:left; height:102px; width:33%; margin: 30px 0 0 0; text-align:center; border:0; }
		.lsite2 { float:left; height:102px; width:33%; margin: 30px 0 0 0; text-align:center; align:center; border:0; }
		
		.lsite1 img, .lsite2 img { max-width:207px; }
		.lfooter { margin:140px auto 0 auto; width:100%; height:50px; text-align:center; }
		
		.home-partner-logo { float:left; width:160px; margin:0 30px 0 0; }


	/**header**/
	.header { width: 100%; float: left; position: relative; }
		/**logo**/		
		.logo { margin: 35px 0 0 0; float: left; }
		.header .sep { position: absolute; bottom: 25px; right:0px; width: 75%; }
		.header .sep img { width: 100%; }
		
		/**nav**/
		.nav { float: right; }
		.nav ul { margin: 60px 0 0 0; padding:0px; list-style:none; float: right; }
		.nav li { float: left; padding: 0 3px; position: relative; }
		.nav li a { padding: 10px 12px; font-size: 13px; line-height: 18px; color:#333333; text-decoration:none; background-color:#fff; border-radius: 10px; }
		.nav li a.arrow { background: #fff url(../images/arrow.png) no-repeat 58px 16px; }
		.nav li a.arrow:hover { background: #646464 url(../images/arrow.png) no-repeat 58px 16px; }
		
		.nav li a.arrow1 { background: #fff url(../images/arrow.png) no-repeat 59px 16px; }
		.nav li a.arrow1:hover { background: #646464 url(../images/arrow.png) no-repeat 59px 16px; }

		.nav li a.arrow2 { background: #fff url(../images/arrow.png) no-repeat 67px 16px; }
		.nav li a.arrow2:hover { background: #646464 url(../images/arrow.png) no-repeat 67px 16px; }
		
		.nav li a.arrow3 { background: #fff url(../images/arrow.png) no-repeat 66px 16px; }
		.nav li a.arrow3:hover { background: #646464 url(../images/arrow.png) no-repeat 66px 16px; }
		
		.nav li a.arrow4 { background: #fff url(../images/arrow.png) no-repeat 73px 16px; }
		.nav li a.arrow4:hover { background: #646464 url(../images/arrow.png) no-repeat 73px 16px; }

		.nav li a:hover { background: #646464; color: #fff; }
		.nav li ul { display: none; position: absolute; background: #d2d1d1; left: 10px; z-index: 2; top: -35px; border: 1px solid #333333; width:170px; }
		.nav li:hover ul { display: block; }
		.nav li li { padding:0; float: left; width: 100%; }
		.nav li li a { padding:0 0 0 15px; line-height: 45px; border-radius: 0; background: #d2d1d1; color: #333333; display: block; }
		.nav li li a:hover { background:#333333; color:#fff; }
		
		.mobile { margin: 20px 0 0 0; display: none; float:right; width: 180px; position: relative;}
		.mobile a.btn { display:block; text-align:right; }
		.mb-nav { position: absolute; display: none; margin:0px 0 0 0; background: #646464; overflow: hidden; border-radius: 0px 0 0px 0px; padding: 10px;  }
		.mb-nav ul { margin: 0px; padding:0; list-style:none; text-align: right; }
		.mb-nav li { float: left; width: 100%; }
		.mb-nav li ul { display: none; }
		.mb-nav li li a {  padding: 0 10px 0 0; border:none; font-size:12px; color:#FFCC00  }
		.mb-nav li a { color: #fff; text-decoration:none; line-height: 25px; border-bottom:1px solid #505050; display: block; }
		
		/**welcome**/
		.welcome { width: 100%; float: left; z-index:10; }
		.welcome .left { padding: 45px 0 0 20px; float: left; width: 60%; }
		.welcome .left p { padding: 0 0 15px 0; font-family:myriadlight, Arial, Helvetica, sans-serif; font-size: 16px; line-height: 22px; color:#fff; }
		.welcome .right { padding: 55px 0 0 0; width: 30%; float: right; font-family:myriadlight, Arial, Helvetica, sans-serif; font-size: 40px; line-height: 50px; color:#fff; text-align: right; }
		
		/**slider**/
		.slider { width: 100%; float: left; position: relative;}
		.slider .left { padding: 0 0 0 2%; min-height: 514px; width: 50%; float: left; background:#fff; border-radius: 20px 0 0px 20px; }
		.slider .left .text { float: left; width: 50%; margin: 0px 0 0 0px; padding: 11px 11px 7px 12px; color:#ffffff; font-family:myriadreg, Arial, Helvetica, sans-serif; font-size: 20px; line-height: 24px; background: url('../images/btn_partner1_bg.png'); box-shadow:#999 2px 2px 3px; border-radius:8px; }
		.slider .left .text.second { float: left; width: 30%; margin: 0px 0 0 2%; background:url('../images/btn_partner2_bg.png');  }
		.slider .left .text a { display: block; margin: 0; font-family:myriadreg, Arial, Helvetica, sans-serif; font-size:14px; color:#ffffff; }
		.slider .left .text a:hover { color:#CCC; }
		.slider .left h2 { padding: 370px 0 0 10px; color:#0c1019; font-family: myriadsemi, Arial, Helvetica, sans-serif; font-weight:normal; font-size: 24px; line-height: 24px; margin-bottom:5px; }
		.slider .left a.one { position: absolute; margin: 20px 0; display: block; z-index: 20; left: 18px; border:0; }
		.slider .left a img { max-width: 100%; }
		.slider .left a.two { top: 90px; position: absolute; margin: 20px 0; display:block; z-index:20; border:0; }
		.slider .left a.three { top: 180px; position: absolute; margin: 20px 0; display:block; z-index:20; border:0; }
		.slider .left a.four { top: 270px; position: absolute; margin: 20px 0; display:block; z-index:20; border:0; }
		.slider .right { width: 48%; float:left; border-radius:20px 0 0px 20px; }
		.slider .right img { max-width: 100%; }
		
		/**content-wrap**/
		#ret { background: #fff url(../images/bghead_retread.png) no-repeat 30px 40px; }
		#rep { background: #fff url(../images/bghead_repair.png) no-repeat 30px 40px; }
		#tes { background: #fff url(../images/bghead_testing.png) no-repeat 30px 40px; }
		#sol { background: #fff url(../images/bghead_solid.png) no-repeat 30px 40px; }
		#abo { background: #fff url(../images/bghead_about.png) no-repeat 30px 40px; }
		#con { background: #fff url(../images/bghead_contact.png) no-repeat 30px 40px; }
		#rec { background: #fff url(../images/bghead_recycling.png) no-repeat 30px 40px; }
		.content-wrap { float: left; width: 100%; }
		.content-wrap h2 { margin: -27px 0 30px 0; font-family:myriadreg, Arial, Helvetica, sans-serif; font-weight:normal; font-size: 30px; color: #fff; text-align: right; }
		.content-wrap-hm { float: left; width: 100%; margin:0 0 16px 0; }
		.content-wrap-hm h2 { margin: -27px 0 0 0; font-family:myriadreg, Arial, Helvetica, sans-serif; font-weight:normal; font-size: 30px; color: #fff; text-align: right; }
		.content { padding: 30px; border-radius: 20px; overflow: hidden; }
		.content .left { float: left; width: 580px; }
		.content .left img { max-width: 100%; }
		.content .left img.gap { padding: 30px 0 10px 0; }
		.content .left .imgspace { width:100%; text-align:right; padding:0 0 10px 0; }
		.content .left img.gapright { float:right; clear:left; width:40%; padding:0 0 0 0; margin:10px 0 10px 15px; border-style:solid; border-color:#666666; border-width:1px; box-shadow: -1px 1px 3px #666666; -moz-box-shadow: -1px 1px 3px #666666; -webkit-box-shadow: -1px 1px 3px #666666; }
		.content .left img.gaprightb { float:right; clear:left; width:40%; padding:0 0 0 0; margin:10px 0 10px 15px; }
		.content .left img.gapleft { float:left; clear:left; width:40%; padding:0 0 0 0; margin:10px 15px 10px 0; border-style:solid; border-width:1px; -moz-box-shadow: -1px 1px 3px #666666; -webkit-box-shadow: -1px 1px 3px #666666; box-shadow: 10px 2px 5px #000;}
		.content .left h1 { font-family:myriadsemiArial,Helvetica,sans-serif; font-size: 30px; line-height: 30px; color: #333; font-weight:normal; }
		.content .left h1 span { font-family:myriadregArial,Helvetica,sans-serif; font-size: 24px; line-height: 24px; display: block; }
		.content .left p { font-family:myriadlight,Arial,Helvetica,sans-serif; padding:8px 0 4px 0; line-height:22px; }
		.content .left .subhead { font-family:myriadlsemi,Arial,Helvetica,sans-serif; font-size:20px; }
		.content .left .bold { font-family:myriadreg,Arial,Helvetica,sans-serif; }
		.content .left .highlight { font-family:myriadlight,Arial,Helvetica,sans-serif; font-size:18px; }
		.content .left .bullets { font-family:myriadlight,Arial,Helvetica,sans-serif; padding:0 0 0 24px; }
		.content .left .bullets li { margin:0 0 6px 0; }
		.content .left .textquote { color:#014f80; font-family:myriadlight,Arial,Helvetica,sans-serif; font-weight:lighter; font-size:24px; line-height:34px; }
		.content .left a:hover { color:#000000; }
		
		.tablepic { clear:left; width:200px; height:132px; border:1px; border-style:solid; border-color:#000; box-shadow:#333; margin:22px 0 8px 0; }

		
		.content .right { padding: 90px 0 0 0; width: 250px; float: right; }
		.content .right .sidepanel { padding: 0 0 20px 20px; float: left; width: 230px; border-radius: 10px; background: url(../images/right-bg.png) repeat-y; }
		.content .right .sidepanel h2 { font-family:myriadreg, Arial, Helvetica, sans-serif; font-weight:normal; font-size: 24px; line-height: 24px; color: #333; text-align: left; margin: 25px 0 10px 0; }
		.content .right .sidepanel ul { font-family:myriadlight, Arial, Helvetica, sans-serif; font-weight:lighter; list-style: none; margin:0 0 0 10px; padding: 0; }
		.content .right .sidepanel li { float: left; width: 100%; }
		.content .right .sidepanel li a { font-size: 16px; line-height: 27px; color: #333; text-decoration: underline; }
		.content .right .sidepanel li a:hover { color:#999 }	
		.content .right .video { float: left; margin: 22px 0; }
		.content .right .video img { max-width: 100%; }
		.content .right .pic { float: left; margin: 22px 0 0 0; }
		.content .right .pic img { max-width: 100%; }
		.content .right .link { float: right; text-align: right; margin: 22px 0; color: #014f80;  font-family:myriadreg, Arial, Helvetica, sans-serif; font-size: 34px; line-height: 40px; }
		.content .right .pullquote { float: right; text-align: right; margin: 15px 0; color: #014f80; font-family: myriadlight, Arial, Helvetica, sans-serif; font-weight:lighter; font-size: 28px; line-height: 36px; }
		
		.content .right .normal { clear:both; text-align: right; margin: 15px 0; color: #014f80; font-family:myriadlight,Arial,Helvetica,sans-serif; font-weight:lighter; font-size: 18px; line-height: 22px; }
		
		.content .right .bold { font-family:myriadsemi,Arial,Helvetica,sans-serif; font-weight:bolder; font-size:20px; }
		
		/**footer**/
		.footer { padding: 25px 0 30px 0; width: 100%; float: left;}
		.footer .left { float: left; width: 60%; position:relative; left:15px;}
		.footer .left ul { list-style: none; margin:0px; padding:0; }
		.footer .left li { float: left; width: 100%; ont-size: 13px; color: #fff;}
		.footer .left li a { padding: 0 3px; font-family:myriadreg, Arial, Helvetica, sans-serif; font-size: 13px; line-height: 18px; color: #fff; text-decoration: none; }
		.footer .left li a:hover { text-decoration:underline; color:#999; }
		.footer .left li span { padding: 0 3px; font-family:myriadreg, Arial, Helvetica, sans-serif; font-size: 13px; line-height: 18px; color: #fff; text-decoration: none; }
		
		.footer .right { padding: 0 30px 0 0; float: right; width: 30%; text-align: right; }
		.footer .right h2 { margin-top:0px; font-family: myriadreg, Arial, Helvetica, sans-serif; font-size:24px; line-height:24px; color:#fff; text-decoration:none; font-weight:normal; }
		.footer .right h2 a { display: block; font-family: myriadreg, Arial, Helvetica, sans-serif; font-size: 18px; line-height: 24px; color: #fff; text-decoration:underline; font-weight:normal; }
		.footer .right h2 a:hover { color:#999; }
		.footer .right h3 { font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 18px; color: #fff; text-decoration: none; }
		.footer .right h3 a {  font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 18px; color: #fff; text-decoration: none; }
		.footersml { font-family: myriadreg, Arial, Helvetica, sans-serif; color:#ffffff; font-size:13px; }
		.footersml a { text-decoration:underline; color:#ffffff; }
		.footersml a:hover { color:#999; }
		
		.tablecopy { font-size:12px; }
		.tablewhite { color:#ffffff; }