header.header-sec { position: fixed; width: 100%; top: 0; left: 0; z-index: 9; background-color: transparent; transition: var(--transition-default);   padding: 30px 0;}
header.header-sec.nav-up {  top: -100%;}
header.header-sec.nav-down {  top: 0;}
header.header-sec.nav-down {padding: 0px 0;}

header.header-sec.nav-down { box-shadow: 0 3px 6px #0000005c;     background: #1a1a1a;}
.home header.header-sec.nav-down { box-shadow: 0 1px 16px rgb(255 255 255 / 20%); background: #000;}


.head-wrap{display:flex;width:100%;}
.head_logo{width:123.3px; display: flex; align-items: center; }
.head_logo a{width:100%;display:inline-block;line-height:0;}
.head_logo a img{width:100%;display:inline-block;object-fit:contain;}
.nav-right{width:calc(100% - 123.3px);padding-left:10px;position:relative;align-items:center;display:flex;}
nav.header-menu{width:100%;display:flex;justify-content:flex-end;}
nav.header-menu ul.menu-tem{display:flex;align-items:center;column-gap:30px;}

nav.header-menu ul.menu-tem li a{color:#fff;font-size:16px;line-height:26px;font-weight:600;}
nav.header-menu ul.menu-tem li.header-btn > a{padding:5px 20px 6px;font-size:16px;line-height:31px;width:150px;}
nav.header-menu ul.menu-tem li.header-btn > a:hover {
    color: #fff; background: #448668;
}
nav.header-menu ul.menu-tem li.header-btn{padding-left:41px;}

nav.header-menu ul.menu-tem li.menu-item-has-children > a{position:relative;padding-right:15px;}
nav.header-menu ul.menu-tem li.menu-item-has-children > a i.arrow-icon {display: none;}


nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li.menu-item-has-children:hover > a,
nav.header-menu ul.menu-tem li.menu-item-has-children:hover > a,
nav.header-menu ul.menu-tem li > a:hover,
nav.header-menu ul.menu-tem li.active > a,
nav.header-menu ul.menu-tem li.menu-item-has-children:hover > ul.sub-menu li.current-menu-item > a,
nav.header-menu ul.menu-tem li.menu-item-has-children:hover > ul.sub-menu li.menu-item-has-children.active > a,
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li a:hover{color:#448668;}







@media (min-width:1199px) {
nav.header-menu > ul.menu-tem >li.menu-item-has-children {padding-bottom: 12px; margin-top: 12px;}
header.header-sec.nav-down nav.header-menu > ul.menu-tem >li.menu-item-has-children {padding-bottom: 28px; margin-top: 28px;}
.menu-toggle { display: none; }
header.header-sec.nav-up ul.sub-menu {  display: none !important;}
nav.header-menu ul.menu-tem li.menu-item-has-children > a i.arrow-icon{display:flex;position:absolute;/*top:10px; */top: 50%; transform: translateY(-50%); right:0;width:10px;height:7px;align-items:center;justify-content:center; transition: all 0.5s ease;}
nav.header-menu ul.menu-tem li.menu-item-has-children > a i.arrow-icon svg{width:100%;height:100%;}
nav.header-menu ul.menu-tem li.menu-item-has-children > a > i.arrow-icon svg path {transition: all 0.5s ease;}

nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li.menu-item-has-children:hover > a i.arrow-icon svg path,
nav.header-menu ul.menu-tem li.menu-item-has-children:hover > ul.sub-menu li.menu-item-has-children.active > a > i.arrow-icon > svg path,
nav.header-menu ul.menu-tem li.menu-item-has-children.active  > a > i.arrow-icon svg path,
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li.menu-item-has-children:hover > .arrow-icon > svg path,
nav.header-menu ul.menu-tem li.menu-item-has-children:hover > a > i.arrow-icon svg path {fill: #448668;}

nav.header-menu ul.menu-tem > li.menu-item-has-children:hover > a > i.arrow-icon {transform: translateY(-50%) rotateX(180deg);}
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li.menu-item-has-children > a {width: 100%;}
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li.menu-item-has-children .arrow-icon > svg path {fill: #5e5e5e;}
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li.menu-item-has-children .arrow-icon {transform: translateY(-50%) rotate(270deg);}

nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li.menu-item-has-children .sub-menu {top: 0;left: 100%;}
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li.menu-item-has-children {position: relative;}



nav.header-menu ul.menu-tem li.menu-item-has-children{position:relative;}
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu{position:absolute;top:150%;border:1px solid #fff;width:290px;background:#fff;border-radius:8px;padding:15px; /*transition:all .2s ease-in-out;*/ display:block;opacity:0;visibility:hidden;  box-shadow: 0 5px 10px rgb(0 0 0 / 20%); display: none;}
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li a{color:#5e5e5e;font-weight:500;font-size:15px;line-height:24px; display: block;}




nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li:not(:last-child){border-bottom:1px solid #47444426;padding-bottom:10px;margin-bottom:10px;}
nav.header-menu ul.menu-tem li.menu-item-has-children:hover > ul.sub-menu{top:100%;opacity:1;visibility:visible; display: block;}

li.menu_text  {  display: none;}
nav.header-menu ul.menu-tem  li.two-column-submenu.menu-item-has-children:hover > ul.sub-menu {display: flex !important; flex-wrap: wrap;}
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children:hover > ul.sub-menu > li {width: 50%;}
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children > ul.sub-menu {width: 500px;}
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children:hover > ul.sub-menu >li:nth-last-child(-n+2) {margin-bottom: 0; border-bottom: 0;}
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children > ul.sub-menu > li {margin-bottom: 0;padding-top: 10px;}
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children> ul.sub-menu > li:nth-child(odd) {border-right: 1px solid #ddd;}
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children> ul.sub-menu > li:nth-child(even) {padding-left: 20px;}


body nav.header-menu ul.menu-tem li:not(.two-column-submenu) > ul.sub-menu{padding-left:0;padding-right:0;}
body nav.header-menu ul.menu-tem li:not(.two-column-submenu) > ul.sub-menu li{padding-left:15px;padding-right:15px;border-bottom:0!important;}
body nav.header-menu ul.menu-tem li:not(.two-column-submenu) > ul.sub-menu li:after{content:"";position:absolute;bottom:0;left:15px;width:calc(100% - 30px);height:1px;background:#47444426;}
body nav.header-menu ul.menu-tem li:not(.two-column-submenu) > ul.sub-menu li:last-child:after{width:0;}
body nav.header-menu ul.menu-tem li:not(.two-column-submenu) > ul.sub-menu{padding:15px 0;}
body nav.header-menu ul.menu-tem li:not(.two-column-submenu) > ul.sub-menu li{position:relative;}



/* dropdown menu design */
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children> ul.sub-menu > li:nth-child(odd),
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children> ul.sub-menu > li:nth-child(even){padding-left:15px;border-top:0!important;border-right:0;}
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children:hover > ul.sub-menu{display:grid!important;grid-template-columns:repeat(2,1fr);column-gap:20px;}
nav.header-menu ul.menu-tem li.two-column-submenu.menu-item-has-children> ul.sub-menu > li{width:100%!important;}
nav.header-menu ul.menu-tem li ul.sub-menu li a{position:relative;}
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li a:before{content:"";position:absolute;width:5px;height:5px;border-radius:100%;opacity:0;top:1px;bottom:0;left:0;margin:auto;background-color:var(--hover-color);-ms-transition:all 0.4s ease;-o-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-webkit-transition:all 0.4s ease;transition:all 0.4s ease;}
nav.header-menu ul.menu-tem li.menu-item-has-children> ul.sub-menu li.current-menu-item > a:before,
nav.header-menu ul.menu-tem li.menu-item-has-children > ul.sub-menu li.menu-item-has-children.active > a::before,
nav.header-menu ul.menu-tem li.menu-item-has-children > ul.sub-menu li.menu-item-has-children:hover > a::before,
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu li a:hover:before{opacity:1;left:-15px;-ms-transition:all 0.4s ease;-o-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-webkit-transition:all 0.4s ease;transition:all 0.4s ease;}
body nav.header-menu ul.menu-tem li:not(.two-column-submenu) > ul.sub-menu li{padding-left:30px;padding-right:15px;}
nav.header-menu ul.menu-tem > li.menu-item-has-children:before{opacity:0;position:absolute;content:"";width:10px;height:10px;background:#fff;bottom:-5px;left:50%;transform:rotate(45deg); z-index:999999;border:1px solid #E4E4E4;border-bottom:0;border-right:0;}

nav.header-menu ul.menu-tem > li.menu-item-has-children:hover:before{opacity:1; }
nav.header-menu ul.menu-tem li.menu-item-has-children ul.sub-menu{width:385px;}
nav.header-menu ul.menu-tem li.marketing-solution-menu.menu-item-has-children ul.sub-menu{width:320px;}
nav.header-menu ul.menu-tem li.mobile-app-menu.menu-item-has-children ul.sub-menu{width:270px;}

body nav.header-menu ul.menu-tem li:not(.two-column-submenu) > ul.sub-menu li {padding-top: 10px; margin-bottom: 0  !important; padding-bottom: 10px;}
/* dropdown menu design */


}

@media (max-width:1439px) {
    nav.header-menu ul.menu-tem li.header-btn {padding-left: 20px;}
    nav.header-menu ul.menu-tem {column-gap: 20px;}
    nav.header-menu ul.menu-tem li a {font-size: 15px;}
}

@media (max-width:1199px) {
.menu-toggle {width: 30px; height: 30px; cursor: pointer;}
.menu-toggle svg path {fill: #fff;}
nav.header-menu ul.menu-tem{display:block;position:fixed;right:-200%;top:0;width:100%;max-width:450px;background:#2a2a2a;height:100%;margin:0;padding:0 20px 40px;overflow-y:auto;flex-direction:column;transition:all .6s ease;display:block!important;flex-wrap:nowrap;z-index:99;}
nav.header-menu ul.menu-tem > li.menu_text{border:none;width:100%;height:50px;position:sticky;top:0;display:flex!important;align-items:center;justify-content:flex-end;text-align:right;z-index:3;background:#2a2a2a; text-align: end;}
nav.header-menu ul.menu-tem > li.menu_text span.header_toggle_button_inner{width: 15px;height: 16px; cursor: pointer; display: inline-block;}
nav.header-menu ul.menu-tem > li.menu_text span.header_toggle_button_inner svg{width:100%;height:100%;}
.nav-right:before{content:'';width:100%;height:100%;position:fixed;top:0;left:0;background:#0000004f;backdrop-filter:blur(5px);opacity:0;visibility:hidden;}


header.header-sec.nav-down {padding: 15px 0;}
body.active-responsive-menu {overflow: hidden;}
body.active-responsive-menu nav.header-menu ul.menu-tem { right: 0;}
body.active-responsive-menu .nav-right:before {opacity: 1; visibility: visible;}

ul.sub-menu > li { width: 100%; border-bottom: 1px solid rgb(255 255 255 / 10%); padding: 0px 0; position: relative;}
nav.header-menu ul.menu-tem > li { padding: 0 0 !important; width: 100%; border-bottom: 1px solid rgb(255 255 255 / 10%); height: auto; line-height: 0;}
ul.sub-menu > li:last-child,
nav.header-menu ul.menu-tem > li:last-child {border-bottom: none; padding-bottom: 0;}

nav.header-menu ul.menu-tem li.menu-item-has-children {position: relative;}
nav.header-menu ul.menu-tem > li a{color:#fff;transition:0.5s;position:relative;padding-bottom:11px;padding:11px 0!important;display:block;cursor:pointer;}
/* nav.header-menu ul.menu-tem > li  ul.sub-menu li:first-child > a{} */
nav.header-menu ul.menu-tem li:not(.header-btn) a {
    padding-right: 30px !important;
}
nav.header-menu ul.menu-tem > li .sub-menu li a{font-weight:500;}
ul.sub-menu{width:100%;list-style:none;padding:0;padding-left:20px;display:none;}
span.mobile-toggle{width:30px;height:48px;position:absolute;top:0;right:0;display:flex;align-items:center;justify-content:center;cursor:pointer;}
span.mobile-toggle:after,
span.mobile-toggle:before{content:"";width:14px;height:2px;background:#fff;position:absolute;border-radius:1px;transition:all .6s ease;right:5px;}
span.mobile-toggle:after{transform:rotate(90deg);}
span.mobile-toggle.dt-open::after{transform:rotate(0deg);}

nav.header-menu ul.menu-tem li.header-btn > a {margin-top: 30px;}
nav.header-menu ul.menu-tem li.current-menu-item > a {color: #448668;}
}

@media (max-width:767px) {
    header.header-sec {padding: 20px 0;}
    nav.header-menu ul.menu-tem li a {
        font-size: 14px;
    }

}

@media (max-width:576px) {
    nav.header-menu ul.menu-tem {max-width: 100%;}
}