/* Variables */
:root {
  --black: #000000;    
  --white: #ffffff;
  --darkgreen: #00343A;
  --green: #007377;
  --lightgreen: #B2C96F;
  --gold: #DFA242;
}

/* Global */
.roboto-flex-mainfont {
  font-family: "Roboto Flex", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "wdth" 100,
    "GRAD" 0,
    "XOPQ" 96,
    "XTRA" 468,
    "YOPQ" 79,
    "YTAS" 750,
    "YTDE" -203,
    "YTFI" 738,
    "YTLC" 514,
    "YTUC" 712;
}
.font-weight-light{font-weight:300;}
.font-weight-regular{font-weight:400;}
.font-weight-medium{font-weight:500;}
.font-weight-semibold{font-weight:600;}
.font-weight-bold{font-weight:700;}

*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing:border-box; box-sizing:border-box;
}

.txt-darkgreen{color:var(--darkgreen);}
.txt-green{color:var(--green);}
.txt-lightgreen{color:var(--lightgreen);}
.txt-gold{color:var(--gold);}
.txt-white{color:var(--white);}
 
HTML{height:100%;width:100%;scroll-behavior:smooth;overflow:hidden;overflow-y:visible;}
BODY{height:100%;width:100%;max-width:100%;min-width:320px;background-color:var(--green);}
.container{width:100%;max-width:1220px;margin:0 auto;}
.col{padding:0 10px;flex-direction:column;}
.row{display:flex;}
.col-lg-1{width:8.33%;} .col-lg-2{width:16.66%;} .col-lg-3{width:25%;} .col-lg-4{width:33.33%;} .col-lg-5{width:41.65%;} .col-lg-6{width:50%;} .col-lg-7{width:58.33%;} .col-lg-8{width:66.66%;} .col-lg-9{width:75%;} .col-lg-10{width:83.33%;} .col-lg-11{width:91.65%;} .col-lg-12{width:100%;}

/* Header */
header.main{padding:35px 0 0 0;}
.logo{text-align:left;}
.logo a, .logo-center a{display:inline-block;width:195px;height:48px;background-image: url('../images/logo.svg');background-size:100%;}
.logo-center{text-align:center;}
.login{text-align:right;}

/* Buttons */
.btn-global{display:inline-block;min-width:125px;text-align:center;font-size:16px;padding:15px 20px;border-radius:40px;text-decoration:none;transition: all 0.3s ease;}
.btn-lg{display:inline-block;min-width:200px;text-align:center;font-size:20px;padding:25px 30px;border-radius:40px;text-decoration:none;transition: all 0.3s ease;}
.btn-lightgreen{background-color:var(--lightgreen);color:var(--darkgreen);}
.btn-lightgreen:hover, .btn-white:hover, .btn-gold:hover{color:var(--white);background-color:var(--darkgreen);}
.btn-white{background-color:var(--white);color:var(--darkgreen);}
.btn-gold{background-color:var(--gold);color:var(--white);}

/* Content */
.main-intro{margin:0 0 50px 0;}
.main-intro .intro-txt{padding-top:180px;}
.main-intro h1{font-size:56px;margin:0 0 45px 0;}
.main-intro p{font-size:20px;line-height:32px;margin:0 0 25px 0;}
.main-intro .intro-btns{padding:60px 0 0 0;}
.main-intro .video-icon{margin:0 0 0 15px;}
.main-intro .video-icon::after{content:'';display:inline-block;margin:0 0 0 15px;width:23px;height:14px;background-image: url('../images/icon-video.svg');}
.main-intro .video-icon:hover::after{content:'';background-image: url('../images/icon-video-white.svg');}
.main-intro .intro-imgs{position:relative;text-align:right;padding:120px 0 0 0;}
.main-intro .intro-imgs .main-img{max-width:443px;}
.main-intro .intro-imgs #main-img1{position:absolute;z-index:10;box-shadow: 0 0 20px 0 rgba(0,0,0,.25);max-width:391px;left:38px;bottom:45px;border-radius:14px;animation-name:main-img1;animation-duration:12s;animation-iteration-count:infinite;}
@keyframes main-img1 {
  0%{left:8px;opacity:0;}
  11%{left:38px;opacity:1;}
  40%{opacity: 1;}
  50%{opacity: 0;}
  100% {opacity: 0;}
}
.main-intro .intro-imgs #main-img4{position:absolute;z-index:10;box-shadow: 0 0 20px 0 rgba(0,0,0,.25);opacity:0;max-width:391px;left:38px;bottom:45px;border-radius:14px;animation-name:main-img4;animation-duration:12s;animation-iteration-count:infinite;}
@keyframes main-img4 {
  0%{opacity:0;}
  11%{opacity:0;}
  45%{opacity:0;left:8px;}
  55%{opacity:1;left:38px;}
  93% {opacity:1;}
  100% {opacity:0;}
}

.main-intro .intro-imgs #main-img2{position:absolute;z-index:10;box-shadow: 0 0 20px 0 rgba(0,0,0,.15);max-width:194px;right:-97px;top:157px;border-radius:14px;animation-name:main-img2;animation-duration:12s;animation-iteration-count:infinite;}
@keyframes main-img2 {
  0%{right:-127px;opacity:0;}
  15%{right:-97px;opacity:1;}
  42%{opacity: 1;}
  50%{opacity: 0;}
  100% {opacity: 0;}
}
.main-intro .intro-imgs #main-img5{position:absolute;z-index:10;box-shadow: 0 0 20px 0 rgba(0,0,0,.15);opacity:0;max-width:194px;right:-97px;top:157px;border-radius:14px;animation-name:main-img5;animation-duration:12s;animation-iteration-count:infinite;}
@keyframes main-img5 {
  0%{opacity:0;}
  105%{opacity:0;}
  47%{opacity:0;right:-127px;}
  57%{opacity:1;right:-97px;}
  95% {opacity:1;}
  100% {opacity:0;}
}

.main-intro .intro-imgs #main-img3{position:absolute;z-index:10;box-shadow: 0 0 20px 0 rgba(0,0,0,.15);max-width:220px;left:97px;top:150px;border-radius:14px;animation-name:main-img3;animation-duration:1.3s;}
@keyframes main-img3 {
  from {left:0;opacity:0;}
  to {left:97px;opacity:1;}
}

/* Login */
.login-box{margin:0 auto;margin-top:70px;width:100%;max-width:375px;border:1px solid var(--white);border-radius:24px;padding:24px;}
.login-box h2{font-size:28px;line-height:38px;margin:0 0 50px 0;}
.login-box h2.messages{margin:0 0 20px 0;}
.login-box h4{font-size:18px;margin:0 0 20px 0;line-height:24px;}
.login-box p{font-size:14px;margin:0 0 20px 0;line-height:20px;}
.login-box p a, .login-box h4 a{color:var(--lightgreen);}
.login-box p a:hover, .login-box h4 a:hover{text-decoration:none;}
.login-box p.legal{font-size:12px;margin:0;}
.login-box form{margin:0 0 40px 0;overflow:hidden;}
.login-box form label{display:block;width:100%;margin:0;}
.login-box form input[type=text]{display:block;width:100%;margin:0 0 15px 0;border:none;border-bottom:1px solid #babfc0;background-color:var(--green);outline:none;color:var(--white);font-size:16px;}
.login-box form input[type=submit]{border:none;font-family: "Roboto Flex", sans-serif;float:right;}
.login-box form input[type=submit]:hover{cursor:pointer;}

/* Footer */
footer.main-footer{text-align:right;padding-bottom:15px;}
footer.main-footer span.separator{margin:0 10px;}
footer.main-footer p{color:var(--white);font-size:14px;}
footer.main-footer p.copy{text-align:left;letter-spacing:1px;}
footer.main-footer a{color:var(--white);text-decoration:none;}
footer.main-footer a:hover{text-decoration:underline;}


/* Modals */
#book-demo, #know-more, #privacy , #terms, #imprint, #faqs{height:100%;width:100%;position:fixed;z-index:1000;top:0;left:0;background-color: rgba(0,52,58,.65);display:none;opacity:0;transition: all 0.4s ease;overflow:auto;}
#book-demo.visible, #know-more.visible, #privacy.visible, #terms.visible, #imprint.visible, #faqs.visible{display:block;opacity:1;}
.book-demo-modal{margin:0 auto;margin-top:10%;margin-bottom:10%;max-height:80%;overflow:auto;border-radius:16px;width:95%;max-width:490px;background-color:var(--white);position:relative;padding:30px;}
.book-demo-modal-close, .know-more-modal-close, .privacy-modal-close, .terms-modal-close, .imprint-modal-close, .faqs-modal-close{position:absolute;top:20px;right:20px;width:17px;height:17px;background-image: url('../images/close.svg');}
.book-demo-modal-close:hover, .know-more-modal-close:hover, .privacy-modal-close:hover, .terms-modal-close:hover, .imprint-modal-close:hover, .faqs-modal-close:hover{cursor:pointer;}
.book-demo-img{text-align:center;margin:15px 0;}
.book-demo-modal h3{font-size:21px;text-align:center;text-transform:uppercase;}
.book-demo-form{padding:30px 0 0 0;}
.book-demo-form input{border:#C3C8CC 1px solid;border-radius:10px;height:45px;width:100%;font-size:16px;font-weight:300;font-family: "Roboto Flex", sans-serif;padding:0 15px;}
.col-full, .col-half{width:100%;margin:0 0 10px 0;display:flex;}
.book-demo-modal .col-full:last-child{margin:30px 0 0 0;}
.col-full .btn-global{margin:0 auto;}
.col-half input, .col-half div.txtcnt{width:calc(50% - 5px);}
.col-half input:first-child, .col-half div.txtcnt:first-child{margin-right:10px;}
.col-full ul, .col-half ul, .col-full ol, .col-half ol{margin:0 0 30px 0;}
.col-full ul li, .col-half ul li, .col-full ol li, .col-half ol li{margin:0 0 20px 15px;padding:0 0 0 12px;}
.know-more-modal{margin:0 auto;margin-top:10%;margin-bottom:10%;height:100%;max-height:80%;overflow:auto;border-radius:16px;width:100%;background-color:#F3F5F7;position:relative;padding:30px 110px;}
.know-more-modal h2{font-size:32px;text-align:center;text-transform:uppercase;margin:0 0 35px 0;}
.know-more-modal h3{font-size:22px;line-height:32px;text-align:center;text-transform:uppercase;margin:0 0 32px 0;text-align:left;}
.know-more-modal p{font-size:16px;line-height:22px;margin:0 0 22px 0;}
.know-more-modal img, .know-more-modal video{max-width:100%;margin:0 0 25px 0;}
.know-more-modal .col-full, .know-more-modal .col-half{margin:40px 0 20px;align-items: center;}
.know-more-modal .rightpad{padding:0 55px 0 0;}
.know-more-modal .leftpad{padding:0 0 0 55px;}
#neurobtn{margin:0 0 40px 0;}

/* Faqs */
.accordion {background-color:#fff;cursor:pointer;padding:20px;width:100%;transition:0.5s;border-radius:10px 10px 0 0;margin:10px 0 0 0;}
.active, .accordion:hover {background-color:var(--green); color:var(--white);}
.panel {padding:20px 20px 0 20px;display:none;background-color:white;overflow:hidden;border-radius:0 0 10px 10px;}