.menu a{color:#fff!important;}
.menu a:hover{color:#D2AB67!important;/*color:#675b5e!important;*/}

.menu-top-row{position:relative;height:100vh!important;}
.menu-img,#gradient{position:absolute!important;z-index:0!important;}
#logo-menu{z-index:10!important;margin-bottom:100px;}
.menu-img{background-size:cover; height:100vh;}

#gradient{width: 390px; top:0px; background:linear-gradient(to right, rgba(255,255,255,0) 0%,rgb(167, 216, 243) 75%);}
.menu-img,#gradient{left:-272px;height:100vh;}

.social-block{position:relative;display: flex; align-items: flex-start; justify-content:center;margin-top:0px!important;height:80px;}
.social-block-ins{color:#fff;}
.social-block span{color:#D2AB67;font-size:40px;padding:0px 12px;transition:all .2s ease;}
.social-block span:hover{color:#fff;}

/* ******** HAMBURGER MENU ******** */
/* **************************** */
.menu-image{object-fit:contain;}
.outer-menu{position:absolute;top:40px;/*right:40px;*/ z-index: 10000;display:flex;justify-content: flex-end;}

.outer-menu .checkbox-toggle {z-index: 100002; cursor: pointer; width: 60px; height: 60px; opacity: 0;display: block;position: absolute;}

.outer-menu .hamburger > .hamburger-ins > div {  width: 40px; height: 2px; background-color: #231f20; margin: 4px 0; transition: all .3s ease;}
.outer-menu .hamburger > .hamburger-ins > div.b1-line{width: 10px!important; height: 10px!important; border-radius:50%!important;margin: 0 auto!important;}

.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins > .b1-line{opacity: 0;}
.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins > .b2-line{transform: rotate(42deg);}
.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins > .b3-line{transform: rotate(-42deg);margin-top: -5px;}

.outer-menu .checkbox-toggle:checked ~ .menu { pointer-events: auto; visibility: visible; }

.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block { transform: scale(1);transition-duration: .7s;}
.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 { transform: scale(1);transition-duration: .9s; }

/* Important Menu Items fx, it appears after the transition if increaseed */
.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 { opacity: 1; transition: opacity .9s ease .9s;background-image:url('/wp-content/uploads/2025/06/menu-bg.jpg');background-repeat: no-repeat;background-size: cover;}
#step{position:absolute;width:600px;height:auto;object-fit:contain;z-index:1000000;bottom:0px;right:0px;opacity: 0;transition: opacity 1s ease 1.5s;}
.outer-menu .checkbox-toggle:checked ~ .menu > #step {opacity: 1;}
/* Menu Columns FX */
.menu-block .menu-col-2,.menu-block .menu-col-2 ul{text-align:center;}

.menu-block .menu-col-1,.menu-block .menu-col-2,.menu-block .menu-col-3,.menu-top-row,.main-mssg,.social-block-ins,.lang-block{opacity:0!important;}
.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 > .menu-top-row{ opacity:1!important; transition: opacity 1.2s ease 1.2s!important;}

.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 > .menu-handle-row > .menu-col-1{opacity: 1!important; transition: opacity .7s ease .7s!important;}
.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 > .menu-handle-row > .menu-col-2{opacity: 1!important; transition: opacity .8s ease .8s!important;}
.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 > .menu-handle-row > .menu-col-3{opacity: 1!important; transition: opacity 1s ease 1s!important;}
.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 > .menu-handle-row > .lang-block{opacity: 1!important; transition: opacity 1.2s ease 1.2s!important;}
.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 > .menu-handle-row > .main-message > .main-mssg{opacity: 1!important; transition: opacity 1.9s ease 1.9s!important;}

.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 > .menu-handle-row > .social-block > .social-block-ins{ opacity:1!important; transition: opacity 1.4s ease 1.4s!important;}

.outer-menu .hamburger {z-index: 10000; width: 80px; height: 60px; padding: .5em 1em; background:transparent; border-radius: 0 0.12em 0.12em 0; cursor: pointer;transition: box-shadow 0.4s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: flex; align-items: center; justify-content: center;position: absolute;}

.outer-menu .checkbox-toggle, .outer-menu .hamburger{top:0px;right:7%;}
.outer-menu .checkbox-toggle:checked, .outer-menu .checkbox-toggle:checked + .hamburger{position:fixed!important;top:40px;right:7%;}

.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins{background:#fff!important;width: 100%;}
.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins:before,
.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins:after {width: 100%; top: 0; -webkit-transform: rotate(90deg); transform: rotate(90deg); background:#fff!important;}
.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins:after { opacity: 0;}
.outer-menu .checkbox-toggle:hover + .hamburger { box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); }

.outer-menu .hamburger > .hamburger-ins { position: relative; flex: none; width: 140%; height: 2px; background: #fff; transition: all 1s ease; display: flex; align-items: center;justify-content: center;}
.outer-menu .hamburger > .hamburger-ins:before{content: ''; position: absolute; z-index: 10000; top: -8px; right: 0; width: 75%; height: 2px; background: inherit; transition: all 1s ease;}
.outer-menu .hamburger > .hamburger-ins:after { top: 10px; }

.outer-menu .menu {position: fixed; top: 0px; left: 0; width: 100%; height: 100%; pointer-events: none; visibility: hidden; overflow: hidden; backface-visibility: hidden; outline: 1px solid transparent; display: flex;align-items: center;}
.outer-menu .menu > .menu-block {width: 300vw; height: 300vh; border-radius: 0%; background:#3699CD; color: #fff; transition: all 1s ease; flex: none; transform: scale(0); backface-visibility: hidden; overflow: hidden; display: flex; align-items: center;}


.outer-menu .menu > .menu-block > .menu-block-in-1{ 
width: 300vw; height: 300vh; border-radius: 0%; 
background-color: #07105B;
background-attachment: fixed;
background-size: cover;
color: #fff; transition: all 1s ease; flex: none; transform: scale(0); backface-visibility: hidden; overflow: hidden; display: flex; align-items: center;}

.outer-menu .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 {
  text-align: center; max-width: 100vw;  /*100vw for orizontal, 90vw for vertical */
  max-height: 100vh;  opacity: 0;  transition: opacity 1s ease;
  overflow-y: auto; /* To be able to scroll when in mobile*/
  flex: none;  display: flex;  align-items: center;  justify-content: center;}


.outer-menu .menu .menu-block ul { list-style: none; padding: 0px!important; margin: 0px 0px 100px 0px; max-height: 100vh; text-align:center; height:auto; display: flex!important; flex-direction: column;
    justify-content: center; line-height: 30px;}
.outer-menu .menu .menu-block ul li { padding: 0px; margin: 10px 0px;display: block;text-align: center;}
.outer-menu .menu .menu-block ul li ul{padding:0px;margin-top: 10px;}
.outer-menu .menu .menu-block ul li ul li { padding: 0; margin: 5px 0px;}

.outer-menu .menu .menu-block ul li a { position: relative; display: inline; cursor: pointer; transition: color 0.4s ease;}
.outer-menu .menu .menu-block ul li a:hover { color: #fff; }
.outer-menu .menu .menu-block ul li a:hover:after { width: 100%; }
.outer-menu .menu .menu-block ul li a:after { content: ''; position: absolute; z-index: 10000; bottom: -0.15em; left: 0; width: 0; height: 2px; background: #D2AB67; transition: width 0.4s ease;}


.menu-col-2 > li > a{font-size:32px!important;line-height:40px;}
.menu-col-2 > li > ul > li > a{font-size:24px!important;line-height:32px;}
.menu-col-2 > li > a:before{font-size:12px;color:#042F5F;position: absolute;margin: -7px 0px 0px -22px;}

/* ********* SET MENU BOX FX ******* */
.outer-menu .menu, .outer-menu .menu > .menu-block, .outer-menu .menu > .menu-block > .menu-block-in-1{
  /* column or row for direction */
  flex-direction:column;
  /* start, end center for animation start point*/
  justify-content:flex-start;
  }

/* ***** SET MENU ITEMS POSITION **** */
/* *********REMOVE IT TO CHANGE POSITION**** */
.outer-menu .menu > .menu-block > .menu-block-in-1 > .menu-block-in-2 { width:100%;height:100%; text-align:center!important;}
/* .menu-handle-row{width:70%;height:63%!important;margin:40px!important;margin-left: 0px!important;} */

@media screen and (max-width: 991px) {
  #step{width:400px;}
  .outer-menu .menu {width: 100vw;}
  .menu-handle-row{height:130%!important;}
  .outer-menu .menu .menu-block .menu-col-1{display:none!important;}
  .outer-menu .menu .menu-block .menu-col-2{width:100%!important;}
  .outer-menu .menu .menu-block ul li {font-size:1.6rem!important;}
  .outer-menu .menu .menu-block ul li ul li a{font-size:1rem!important;}
  

  .menu-handle-row .col-lg-4,.menu-handle-row .col-lg-4 li{text-align: center!important;}
  .menu-handle-row{width:100%;margin-top:110px!important;}
  #logo-menu{margin-bottom: -400px;}
  .social-block-ins{left:50px;margin-top:0px;}

  .menu-col-2 > li > a{font-size:1.8rem!important;line-height:1.8rem;}
  .menu-col-2 > li > ul > li > a{font-size:1.5rem!important;line-height:2rem;}
}

@media screen and (max-width: 768px) {
  #logo-menu{width:240px;}
  #step{width:300px;}
  /* .outer-menu .checkbox-toggle:checked, .outer-menu .checkbox-toggle:checked + .hamburger{position:fixed!important;top:80px;left:10px;} */
  .outer-menu .menu {width: 100vw;}
  .outer-menu .menu .menu-block ul li{margin:8px 0px;}
  .menu-col-2 > li > a{font-size:1.6rem!important;line-height:1.6rem;}
  .menu-col-2 > li > ul > li > a{font-size:1.4rem!important;line-height:1.8rem;}

  /* .outer-menu .checkbox-toggle, .outer-menu .hamburger{right:20px!important;} */
  /* .outer-menu .checkbox-toggle:checked, .outer-menu .checkbox-toggle:checked + .hamburger{top:60px;left:20px;} */

  /* #logo-menu{display:none!important;} */
  .outer-menu .menu .menu-block .menu-col-2{margin-top:-200px!important;}

}

@media screen and (max-width: 520px) {
  .outer-menu .menu .menu-block .menu-col-2{margin-top:0px!important;}
}