/* -------------------------------------------------------------------------- */


.header .area-menu{margin: 0 0 0 0; justify-content: center; justify-content: center;}
.header .menu ul li.current-menu-item > a::before{content: ''; position: absolute; bottom: 8px; left: 0; right: 0; height: 3px; background-color: #2da2ce;}
.header .menu ul li a{margin: 0 15px 0 15px;  padding: 15px 0; color: #525051; font-size: 14px;}
.header .menu ul li a:hover, .menu ul li a.active:hover{color: #2da2ce;}
.header .menu ul li ul li a{padding: 8px 0; font-size: 14px; color: #2da2ce;}


/* primeiro nivel */
.menu{height: 100%;}
.menu ul{margin: 0 0 0 ; padding: 0; display: flex; list-style: none; height: 100%;}
.menu ul li{position: relative; padding: 0 0; align-items: stretch;}
.menu ul li:first-child a{margin-left: 0;}
.menu ul li:last-child a{margin-right: 0;}
.menu ul li a{display: flex; height: 100%; text-decoration: none; text-transform: uppercase; align-items: center; position: relative; }  


/* segundo nivel */
.menu ul li ul a{transition: none!important; margin: 0 15px 0 15px!important; display: block;}
.menu ul li ul li.current-menu-item a::before{display: none!important;}
.menu ul li ul li.current-menu-item{background-color: #f3f3f3;}
.menu ul li ul{display: flex; flex-direction: column; width: 170px; visibility: hidden; position: absolute; top: 120%!important; left: 0; z-index: 99; margin: 0; padding: 15px 0; background-color: #fff; height: auto!important; box-shadow: 0px 0px 10px rgba(0,0,0,.2);}
.menu ul li > ul::before{content: ''; position: absolute; top: -5px; left: 10px!important; right: auto!important; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 5px solid #F9F9F9;}



.menu ul li:hover > ul{top: 100%!important; visibility:visible!important; background: #F9F9F9; transition: 0.4s ease;}
.menu ul li ul li{display: block; position: relative; }
.menu ul li ul li a{display: block; text-align: left; border-bottom: 0; text-transform: initial;} 
.menu ul li ul li:hover{background-color: #f3f3f3;}
.menu ul li ul li a:hover, .menu ul li ul li a.active{border-bottom: 0; color: #000!important;}


/* ajuste ultimo elemento para a esquerda 
.menu ul li:last-child ul{left: auto; right: 0;}
*/


/* outros niveis */
.menu ul li ul li ul{height: auto; background: #f3f3f3!important; width: 220px; visibility: hidden; position: absolute; top: 0!important; left: 100%; margin: 0;}
.menu ul li ul li:hover ul{top: 0!important; left: 100%; margin: 0; padding: 0 0 15px 0!important;}
.menu ul li ul li ul li{background: #f3f3f3;}

        


/* menu responsivo ---------------------------------------------------------- */
/* -------------------------------------------------------------------------- */

.btMenuFechar{width: 40px; height: 40px; text-align: center; color: #fff; position: absolute; top: 20px;  left: 10px; background: #bfd632; cursor: pointer; z-index: 99999; transition: 0.4s ease; border-radius: 50%;}
.btMenuFechar:hover{opacity: 0.7;}
.btMenuFechar i{line-height: 42px; font-size: 22px;}

.areaMenuResponsivo{position: fixed; right: -100%; top: 0; bottom: 0;  width: 250px; background: #fff; z-index: 999999; overflow: hidden; visibility: hidden;}
.areaMenuResponsivo .overflow{position: absolute; left: 0; right: 0; width: 270px; top: 0; bottom: 0;  overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch !important; border-left: 2px solid #eee;}
.areaMenuResponsivo .overflow .menuResponsivo{ width: 250px; margin: 80px 0 0 0; font-size: 13px;  z-index: 9999;}
.areaMenuResponsivo .overflow .menuResponsivo li .clearfix{background: none!important; padding-top: 0!important;}
.areaMenuResponsivo .overflow .menuResponsivo .sub-menu{position: relative; display: block; }
.areaMenuResponsivo .overflow .menuResponsivo .sub-menu .sub-menu{position: relative; padding: 0; display: block; top: 0; left: 0;}   
.areaMenuResponsivo .overflow .menuResponsivo ul{margin: 0; padding: 0; list-style: none; }
.areaMenuResponsivo .overflow .menuResponsivo ul li{border-bottom: 1px solid #e6e7e8;}
.areaMenuResponsivo .overflow .menuResponsivo ul li li:last-child{border: none;}  
.areaMenuResponsivo .overflow .menuResponsivo ul li a{padding-left:10px; font-weight: bold; color: #000; background: #f1f1f1; border-bottom: 1px solid #e6e7e8;}
.areaMenuResponsivo .overflow .menuResponsivo ul li li a{padding-left: 15px; font-weight: normal; background: none; border: none;}
.areaMenuResponsivo .overflow .menuResponsivo ul li li li a{padding-left: 20px; font-weight: normal; background: none; border: none;}
.areaMenuResponsivo .overflow .menuResponsivo ul a{padding-bottom: 7px; padding-top: 7px; display: block;}
.areaMenuResponsivo .overflow .menuResponsivo ul a:hover{color: #122845;}