/* ---------- navigaiton ---------*/
.site-navbar :where( li , a  ,.dropdown ) , .site-navbar :after , .site-navbar :before , .site-mobile-menu , .side-nav , .site-mobile-menu-close {transition: 0.4s ease;-webkit-transition: 0.4s ease;-moz-transition: 0.4s ease;-o-transition: 0.4s ease;-ms-transition: 0.4s ease;}

/* active css */
.site-navbar .site-navigation .menu-active a{color: var(--tertiarycolor);}
.site-mobile-menu  ul > .menu-active a{color: var(--secondarycolor) !important;}

/* nav-container */
.site-navbar .site-navigation{display: flex; justify-content: center;padding: 1rem 0;}
.site-navbar .site-navigation ul{list-style: none ; display: flex; justify-content: space-between;  margin-bottom:0px;}
.site-navbar .site-navigation .home-btn{background: var(--secondarycolor); color: #fff; padding:15px;position:relative;list-style: none !important;}
.site-navbar .site-navigation .home-btn img{width: 28px;margin-bottom:5px}
.site-navbar .site-navigation .home-btn a{color: #fff; font-size:21px; letter-spacing: 1px;font-weight:600;display:flex;align-items: center; gap: 1rem;width: fit-content;margin: 0 auto;}


.header_area {background: var(--light-shade);border-top: 6px solid var(--secondarycolor);border-bottom: 1px solid #ccc;}

/* nav items */
.site-navbar .site-navigation > ul > li{border-bottom:2px solid transparent; margin: 0 1.4rem;position: relative;}
.site-navbar .site-navigation > ul > li:nth-last-child(1), .site-navbar .site-navigation > ul > li:nth-last-child(2){margin-right: 0px ;}
.site-navbar .site-navigation > ul > li:nth-child(1){margin-left:0 ;}
.site-navbar .site-navigation > ul > li:hover{ border-bottom:2px solid var(--secondarycolor);}

/* navigation typography*/
.site-navbar .site-navigation li a{font-size:18px; font-weight:500;color: #fff;width: max-content;}
.site-navbar .site-navigation li a:hover{color: var(--tertiarycolor);}
/* -------------------*/


/* ---------- Nav Dropdown ---------*/
.site-navbar .menu-item-has-children{position: relative; padding-right: 10px}
.site-navbar .site-navigation .menu-item-has-children{border-bottom: none !important;display: flex; flex-direction: column; align-items: center;} 

/* Dropdown  Title */
.site-navbar .menu-item-has-children a{display: flex; align-items: center;}
.site-navbar .menu-item-has-children > a:after{content: "\f078";font-family:'Font Awesome 5 Free'; margin-left: 0.5rem;font-weight:900; margin-top:-3px; }
.site-navbar .menu-item-has-children:hover > a:after{transform:rotate(180deg);}

/* Dropdown  container */
#menu-top-nav > .menu-item-has-children > .dropdown{transform:scaley(0);opacity:0;border-top:2px solid var(--secondarycolor); transform-origin:top;position: absolute;display: flex; flex-direction: column; background: #fafafa;top:  2rem; box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;}
#menu-top-nav > .menu-item-has-children:hover .dropdown{transform:scaley(1);opacity:1;}

/* Dropdown  items */
#menu-top-nav .menu-item-has-children > .dropdown > li{min-width: 180px; padding: 6px  20px; position: relative;   transition: 0.2s linear;-webkit-transition: 0.2s linear;-moz-transition: 0.2s linear;-o-transition: 0.2s linear;-ms-transition: 0.2s linear;left: 0; border-bottom: 1px dashed #ccc;width: 100%;}
#menu-top-nav .menu-item-has-children > .dropdown > li a{font-size: 16px;color: #000 !important;}
#menu-top-nav .menu-item-has-children  .dropdown > li:hover{background: var(--tertiarycolor);left:2px;box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;border-bottom: 1px dashed transparent }
#menu-top-nav .menu-item-has-children  .dropdown > li:hover > a{color: #000;}


/* sub dropdown */
#menu-top-nav .dropdown > .menu-item-has-children {display:block; justify-content: space-between; width: 100%; }
#menu-top-nav .dropdown > .menu-item-has-children a{display: flex; justify-content: space-between;}
#menu-top-nav .dropdown > .menu-item-has-children > a:after{content:"\f067"}
#menu-top-nav .dropdown > .menu-item-has-children > .dropdown{display: flex;flex-direction: column;transform: scalex(0) scaley(0); opacity:0;transform-origin:top left; position: absolute;top:0; left: 100%; background: #fff;}
#menu-top-nav .dropdown > .menu-item-has-children:hover > .dropdown{transform: scalex(1) scaley(1); opacity:1;}
#menu-top-nav .dropdown > .menu-item-has-children > .dropdown >li{padding: 6px}
/* -------------------*/

/* ---------- Mobiel Navigaiton---------*/
.site-mobile-menu{position:fixed; height: 100vh; width: 100vw;top:0; background:#0009; z-index:999;transform: scalex(0);transform-origin:left;left: 0;}
.active-menu .site-mobile-menu{transform: scalex(1);}
.active-menu .site-mobile-menu  .side-nav{transform: scalex(1);}
.site-mobile-menu .side-nav{height:100%; background:#fff; width:350px;transform: scalex(0); transform-origin:left;transition-delay: 0.2s;}

/* mobile menu header */
.site-mobile-menu .side-logo{width: 240px;}
.site-mobile-menu .site-mobile-menu-header{display: flex; align-items: center; justify-content: space-between; border-bottom:1px solid #ccc; padding:15px 10px;}
.site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close{cursor: pointer;}
.site-mobile-menu  .header-btn{margin: 1rem auto 0}
.close-arrow img{width: 20px !important;}
.close-arrow i{font-size:24px !important; transition:0.4s ease; }
.close-arrow:hover i{color: var(--tertiarycolor);}

/* mobile menu navigation */
.site-mobile-menu .site-mobile-menu-body{padding: 1rem; }
.site-mobile-menu  ul{list-style: none}
.site-mobile-menu  ul > li{border-bottom: 1px dashed #ccc; padding:8px 0;position:relative;}
.site-mobile-menu  ul > li:nth-last-child(1){border-bottom: 0}

/* mobile menu dropdown */
.site-mobile-menu .menu-item-has-children{overflow:hidden;}
.site-mobile-menu .menu-item-has-children .arrow-collapse{position: absolute; right: 0}
.site-mobile-menu .menu-item-has-children .collapse{height: 0;background: #f2f2f2; padding: 0 1rem; margin-top:0;}
.site-mobile-menu .menu-item-has-children .menu-item-has-children .collapse{background: #fafafa !important;box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;}
.site-mobile-menu .menu-item-has-children .collapse.show{height:fit-content;margin-top:0.6rem }
/* ------------------ */

#header-section {background: var(--secondarycolor);margin-top:5px; position: relative;z-index: 999;}

#top-bar{padding: 0.1rem 0 1.4rem;}
#top-bar .logo{width: 400px;}
#top-bar .row{justify-content: space-between; align-items: center;padding: 0.8rem 0;}
#top-bar .flex-container{display: flex; align-items: center; gap:5rem}

.social-media-btns{display:flex; justify-content: center; align-items: center; gap: 0.8rem; margin-bottom: 0 !important;  }
.social-media-btns li{list-style: none;  width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; transition: 0.8s ease;  justify-content: center;background: #334A52;line-height: 0;}
.social-media-btns li i{color: #fff; font-size: 22px;}
.social-media-btns li:hover{ transform: scale(1.08);}

.fa-facebook-f::before {content: "\f39e";font-family: "Font Awesome 5 Brands";font-weight: 400;font-style:initial;}
.fa-instagram::before {content: "\f16d";font-family: "Font Awesome 5 Brands";font-weight: 400;font-style:initial;}
.fa-pinterest-p::before {content: "\f231";font-family: "Font Awesome 5 Brands";font-weight: 400;font-style:initial;}

.social-icons{display: flex;gap: 0.5rem; -webkit-gap: 0.5rem; -moz-gap: 0.5rem;}
.social-icons img{width: 25px;}

.top-navigation{list-style: none; display: flex; gap:10px;margin-bottom: 22px;justify-content: end;}
.top-navigation a{font-size: 15px; }
.top-navigation li{border-right: 1px solid #000; padding-right:10px; line-height: 1 !important;}
.top-navigation li:last-child{border-right: 0; padding-right: 0; }

@media screen and (max-width: 981px) {
	#top-bar{padding:0rem 15px; }
	#top-bar .logo{width: 280px;}
	#header-section::before {display: none;}
	
	.site-mobile-menu .home-btn{display: none !important;}
	
	.mobile-search{margin-top:1.5rem}
}
@media screen and (min-width: 981px) {

}

@media screen and (max-width: 600px) {
	#top-bar{padding:0.8rem 10px; }
  #top-bar .logo{width: 260px;}
}