.nav-menu input {position: fixed;opacity: 0;}
.nav-menu label { position: relative; height: 60vh; top: 70px; width: 50px; margin: 0; padding: 0; border: none; outline: none; background: none; cursor: pointer;}
.nav-menu label .burger { position: absolute; top: 67%; left: 1em; z-index: 2; width: 2em; height: 2em; margin: 0; padding: 0; transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1);}
.nav-menu label .burger::before, .nav-menu label .burger .bar, .nav-menu label .burger::after { position: absolute; left: 0; display: block; width: 20px; height: 3px; background: #404041 !important; content: ''; transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1); border-radius: 4px;}
.nav-menu label .burger::before, label .burger::after{left: 4px;}
.nav-menu label .burger .bar { top: 44%; width: 28px;}
.nav-menu label .burger::before { top: 3px; transform-origin: top left;}
.nav-menu label .burger::after { bottom: 3px;transform-origin: bottom left;left: 4px;}
.nav-menu input:focus + label .burger, label:hover .burger {opacity: 0.75;}
.nav-menu nav { position: absolute; top: 0; left: 0; bottom: 0; z-index: 2; display: flex; flex-flow: column nowrap; justify-content: center; align-items: flex-start; transform: translate3d(0, 0, 0); transform: translateX(-100%); will-change: transform; transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);}
.nav-menu nav::before { position: absolute; top: 0; bottom: 0; left: 0; z-index: -1; width: 25em; background: #fff; content: ''; transform: skewX(15deg) translateX(-100%); transform-origin: bottom left; will-change: transform; transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); box-shadow: 11px 0px 30px -10px rgba(0, 0, 0, 0.5);}
@media (min-width: 40em) {.nav-menu nav::before {width: 61.5em;}}
@media (min-width: 1920px){.nav-menu nav::before{width: 79em;} .contact-menu #menu2::before{width: 79em !important;}}
.nav-menu nav a { margin: 0.3em 0; text-decoration: none;  font-family: 'Montserrat', sans-serif !important;  font-size: 30px; color: #404041; letter-spacing: 0.43px; transform: translateX(-100%); transition: color 0.15s, transform 0.5s; transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);}
/*.nav-menu nav a:nth-child(1) {transition-delay: 0s, 100ms;}
.nav-menu nav a:nth-child(2) {transition-delay: 0s, 150ms;}
.nav-menu nav a:nth-child(3) {transition-delay: 0s, 200ms;}
.nav-menu nav a:nth-child(4) {transition-delay: 0s, 250ms;}
.nav-menu nav a:nth-child(5) {transition-delay: 0s, 300ms;}
.nav-menu nav a:nth-child(6) {transition-delay: 0s, 350ms;}
.nav-menu nav a:nth-child(7) {transition-delay: 0s, 400ms;}
.nav-menu nav a:nth-child(8) {transition-delay: 0s, 450ms;}
.nav-menu nav a:nth-child(9) {transition-delay: 0s, 500ms;}*/
.nav-menu main {overflow: hidden;}
.nav-menu main .content {transform: translate3d(0, 0, 0);/* material acceleration */will-change: transform, filter;transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);}
[id="navcheck"]:checked + label::before {opacity: 1;pointer-events: auto;}
[id="navcheck"]:checked + label .burger::before {width: 62%;}
[id="navcheck"]:checked + label .burger::after {width: 41%;}
[id="navcheck"]:checked + label .burger::before {transform: rotate(135deg) translateY(-50%);left: 25px;}
[id="navcheck"]:checked + label .burger::after { transform: rotate(-135deg) translateY(50%); left: 25px;}
[id="navcheck"]:checked + label .burger{z-index: 3;left: 0.8em;}
[id="navcheck"]:checked + label .burger .bar {transform: scale(0.1); display: none;}
[id="navcheck"]:checked ~ nav {transform: translateX(0);}
[id="navcheck"]:checked ~ nav::before {transform: skewX(22deg) translateX(0); }
[id="navcheck"]:checked ~ nav a {transform: translateX(0);}
[id="navcheck"]:checked ~ main .content { transform: translateX(3em); transform-origin: left center; -webkit-filter: blur(2px); filter: blur(2px);}
@media (max-width: 768px){
  [id="navcheck"]:checked + label .burger{z-index: 3;left: 0.4em;}
}
/* helper */
.nav-menu .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
.left-menu{ position: relative; width: 60px; height: 100vh; border-right: 1px solid #979797;}
.open-border{position: absolute;top: 0;left: 60px;height: 100vh;width: 1px;background-color: #979797;}
.open-border-white{background-color: #fff !important;}
.left-menu .logo img{max-width: 30px; position: absolute; top: 23px; left: 15px;}
.left-menu-social{display: contents;}
.left-menu-social a{font-family: 'Montserrat', sans-serif !important; font-weight: 500 !important; font-size: 16px !important; color: #404041 !important; letter-spacing: 0.23px !important; line-height: 15px; padding-left: 7.5em;}
.social-first-item{padding-top: 30px !important;}
.lef-menu-address{display: flex; padding-left: 8.5em !important;}
.lef-menu-address .address{font-size: 12px;}
.lef-menu-address span{font-family: 'Montserrat', sans-serif !important; font-size: 12px; color: #F22B3E; letter-spacing: 0.18px;}
.lef-menu-address a{font-family: 'Montserrat', sans-serif !important; font-size: 12px !important; color: #404041 !important; letter-spacing: 0.18px !important; padding: 0 !important; margin: 0 !important;}
.lef-menu-address .address, .lef-menu-address .phone, .lef-menu-address .support{min-width: 240px; padding: 40px 20px 0 0; line-height: 17px;}





.contact-menu label { position: absolute; top: 91%; width: 100%; height: 10vh; z-index: 3; margin: 0; padding: 0; border: none; outline: none; background: none; cursor: pointer;}
.contact-menu label .burger { position: fixed; top: 96%; left: 1em; z-index: 3; width: 2em; height: 2em; margin: 0; padding: 0; transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1);}
.contact-menu label .burger::before, .contact-menu label .burger .bar, .contact-menu label .burger::after { position: absolute; left: 0; display: block; width: 24px; height: 4px; background: transparent; content: ''; transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1); border-radius: 4px;}
.contact-menu label .burger::before, label .burger::after{left: 4px;}
.contact-menu label .burger .bar { top: 44%; width: 32px;}
.contact-menu label .burger::before { top: 0; transform-origin: top left;}
.contact-menu label .burger::after { bottom: 0;transform-origin: bottom left;}
.contact-menu input:focus + label .burger, label:hover .burger {opacity: 0.75;}
.contact-menu #menu2 { position: absolute; top: 0; left: 0; bottom: 0; z-index: 2; display: flex; flex-flow: column nowrap; justify-content: center; align-items: flex-start; transform: translate3d(0, 0, 0); transform: translateX(-100%); will-change: transform; transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);    padding-left: 70px;}
.contact-menu #menu2::before { position: absolute; top: 0; bottom: 0; left: 0; z-index: -1; width: 25em; background: #F22B3E; content: ''; transform: skewX(15deg) translateX(-100%); transform-origin: bottom left; will-change: transform; transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); box-shadow: 11px 0px 30px -10px rgba(0, 0, 0, 0.5);}
@media (min-width: 40em) {.contact-menu #menu2::before {width: 61.5em;}}

.contact-menu main {overflow: hidden;}
.contact-menu main .content {transform: translate3d(0, 0, 0);/* material acceleration */will-change: transform, filter;transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);}


[id="navcheck2"]:checked + label::before {opacity: 1;pointer-events: auto; background-color: #404041;}
[id="navcheck2"]:checked + label .burger::before {width: 79%; background-color: #404041;}
[id="navcheck2"]:checked + label .burger::after {width: 54.42%; background-color: #404041;}
[id="navcheck2"]:checked + label .burger::before {transform: rotate(135deg) translateY(-50%);left: 25px;}
[id="navcheck2"]:checked + label .burger::after { transform: rotate(-135deg) translateY(50%); left: 25px;}
[id="navcheck2"]:checked + label .burger .bar {transform: scale(0.1); background-color: #404041;}
[id="navcheck2"]:checked ~ #menu2 {transform: translateX(0);}
[id="navcheck2"]:checked ~ #menu2::before {transform: skewX(22deg) translateX(0);}
[id="navcheck2"]:checked ~ #menu2 a {transform: translatenav}
[id="navcheck2"]:checked ~ main .content { transform: translateX(3em); transform-origin: left center; -webkit-filter: blur(2px); filter: blur(2px);}
/* helper */
.contact-menu .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
.left-menu{ position: fixed; z-index: 10; width: 60px; height: 100vh; border-right: 1px solid #979797;    background-color: #fff;}
.open-border{position: absolute;top: 0;left: 60px;height: 100vh;width: 1px;background-color: #979797;}
.left-menu .logo img{max-width: 30px; position: absolute; top: 23px; left: 15px;}
.contact-menu .c-menu-icon, .contact-menu .c-close-icon{position: absolute; bottom: 20px; max-width: 25px; left: 18px;}
.contact-menu .c-close-icon{max-width: 20px;}
.white-logo{max-width: 30px; position: absolute; top: 23px; left: 15px; z-index: 999; }
.menu-ext-logo{position: absolute; left: 0;top: 0; margin-top: 23px !important; padding: 0.1em 4em;}
.left-menu-logo{max-width: 30px; position: absolute; top: 0; left: 15px;}
.c-menu-icon-ext{max-width: 25px; position: absolute; bottom: 20px; left: 18px; display: none;}

.contact-menu-title p{color: #fff; max-width: 350px; letter-spacing: 0; padding-left: 7.5em !important; line-height: 18px;}
.contact-menu-title span{font-weight: 600;}
#menu2 form{position: relative;padding-left: 7.5em !important;}


#menu2 form {padding-top: 50px;}
#menu2 .form-group {position: relative;	margin-bottom: 20px;}
#menu2 input { display: block; width: 300px; font-size: 14pt; padding: 5px 10px; border: none; border-radius: 0 !important; border-bottom: 1px solid #ccc; background-color: transparent !important; color: #fff;}
#menu2 input:focus { outline: none;}
#menu2 label { position: absolute; top: 10px; left: 5px; color: #C8C8C8; font-weight: normal; pointer-events: none; transition: all 0.2s ease;font-family: 'Montserrat', sans-serif !important; font-size: 14px; letter-spacing: 0;}
#menu2 input:focus ~ label, #menu2 input:valid ~ label { top: -20px; font-size: 9pt; color: #fff;outline: none !important;}
#menu2 .bar { display: block; position: relative; width: 300px;}
#menu2 .bar:before, .bar:after {content: "";height: 2px;width: 0;bottom: 0;position: absolute;background: #fff;transition: all 0.2s ease;}
#menu2 .bar:before {left: 50%;}
#menu2 .bar:after {right: 50%;}
#menu2 input:focus ~ .bar:before, input:focus ~ .bar:after {width: 50%;}
.send-button{padding-top: 20px;}
.send-button button{display: flex;font-size: 16px; color: #F22B3E; letter-spacing: 0; padding: 8px 102px;    background-color: #fff;}
.send-button button img{max-width: 35px; padding-left: 10px;}
.contact-menu-bottom-description{padding-top: 40px;}
.contact-menu-bottom-description p{max-width: 400px; line-height: 18px;}
@media (max-width: 768px){
  .nav-menu label .burger{top: 62%;}
  .left-menu{width: 40px;}
  .left-menu .logo img{ max-width: 25px; left: 7px;}
  .nav-menu label .burger{left: 5px;}
  .nav-menu label .burger .bar{width: 28px;}
  .nav-menu label .burger::after{width: 20px;}
  .nav-menu label .burger::before{width: 20px;}
  .nav-menu label .burger::before{top: 3px;}
  .nav-menu label .burger::after{bottom: 4px;}
  .contact-menu .c-menu-icon, .contact-menu .c-close-icon{left: 7px;}
}
.nav-menu-bold{font-weight: 900; margin-left: 6vw !important;}
@media (max-width: 1440px){
.nav-menu-bold{margin-left: 8.2vw !important;}

}
@media (max-width: 768px){
  .open-border{left: 40px;}
  .left-menu-logo{max-width: 25px;left: 8px;}
  .c-menu-icon-ext{left: 8px;}
  [id="navcheck"]:checked + label .burger::after{bottom: 0; width: 48%;left: 20px;}
  [id="navcheck"]:checked + label .burger::before{width: 67%; left: 20px;}
  .nav-menu nav::before{width: 115%;}
  [id="navcheck"]:checked ~ nav::before{ transform: skewX(0) translateX(0);}
  .nav-menu nav a{font-size: 22px; margin: 0;}
  .nav-menu-bold{margin-left: 24vw !important;}
  .left-menu-social a{padding: 5px 0 5px 5.5em;}
  .lef-menu-address{display: block;padding-left: 6.5em !important;}
  .lef-menu-address .address{margin-top: 10px;}
  .lef-menu-address .address, .lef-menu-address .phone, .lef-menu-address .support{padding: 10px 20px 0 0;}
  .social-first-item{padding-top: 30px !important;}
  .white-logo{max-width: 25px; left: 7px;}
  .contact-menu .c-close-icon{left: 10px;}
  .contact-menu .c-menu-icon{left: 7px; max-width: 25px;}
  .contact-menu #menu2::before{width: 130%;}
  .contact-menu #menu2{padding-left: 0;}
  [id="navcheck2"]:checked ~ #menu2::before{transform: skewX(0) translateX(0);}
  .contact-menu-title p{padding-left: 5.5em !important;}
  #menu2 form{padding-left: 5.5em !important; padding-top: 20px;}
  #menu2 input{ width: 230px; border-radius: none !important;}

  #menu2 .bar{width: 230px;}
  .send-button button{padding: 8px 68px;}
}

 #menu a{}
 #menu .nav-menu-bold .hover {
   color: #404041;
   background-color: #404041;
   display: inline-block;
   position: absolute;
   bottom: 0;
   left: 0;
   width: 0;
   height: 3px;
   overflow-x: hidden;
   transition: all 0.5s ease;
   white-space: nowrap;
}
 #menu .nav-menu-bold:hover .hover {
   width: 100%;
   height: 3px;
}

@media (max-width: 768px){
   #menu .nav-menu-bold .hover{display: none;}
}