.full-sidenav {
    @apply fixed h-screen lg:w-full sm:w-500 w-330 lg:left-0 left-[-100%] top-0 flex lg:opacity-0 lg:pointer-events-none lg:invisible max-lg:dark:bg-dark max-lg:bg-white lg:overflow-hidden overflow-y-scroll duration-700;
}
.full-sidenav.show {
    @apply lg:visible lg:opacity-100 lg:flex lg:items-center left-0 pointer-events-auto;
}
.flsbg {
    @apply absolute h-full left-0 top-0 w-full -z-10 lg:flex hidden;
}

.flsbg .bg-wrap {
    @apply block overflow-hidden w-[11%] -translate-y-full relative dark:bg-dark bg-white pointer-events-none border dark:border-white/5 border-black/5 -m-px box-content;
}

.flsbg .bg-wrap:nth-child(1) {
    transition: 0.1s;
}
.flsbg .bg-wrap:nth-child(2) {
    transition: 0.2s;
}
.flsbg .bg-wrap:nth-child(3) {
    transition: 0.3s;
}
.flsbg .bg-wrap:nth-child(4) {
    transition: 0.4s;
}
.flsbg .bg-wrap:nth-child(5) {
    transition: 0.5s;
}
.flsbg .bg-wrap:nth-child(6) {
    transition: 0.6s;
}
.flsbg .bg-wrap:nth-child(7) {
    transition: 0.7s;
}
.flsbg .bg-wrap:nth-child(8) {
    transition: 0.8s;
}
.flsbg .bg-wrap:nth-child(9) {
    transition: 0.9s;
}
.flsbg .bg-wrap:nth-child(10) {
    transition: 1s;
}
.flsbg .bg-wrap:nth-child(11) {
    transition: 1.1s;
}
.full-sidenav.show .flsbg .bg-wrap {
    @apply translate-y-0;
}

.flsbg .bg-wrap span {
    @apply absolute h-full left-0 top-0 w-full;
}
.site-header .nav > li > a {
    @apply dark:text-white text-black lg:text-[39px]/38 text-2xl py-10 lg:px-0 sm:px-20 block w-full relative hover:text-primary;
}
.full-sidenav .navbar-nav > li .sub-menu li a {
    @apply dark:text-white text-black text-lg py-5 lg:px-20 sm:px-40 px-20 block hover:text-primary;
}

.site-header .nav .sub-menu-down > a:after {
    @apply content-['\f107'] absolute top-1/2 -translate-y-1/2 lg:right-0 right-20 font-['Line_Awesome_Free'] font-black lg:text-2xl text-lg dark:text-white  opacity-50;
}
.sub-menu,
.mega-menu {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease;
}

.full-sidenav.header-nav .nav > li .sub-menu {
    opacity: 1;
}

.site-header .main-bar-wraper>.container>div {
    @apply py-30;
}
.site-header.is-fixed .main-bar-wraper>.container>div {
    @apply py-20;
}
.site-header.is-fixed .main-bar-wraper .btn.btn-outline {
    @apply dark:text-white dark:border-white dark:hover:border-black;
}
.site-header.is-fixed .main-bar-wraper .container-fluid>div {
    @apply xl:h-80 py-10;
}
@media only screen and (min-width: 991px) {
    .full-sidenav .navbar-nav > li .sub-menu {
        @apply relative visible w-full m-0 opacity-100 shadow-none duration-500 block;
    }
}
.is-fixed:not(.sticky-no) .main-bar-wraper {
    @apply fixed top-0 left-0 w-full dark:bg-black/50 bg-white/50 backdrop-blur-[10px];
    animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
}
.header-light.is-fixed:not(.sticky-no) .main-bar-wraper {
    @apply bg-black/50;
}
.menu-btn.open::after {
    background-color: rgba(0, 0, 0, 0.6);
    content: "";
    left: 0;
    position: fixed;
    right: -20px;
    top: -63px;
    transform: scale(100);
    width: 100%;
    z-index: -1;
    transition: all 0.5s;
    transform-origin: top right;
    margin: 0 0px 0px 20px;
    box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.6);
}
body.menu-btn-open {
    @apply !h-screen overflow-hidden;
}

.site-header.style-1 .main-bar-wraper>.container-fluid>div {
    @apply xl:h-120 h-80;
}



.site-header.style-2 .full-sidenav {
    @apply overflow-visible h-auto w-auto relative visible pointer-events-auto opacity-100 max-xl:fixed max-xl:h-screen max-xl:w-500 max-sm:!w-300 max-xl:left-[-100%] max-xl:top-0 max-xl:opacity-0 max-xl:invisible max-xl:dark:bg-dark max-xl:bg-white max-xl:overflow-y-scroll max-xl:duration-700 xl:p-0 sm:p-40 p-20;
}
.site-header.style-2 .full-sidenav.show {
    @apply max-xl:visible max-xl:opacity-100 max-xl:left-0;
}
.site-header.style-2 .menu-btn .toogle-btn span:nth-child(1) {
    @apply w-25;
}
.site-header.style-2 .menu-btn .toogle-btn span:nth-child(2) {
    @apply w-30;
}
.site-header.style-2 .menu-btn .toogle-btn span:nth-child(3) {
    @apply w-15;
}
.site-header.style-2 .menu-btn.open .toogle-btn span:nth-child(1) {
    @apply w-30 m-0 rotate-45;
}
.site-header.style-2 .menu-btn.open .toogle-btn span:nth-child(2) {
    @apply opacity-0 m-0;
}
.site-header.style-2 .menu-btn.open .toogle-btn span:nth-child(3) {
    @apply w-30 -rotate-45 m-0;
}
.site-header.style-2 .menu-btn.open::after {
    background-color: rgba(0, 0, 0, 0.6);
    content: "";
    left: 0;
    position: fixed;
    right: -20px;
    top: -63px;
    transform: scale(100);
    width: 100%;
    z-index: -1;
    transition: all 0.5s;
    transform-origin: top right;
    margin: 0 0px 0px 20px;
    box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.6);
}

.site-header.style-2 .navbar {
    @apply dark:text-white text-dark xl:border-0 border-b dark:border-white/20 border-black/20 xl:pb-0 pb-20;
}
.header-light.site-header.style-2 .navbar {
    @apply dark:lg:text-white lg:text-white dark:text-white text-dark;
}
.site-header.style-2 .navbar {
    @apply dark:text-white text-dark;
}
.site-header.style-2 .navbar > li > a {
  @apply xl:px-20 py-10 text-xl font-normal block w-full hover:text-primary;
}
.site-header.style-2 .full-sidenav.header-nav .nav > li .sub-menu {
    @apply transition-all duration-300 max-xl:px-20;
}
.site-header.style-2 .navbar > li:hover > .sub-menu{
    @apply xl:opacity-100 xl:visible xl:translate-y-0;
}
.site-header.style-2 .navbar .sub-menu{
    @apply max-h-none dark:text-white text-secondary xl:absolute xl:top-[calc(100%_+_10px)] xl:left-0 xl:w-230 dark:bg-bodybg bg-white xl:border xl:dark:border-white/20 xl:border-black/20 xl:p-5 xl:opacity-0 xl:invisible duration-500 xl:-translate-y-10 max-xl:max-h-0 max-xl:overflow-hidden overflow-visible;
}
.site-header.style-2 .navbar .sub-menu .sub-menu{
    @apply left-full xl:opacity-0 xl:invisible ml-5;
}
.site-header.style-2 .navbar .sub-menu li:hover > .sub-menu{
    @apply opacity-100 visible top-0;
}
.site-header.style-2 .navbar > .sub-menu-down > .sub-menu > li  a {
  @apply xl:px-10 py-5 text-base font-normal block w-full hover:text-primary duration-0;
}
.sub-menu-down ,
.sub-menu-down a {
    @apply relative;
}
.site-header.style-2 .navbar .sub-menu-down > a:after{
    @apply content-['\f107'] absolute top-1/2 -translate-y-1/2 lg:right-0 right-20 font-['Line_Awesome_Free'] font-black text-xs w-8 duration-500;
}
.site-header.style-2 .navbar .sub-menu-down .sub-menu-down > a:after{
    @apply xl:right-10 xl:-rotate-90;
}
.site-header.style-2 .navbar .sub-menu-down > a.dz-open:after{
    @apply rotate-180;
}
@media only screen and (min-width: 991px) {
    .site-header.style-2.light .nav > li > a:not(:hover){
        @apply text-white;
    }
}