body{ background-color: #050b1f; width: 100vw; max-width: 100vw; overflow-x: clip;}
a{ text-decoration: none; }
.container{ width: 1320px !important; }
.sideber{ /*background-color:#0f1329;*/ width: 135px; height: 100vh; padding: 12px; position: fixed; top:0; z-index: 9; background: rgba(07,14,37,1); background: linear-gradient(242deg, rgba(08,14,38,1) 0%, rgba(08,14,38,1) 49%, rgba(01,21,90,1) 100%); transition: all 0.3s ease-in-out; }
.sideber .logo{ width: 107px; margin: 10px auto; }
.logo img{ margin-left: 9px; }
.sideber .hamburgerMenu{ margin: 0; padding: 0; width: 100%; margin-top:15px; position: absolute; bottom: 35px !important; left: 0; }
.sidebar .hamburgerMenu .hamburger{ margin: 1px auto;  display: block; }
.openShow{ display: none; }
.active{ /*background-color:#0f1329;*/ width: 350px;}
.bigBox1{ width:896px !important; height:868px !important;  }
.active ul li{ display: block; }
.active .openShow{ display: block; width: 153%; margin-left: -30px; margin-top: 28px; }
.active .hamburger{ display: none; }
.active ul li:nth-child(1){ animation-duration: 800ms; }
.active ul li:nth-child(2){ animation-duration: 1600ms; }
.active ul li:nth-child(3){ animation-duration: 2400ms; }
.home{width: 100%; min-height: 100vh; position: relative; }
.home p{ font-family: 'Albra Display'; font-weight: 100; font-style: normal; color:#fff; font-size: 61px; line-height: 71px; text-align: center; }
.home img{ max-height: 80vh; object-fit: contain; left: -76px; }
.about{ width: 100%; height: 6862px; padding-left: 15vw; padding-right: 10vw; }
.about2{ height: 3027px !important; }
.about .aboutContent{ height: 100vh; min-height:968px;  position: sticky; top:0;  opacity: 0; traslation:1s;}
.about .aboutContent .layer *{ display: none; }
.about .aboutContent .layer img{ opacity:0; }
.about .layer{ border: 1px solid #f4f4f4; width:434px; height: 434px; display:flex;  justify-content:center; align-items: center; padding:0;}
.about .layer2{ border: 1px solid #f4f4f4; width:434px; height: 434px; padding: 0; }
.about .layer3{ border: 1px solid #f4f4f4; overflow: hidden; padding:0; float: left;}
.st2 p{ color:#f4f4f4; font-size: 81px; width: 100%;  text-align: center; font-family: 'Albra Display'; font-weight: 100; font-style: normal;  display: none; }
.about .layer img{ width: 100%; height: 100%; object-fit: cover; }
.st2 p:first-child{ display: block; }
.st2 img{ display: none; }
.keyf{ animation-duration: 10s;}
.years{ position: relative; }
.layerYears{ position: absolute; z-index: 2; left: -89px !important; }
.about .layer3 img{ width: 100%; height: 100%; object-fit: cover; display: none; }
.st2x{ display:flex;  justify-content:center; align-items: center; padding:0; }
.st2x p{ color:#f4f4f4; font-size: 81px; width: 100%;  text-align: center; font-family: 'Albra Display'; font-weight: 100; font-style: normal;  display: none; }
.sahneson{ width: 100%; min-height: 100vh; position: relative; }
.sahneson p{ font-family: 'Albra Display'; font-weight: 100; font-style: normal; color:#fff; font-size: 55px; line-height: 71px; text-align: center;  margin-top: -20px; position: relative; top: -158px; }
.sahneson img{ max-height: 80vh; object-fit: contain;  margin-top: 20vh; }
.footer{ background-color:#0f1329; width: 100vw; padding: 12px; position: relative; bottom:0; color:#fff; }
.footer p{ color:#f4f4f4; font-family: 'Albra Display'; font-weight: 100; font-style: normal; }
.navContent{ height: 75vh; display:table; }
.contentNav{ display: table-cell; vertical-align: bottom; }
.contentNav li{ display: none; }
.contentNav a{ color:#fff; font-family: 'Albra Display'; font-weight: 600; font-style: normal; font-size:65px; }
.active .langItem{ display: inline-flex !important; }
.active .langItem a{ font-size: 40px; }

.hamburger:hover{cursor: pointer;}
.hamburger .line{ width: 50px; height: 8px; background-color: #ecf0f1; display: block; margin: 8px auto; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
#hamburger-1.is-active .line:nth-child(2){ opacity: 0; }
#hamburger-1.is-active .line:nth-child(1){ -webkit-transform: translateY(13px) rotate(45deg); -ms-transform: translateY(13px) rotate(45deg); -o-transform: translateY(13px) rotate(45deg); transform: translateY(13px) rotate(45deg); }
#hamburger-1.is-active .line:nth-child(3){ -webkit-transform: translateY(-13px) rotate(-45deg); -ms-transform: translateY(-13px) rotate(-45deg); -o-transform: translateY(-13px) rotate(-45deg); transform: translateY(-13px) rotate(-45deg); }

.AboutPage{ padding-left: 15%; margin-top: 3%; margin-bottom: 22%; background-image:url("../img/bg.png"); background-repeat: no-repeat; background-position: top center; background-size: contain; text-align: center !important; }
.AboutPage h1{ font-family: 'Albra Display'; font-weight: 100; font-style: normal; color:#e5e5e5; text-align: center; font-size: 6rem; margin-top: 64px; margin-bottom:15px; }
.AboutPage p{ font-size: 1.3rem; line-height: 32px; font-family: 'Albra Display'; font-weight: 100; font-style: normal; color:#e5e5e5; }
.AboutPage a{ color:#e5e5e5; font-size:1.4rem; font-family: 'Albra Display'; font-weight: 100; font-style: normal; color:#e5e5e5; }
.tell a{ font-size: 3rem; }
.contactMail{ border-right: 1px solid #e5e5e5; }
.contactMail:last-child{ border-right: none !important; }
.seperator{ width: 95%; height:2px; background-color:#e5e5e5; margin: 40px auto; }
.ContactItem .infoContact{ border: 1px solid #f4f4f4;  }
.ContactItem p{ font-size: 21px; line-height: 29px;}
.perde{ display: none; }
.playbtn{ margin-top: 0 !important; height: 65px; }
@media screen and (min-width: 952px) {
    .st2 p{ font-size: 65px; }
    .about .aboutContent{ min-height: 820px; }
    .about .layer{ width: 360px !important; height: 360px !important; }
    .about .layer2{ width: 360px; height: 360px; }
    .about{ padding-left: 17vw; padding-right: 0; }
    .st2 p{ font-size: 47px; }
    .st2x p{ font-size: 3rem; }

    /*.about{ height: 900vh; }
    .about2{ height: 600vh !important; }*/
}
@media screen and (min-width: 986px) {
    .about .aboutContent{ min-height: 800px; }
    .about .layer{ width: 350px !important; height: 350px !important; }
    .about .layer2{ width: 350px; height: 350px; }
    .content{ min-width: 989px !important; }
}
@media screen and (min-width: 953px) and (max-width: 1200px) {
    .st2x p{ font-size: 4em; }
    .home p{ margin-left: 71px; font-size: 54px; line-height: 65px; }
    .sahneson p{ margin-left: 76px;}
}
@media screen and (max-width: 951px) {
    .st2 p{ font-size: 65px; }
    .about .aboutContent{ min-height: 800px; }
    .about .layer{ width: 350px !important; height: 350px !important; }
    .about .layer2{ width: 350px; height: 350px; }
    .about{ padding-left: 17vw; padding-right: 0; }
    .st2 p{ font-size: 47px; }
}
@media screen and (max-width: 920px) {
    .about{ padding-left: 20vw; padding-right: 0; }
}
@media screen and (max-width: 860px) {
    .about{ padding-left: 20vw; padding-right: 0; }
    .about .aboutContent{ min-height: 760px; }
    .about .layer{ width: 330px !important; height: 330px !important; }
    .about .layer2{ width: 330px; height: 330px; }
    .st2x p{ font-size: 73px; }
    .sahneson p{ font-size: 49px; line-height: 62px;  }
}
@media screen and (max-width: 985px){
    .content{ max-width: 947px !important; }
}
@media screen and (max-width: 820px) {
    .st2 p{ font-size: 65px; }
    .about .aboutContent{ min-height: 740px; }
    .about .layer{ width: 320px !important; height: 320px !important; }
    .about .layer2{ width: 320px; height: 320px; }
    .about{ padding-left: 20vw; padding-right: 0; }
    .st2 p{ font-size: 47px; }
}
@media screen and (max-width: 796px) {
    .about .aboutContent{ min-height: 700px; }
    .about .layer{ width: 300px !important; height: 300px !important; }
    .about .layer2{ width: 300px; height: 300px; }
    .about{ padding-left: 20vw; padding-right: 0; }
    .st2 p{ font-size: 47px; }
    .st2x p{ font-size: 60px; }
    .sahneson p{ font-size: 42px; line-height: 55px; }
    .home img{ max-height: 54vh; }
    .home p{ font-size: 40px !important; }
}
@media screen and (max-width: 750px) {
    .st2 p{ font-size: 65px; }
    .about .aboutContent{ min-height: 540px; }
    .about .layer{ width: 220px !important; height: 220px !important; }
    .about .layer2{ width: 220px; height: 220px; }
    .about{ padding-left: 26vw; padding-right: 0; }
    .st2 p{ font-size: 47px; }
    .st2x p{ font-size: 47px; }
    .content{ max-width: 750px !important; }
    .home p{ font-size: 35px !important; }
    .sahneson p{ font-size: 33px; line-height: 45px; }
}
@media screen and (max-width:620px){
    .home{ margin-left: -13px; }
    .sahneson{ margin-left: 29px; }
    .content{ width: 100%; max-width: 550px !important; }
    .home img{ left: 33px !important; }
    .layerYears{ left: 33px!important; top: -6px; }
    .sideber{ width: 65px; }
    .active{ width: 210px; }
    .sideber .logo{ width: auto; }
    .active .logo{ width: 49%; }
    .contentNav a{ font-size: 41px;  }
    .active .langItem a{ font-size: 23px; }
    .home p{ width: 87%; left: 102px; position: relative; font-size: 49px; line-height: 60px; }
    .about .aboutContent{ min-height: 500px; }
    .about .layer{ width: 200px !important; height: 200px !important; }
    .about .layer2{ width: 200px; height: 200px; }
    .about{ padding-left: 22vw; padding-right: 0; }
    .hamburger .line{ height: 4px; width:40px; }
    .st2 p{ font-size: 39px !important; }
    .st2x p{ font-size: 44px; }
    .sahneson img{  position: relative;  }
    .sahneson p { font-family: 'Albra Display'; font-weight: 100; font-style: normal; color: #fff; font-size: 31px; line-height: 48px; text-align: center; margin-top: -20px; position: relative; top: -70px; left: 33px; }
    .AboutPage h1{ font-size: 3rem; }
    .contactMail p, .location{ line-height: normal !important; left:0 !important; margin: 25px auto; font-size: 21px !important; }
    .seperator{ display: none; }
    .contactMail{ padding-top: 31px; }
    .socialBar{ margin-left: 20px; margin-right: 20px; }
    .tell a{ font-size: 2rem; }
    .maps{ margin-bottom: 20px; }
    .contactMail img{ margin-top: -36px !important; margin-left: 13px; width: 35px; height: 35px; }
    .sideber .hamburgerMenu{ bottom: 80px !important;  }
    .contactMail p{ margin-left: auto !important;}
    .navContent{ display: none !important; }
    .active .navContent{ display: block !important;  position: absolute; bottom: 27px; height: auto; }

}
@media screen and (max-width: 420px){
    .home{ margin-left: 1px; }
    .about{ padding-left: 26vw; }
    .sahneson{ margin-left: 10px; }
    .home img{ left: -11px !important; max-height: 48vh;}
    .home .layerYears{ left: -10px !important; }
    .home p{ width: 69%; font-size: 34px !important; margin-top: 2px !important; line-height:57px !important; margin-left:-10px; }
    .about .aboutContent{ min-height: 390px; }
    .about .layer{  width: 145px !important; height: 145px !important; }
    .about .layer2{  width: 145px !important; height: 145px !important; }
    .st2 p{ font-size: 22px !important; }
    .st2x p{ font-size: 31px !important; margin-bottom: 0 !important; }
    .sahneson img{ max-height: 51vh; object-fit: contain; margin-top: 20vh; left: 6px; }
    .sahneson p{ left: 66px; width: 75%; top: -47px; font-size:22px; }
    .content{ width: 100%; max-width: 420px !important; }
    .contactMail p, .location{ line-height: normal !important; left:0 !important; margin: 25px auto; font-size: 21px !important; }
    .AboutPage h1{ margin-top: 57px; }
    .location{ margin-left: 58px !important; }
    .logo img{ margin-left: 7px; }
    .sideber{ padding: 12px 5px; }
}
@media screen and (max-width: 375px){
    .home{ margin-left: 17px; }
    .about{ padding-left: 27vw;  }
    .sahneson{ margin-left: 12px; }
    .home img{ left: -11px !important; max-height: 48vh;}
    .home .layerYears{ left: -10px !important; }
    .home p{ width: 69%; font-size: 34px !important; margin-top: 2px !important; line-height:57px !important; margin-left:-29px; }
    .about .aboutContent{ min-height: 370px; }
    .about .layer{  width: 135px !important; height: 135px !important; }
    .about .layer2{  width: 135px !important; height: 135px !important; }
    .st2 p{ font-size: 27px !important; }
    .st2x p{ font-size: 31px !important; }
    .sahneson img{ max-height: 51vh; object-fit: contain; margin-top: 20vh; left: 6px; }
    .sahneson p{ left: 68px; width: 70%; top: -44px; font-size:22px; }
    .content{ width: 100%; max-width: 375px !important; }
    .contactMail p, .location{ line-height: normal !important; left:0 !important; margin: 25px auto; font-size: 21px !important; }
    .AboutPage h1{ margin-top: 57px; }

}
@media screen and (max-width: 1060px) {
    .home img{ left:-21px; }
    .layerYears{ left: -24px !important; }
    .home p{ font-size: 52px; line-height: 65px; margin-top: 91px; }
    .contactMail p{ margin-left: 1px; font-size: 23px !important;  line-height: 43px; margin-top: 1px;}
    .location{ margin-left: 1px !important; font-size: 23px !important;  line-height: 43px !important; margin-top: 1px !important;}
    .AboutPage h1{ font-size: 4rem; margin-top: 81px; margin-bottom: 20px; }
}
@media screen and (max-width: 1400px) {
    .contactMail p{ margin-left: 1px; font-size: 23px !important;  line-height: 43px; margin-top: 1px;}
    .location{ margin-left: 1px !important; font-size: 23px !important;  line-height: 43px !important; margin-top: 1px !important;}
    .AboutPage h1{ font-size: 4rem; margin-top: 81px; margin-bottom: 20px; }
}
@media screen and (max-width:619px){
    .location{  margin-left: auto !important; font-size: 19px !important; }
}
@media screen and (min-width: 999px) {
    .about{ padding-right: 0!important; padding-left: 16vw;}
}
@media screen and (width: 1024px) and (height: 768px) {
    .sahneson p{ font-size: 52px; }
}
@media screen and (width: 1080px) and (height: 810px) {
    .home p{ margin-left: 111px; }
    .sahneson p{  left: 28px;  }
}
@media screen and (max-width: 896px) and (max-height: 414px){
    .perde{ display: block; position: fixed; top:0; left: 0;  background-color:#050b1f; color:#fff; text-align: center; z-index: 9999; width: 107vw; height: 110vh; padding-top: 100px; }
    .perde p{ font-family: 'Albra Display'; font-weight: 100; font-style: normal; color:#fff; font-size: 2rem; margin-top: 10px; }
    .content{ display: none; }
}
@media screen and (width: 414px) and (height: 736px){
    .about { height: 880vh; }
    .about2 { height: 460vh !important; }
}
@media screen and (width: 810px) and (height: 1080px) {
    .content{ width:810px !important;  max-width:810px !important; }
    .home img{ left: -1px !important; max-height: 60vh; }
    .home p{ margin-top: 36px; }
    .about .aboutContent{ min-height: 740px; }
    .about .layer{ width: 320px !important; height: 320px!important; }
    .about .layer2{ width: 320px !important; height: 320px!important; }
    .layerYears{ left: -54px !important; }
    .st2x p{ font-size:63px; }
    .sahneson p{ font-size: 47px; width: 81%; left: 80px; }
    .AboutPage img{ max-height: 28vh; position: relative; left: -60px; }
    .AboutPage h1{ font-size:4rem; }
    .AboutPage p{ font-size: 16px; line-height: 24px; margin-top: 8px; }
    .AboutPage a{ font-size: 1rem; }
}
@media screen and (width: 820px) and (height: 1180px) {
    .home p{ margin-left: 133px; }
    .content{ width:820px !important;  max-width:820px !important; }
    .about .aboutContent{ min-height: 740px; }
    .about .layer{ width: 320px !important; height: 320px!important; }
    .about .layer2{ width: 320px !important; height: 320px!important; }
    .st2x p{ font-size: 67px; }
    AboutPage img{ max-height: 28vh; position: relative; left: -60px; }
    .AboutPage h1{ font-size:4rem; }
    .AboutPage p{ font-size: 16px; line-height: 24px; margin-top: 8px; }
    .AboutPage a{ font-size: 1rem; }
    .sahneson p{ font-size: 47px; width: 81%; left: 120px; }
}
@media screen and (width: 1180px) and (height: 820px) {
    .home p{ margin-left: 133px; }
    .content{ width:1180px !important;  max-width:1180px !important; }
    .about .aboutContent{ min-height: 960px; }
    .about .layer{ width: 430px !important; height: 430px!important; }
    .about .layer2{ width: 430px !important; height: 430px!important; }
    .st2x p{ font-size: 67px; }
    AboutPage img{ max-height: 28vh; position: relative; left: -60px; }
    .AboutPage h1{ font-size:4rem; }
    .AboutPage p{ font-size: 16px; line-height: 24px; margin-top: 8px; margin-left:0 !important; }
    .AboutPage a{ font-size: 1rem; }
    .sahneson p{ font-size: 47px; width: 81%; left: 120px; }
}
@media screen and (min-width: 1400px) {
    .st2 p{ font-size: 65px; }
    .about .aboutContent{ min-height: 1022px; }
    .about .layer{ width: 461px !important; height: 461px !important; }
    .about .layer2{ width: 461px; height: 461px; }
    .about{ padding-left: 17vw; padding-right: 0; }
    .st2 p{ font-size: 47px; }
}
@media screen and (min-width: 1400px) and (max-height: 950px) {
    .about .layer{ width: 363px !important; height: 363px !important; }
    .about .layer2{ width: 363px !important; height: 363px !important; }
    .about .aboutContent{ top: -50px; }
}
@media screen and (min-width: 2100px) {
    .st2 p{ font-size: 5rem; }
    .st2x p{ font-size: 90px; }
    .about .aboutContent{ min-height: 1210px; }
    .about .layer{ width: 555px !important; height: 555px !important; }
    .about .layer2{ width: 555px; height: 555px; }
    .about{ padding-left: 7vw; padding-right: 0; }
    /*.st2 p{ font-size: 47px; }*/
}
@media screen and (min-width: 3000px) {
    .container{ width: 2003px!important; max-width: 3000px; }
    .sideber{ width: 223px; }
    .sideber .logo{ width: 189px; }
    .active{ width: 450px !important; }
    .home p{ font-size: 108px; line-height: 103px; }
    .layerYears{ left:-95px !important; }
    .about{ padding-right: 0!important; padding-left: 10vh;}
    .st2 p{ font-size:125px; }
    .st2x p{ font-size: 132px; }
    .sahneson p { font-size: 100px;line-height: 98px; }
    .footer p{ font-size: 28px; }
    .about .aboutContent{ min-height: 1650px; }
    .about .layer{ width: 775px !important; height: 775px !important; }
    .about .layer2{ width: 775px; height: 775px; }
}
@media screen and (min-width: 5000px) {
    .container{ width: 3000px!important; max-width: 4000px; }
    .sideber{ width: 340px; }
    .sideber .logo{ width: 289px; }
    .sideber .hamburge{ margin-top: 100px; }
    .hamburger .line{ width: 100px; height: 10px; margin: 18px auto; }
    .active{ width: 950px!important; }
    .contentNav a{ font-size: 158px !important; }
    .active .langItem a{ font-size: 95px !important; }
    .home p{ font-size: 165px; line-height: 163px; }
    .layerYears{ left:-95px !important; }
    .about{ padding-right: 0!important; padding-left: 17vh;  }
    .st2 p{ font-size:190px; }
    .st2x p{ font-size: 203px; }
    .sahneson p { font-size: 152px; line-height: 145px;}
    .footer p{ font-size: 28px; }
    .about .aboutContent{ min-height: 2610px; }
    .about .layer{ width: 1255px !important; height: 1255px !important; }
    .about .layer2{ width: 1255px; height: 1255px; }
    .navContent{ height: 80vh; }
}
