﻿@charset "utf-8";
/* CSS Document */

@media only screen and (max-width: 1079px) {
	body{-webkit-text-size-adjust:none;}

}

@media only screen and (max-width : 1080px), 
only screen and (max-device-width : 1080px) {

   .wrapper{max-width:980px; padding:0 1%;}

   #bg-image{min-height:580px;}
   ul.categories li{line-height:35px;}

   .product{ width:20%;}

}

@media only screen and (max-width : 960px),
only screen and (max-device-width : 960px){

   .wrapper{padding:0 2%;}

   #bg-image{min-height:530px;}
   ul.categories li{line-height:32px;}
   .nav-head{line-height:34px;}

   a#link-tab-menu, #div-tab-menu {display:none;}

   .product{ width:20%; height:360px;}
   .three-fourth .product{ width:28%; height:365px;}

   .browsing-summary {width: 100%; padding:0;}
   .browsing-summary h3 {font-size:14px; line-height:30px;}
   .browsing-summary .two-third {width:70%; float:left;}
   .browsing-summary .one-third {width:28%; float:right; margin-top:-30px;}
   .browsing-summary .one-third .dropdown {width: 100%;}


   /*.popup { left:20%; width:60%; max-width:600px; }*/


}

@media only screen and (max-width : 800px),
only screen and (max-device-width : 800px){

   .wrapper{padding:0 3%;}

   header .one-third { width:48%;}
   header .two-third { width:48%;}
   header .one-third .img-placeholder { padding-top:15px;}
   header .two-third .half {width:100%;}
   .search-bar-container { margin-top: 0;}
   .login-controls { margin-top: 15px;}

   #bg-image .one-third, #bg-image .two-third {width:100%;}
   #bg-image .nav-head {float:left; margin-right:3%;}
   #bg-image .nav-head.bg-light-blue {margin-right: 0;}
   .nav-head.bg-green,.nav-head.bg-light-blue { margin-top:0;}


   h4#link-web-menu, #div-web-menu {display:none;}
   a#link-tab-menu {display:block;}

   #slider {clear:both; margin-top:25px !important;}
   .banner {margin-bottom: 25px;}

   .product{ width:28%; height:400px;}
   .three-fourth .product{ width:42%; margin-left:2.5%; margin-right:2.5%; height:365px;}
   .three-fourth .product .img-placeholder {max-width:180px; margin:0 auto;}


   .table-style section .small-col { width:12%;}
   .table-style section .medium-col { width:18%;}
   .table-style section .large-col { width:22%;}
   .table-style section .large-col img.product-thumb { display:block; float:none;}


   .sign-up section {clear:both; padding:5px 0;}
   .sign-up .left-cell{display:block; float:none; width:100%; margin:0 auto 3px auto; vertical-align:top;}
   .sign-up .right-cell{display:block; float:none; width:100%; margin:0 auto;}
   .sign-up .left-cell.to-hide, .sign-up .right-cell.to-hide {display:none;}

   .two-third.to-expand { width:100%;}
   .two-third .sign-up section {clear:both; padding:8px 0;}
   .two-third .sign-up .left-cell{display:block; float:left; width:35%; margin:0 2% 0 0; vertical-align:top;}
   .two-third .sign-up .right-cell{display:block; float:left; width:60%; margin:0 auto;}
   .two-third .sign-up .left-cell.to-hide, .sign-up .right-cell.to-hide {display:block;}

}

@media only screen and (max-width : 768px),
only screen and (max-device-width : 768px){


}

@media only screen and (max-width : 600px),
only screen and (max-device-width : 600px){

	body{font-size:16px; line-height:24px;}

   /*LAYOUT*/
	.left, .right{clear:both; float:none;}
	.one-third, .two-third, .half, .one-fifth, .four-fifth, .one-fourth, .three-fourth {width:100%;}
   /*.content .one-third, .content .two-third {width:100%;}*/

	/*COMMON*/
	p{font-size:16px; line-height:24px;}
	ul.list li{font-size:16px; line-height:24px;}

   h1 {font-size:32px; line-height:36px;}
   h2 {font-size:24px; line-height:30px;}
   h3 {font-size:20px; line-height:24px;}
   h4 {font-size:16px; line-height:20px;}

   .to-hide { display: none !important;}
   .to-show { display: block !important;}

   .border-right-to-top { border-right:none; border-top: solid 1px #ebebeb; padding-top:20px; }
   .border-right-to-bottom { border-right:none; border-bottom: solid 1px #ebebeb; padding-bottom:20px; margin-bottom:20px; }



   #topbar .left, #topbar .right {float:none; text-align:center;}
   #topbar, #topbar a {font-size:12px;}
   #topbar .right a {font-size:14px;}
   #topbar .left ul {width:90%; margin:0 auto;}
   #topbar .left ul li {padding:0 3%;}

   header .one-third, header .two-third { width:80%; margin:0 auto;}
   header .one-third .img-placeholder { padding-top:0; padding-bottom:15px; max-width:300px; margin:0 auto;}
   header .two-third .half {width:100%;}
   .search-bar-container { margin-top: 0;}
   .login-controls { margin-top: 15px;}
   .login-controls .right {clear:none; float:right;}

   ul.categories li{line-height:36px;}
   .nav-head, a.nav-head{line-height:40px; font-size:14px;}

   #bg-image .nav-head {float:left; margin-right:1%; padding:0 1%;}
   #bg-image .nav-head.bg-light-blue {margin-right: 0;}

   #brands .one-fifth {width:44%; padding:0 3%; float:left; clear:none;}

   #features .left {float: left; clear: none;}
   #features .right {float: right; clear: none;}
   #features .one-third {width:30%;}
   #features .two-third {width:65%;}
   #features .half.left {border-bottom:solid 1px #ebebeb; margin-bottom:20px;}

   footer .half .one-third {width:33%; clear:none; float:left;}
   footer #newsletter-signup, footer #socialize {width:60%; padding:10px 20% 0 20%; margin:20px auto 0 auto; text-align:center; border-top:solid 1px #ddd;}
   .btn-signup {font-size:16px; line-height:30px; padding:0 12px;}
   #socialize a {margin:0 5px;}
   #socialize a img {width:30px; height:30px;}

   #payment-methods {text-align:center;}
   #payment-methods span {display:block; padding-bottom:5px;}

   #pager-1,#pager-2{ display:none; }

   #categorization { margin-bottom:50px; display: none; }
   a#mobLinkFilters {display: block !important; }

   #categorization h3{line-height:36px;}
   #categorization a, #categorization .decolink{line-height:24px !important; }
   #categorization .decolink-small { line-height: 24px; padding: 2px 4px; }
   #categorization .active-small{line-height:24px;}
   .filterContainer li {padding:5px 0; }


   .product{ width:42%; margin-left:2.5%; margin-right:2.5%; height:365px;}
   .product .img-placeholder {max-width:180px; margin:0 auto;}


   #mobTitle {display: block;}
   #product-description h2 { display: none;}
   #productImgs { max-width: 300px; margin: 10px 0;}
   #tab-product-details {margin-bottom: 20px;}

   .product .description {font-size: 12px;}
   #product-description p.small-font {font-size:16px; line-height:24px;}
   #product-description .small-font b {font-size: 16px;}


   .table-style section .small-col{
      float:left; width:45%; padding:5px 2%;   margin-right:1%;
      min-height:30px;
      text-align:left !important;
   }
   .table-style section .medium-col, .table-style section .large-col {
      clear:both;
      float:none; width:96%; padding:5px 2%;   
      min-height:30px;
      text-align:left !important;
   }
   .table-style section .large-col img.product-thumb { float:left;}

   .table-style section label { display:block; float:left; font-weight:bold; width:50%; max-width:80px;}

   .table-style tr td, .table-style tr th {font-size:14px; line-height:24px;}
   .table-style p.small-font { font-size:14px; line-height:24px;}
   .small-font b{ font-size:16px;}

   .table-style section.header-style .small-col {line-height: 40px;}

   .sign-up section {font-family:'OpenSansRegular', Arial, Helvetica, sans-serif;}
   .two-third .sign-up section {clear:both; padding:5px 0;}
   .two-third .sign-up .left-cell{display:block; float:none; width:100%; margin:0 auto 3px auto; vertical-align:top;}
   .two-third .sign-up .right-cell{display:block; float:none; width:100%; margin:0 auto;}
   .two-third .sign-up .left-cell.to-hide, .sign-up .right-cell.to-hide {display:none;}

   ul#user-options{float:none; margin:10px auto 0 auto; padding:0; list-style:none;}
   ul#user-options li{margin:5px 2%; width:20%; padding:0; text-align:center;}
   ul#user-options li a{font-size:12px;}

   .viewOptions {text-align: center;}
   .viewOptions b {display:none;}
   .viewOptions .btn-as-link{ font-size:14px; margin:2px 8px;}


   #divToPrint {padding:0 2%;}
   #divToPrint, 
   #divToPrint h2 span, 
   #divToPrint p, #divToPrint p.small-font,
   #divToPrint .table-style tr td, 
   #divToPrint .table-style tr th{
      font-size:14px;
      line-height:20px;
   }

   #divToPrint .left {clear:none; float:left; }
   #divToPrint .right {clear:none; float: right;}
   #divToPrint h3 {line-height:30px;}
   #divToPrint .table-style section.header-style {height:16px; padding:0 0 4px 0;}
   #divToPrint .table-style section.header-style .small-col {font-size:16px; line-height:16px; width:96%;}


}

@media only screen and (max-width : 480px),
only screen and (max-device-width : 480px){


   #topbar .left ul {width:100%; margin:0 auto;}
   #topbar .left ul li {padding:0 3%;}

   header .one-third, header .two-third { width:100%; margin:0 auto;}
   .nav-head span {display:none;}
   #bg-image .nav-head {float:left; margin-right:3%; padding:0 3%;}
   #bg-image .nav-head.bg-light-blue {margin-right: 0;}

   #bg-image {min-height:460px;}

   a#link-mobile-menu, #div-mobile-menu {display:none;}

   #features .left, #features .right {float: none; clear: both;}
   #features .one-third, #features .two-third {width:100%; text-align:center;}
   #features .half img {max-width:120px; margin:0 auto;}


   footer .half .one-third {width:100%; clear:both; float:none;}
   footer #divAccountLinks, footer #divQuickLinks {display:none;}
   footer #divPoliciesLinks {text-align:center;}
   footer #divPoliciesLinks ul {max-width:340px; margin:0 auto;}
   footer #divPoliciesLinks ul li {float:left; padding:0 5%;}

   footer #newsletter-signup, footer #socialize {width:90%; padding:10px 5% 0 5%;}

   #category-heading h2 {padding-right:70px;}

   .browsing-summary {height:auto;}
   .browsing-summary h3 { font-size: 16px; line-height:24px;}
   .browsing-summary .two-third {width:100%; float:none;}
   .browsing-summary .one-third {width:100%; float:none; margin-top:0; text-align:left;}
   .browsing-summary .one-third .dropdown {width: 100%; margin:10px auto;}


   p.speech {width:90%;}

   #divToPrint .left, #divToPrint .right {clear:both; float:none; text-align:left; }
   

}

@media only screen and (max-width : 320px),
only screen and (max-device-width : 320px){

   #topbar .left ul {width:90%;}
   #topbar .left ul li {padding:0 5%;}
   #topbar .right a {display:block; text-align:center;}

   .nav-head span {display:inline;}
   #bg-image .nav-head {float:left; margin:0 0 15px 0; width:90%; padding:0 5%;}
   #bg-image .nav-head.bg-light-blue {margin-bottom: 0;}
   #bg-image {min-height:420px;}

   a#link-tab-menu, #div-tab-menu {display:none;}
   a#link-mobile-menu {display:block;}

   footer #divPoliciesLinks ul li {float:none; width:100%; padding:0; text-align:center;}

   .products-wrapper { width: 90%; margin: 0 auto; }
   .product, .three-fourth .product{ width:100%; margin-right:0; }


   .gray-bg .half h2 {font-size:18px;}
   .gray-bg .half.right label {display:block; margin-bottom:3px;}
   .gray-bg .half.right section {border-top:solid 1px #ebebeb; text-align:center; padding:10px 0 5px 0;}


   .table-style section .small-col{ clear:both; float:none; width:96%; padding:5px 2%;   margin-right:0;}
   .table-style section.header-style .small-col{clear:none; float:left; width:46%; padding:5px 2%; margin:0; }

   ul#user-options li{margin:5px 4%; width:40%; padding:0; text-align:center;}


}