.menu a{color:#fff!important;text-transform:uppercase;}
.menu a:hover{color:#5968b1!important;}

.menu-top-row{position:relative;height:100vh!important;}
.menu-img,#logo-menu,#gradient{position:absolute!important;z-index:0!important;}
#logo-menu{top:40px;left:36px;z-index:10!important;}
.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:-30px!important;}
.social-block-ins{position:absolute;margin:24px 0px;}
.social-block span{color:#5968b1;font-size:60px;padding:0px 8px;transition:all .2s ease;}
.social-block span:hover{color:#fff;}
/* ******** HAMBURGER MENU ******** */
/* **************************** */

.outer-menu { position: fixed; top: 75px; right: 20%; z-index: 10000;}
.outer-menu .checkbox-toggle { position: absolute; top: 0; left: 0; z-index: 10002; cursor: pointer; width: 70px; height: 60px; opacity: 0;}
.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins { -webkit-transform: rotate(135deg); transform: rotate(135deg); background:#fff!important}
.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins:before,
.outer-menu .checkbox-toggle:checked + .hamburger > .hamburger-ins:after { width:100%!important;top: 0; -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.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 .checkbox-toggle:checked:hover + .hamburger > .hamburger-ins { -webkit-transform: rotate(225deg); transform: rotate(225deg); }

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

.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block { -webkit-transform: scale(1); transform: scale(1);transition-duration: .4s;}
.outer-menu .checkbox-toggle:checked ~ .menu > .menu-block > .menu-block-in-1 { -webkit-transform: scale(1); transform: scale(1);transition-duration: .6s;}
/* 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 .6s ease .6s;}

/* Menu Columns FX */
.menu-block .menu-col-1,.menu-block .menu-col-1 ul{text-align:right!important; padding-right:10px!important;}
.menu-block .menu-col-2,.menu-block .menu-col-2 ul{text-align:left!important; padding-left:10px!important;}

/*.menu-block .menu-col-1,.menu-block .menu-col-1 ul{text-align:left!important;}
.menu-block .menu-col-2,.menu-block .menu-col-2 ul{text-align:center!important;}
.menu-block .menu-col-3,.menu-block .menu-col-3 ul{text-align:right!important;}*/

.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 { position: absolute; left: 0; z-index: 10000; width: 60px; 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;}

.outer-menu .hamburger,.outer-menu .checkbox-toggle{top: -60px;}
.home .outer-menu .hamburger,.home .outer-menu .checkbox-toggle{top: -60px;}



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

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

.outer-menu .menu {position: fixed; top: 0; 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: 200vw; border-radius: 0%; background:rgba(61,120,79,.7); /*#a08344;*/ color: #fff; transition: all 1s ease; flex: none; transform: scale(0); backface-visibility: hidden; overflow: hidden; display: flex; align-items: center; margin-left:50px;}


.outer-menu .menu > .menu-block > .menu-block-in-1{ 
/* width: 200vw; height: 200vw; border-radius: 50%; */ 
width: 300vw; height: 200vw; border-radius: 0%; 

background-color: rgba(102,193,140,.85);
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; margin: 0; 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:0; margin:6px 0px; display:block; text-align:left;}
.outer-menu .menu .menu-block ul li ul li a{ font-size: 1.4rem!important;}

.outer-menu .menu .menu-block ul li ul{padding:0px;}
.outer-menu .menu .menu-block ul li ul li { padding: 0; margin: 2px 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: #5968b1; transition: width 0.4s ease;}


.menu-col-1 a{font-size:2.4rem!important;}
.menu-col-2 a{font-size:2.1rem!important;}

.menu-col-2 li{margin:3px 0px!important;}


/* ********* 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-end;
  }

/* ***** 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;/*padding:20px!important;*/}

@media screen and (max-width: 991px) {
.menu-handle-row{height:80%!important;}
.outer-menu #logo-menu{display:none;}
.outer-menu .menu .menu-block ul li {font-size:1.6rem!important;}
.outer-menu .menu .menu-block ul li ul li a{font-size:1.2rem!important;}

.menu-handle-row .col-lg-4,.menu-handle-row .col-lg-4 li{text-align: center!important;}
}

@media screen and (max-width: 768px) {
.menu-block .menu-col-1,.menu-block .menu-col-1 ul , .menu-block .menu-col-2,.menu-block .menu-col-2 ul{text-align:center!important;padding:0px!important;}
/*.outer-menu .menu .menu-block ul{width:60%!important;}*/
.menu-col-1 li a {font-size:2rem!important; margin:2px 0px!important;}
.menu-col-2 li a{font-size:1.3rem!important; margin:2px 0px!important}
.outer-menu .menu .menu-block ul li{margin:3px 0px!important;}
}