﻿


/************************* RESPONSIVE *******************/
@media only screen and (max-width: 959px)
{
	#container, DIV.container, #seals{width: 98%}
	#container{background: url(../graphics/banner.png) no-repeat -40px 120px}
	#nav LI A{padding-left: 15px; padding-right: 15px}
	#button-solution{left: 300px}
	#sub-nav-corner{display: none}
	
	/*********************** FOOTER *******************/
	#seals-small{padding: 0% 15% 0% 15%}
	
	/*********************** HOME *******************/
	#home-left{width: 34%}
	#home-center{width: 34%}
	#home-right{width: 28%}
	DIV.home-content P{margin-left: 10px; margin-right: 10px}
	#home-right-inner{padding-left: 10px; padding-right: 10px}
}


@media only screen and (max-width: 909px)
{
	#container{background: url(../graphics/banner.png) no-repeat -90px 120px}
	#button-solution{left: 250px}
}

@media only screen and (max-width: 860px)
{
	#container{background: url(../graphics/banner.png) no-repeat -155px 120px}
	#button-solution{left: 185px}
}

@media only screen and (max-width: 820px)
{
	/************************* FOOTER *******************/
	#footer{padding-bottom: 5px}
	#seals A.buy-safe, #seals A.verified-secured{display: none}
	#seals DIV.seal-spacer-6, #seals DIV.seal-spacer-7{display: none}	
	
	#seals A.money-back{width: 21.3%}
	#seals A.lowest-price{width: 7.5%}
	#seals A.approved-merchant{width: 14%}
	#seals A.merchant-certified{width: 13.5%}
	#seals A.privacy-affiliates{width: 20.6%}
	
	
	P.footer-links SPAN.footer-links-divider{padding: 0px 10px 0px 10px}	
	
	/************************* EASY STEPS PAGE *******************/
	DIV.five-steps-inner-left{width: 60%}
	DIV.five-steps-inner-right{width: 35%}
	
	/*********************** TERMS + PRIVACY *******************/
	#legal{width: 100%}	
}

@media only screen and (max-width: 800px)
{
	#container{padding-top: 300px; background: url(../graphics/banner.png) no-repeat 0px 120px}
	#button-solution{left: 340px}
	#button-cart{display: none}
	#icon-menu, #icon-cart{display: block}
	#nav, #sub-nav{display: none}
	
	#nav-wrapper{width: 100%; position: absolute; top: 120px; z-index: 100; display: block; overflow: hidden; transition: height .3s ease-in-out; -moz-transition: height .3s ease-in-out; -webkit-transition: height .3s ease-in-out; background: #fff}	
	DIV.main-nav{height: 0px; padding: 0px}
	DIV.main-nav-slide{height: 183px; overflow: visible}		

	#small-nav LI{width: 50%; border-bottom: solid 1px #c8c8c8; float: left}
	#small-nav LI A{color: #000; font-size: 12px; line-height: 12px; text-decoration: none; padding: 10px; display: block; border: solid 1px #c8c8c8; border-top: none; border-bottom: none; background: #fff}
	#small-nav LI.li-2 A, #small-nav LI.li-4 A, #small-nav LI.li-6 A, #small-nav LI.li-8 A, #small-nav LI.li-10 A{border-left: none}
	#small-nav LI A:hover, #small-nav LI A.active{color: #000; background: #c8c8c8}

	/*********************** HOME *******************/
	#home-left, #home-center{width: 100%; float: none}
	#home-center{margin-bottom: -10px}
	#home-right, DIV.home-spacer{display: none}
	
	#home-promo{width: 100%; margin: 0px; padding: 0px; background: #fff}
	#home-promo P, #home-promo SPAN{color: #000}
	#body #home-promo .scarlet{color: #e00000}
	
	DIV.home-promo-img{display: none}
	DIV.home-promo{width: 100%; padding: 0px; }
	DIV.home-promo-inner{margin: 0px; padding: 15px; border: none; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; background: #e0e0e0}
	DIV.home-promo-inner-1{margin-top: -20px; margin-bottom: 20px}
	
	/*********************** CONTACT *******************/
	FORM.contact-table FIELDSET{padding-bottom: 0px}
	FORM.contact-table DIV.contact-left{text-align: left; width: 100%; padding: 0px 0px 5px 0px; float: none}
	FORM.contact-table DIV.message-label{padding-top: 0px}
	FORM.contact-table DIV.contact-right{width: 100%; padding: 0px 0px 10px 0px; float: none}
	FORM.contact-table INPUT, FORM.contact-table TEXTAREA{width: 99%}
	FORM.contact-table INPUT.submit{margin: -10px 0px -10px 0px}
	
	/************************* WHY EASY 9001 PAGE *******************/
	#why{width: 100%}
	
	/************************* PRODUCT / TOOLKIT PAGE *******************/
	#toolkit-summary{width: auto}	
}

@media only screen and (max-width: 750px)
{
	#container{background: url(../graphics/banner.png) no-repeat -40px 120px}
	#button-solution{left: 300px}
	
	/************************* EASY STEPS PAGE *******************/
	DIV.easy-steps{width: 48.1%; min-height: 0px; padding-top: 10px}
	#easy-steps-right{margin: 0px 0px 10px 0px; clear: both; float: none}
	DIV.easy-steps-spacer-2{display: none}
	DIV.easy-steps P{margin-left: 10px; margin-right: 10px}
	
	/************************* HOW TO BUY PAGE *******************/
	DIV.how{width: 49%}
	#how-right{margin-bottom: 0px; clear: both; float: none}
	DIV.how-inner{padding: 0px 10px 0px 10px}
	DIV.how-spacer-2{display: none}		
}

@media only screen and (max-width: 710px)
{
	#container{background: url(../graphics/banner.png) no-repeat -90px 120px}
	#button-solution{left: 250px}
}

@media only screen and (max-width: 660px)
{
	#container{background: url(../graphics/banner.png) no-repeat -155px 120px}
	#button-solution{left: 185px}
}

@media only screen and (max-width: 620px)
{
	#container{background: url(../graphics/banner.png) no-repeat -185px 120px}
	#button-solution{left: 155px}
	
	/************************* FOOTER *******************/
	#seals-small{display: none}
	P.footer-links{margin-top: 0px; padding-top: 0px; border-top: none}
	P.footer-links SPAN.footer-links-divider{padding: 0px 10px 0px 10px}		
}

@media only screen and (max-width: 600px)
{
	#container{background: url(../graphics/banner.png) no-repeat -208px 120px}
	#button-solution{left: 132px}
	
	/*********************** CONTACT *******************/
	#contact{padding-bottom: 10px}
	#contact-left{margin: 0px}
	FORM.contact-table FIELDSET{padding: 20px 30px 5px 20px}
	FORM.contact-table DIV.contact-left{text-align: right; width: 28%; padding: 0px 10px 0px 0px; float: left}
	FORM.contact-table DIV.message-label{padding-top: 30px}
	FORM.contact-table DIV.contact-right{width: 69%; padding: 0px 0px 10px 0px; float: right}
	FORM.contact-table INPUT, FORM.contact-table TEXTAREA{width: 98%}
	FORM.contact-table INPUT.submit{margin-top: 10px}
	#contact-right{width: auto; margin: 30px 0px 0px 0px; padding: 0px; position: relative; left: 0%; top: 0px; background: #fff}
	#contact-right P.main-header{color: #000}
	#contact-right P.main{color: #000}	
	
	/************************* ABOUT PAGE *******************/
	#about-left{margin: 0px}
	DIV.about{padding: 10px 10px 0px 10px}
	#about-right{width: 100%; margin: 0px; padding: 0px; position: relative; left: 0%; background: #fff}	
	#about-right-inner{width: auto; padding: 10px 0px 0px 0px; background: #fff}	
	#about-right-inner P.main-header{color: #000}
	#about-right-inner P.main{color: #000}
		
	/************************* PRODUCT / TOOLKIT PAGE *******************/
	IMG.img-toolkit{width: 183px; height: auto}
	#toolkit-inner-price-box{width: 185px}

	/*********************** AFFILIATES *******************/	
	#affiliates{padding: 25px 0px 25px 0px; position: relative}
	#affiliates-left{margin: 0px}	
	#left-affiliates-signup{display: none}
	#affiliates-right{width: 300px; height: 436px; margin: 0px; position: relative; left: 0%; top: 0px}			
}

@media only screen and (max-width: 580px)
{
	#container{padding-top: 290px; background: url(../graphics/banner-small.png) no-repeat -90px 120px}
	#button-solution{left: 250px; top: 250px}
	
	/************************* EASY STEPS PAGE *******************/
	DIV.easy-steps{width: 99%; min-height: 0px}
	DIV.easy-steps-spacer{display: none}	
	
	/************************* TESTIMONIALS PAGE *******************/
	#testimonials-left, #testimonials-right{width: 100%; float: none}	
}

@media only screen and (max-width: 510px)
{
	#container{background: url(../graphics/banner-small.png) no-repeat -155px 120px}
	#button-solution{left: 185px}
	
	/************************* FOOTER *******************/
	P.footer-links SPAN.footer-links-divider{padding: 0px 5px 0px 5px}	

	/************************* EASY STEPS PAGE *******************/
	DIV.five-steps{padding-bottom: 0px}
	DIV.five-steps-inner-left{width: auto; padding-right: 10px; float: none}
	DIV.five-steps-inner-right{width: auto; margin: 0px 10px 0px 10px; float: none}	
	
	/************************* PRODUCT / TOOLKIT PAGE *******************/
	#toolkit-summary-price{margin: 10px 0px 10px 0px; position: relative; left: 0%; top: 0%}
	#toolkit-summary-price P{text-align: left; padding: 0px 0px 15px 0px}	
	#toolkit-summary-price A{margin-left: -5px}

	/************************* HOW TO BUY PAGE *******************/
	DIV.how{width: 100%; min-height: 0px}
	DIV.how-spacer{display: none}	
}

@media only screen and (max-width: 450px)
{
	#container{background: url(../graphics/banner-small.png) no-repeat -208px 120px}
	P.old-h1{width: 196px; background: url(../graphics/header-small.png)}
	#button-solution{left: 132px}
	
	/************************* FOOTER *******************/
	P.footer-links A{font-size: .9em}
	P.footer-links SPAN.footer-links-divider{padding: 0px 1px 0px 1px}	

	/*********************** CONTACT *******************/
	FORM.contact-table FIELDSET{padding: 10px 10px 0px 10px}
	FORM.contact-table DIV.contact-left{text-align: left; width: 100%; padding: 0px 0px 5px 0px; float: none}
	FORM.contact-table DIV.message-label{padding-top: 0px}
	FORM.contact-table DIV.contact-right{width: 100%; padding: 0px 0px 10px 0px; float: none}
	FORM.contact-table INPUT, FORM.contact-table TEXTAREA{width: 99%}
	FORM.contact-table INPUT.submit{margin: -10px 0px -10px 0px}
	
	/************************* FAQ PAGE *******************/
	DIV.faq-question{padding: 0px}
	P.faq-question-left{display: none}
	P.faq-question-right{color: #fff; font-size: 12px; line-height: 16px; padding: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background: #000}	
		
	DIV.faq-answer{padding: 0px}
	P.faq-answer-left{display: none}
}

@media only screen and (max-width: 400px)
{
	#container{background: url(../graphics/banner-small.png) no-repeat -265px 120px}
	#button-solution{left: 75px}
}




