.home-container-fluid{box-shadow: 0 4px 12px rgba(154, 170, 207, 50%); z-index: 16; position: relative;}
#header-desktop{display: flex; align-content: center; justify-content: space-between;}
#header-device{display: none;}
#header-desktop,#header-device{padding-block: 1.5rem;}
#header-desktop .logo img {max-height: 45px;}
.navmenu-login-lang, .navmenu-login-lang .nav-menu ul {gap: 3rem;}
.navmenu-login-lang .nav-menu li a{color: var(--clr-black-1); font-size:var(--font-medium);}
#header-desktop .navmenu-login-lang .nav-menu li:hover a, .navmenu-login-lang .nav-menu li.active a { color: var(--clr-primary);}



.navmenu-login-lang .nav-menu li.active {
        color: var(--clr-primary); 
        border-bottom: 2px solid #ff1111;
        font-family: "DB-HeaventRounded-Med";
    }

.navmenu-login-lang .nav-menu li:hover > ul > li > a {
        color: var(--clr-black-1); 
        border-bottom: none;
}

.navmenu-login-lang .nav-menu li:hover > ul > li > a:hover {
    color: var(--clr-primary);
}
   

.navmenu-login-lang .nav-menu li a.dropdown-toggle::after {
    display: none !important;
}
.navmenu-login-lang .nav-menu .dropdown-menu{font-size: var(--font-default);}
.button-medium.button-login{border-radius: 3.2rem; min-height: 3rem; font-family: "DB-HeaventRounded-Med";}
.button-medium.button-login:hover{background: var(--clr-primary);  box-shadow: 0 4px 6px rgba(154, 170, 207, 40%);}


@media (min-width:992px){
/*.navmenu-login-lang .nav-menu li:hover a, .navmenu-login-lang .nav-menu li.active a { color: var(--clr-primary); }*/
}

@media (max-width:1399px){
    .navmenu-login-lang, .navmenu-login-lang .nav-menu ul {gap: 2rem;}
    /*.navmenu-login-lang .nav-menu li a{font-size:var(--font-default); ;}
    .navmenu-login-lang .nav-menu .dropdown-menu{font-size: var(--font-detail);}*/
}

@media (max-width:1300px){
    .navmenu-login-lang, .navmenu-login-lang .nav-menu ul {gap: 1.2rem;}
    .navmenu-login-lang .nav-menu li a{font-size:var(--font-default); ;}
    .navmenu-login-lang .nav-menu .dropdown-menu{font-size: var(--font-detail);}/**/
}

@media (max-width:1199px){
    .navmenu-login-lang .nav-menu li a{font-size:var(--font-detail);}
    .navmenu-login-lang .nav-menu .dropdown-menu{font-size: var(--font-detail);}/**/
    #header-desktop .logo img {
        max-width: 20.5rem;
    }
    .home-container-fluid.container-fluid {padding-left: 1.5rem; padding-right: 1.5rem;}
}

@media (max-width:1050px){
    .navmenu-login-lang, .navmenu-login-lang .nav-menu ul {gap: 0.6rem;}
}

@media (max-width:991px){
    #header-desktop{display: none;}
   #header-device{display: block;} /**/
   #header-device .logo img {max-height: 38px;}
   .logo-on-mobile-menu{background-image: url(../images/logo-jobbkk.svg); width: 210px; height: 40px; background-size: cover;}
   /*#header-device .navbar-collapse .logo img {max-height: 40px;transition: left 400ms ease-in-out;}*/
   #header-device .navbar-collapse {
    position: fixed;
    /*top: 54px;*/
    top:0;
    left: 0;
    /*padding-left: 30px;
    padding-right: 30px;*/
    padding-bottom: 30px;
    height: 100%;
    background: #fff;
    }

    /*#header-device .navbar-collapse.submenu-nav {
        top: 12%;
    }*/

    #header-device .navbar-collapse.collapsing {
        height: 100%;
        left: -75%;
        /*transition: height 0s ease;*/
    }

    #header-device .navbar-collapse.show {
        height: 100%;
        left: 0;
        transition: left 400ms ease-in-out;
        z-index: 20;
        background: #fff;
        width: 50%;
    }

    #header-device .navbar-toggler.collapsed ~ #header-device .navbar-collapse {
        transition: left 400ms ease-in;
    }/**/

    #header-device .navbar-collapse .logo-n-closebtn,  #header-device .navbar-collapse .navmenu-login-lang
    {padding-inline: 30px;}

    #header-device .submenu-nav .nav-menu
    {margin-inline: 30px;}

    #header-device .submenu-nav .back-slide
    {padding-left: 30px;}



    #header-device .navmenu-login-lang .nav-menu li:hover a, #header-device .navmenu-login-lang .nav-menu li.active ,#header-device .navmenu-login-lang .nav-menu li.active a {
        border-bottom: none;}

    .button-medium.close{opacity: 1; min-height: 2.5rem;
        padding-inline: 0.725rem;}

    .button-medium.close:hover {
        color: #fff;
        background: var(--clr-primary);
    }

    
    
    .button-medium.close:not(:disabled):not(.disabled):focus,.button-medium.close:not(:disabled):not(.disabled):hover {
        opacity: 1;
    }

    #header-device .navbar-collapse .navmenu-login-lang{flex-direction: column; display: flex; gap: 0;}

    #header-device .navbar-collapse .navmenu-login-lang .nav-menu{
            margin-bottom: 1.2rem;
            padding-bottom: 1.2rem;
    }   
    
    #header-device .navbar-collapse .navmenu-login-lang .nav-menu ul{
        border-bottom: 1px solid var(--clr-gray-4);
    }   

    #header-device .navbar-collapse .navmenu-login-lang li a {font-size: 2.4rem; padding: 1.2rem 0; white-space: nowrap;}
    #header-device .navbar-collapse .navmenu-login-lang li:hover a,#header-device .navbar-collapse .navmenu-login-lang li.active a{ color: var(--clr-primary);}
    #header-device .navbar-collapse .navmenu-login-lang li:hover .submenu-nav li a{ color: var(--clr-black-1);}
    /*.with-mobile-icon{display: flex; align-items: center;}

    #header-device .navbar-collapse .navmenu-login-lang li.dropdown a{padding: 1.2rem 0 0.6rem;}*/

    #header-device .navbar-collapse .dropdown-menu{position: relative !important; transform: translate3d(0px, 0px, 0px) !important; border:none; float: none;}
    /*
    #header-device .navbar-collapse .dropdown-menu {
        position: fixed !important;
        width: 100%;
        top: 10px;
        height: 100%;
        top: 12% !important;
    }
    */
    /*#header-device .navbar-collapse .navmenu-login-lang li a {
        font-size: 2.4rem;
        padding: 1.2rem 0;
    }*/


    #header-device .navbar-collapse .navmenu-login-lang li > .dropdown-menu{margin: 0; padding: 0;}
    #header-device .navbar-collapse .navmenu-login-lang li > .dropdown-menu li a , #header-device .navbar-collapse .dropdown-language .dropdown-menu a{
        padding: 0.6rem 0.6rem 0.6rem 2rem;
        font-size:2.2rem;
    }
    /*#header-device .navbar-collapse .navmenu-login-lang li > .dropdown-menu li a:first-child{
        padding-top: 0;
    }
    #header-device .navbar-collapse .navmenu-login-lang li > .dropdown-menu li a:last-child{
        padding-bottom: 0;
    }*/
    #header-device .navbar-collapse .dropdown-language{    
        padding-left: 0;
        border-bottom: 1px solid var(--clr-gray-4);
        margin-bottom: 1.2rem;
        padding-bottom: 1.2rem;
    }
    #header-device .navbar-collapse .dropdown-language .font-medium{font-size: 2.4rem;}
    #header-device .navbar-collapse .button-medium.button-login {
        border-radius: 3.2rem;
        width: 100%;
        font-size:  var(--font-default);
        min-height: 4.4rem;
        /* min-height: 2.4rem; */
    }

    .with-mobile-icon{
        display: block;
        width: 20px;
        height: 20px;
        background-size: cover;
    }
    .icon-home{background-image: url(../images/icon-home-mobile.svg);}
    .navmenu-login-lang .nav-menu li:hover a .icon-home, .navmenu-login-lang .nav-menu li.active .icon-home,.navmenu-login-lang .nav-menu li.active a .icon-home
    {filter:invert(19%) sepia(99%) saturate(5464%) hue-rotate(4deg) brightness(99%) contrast(113%);}

    .icon-urgent{background-image: url(../images/icon-urgent-mobile.svg);}
    .navmenu-login-lang .nav-menu li:hover a .icon-urgent, .navmenu-login-lang .nav-menu li.active .icon-urgent,.navmenu-login-lang .nav-menu li.active a .icon-urgent
    {filter:invert(19%) sepia(99%) saturate(5464%) hue-rotate(4deg) brightness(99%) contrast(113%);}

    .icon-region{background-image: url(../images/icon-region-mobile.svg);}
    .navmenu-login-lang .nav-menu li:hover a .icon-region, .navmenu-login-lang .nav-menu li.active .icon-region,.navmenu-login-lang .nav-menu li.active a .icon-region
    {filter:invert(19%) sepia(99%) saturate(5464%) hue-rotate(4deg) brightness(99%) contrast(113%);}  
    
    
    .icon-industry{background-image: url(../images/icon-industry-mobile.svg);}
    .navmenu-login-lang .nav-menu li:hover a .icon-industry, .navmenu-login-lang .nav-menu li.active .icon-industry,.navmenu-login-lang .nav-menu li.active a .icon-industry
    {filter:invert(19%) sepia(99%) saturate(5464%) hue-rotate(4deg) brightness(99%) contrast(113%);}  

    .icon-hotel{background-image: url(../images/icon-hotel-mobile.svg);}
    .navmenu-login-lang .nav-menu li:hover a .icon-hotel, .navmenu-login-lang .nav-menu li.active .icon-hotel,.navmenu-login-lang .nav-menu li.active a .icon-hotel
    {filter:invert(19%) sepia(99%) saturate(5464%) hue-rotate(4deg) brightness(99%) contrast(113%);} 

    .icon-doc{background-image: url(../images/icon-doc-mobile.svg);}
    .navmenu-login-lang .nav-menu li:hover a .icon-doc, .navmenu-login-lang .nav-menu li.active .icon-doc,.navmenu-login-lang .nav-menu li.active a .icon-doc
    {filter:invert(19%) sepia(99%) saturate(5464%) hue-rotate(4deg) brightness(99%) contrast(113%);} 

    .icon-employer{background-image: url(../images/icon-employer-mobile.svg);}
    .navmenu-login-lang .nav-menu li:hover a .icon-employer, .navmenu-login-lang .nav-menu li.active .icon-employer,.navmenu-login-lang .nav-menu li.active a .icon-employer
    {filter:invert(19%) sepia(99%) saturate(5464%) hue-rotate(4deg) brightness(99%) contrast(113%);} 

    .icon-lang{background-image: url(../images/icon-world.svg);}
    .navmenu-login-lang .nav-menu li:hover a .icon-lang, .navmenu-login-lang .nav-menu li.active .icon-lang,.navmenu-login-lang .nav-menu li.active a .icon-lang
    {filter:invert(19%) sepia(99%) saturate(5464%) hue-rotate(4deg) brightness(99%) contrast(113%);} 

    .submenu-nav .icon-region,.submenu-nav .icon-doc,.submenu-nav .icon-lang {filter:invert(19%) sepia(99%) saturate(5464%) hue-rotate(4deg) brightness(99%) contrast(113%);} 

    .submenu-nav ul{padding-left: 6rem;}
    .submenu-nav ul li a{font-size: 22px !important;}
    /*.navmenu-login-lang .nav-menu .submenu-nav li:hover a, .navmenu-login-lang .nav-menu .submenu-nav li.active a { color: var(--clr-black-1) !important;}
    .submenu-nav li:hover a, .submenu-nav li.active a{color: #333 !important;}*/

}

@media (max-width:767px){
    #header-device .navbar-collapse.show {width: 100%;}
}

@media (max-width:576px){
    /*.ham-logo{gap: 3rem;}*/
}