@import url(https://fonts.googleapis.com/css?family=Oxygen:300,400,700&display=swap);

*{font-family: Oxygen, Helvetica, Sans-Serif;}
html{scroll-behavior: smooth;}
h1{font-size: calc(30px + .5vw); margin: 0; padding: 0; color: #003366; font-weight: 700;}
h2{font-size: calc(20px + .5vw); margin: 0; padding: 0; color: #003366; font-weight: 700;}
h3{font-size: calc(16px + .5vw); margin: 0; padding: 0; color: #003366; font-weight: 700;}
p{font-size: calc(11px + .7vw);}
div{font-size: calc(16px + .7vw);}
img {image-rendering: crisp-edges;}
body{margin: 0; padding: 0px; font-size: calc(16px + .7vw); color: #000;}
body:before{content: "."; line-height: 142px; color: transparent;}
a{text-decoration: none; margin: 0; padding: 0; font-size: calc(14px + .5vw); color: #000; opacity: .9; font-weight: 700; outline: none;}
a:hover{opacity: 1; color: #CC6600;}


input{padding: 6px ; border: solid 1px #003366; outline: none; }
.std-field {font-size: 24px; border-radius: 4px; border-width: 2px; border-style: solid; border-color: #b5b4b7; padding-right: 1rem; padding-left: 1rem; width: 100%; margin-top: 5px; margin-bottom: 5px;}

/* CORE STRUCTURE*/
.page-outer-w-margin{width: 98%; margin-left: 2%; text-align: left;}
.page-outer{width: 100%; text-align: center; margin-bottom: 100px;}
.page-inner{display: inline-block; margin: 0 auto; text-align: left; max-width: 96%; margin-bottom: 50px;}
.address_cell {text-align: left;  border: solid 1px #ccc; float: left; width: 26%; min-height: 250px; margin-left: 4%;}
.full-width{line-height: 1.5em; padding-left: 6vw; padding-right: 6vw; text-rendering: optimizeLegibility; font-size: calc(16px + .7vw); margin-top: 20px;}
#pagewrap{width: 98%; margin-left: 2%;} /* OLD PAGES DO NOT USE*/

#CurrentUser{background-color: yellow; position: absolute; top: 0px; left: 0px; width: 600px; height: 40px; z-index: 9999999;}

@media screen and (max-width: 500px) {
    .address_cell{width: 100%;}
}

a.pagebutton{color: White; margin: 3px; border-radius: 2px; background: #003366; width: 40px; height: 40px; text-align: center; font-size: 16px; font-weight: 700; cursor:default; text-decoration: none; line-height: 40px; float: right ; cursor: pointer;}
a.pagebutton:hover{opacity: 1; color: yellow;}
a.bigpagebutton{color: White; margin: 3; border-radius: 4px; background: #003366; width: 40; height: 40; text-align: center; font-size: 22px; font-weight: 700; cursor:default; text-decoration: none; line-height: 40px; float: right ; cursor: pointer;}
a.bigpagebutton:hover{opacity: 1; color: yellow;}
.checkoutButton{opacity: .9; text-align: right; font-weight: bold; cursor: pointer; min-width: 125; margin: 5 0 5 0; background-color: #003366; color: white; padding: 8 4 8 4; text-align: center; border-radius: 10px; display: inline-block; font-size: 20px;}
.checkoutButton:hover{opacity: 1; color: yellow; background: #003366;}
.checkoutButton_click{background: url('/images/rwait.gif'); background-repeat: no-repeat; background-position: center center; color: white; width: 125px; height: 25px; border: solid 0px red; padding: 8 4 8 4; }

#pnlSocial{text-align: center; border: none; background-color: #f0f0f0; height: 75px; width: 100%; float: left;}
#pnlSocial img{width: 32px; margin-top: 15px;}
#pnlSocial a{opacity: .5; margin: 0 12px 0 12px; }
#pnlSocial a:hover{opacity: 1; background-color: #f0f0f0;}

.shoulder_left{border: solid 1px #ccc; float: left; padding: 0; margin: 0; width: 85px;}
.center_cell{border: solid 1px #ccc; float: left; padding: 0; margin: 0; width: 600px;}
.shoulder_right{border: solid 1px #ccc; float: left; padding: 0; margin: 0; width: 85px;}

/* Catalog Content*/
.catalogContent{font-weight: 400;}
.catalogContent h2{margin: 15px 0 0px 0; font-size: 24px; font-weight: 900;}
.catalogContent h3{margin: 15px 0 0px 0; color: black; font-weight: 900; }
._catalogContent a{color: #fa8404;}
.emoji{width: 30px; height: auto; margin-top: 0; vertical-align: bottom;}
.emoji:hover {width: auto;}
.catalogProductHeaderDescription{width: 550px; height: 140px; margin: 10px 0px 0px 10px;}
.catalogProductHeader{background: none; height: 210px;cursor: pointer; background-position:center center; background-repeat: no-repeat; background-color: white; color: #003366; _border: solid 1px yellow !important; }
.catalogProductHeader h1{white-space: nowrap; background-color: none; text-align: left; border: solid 0px red; width: 100%; margin-bottom: 10px; color: white; font-weight: 900; font-size: 36px; line-height: 38px; color: #003366;}
.catalogProductHeader h2{background-color: none; text-align: left; border: solid 0px red; width: 100%; color: white; font-weight: 900; font-size: 16px; color: black;}
.cpmini {height: 60px !important;}

/* HEADER 2019 */
.framed-header{padding: 0px; margin: 0px; position: fixed; top: 0px; left: 0px;  width: calc(100% + 10px);}

.header {border-top: solid 6px #003366; overflow: hidden; position: fixed; top: 0px; left: 0px; height: 135px; width: calc(100% + 10px); box-shadow: 0 1px 1px rgba(0,0,0,.25); _border-bottom: solid 1px #CCCCCC; z-index: 999; background-color: white;}
.header a{text-decoration: none;}
.header a:hover{background-color: transparent !important;}
.header ul{display: table; width: 100%; height: 100%; _background: #f0f0f0; padding: 0; margin: 0; _border: solid 1px red;}
.header ul li{display: inline-block; display: table-cell; border: solid 0px blue; vertical-align: top;}
.header ul li a{font-size: calc(10px + 1vw); color: #003366; max-height: 30px;}
.icontab{width: 56px; text-align: center;}
.icontab img{width: 50%; height: auto; padding: 0px; margin: 0px; padding: 2px;}
.phonetab{border-left: solid 1px #cccccc; font-size: calc(14px + .7vw); color: #003366; font-weight: 900; text-align: center; width: 225px; padding-right: 10px;}
.logotab{border-left: solid 1px #cccccc; text-align: left; padding: 0 1vw 0 1vw; width: 170px;}
.logotab img{max-width: 100%; margin: 10px;}
.texttab{text-align: center; text-transform: uppercase;}
.menutab{width: 64px; cursor: pointer; padding-top: 10px; _display: none !important;}
.hb-bar{background-color: #003366; width: 70%; margin: 5px auto; height: 6px; border-radius: 10px;}
.hb-text{margin: 4px auto; height: 16px; line-height: 16px; text-align: center; color: #003366; text-transform: uppercase; font-weight: 900;}
#icontab-dc{display: none;}

.menu-link{}
.menu-link:hover{color: #CC6600 !important;}
.menu-indicator{}
.menu-indicator:hover{color: #CC6600;}
.menu-hover:hover{border-bottom: solid 4px #003366;}
.menu-indicator:after{content: ''; width: 30px; height: calc(10px + 1vw); display: inline-block; background-image: url('/images/inline-down-arrow.png'); background-position: 2px center; background-repeat: no-repeat; background-size: calc(10px + 1vw) auto;}
.menu-indicator:hover:after{transform: rotate(360deg); transition: .1s;}

/* Menu */        
#menuContent{ margin: 0 auto; margin-top: 70px; padding: 0px;}
#menuContent li a{background-color: rgb(255, 255, 255); border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid;border-bottom-width: 0px;border-left-color: rgb(221, 221, 221);border-left-style: solid;border-left-width: 0px;border-right-color: rgb(221, 221, 221);border-right-style: solid;border-right-width: 0px;border-top-color: rgb(221, 221, 221);border-top-left-radius: 0px;border-top-right-radius: 0px;border-top-style: solid;border-top-width: 1px;color: rgb(51, 51, 51);display: block;font-size: 16px;height: 20px;line-height: 20.8px;list-style-image: none;list-style-position: outside;list-style-type: none;margin-bottom: 0px;margin-left: 0px;margin-right: 0px;margin-top: 0px;overflow-x: hidden;overflow-y: hidden;padding-bottom: 11.2px;padding-left: 16px;padding-right: 16px;padding-top: 11.2px;position: relative;text-align: left;text-overflow: ellipsis;text-shadow: rgb(243, 243, 243) 0px 1px 0px;text-size-adjust: 100%;white-space: nowrap;width: 813.375px;-webkit-tap-highlight-color: rgba(0, 0, 0, 0); text-decoration: none;}             
#menuContent .divider{background-color: #003366; color: white; font-weight: 700; height: 30px; line-height: 30px; padding-left: 16px; font-weight: 900;}   
        
/* SEARCH */
.search-overlay {height: 100%; width: 0; position: fixed; z-index: 1; top: 0; left: 0; background-color: rgba(0,0,0,.6); overflow-x: hidden; transition: 0.2s; z-index: 99999;}
.search-overlay-content {position: relative; top: 25%; width: 100%; text-align: center; margin-top: 30px;}
.search-overlay-content input{height: calc(40px + 2vh); width: 50%; font-size: calc(30px + 2vh);}
.overlay-close:hover {color: black; opacity: 1; background-color: white;}
.overlay-close:focus {_color: yellow;}
.overlay-close{opacity: 1;  font-size: 48px; width: 50px; font-weight: 400; height: 50px; line-height: 42px; position: absolute; top: 3%; right: 3%; color: black; text-align: center; background-color: white; border-radius: 25px;}


#txtSearch{opacity: 1; z-index: 999999;}
        
/* Header media */

/* DESKTOP */
#icon-menu1{display: none;}
#icon-menu2{display: none;}
#icon-menu3{display: none;}

@media screen and (min-width: 1025px) {
    .header ul li a {font-size: 24px; }
    ._header-menu-bar{margin-top: 0px;}
    .menu-indicator:after{height: 24px; background-size:24px auto;}
    #chat-link:before {padding: 5px 12px 10px 5px;}
    #header-divider{margin-top: 16px !important;}    
}

@media screen and (min-width: 1200px) {    
    .header ul li a {font-size: 28px; }
    .header-menu-bar{margin-top: 0px;}
}

@media screen and (min-width: 1400px) {
    .header ul li a {font-size: 30px; }
    .header-menu-bar{margin-top: 0px;}
    #header-divider{margin-top: 8px !important;}
}

@media screen and (max-width: 1024px) {
    .header-menu-bar{margin-top:4px !important;}
    #header-menu1-p2{display: none;}
    #header-menu2-p2{display: none;}
}

@media screen and (max-width: 930px) {
    #icon-menu3{display: table-cell;}    
    #header-divider{margin-top: calc(10px + 1vw);}
}

@media screen and (max-width: 800px) {
    #icon-menu3{display: table-cell;}
    #header-link4{display: none;}
    #icon-menu2{display: table-cell;}
    #header-link3 a{display: none;}    
    .overlay-close {top: 0px !important; right: 25px !important; font-size: 50px;}
    .overlay-close {padding: 0px !important;}    
    #header-link4{display: none;}
    #header-divider{margin-top: calc(10px + 1vw);}
}

@media screen and (max-width: 660px) {
    #header-link2{display: none;}
    #header-chat-link{display: none;}
    #header-phone-link{border-right: none !important;}    
    .overlay-close {top: 10px !important; right: 25px !important; font-size: 50px;}
    .overlay-close {padding: 0px !important;}
    #header-divider{display: none;}
    .header-menu-bar{display: none;}
    .header{height: 94px; border-top: solid 3px #003366;}
    body:before{line-height: 94px;}
    #header-hamburger {display: block !important;}

    #header-menu1-p3{display: none;}
    .header-contact-box{display: none;}
    #header-menu1{display: none;}
    #header-menu2{display: none;}
    #header-menu3{display: none;}
}  
        
/* FOOTER 2019 */
#footer2019 {_width: calc(100% + 20px); margin-left: -10px; padding-bottom: 0; }
#footer2019 div{padding: 0px; margin: 0px; background-color: #f0f0f0; display: block;}
#footer2019 ul{display: table; width: calc(100% - 50%); padding: 0 25% 0 25%; background-color: #f0f0f0; height: 48px; line-height: 48px; margin: 0px;}
#footer2019 ul li{display: table-cell; text-align: center; width: 25%;}
#footer2019 ul li:hover {background-color: #e1e1e1;}
#footer2019 ul li a{text-decoration: none;}
#pnlSocial{text-align: center; border: none; background-color: #f0f0f0; height: 75px; width: 100%; float: left;}
#pnlSocial img{width: 32px; margin-top: 15px;}
#pnlSocial a{opacity: .5; margin: 0 12px 0 12px; }
#pnlSocial a:hover{opacity: 1; background-color: #f0f0f0;}
#bbb {width: 100%;float: left;text-align: center;}
#bbb a:hover {background-color: transparent;}
 
/* REVIEW BLOCKS */
.review-block{width: 100%; text-align: center; padding: 0px; margin-top: 20px; display: inline-block;}
.review-block li{display: inline-block; overflow: hidden; margin: 20px 2vw 20px 2vw; width: 25%;}
.review-bubble {background: #EEEEEE; -webkit-border-radius: calc(10px + 1vw); border-radius: calc(10px + 1vw); font-size: 1.2rem; line-height: 1.3;margin: 0 auto 40px; max-width: 400px; padding: 15px; position: relative;}
.review-bubble p {margin: 0 0 10px; line-height: 1.5em; text-rendering:optimizeLegibility; font-size: calc(16px + .5vw);}
.review-bubble p:last-of-type {margin-bottom: 0;}
.review-bubble::after {border-left: 20px solid transparent; border-top: 20px solid #EEEEEE; bottom: -20px; content: ""; position: absolute; right: 50px;}    
.rb-blue{background: #003366; color: white;}
.rb-blue::after{border-top: 20px solid #003366; right: 80px;}
.rb-gray{background: #eeeeee; color: black;}
.rb-gray::after{border-top: 20px solid #eeeeee; right: 90px;}


@media screen and (max-width: 1024px) {
    #footer2019 ul{width: calc(100% - 30%); padding: 0 15% 0 15%;}
}

@media screen and (max-width: 800px) {
    .review-block{margin-left: 0px; width: 95%; margin: 40px auto;}
    .review-block li{width: 100%; margin: 0; margin-top: 20px;}
    #footer2019 ul {width: 100%; padding: 0;}
}

/* WHY BAR */
.why-bar{_width: calc(100% + 20px); margin-left: -10px; text-align: center; padding: 10px 0px 0px 0px;}
.why-bar-left{background-color: #f0f0f0; display: inline-block; float: left; width: 50%; min-height: 450px; padding-top: 20px; padding-bottom: 20px;}
.why-bar-left img{max-width: 200px;}
.why-bar-left p{line-height: 1.5em; padding-left: 8vw; padding-right: 8vw; text-rendering:optimizeLegibility; font-size: calc(14px + .7vw); margin-top: 5vh;}
.why-bar-right{background-color: white; display: inline-block; float: right; width: 50%; min-height: 450px; padding-top: 20px; padding-bottom: 20px; overflow: hidden;}
.why-bar-right a {font-size: calc(14px + .7vw); text-align: center;}
.why-bar-right a:hover{background-color: white;}
.why-bar-left h4{font-size: calc(14px + .7vw); font-weight: 700; color:#003366; margin: 10px 0px 10px 0px; text-align: center; width: 100%; _padding-left: 20%; text-transform: capitalize;}
.why-bar-right h4{font-size: calc(14px + .7vw); font-weight: 700; color:#003366; text-align: center; margin: 0px 0px 20px 0px;}
.why-bar-bullet {line-height: calc(30px + .7vw); width: 100%; text-align: left; padding:5px 0px 10px 8vw; margin: 10px 0px 10px 0px; height: calc(30px + .7vw); text-rendering:optimizeLegibility; font-size: calc(14px + .7vw); overflow: hidden;}
.why-bar-bullet:before{line-height: calc(30px + .7vw); vertical-align: top;content:"\2bC8"; padding-right: 5px; color: #003366; font-weight: 700; font-size: calc(28px + .7vw);}
.why-bar-h4 {padding-left: 0; width: 100%; text-transform: capitalize;}
.why-bar-a {padding-left: 0; width: 100%; text-align:center; margin-top: 20px;}

@media screen and (max-width: 800px) {
    .why-bar-left {width: 100%;}
    .why-bar-right {width: 100%;}
}


/* CORE CSS BLOCKS*/

/* TEXT MENU */
.onpagescroll{text-align: center; padding: 0px;}        
.onpagescroll li{display: inline-block; /*border-bottom: solid 5px #c1c1c1; */ margin-right: 2vw; margin-left: 2vw; font-weight: bold; height: 50px; line-height: 50px; text-transform: uppercase;}
.onpagescroll li a{color: black; text-decoration: none; font-size: calc(16px + .7vw); }
.onpagescroll li a:hover{color: #CC6600;}
.onpagescroll div{font-size: calc(14px + .5vw); color: dimgray; width: 100%; text-align: center;}
        
@media screen and (max-width: 800px) {
    .onpagescroll{border-top: solid 1px #c1c1c1; margin-left: 0px; width: 95%; margin: auto;}
    .onpagescroll li{ border-bottom: solid 1px #c1c1c1; width: 100%; margin: 0px;}
    .onpagescroll li::after {content: "";}
}

/* H1 BLOCK */
.h1cell{width: 100%; margin: 10px 0px 0px 0px; text-align: center;}			
.h1cell span{font-size: calc(16px + 1vw); color: #C1C1C1;}
.h1cell h1{line-height: 40px; font-size: calc(18px + 1vw); }
			
@media screen and (max-width: 800px) {
	.h1cell h1{border-bottom: none; font-size: calc(16px + 1vw);}
}

/* H2 BLOCK */
.h2cell{width: 100%; margin-bottom: 10px; margin-top: 10px; text-align: center; }			
.h2cell span{font-size: calc(14px + .5vw); color: dimgray;}
.h2cell h2{line-height: 30px; font-size: calc(14px + 1vw);}
			
@media screen and (max-width: 800px) {
	.h2cell h2{border-bottom: none;}
}
    
/* TEXT BLOCK */
.text-block{line-height: 1.5em; padding-left: 6vw; padding-right: 6vw; text-rendering: optimizeLegibility; font-size: calc(16px + .7vw); margin-top: 20px;}
.text-block br{_line-height: 7vh;}
.text-block a{font-size: calc(16px + .7vw);}
.text-block img{float: left; margin: 10px 20px 10px 0px; max-height: 200px;}

.right{float: right !important;  margin: 10px 0px 10px 20px;}
      
.text-block-after{padding-left: 6vw; padding-right: 6vw; font-size: calc(16px + .7vw); margin: 60px 0 60px 0; }
.text-block-after  ul{text-align: center; margin: 0 auto; list-style-type: none;}
.text-block-after  ul li{font-size: calc(20px + .7vw); margin: 30px 0 30px 0; font-weight: 700;}

/* HORIZ CONTENT LEFT */
.hibl{display: inline-block; width: 100%; margin-top: 10px; margin-bottom: 30px;}
.hibl-image{float: left; margin: 0px 20px 20px 10vw;}
.hibl-image img{}
.hibl-content{margin: 0px 9vw 0px 10vw;}
.hibl-content h2{font-size: calc(16px + .5vw); margin: 0; padding: 0; font-weight: 700; color: #003366; display: inline-block;}
.hibl-content h3{font-size: calc(16px + .5vw); margin: 0; padding: 0; font-weight: 700; color: #003366; display: inline-block;}      
.hibl-content h4{font-size: calc(16px + .5vw); margin: 0; padding: 0; color: black; display: inline-block; text-decoration: underline;}
.hibl-content div{margin-top: 10px; font-size: calc(16px + .5vw); min-width: 200px;}
.hibl-content a{font-size: calc(16px + .5vw);}

@media screen and (max-width: 800px) {          
    .hibl-image {margin: 0px auto; text-align: center;width: 100%;}
    .hibl-image img{width: 100%;}        
    .hibl-content {width: 100%; margin: 0px;}
    .hibl-content h2{margin-top: 20px;}
    .hibl-content h3{margin-top: 20px;}
    .hibl-content h4{margin-top: 20px;}
}
    
/* HORIZONTAL CONTENT RIGHT */
.hibr{display: inline-block; width: 100%; margin-top: 10px; margin-bottom: 30px;}
.hibr-image{float: right; margin: 0px 9vw 20px 20px;}
.hibr-image img{}
.hibr-content{margin: 0px 10vw 0px 9vw;}
.hibr-content h2{font-size: calc(16px + .5vw); margin: 0; padding: 0; font-weight: 700; color: #003366; padding-left: 10px; display: inline-block;}
.hibr-content h3{font-size: calc(16px + .5vw); margin: 0; padding: 0; font-weight: 700; color: #003366; padding-left: 10px; display: inline-block;}        
.hibr-content h4{font-size: calc(16px + .5vw); margin: 0; padding: 0; color: black; display: inline-block; text-decoration: underline;}
.hibr-content div{margin-top: 10px; font-size: calc(16px + .5vw); padding-left: 10px;}
.hibr-content a{font-size: calc(16px + .5vw);}
        
@media screen and (max-width: 800px) {
    .hibr-image {margin: 0px auto; text-align: center; width: 100%;}  
    .hibr-image img{width: 100%;}         
    .hibr-content {width: 100%; margin: 0px;}
    .hibr-content h2{margin-top: 20px;}
    .hibr-content h3{margin-top: 20px;}
    .hibr-content h4{margin-top: 20px;}
    
}

/* IMAGE PACK */
.img3{width: 100%; text-align: center; padding: 0px;}
.img3 a:hover{background-color: transparent;}
.img3 img{width: 100%; height: auto;}
.img3 li{display: inline-block; overflow: hidden; vertical-align: top; _height: calc(300px + 10vw); margin: 10px;  margin-right: 2vw; margin-left: 2vw;}
.img3 h3{font-size: calc(16px + .5vw); margin: 10px 0 0 0; padding: 0; font-weight: 700; color: #003366;}
.img3-content{width:300px; text-align: left; font-size: calc(16px + .5vw);}
.img3-desc {font-size: calc(16px + .5vw); margin: 10px 0 0 0;}
.img3-desc  a{font-size: calc(16px + .5vw) !important; color: black;}
.img3-desc  a:hover{background-color: #e1e1e1; color: #CC6600;}

@media screen and (max-width: 450px) {
    .img3-content {width: 100%;}
}

/* SIMPLE HERO */      
.simple-hero-image {width: calc(100% + 10px); margin-left: -10px; overflow: hidden; height: 600px; background-position: center; background-repeat: no-repeat;background-size: cover; position: relative; cursor: pointer;}
.simple-hero-animation {animation-name: simple-hero-animation; animation-duration: 5s;}
@keyframes simple-hero-animation{
    0%{opacity: 0}
    40%{opacity: 1}
    100%{opacity:1}
}

@media screen and (max-width: 1599px) {
    .simple-hero-image{height: 500px;}
    _body{background-color: purple;}
}

@media screen and (max-width: 1399px) {
   .simple-hero-image{height: 500px;}
   _body{background-color: blue;}
}

@media screen and (max-width: 1199px) {
   .simple-hero-image{height: 400px;}
   _body{background-color: green;}
}

@media screen and (max-width: 550px) {
    .simple-hero-image{background-position: top;}
    .simple-hero-image{height: 300px;}
    _body{background-color: red;}
}

/* HEADER MENUS */
#headerTray{}
#header-overlay {height: 0; width: 100%; position: fixed; z-index: 1; top: 141px; left: 0; background-color: rgba(0,0,0,.3); overflow-x: hidden; transition: 0.1s; z-index: 99999;}  
.header-menu{width: 90%; height: 492px; background-color: white; border: solid 1px #f0f0f0; margin: 0 auto;  box-shadow: 0 1px 1px rgba(0,0,0,.25); z-index: 100; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px;}
.header-menu a{font-size: calc(14px + .5vw);}
.header-menu ul{width: 100%; height: 100%;   list-style-type: none; display: table; margin: 0px; padding: 0px;}
.header-menu ul li{height: 100%;   padding: 25px; display: table-cell; min-width: 250px; max-width: 300px;}
.header-menu ul li a{padding-left: 10%; line-height: 35px;}

.header-menu h2{font-size: calc(14px + .5vw);}

#product-menu ul{_border: solid 1px red; }
#product-menu ul li{_border: solid 1px blue; }
    
#product-menu{display: none;}
#design-menu {display: none;}
#account-menu{display: none;}

.headerRecentlyViewed{border: solid 0px red; width: 100%; height: 100%;}
.recentProduct{float: left; width: 45%; border: solid 0px blue; text-align: center; padding-top: 10px;}
.recentProduct img{width: 100%; height: auto;}
.recentProduct a{padding: 0px !important; line-height: 20px !important;}
.recentProduct a:hover{background-color: transparent;}
.recentProductMask{max-height: 180px; overflow: hidden; margin-bottom: 5px;}

.header-brands {max-width: 300px; margin: 0 auto; padding-top: 10px; text-align: center;}
.header-brands a{padding: 0px !important; margin: 0px !important;}
.header-brands a:hover{background-color: transparent;}

.header-top-bar{border: solid 0px red; width: calc(100% - 5px); height: 70px; padding: 5px;}
.header-main-logo{width: 220px; padding-top: 12px; padding-left: 2%;}
.header-contact-box{float: right;  font-size: calc(18px + .7vw); font-weight: 700; color: #003366; padding-right: 8%; padding-top: 24px;}
#header-phone-link{border-right: solid 2px #cccccc; float: left; padding-right: 10px;}

#header-chat-link{float: left; padding-left: 10px;}
    
#header-divider{background-color: #f0f0f0; width: 100%; height: 1px; margin-top: 16px;}
    
.header-menu-bar{border: solid 0px orange; _border-top: solid 1px #f0f0f0; width: 100%; height: 29px; margin-top: 2px;}
#header-hamburger {display: none; cursor: pointer;background-image: url('/images/hamburger64.png'); background-size: 40px 40px; background-position: 50px center; background-repeat: no-repeat; width: 100px; height: 64px; position: absolute; bottom: 0; right: 4%;}


#chat-link{font-size: calc(18px + .7vw); color: #7f7f7f;}
#chat-link:hover{color: #CC6600; }
#phone-link{font-size: calc(18px + .7vw); color: #7f7f7f;}
#phone-link:hover{color: #CC6600;}

#chat-link:before{content:""; display: inline-block; background-image: url('/images/chat-icon.png'); background-position: center 8px; width: 16px; height: 16px; background-size: calc(14px + .7vw) calc(14px + .7vw); background-repeat: no-repeat; padding: 5px 10px 10px 5px;}
#phone-link:before{content:""; display: inline-block; background-image: url('/images/phone-icon.png'); background-position: center 8px; width: 16px; height: 16px; background-size: calc(14px + .7vw) calc(14px + .7vw); background-repeat: no-repeat; padding: 5px 10px 10px 5px; }

.brand-logo-menu img{width: 39%; padding: 5px; height: auto;}
.brand-logo-menu-w img{width: 78%; padding: 5px; height: auto;}

#header-menu3{height: 450px;}
#header-menu3 img{width: 100%; max-width: 300px;}
#header-menu3 ul li {min-width:initial; max-width: initial; width: 32%; text-align: center;}
#header-menu3 h2{margin-bottom: 10px;}
#header-menu3 a{padding: 0; margin:0; opacity: 1;}
#header-menu3 a:hover{padding: 0; opacity: .9;}

#header-menu3 a {background-color: transparent;}
#header-menu3 p {text-transform: capitalize; font-weight: 700;}

#header-menu3-p1 h2{text-align: center;}
#header-menu1-p2 h2{text-align: center;}
#header-menu1-p3 h2{text-align: center;}
#header-menu2-p3 h2{text-align: center;}
#header-menu2-p2 h2{text-align: center;}
#header-menu2-p2 a{padding: 0px;}
#header-menu2-p2{text-align: center;}
#header-menu2-p3 h2{text-align: center;}
#header-menu3-p2 h2{text-align: center;}
#header-menu3-p3 h2{text-align: center;}
.header-nav-links{width: 70%; margin: 0 auto;}

/* Home page brands*/
.hpbl-newera{width: 90px; height: auto;}
.hpbl-ogio{width: 56px; height: auto;}                                   		
.hpbl-ua{width: 56px; height: auto;}
.hpbl-carhartt{width: 78px; height: auto;}
.hpbl-nike{width: 82px; height: auto;}
.hpbl-patagonia{width: 150px; height: auto; vertical-align: baseline;}
.hpbl-eb{width: 96px; height: auto; vertical-align: super;}
.hpbl-gildan{width: 116px; height: auto; vertical-align: super;}
.hpbl-tnf{width: 94px; height: auto;}

@media screen and (min-width: 1679px) {
    .hpbl-newera{width: 120px; height: auto;}
    .hpbl-ogio{width: 86px; height: auto;}                                   		
    .hpbl-ua{width: 86px; height: auto;}
    .hpbl-carhartt{width: 108px; height: auto;}
    .hpbl-nike{width: 112px; height: auto;}
    .hpbl-patagonia{width: 180px; height: auto; vertical-align: baseline;}
    .hpbl-eb{width: 126px; height: auto; vertical-align: super;}
    .hpbl-gildan{width: 146px; height: auto; vertical-align: super;}
    .hpbl-tnf{width: 124px; height: auto;}        
}


@media screen and (min-width: 1599px) {
    #chat-link:before{background-position: center 2px;}
    #phone-link:before{background-position: center 2px;}
}


.tinylb{background: #e1e1e1; color: #333; padding: 2px 8px 2px 8px; margin-top: 5px; border-radius: 2px; display: inline-block; opacity: .9;}
.tinylb:hover{color: black; background: #CCC; opacity: 1;}