#header { position: fixed; top: 0; left: 0; width: 100%; background: #2A3D98; z-index: 100; }
#header::before{ content: ""; position: absolute; top: 64px; left: 0; width: 100%; height: 1px; pointer-events: none; -webkit-box-shadow: 0px -4px 3px 0px rgba(0,0,0,1); -moz-box-shadow: 0px -4px 3px 0px rgba(0,0,0,1); box-shadow: 0px -4px 3px 0px rgba(0,0,0,1); }

#header .mainNav { position: relative; width: 1200px; max-width: calc( 100% - 100px ); margin: auto; }
#header .mainNavMobile { display: none; }
#header .nav1 { position: absolute; z-index: 2; }
#header .nav2,#header .nav3 { position: relative; width: 100%; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items: center; justify-content: flex-end; padding-top: 5px; padding-bottom: 5px; z-index: 1; }

#header .logo { width: 200px; height: 120px; background-position: center; background-size: contain; background-repeat: no-repeat; background-image: url('../images/logo.png'); }
#header .logoCambridge { width: auto; height: 40px; margin: 5px 0px 5px 15px; }
#header .nav a,#header .nav .menu { position: relative; display: inline-block; margin: 10px 15px; padding: 5px; cursor: pointer; color: transparent; text-shadow: 0 0 0 rgba(255,255,255,1), 0 25px 0 rgba(255,255,255,0); -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; line-height: 20px; text-transform: uppercase; text-transform: uppercase; font-size: 14px; line-height: 20px; font-family: 'Open Sans', sans-serif; font-weight: 700; text-transform: none; }
#header .nav a:hover,#header .nav .menu:hover { color: transparent; text-shadow: 0 -25px 0 rgba(255,255,255,0), 0 0 0 rgba(255,255,255,1); }
#header .nav a.activeCategory { text-shadow: 0 0 0 rgba(255,255,255,1), 0 25px 0 rgba(255,255,255,0); }
#header .nav a.activeCategory:hover { text-shadow: 0 -25px 0 rgba(255,255,255,1), 0 0 0 rgba(255,255,255,0); }
#header .nav a.language.active { display: none; }
#header .nav a.language { font-family: 'Open Sans', sans-serif; font-weight: 400; text-transform: uppercase; margin-right: -35px; }
#header .menu { position: relative; }
#header .subMenu { position: absolute; top: 100%; left: 0; padding: 25px 40px; width: 300px; z-index: 1; background-color: #ffffff; pointer-events: none; opacity: 0; cursor: auto; -webkit-box-shadow: 0px 5px 4px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 5px 4px 0px rgba(0,0,0,0.15); box-shadow: 0px 5px 4px 0px rgba(0,0,0,0.15); }
#header .subMenuInvert { width: 200px; left: auto; right: 0; text-align: right; }
#header .subMenu a { display: block; margin: 3px 0px; padding: 0px; }
#header .menu.openMenu .subMenu { pointer-events: auto; opacity: 1; }
#header .nav2 .linha { width: 100%; display: block; text-align: right; }
#header .nav2 .linha1 { margin-bottom: 5px; }
#header .nav2 .linha2 a { font-size: 14px; font-weight: 700; text-transform: uppercase; }
#header .iconCart { font-size: 18px; }
#header .selectCat::before { content:""; background-image: url('../images/arrow_down_w.png'); background-position: center; background-repeat: no-repeat; background-size: contain; position: absolute; top: 50%; left: 100%; width: 7px; height: 4px; }
#header .nav3 a { margin: 25px 25px; }
#header .areaSubCats { position: absolute; top: 100%; left: 0; width: 100%; max-width: 100%; background-color: #ffffff; padding: 0px 20px 20px 20px; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items: flex-start; justify-content: flex-end; max-height: 50vh; overflow-y: auto; }
#header .areaSubCats.hiddenSubs { opacity: 0; pointer-events: none; }
#header .areaSubCats .bloco { position: relative; width: 25%; text-align: left; padding: 15px; }
#header .areaSubCats .bloco .selectCat { cursor: pointer; }
#header .areaSubCats .bloco::before { content: ""; position: absolute; bottom: 0px; left: 15px; width: calc( 100% - 30px ); height: 1px; background-color: #D4D8EA; }
#header .areaSubCats .bloco h2 { color: #2A3D98; font-size: 14px; font-weight: 700; margin-bottom: 4px; }
#header .areaSubCats .bloco p { font-size: 13px; line-height: 16px; }
#header .areaSubCats .bloco a { color: #1A1A1A; }








/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
    #header::before { display: none } 
    #header .nav1 { position: relative; }
    #header .logo { width: 110px; height: 70px; margin: 10px 10px 10px 15px; }
    #header .mainNav { display: none; max-width: 100%; }
    #header .mainNavMobile { display: flex; }
    #header .nav1,#header .nav2,#header .nav3  { z-index: 0; }
    #header .nav a, #header .nav .menu,#header .nav a:hover, #header .nav .menu:hover { margin: 10px 0; padding-top: 0; padding-bottom: 0; }
    #header .subMenu { display: none; position: relative; top: auto; left: auto; padding: 15px; width: 100%; background-color: transparent; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
    #header .subMenuInvert { width: 100%; right: auto; text-align: left; }
    #header .menu.openMenu .subMenu { display: block; }
    #header .burger { position: relative; margin: 25px 25px 25px 15px; padding: 0px; width: 30px; height: 30px; max-width: 30px; cursor: pointer; z-index: 20; }
    #header .burger .line { position: absolute; left: 0; width: 100%; height: 1px; background-color: rgba(255,255,255,1); }
    #header .burger .line1 { top: calc( 50% - 8px ); }
    #header .burger .line2 { top: 50%; left: auto; right: 0; }
    #header .burger .line3 { top: calc( 50% + 8px ); }
    #header .burger:hover .line1 { width: 70%; }
    #header .burger:hover .line2 { width: 70%; }
    #header .burger:hover .line3 { width: 70%; }
    #header.navOpen .burger .line2 { transform: rotate(-45deg); transform-origin: center; left: 0; right: auto; }
    #header.navOpen .burger .line1,#header.navOpen .burger .line3 { top: 50%; transform: rotate(45deg); transform-origin: center; }
    #header.navOpen .burger .line3 { opacity: 0; }
    #header.navOpen .burger:hover .line1 { left: 5px; width: calc( 100% - 10px ); }
    #header.navOpen .burger:hover .line2 { left: 5px; width: calc( 100% - 10px ); }
    #header .nav3 { display: block; position: absolute; top: 0px; left: 0; width: 100%; max-width: 100%; height: 100vh; padding: 25px 40px; overflow-y: auto; z-index: 1; background-color: #2A3D98; pointer-events: none; opacity: 0; -webkit-box-shadow: 0px 5px 4px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 5px 4px 0px rgba(0,0,0,0.15); box-shadow: 0px 5px 4px 0px rgba(0,0,0,0.15); -ms-overflow-style: none; scrollbar-width: none; z-index: 1; }
    #header .nav3::-webkit-scrollbar { display: none; }
    #header .nav3 .absolute-center { display: none; }
    #header .nav3 a,#header .nav3 .menu { display: block; font-size: 14px; line-height: 22px; }
    #header .nav a.cart { text-shadow: 0 0 0 rgba(255,255,255,1), 25px 0 0 rgba(255,255,255,0); z-index: 2; }
    #header .nav a.cart:hover { text-shadow: -25px 0 0 rgba(255,255,255,0), 0 0 0 rgba(255,255,255,1); }
    #header .nav a.language { margin-right: 0px; }
    #header .parceiros { position: relative; margin: auto; margin-bottom: 20px; text-align: center; }
    #header .parceiros img { margin: 5px; }
    #header .megaSubMenu { position: absolute; top: 0px; left: 0; width: 100%; max-width: 100%; height: 100vh; padding: 25px 40px; overflow-y: auto; z-index: 1; background-color: #2A3D98; pointer-events: none; opacity: 0; -webkit-box-shadow: 0px 5px 4px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 5px 4px 0px rgba(0,0,0,0.15); box-shadow: 0px 5px 4px 0px rgba(0,0,0,0.15); -ms-overflow-style: none; scrollbar-width: none; z-index: 2; }
    #header .megaSubMenu.showMega { pointer-events: auto; opacity: 1; }
    #header .megaSubMenu .closeSub { position: absolute; top: 10px; right: 0; margin: 25px 25px 25px 15px; padding: 0px; width: 30px; height: 30px; max-width: 30px; cursor: pointer; z-index: 20; text-align: center; }
    #header .megaSubMenu .closeSub i { color: #ffffff; font-size: 28px; line-height: 30px; }
    #header .megaSubMenu .absolute-center { display: block; width: 100%; overflow-y: auto; max-height: calc( 100vh - 100px ); }
    #header .areaSubCats { position: relative; top: 0; left: 0; width: 100%; max-width: 100%; background-color: transparent; padding: 0px 20px 20px 20px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; max-height: none; }
    #header .areaSubCats.hiddenSubs { display: -ms-none; display: none; }
    #header .areaSubCats .bloco { width: 100%; text-align: center; padding: 15px; }
    #header .areaSubCats .bloco::before,#header .selectCat::before { display: none; }
    #header .areaSubCats .bloco h2,#header .areaSubCats .bloco p,#header .areaSubCats .bloco a { color: #ffffff; }
    #header .areaSubCats .bloco h2 { margin-bottom: 4px; }
    
    #header.navOpen .nav2 { z-index: 2; }
    #header.navOpen .nav a.language { }
    #header.navOpen .nav a.cart img { -webkit-filter: brightness(0) invert(1); -ms-filter: brightness(0) invert(1); filter: brightness(0) invert(1); }
    #header.navOpen .burger .line { background-color: #ffffff; }
    #header.navOpen .nav3 { pointer-events: auto; opacity: 1; }
    #header.navOpen .nav3 .absolute-center { display: block; width: 100%; overflow-y: auto; max-height: calc( 100vh - 100px ); }
    #header.navOpen .nav3 a, #header.navOpen .nav3 .menu, #header.navOpen .nav a.language, #header.navOpen .nav a.cart { text-shadow: 0 0 0 rgba(255,255,255,1), 25px 0 0 rgba(255,255,255,0);  text-align: center; }
    #header.navOpen .nav3 a:hover, #header.navOpen .nav3 .menu:hover, #header.navOpen .nav a.language:hover,#header.navOpen .nav a.cart:hover { text-shadow: -25px 0 0 rgba(255,255,255,0), 0 0 0 rgba(255,255,255,1); }
    #header.navOpen .nav3 .clientSection { margin: 20px auto; }
}

