@charset "utf-8";
/* CSS Document */

/* ------- webfonts ------- */
@font-face{font-family:'suisse';src:url('fonts/SuisseIntl-Regular.eot');src:local('☺'), url('fonts/SuisseIntl-Regular.woff') format('woff'), url('fonts/SuisseIntl-Regular.ttf') format('truetype'), url('fonts/SuisseIntl-Regular.svg') format('svg');font-weight:normal;font-style:normal}

/* ------- STYLES ------- */

/* GENERAL */
.guides.grid{position:fixed;height:100%;width:calc(100% - 72px);padding:0;top:36px;left:36px;z-index:100;pointer-events:none}
.guides.grid > *{background-color:rgba(255, 0, 0, 0.2)}

*{outline:none;margin:0;padding:0;font-family:'suisse';box-sizing:border-box;text-align:left}
body{font-weight:normal;-webkit-font-smoothing:antialiased!important;font-smoothing:antialiased!important;overflow-x:hidden;font-size:18px;line-height:21px;color:#000;background-color:#FFF;position:relative;margin:0 auto}
body.scroll-disabled{overflow:hidden!important;overflow-x:hidden;-webkit-overflow-scrolling:touch;}

h1,h2,h3,h4,h5{font-weight:normal;font-size:inherit}
p{font-size:inherit}

a{cursor:pointer;text-decoration:none;color:inherit;font-size:inherit;transition:opacity .2s ease, color .2s ease}
a.hover-opacity:hover{opacity:.5}
a.hover-color:hover{color:#344830}
a.underline{border-bottom:1px solid}
p a:hover{opacity:.5}
li{list-style:none;}
img{width:100%;display:block}

/* form */
::-webkit-input-placeholder{color:#000}
:-moz-placeholder{color:#000;opacity:1}
::-moz-placeholder{color:#000;opacity:1}
:-ms-input-placeholder{color:#000}
::-ms-input-placeholder{color:#000}
input[type="submit"]{border:0;appearance:none;webkit-appearance:none;border-radius:0;}
input[type="text"], input[type="number"], input[type="email"], input[type="tel"], input[type="password"]{border:0;border-top:1px solid #000;background:transparent;font-weight:normal;appearance:none;webkit-appearance:none;border-radius:0;line-height:inherit;width:100%;padding:10px 0;margin-bottom:5px}
.wrong input{border-color:red}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill{background-color:transparent}
textarea{border:none;border-bottom:1px solid #000;border-top:1px solid #000;border-radius:0;height:300px;resize:none;width:100%;background:transparent;font-weight:normal;padding:10px 0;margin-bottom:5px;display:block}
.wrong textarea{border-color:red}

.left{float:left}
.right{float:right}
.fs-s{font-size:14px;line-height:18px}
.fs-l{font-size:36px;line-height:42px}
.uppercase{text-transform:uppercase}
.underlined{width:fit-content;border-bottom:1px solid}
.display-block{display:block}
.c-white{color:#FFF}
.c-orange{color:#FF7E00}
.background-orange{background-color:#FF7E00}
.img{border-radius:20px;background-position:center;background-size:cover;background-repeat:no-repeat}
.btn{padding:5px;border:1px solid;border-radius:20px;text-align:center;width:140px;display:block}

.border-top{border-top:1px solid;padding-top:3px}

.position-relative{position:relative}
.position-sticky{position:sticky}

/* columns */
.grid{display:grid;grid-gap:36px;width:100%;padding:36px;grid-template-columns:repeat(7, 1fr)}
.grid .grid{padding:0}
.grid > *{grid-column-end:span 7}
.fit-content{height:fit-content}
.align-items-center{align-items:center}

.grid.g-2{grid-template-columns:repeat(2, 1fr)}
.grid.g-3{grid-template-columns:repeat(3, 1fr)}
.grid.g-4{grid-template-columns:repeat(4, 1fr)}
.grid.g-5{grid-template-columns:repeat(5, 1fr)}

.grid .c-1{grid-column-end:span 1}
.grid .c-2{grid-column-end:span 2}
.grid .c-3{grid-column-end:span 3}
.grid .c-4{grid-column-end:span 4}
.grid .c-5{grid-column-end:span 5}

.grid .p-2{grid-column-start:2}
.grid .p-4{grid-column-start:4}
.grid .p-5{grid-column-start:5}

/* .lazy-img */
.thumb{background-color:transparent;position:relative}
.aspect{opacity:0;visibility:hidden}
.lazy{opacity:0;visibility:hidden;transform:translateY(30px);-webkit-transform:translateY(30px);-moz-transform:translateY(30px);-ms-transform:translateY(30px);transition:opacity .3s ease, transform .3s ease}
.lazy.visible{opacity:1;visibility:visible;transform:translateY(0);-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);}
.lazy-img-wrapper{position:relative;overflow:hidden;background-color:#e9e9e9;transition:background .2s ease}
.lazy-img-wrapper .img{position:absolute;top:0;left:0;bottom:0;width:100%;opacity:0;transition:opacity .2s ease, transform .3s ease;background-position:center;background-size:cover;background-repeat:no-repeat;transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1)}
a:hover .lazy-img-wrapper .img{transform:scale(1.02);-webkit-transform:scale(1.02);-moz-transform:scale(1.02);-ms-transform:scale(1.02)}
.lazy-img-wrapper.loaded{background-color:transparent}
.lazy-img-wrapper.loaded .img{opacity:1}
.img.thumb a{position:absolute;top:0;left:0;right:0;bottom:0;z-index:2}
.img.thumb a .overlay{position:absolute;top:0;left:0;right:0;bottom:0;z-index:2;background-color:rgba(45, 45, 45, 0.6);opacity:0;padding:20px;color:#FFF}
.img.thumb a:hover .overlay{opacity:1}

/* .video */
.video{position:relative;overflow:hidden;background-color:#e9e9e9;transition:background .2s ease}
.video video{position:absolute;top:0;left:0;bottom:0;width:100%;opacity:0;transition:opacity .2s ease, transform .3s ease;background-position:center;background-size:cover;background-repeat:no-repeat;transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1)}
a:hover .video video{transform:scale(1.02);-webkit-transform:scale(1.02);-moz-transform:scale(1.02);-ms-transform:scale(1.02)}
.video.loaded{background-color:transparent}
.video.loaded video{opacity:1}

/* .slider */
.slider{width:100%;height:90vh}
.slider div.slide{position:relative;height:100%}
.slider div.slide .img{width:100%;height:100%;background-position:center;background-size:cover;background-repeat:no-repeat;overflow:hidden}
.slider div.slide.slide-video video{background:transparent;width:100%}
	section.full .slider .slide{margin:0 40px}
.slider-wrapper{position:relative}
.slider-wrapper .slider{height:100%;position:absolute;top:0;left:0}

/* .collapsable */
.collapsable{margin:40px 0}
.collapsable .grid{grid-row-gap:0}
.collapsable .collapsable-content{height:0;overflow:hidden;transition:height .3s cubic-bezier(.7, 0, .3, 1)}
.collapsable-multiple .collapsable{margin:0}
.collapsable-multiple .collapsable .btn-collapsable{width:100%;display:block;padding:10px 0}
.collapsable-multiple .collapsable .btn-collapsable .bullet{display:inline-block;margin-left:30px;transform:rotate(90deg);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg)}
.collapsable-multiple .collapsable .grid{margin-top:20px}
.collapsable > a{padding-right:40px;background-image:url('../imgs/collapsable_icon.svg');background-size:30px;background-position:100% 50%;background-repeat:no-repeat}

/* .list */
.list{margin:72px 0 36px}
    .list.no-margin-top{margin-top:0}
.list p{padding-bottom:10px}

/* .btn-swipe */
.btn-swipe{width:40px;height:40px;position:fixed;cursor:pointer;top:28px;left:40px;z-index:13;background-color:transparent;display:none}
.btn-swipe span{display:block;position:absolute;height:1px;width:40px;background:#000;opacity:1;left:0;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);transition:.25s ease-in-out}
.header-transparent .btn-swipe span{background:#FFF}
.btn-swipe span:nth-child(1){top:11px;-webkit-transform-origin:left center;-moz-transform-origin:left center;-o-transform-origin:left center;transform-origin:left center}
.btn-swipe span:nth-child(2){top:19px;-webkit-transform-origin:left center;-moz-transform-origin:left center;-o-transform-origin:left center;transform-origin:left center}
.btn-swipe span:nth-child(3){top:27px}
.swipe-opened  .btn-swipe span{background:#000}
.swipe-opened .btn-swipe span:nth-child(1){-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);top:6px;left:6px}
.swipe-opened .btn-swipe span:nth-child(2){opacity:0;visibility:hidden}
.swipe-opened .btn-swipe span:nth-child(3){-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);top:20px;left:1px}

.swipe{position:fixed;top:-100%;height:100%;left:0;width:100%;overflow:auto;z-index:12;background-color:#FFF;transition:top .6s cubic-bezier(.7, 0, .3, 1);padding:40px}
.swipe.grid{grid-row-gap:0;align-content:space-between}
.swipe-opened .swipe{top:0}
.swipe .selected{color:#885600}

/*. modal */
.modal{position:fixed;bottom:-100%;height:100%;left:0;width:100%;overflow:auto;z-index:13;background-color:#000;transition:bottom .6s cubic-bezier(.7, 0, .3, 1);padding:40px}
.modal.grid{align-content:space-between;grid-template-rows:20px 1fr 20px}
.modal .btn-modal{position:absolute;left:40px;top:28px;width:40px;height:40px;background-image:url('../imgs/close_white.svg');background-position:center;background-repeat:no-repeat;background-size:80%}
.modal .slider{height:auto;width:100%}
.modal .slider .slide .img{background-size:contain}
body[modal-opened="gallery-modal"] .modal.gallery-modal{bottom:0}

.master-wrapper{margin:0 auto;width:100%}
.master-wrapper > section{padding:36px;width:100%}

header.master{position:fixed;width:100%;top:0;height:100px;padding:36px;z-index:10;left:0;mix-blend-mode:difference}
header.master a.logo img{width:90%}
	.header-small header.master a.logo img{width:calc((100vw - 36px*8) / 7)}
header.master nav ul{display:table;width:100%}
header.master nav ul li:not(:last-child){margin-right:36px;float:left}

main{width:100%;height:100vh;position:relative;display:block;background-image:url('../imgs/main.jpg');background-position:center;background-size:cover;background-repeat:no-repeat}
main h1{position:absolute;left:0;top:50%;transform:translateY(-50%)}
main .btn{position:absolute;bottom:0;left:0}

section.about{height:100vh}
section.about .content{align-content:center;align-items:center}
section.about .content .img{height:100%}

section.tests-img{height:100vh;background-position:center;background-size:cover;background-repeat:no-repeat}

section .bullet{display:block}
section .bullet.top{padding-bottom:20px}
section .bullet.bottom{padding-top:40px}

footer.master{height:100vh;align-items:end}

/* .page-tests */

.page-tests .border-top{padding-top:10px}
.page-tests section.tests ul{margin-bottom:80px}


/* media-queries */
@media (max-width: 940px){
	body{font-size:14px;line-height:18px}
	.fs-l{font-size:24px;line-height:28px}
	
	.grid{grid-template-columns:repeat(1, 1fr);grid-column-start:1!important}
	.grid > *{grid-column-end:span 1!important}
	.grid.g-2{grid-template-columns:repeat(1, 1fr)}
	.grid.g-3{grid-template-columns:repeat(1, 1fr)}
	.grid.g-4{grid-template-columns:repeat(1, 1fr)}
	.grid.g-5{grid-template-columns:repeat(1, 1fr)}
	.grid .p-2{grid-column-start:1}
	.grid .p-4{grid-column-start:1}
	.grid .p-5{grid-column-start:1}
   
	header.master.grid{grid-template-columns:repeat(2, 1fr)}
	header.master a.logo img{width:120px}
	header.master nav{grid-column-start:2!important}
	header.master nav ul li{float:none!important}
	.header-small header.master a.logo img{width:120px}
	
	section.about .content .img{height:50vh}
	
	.collapsable > a{background-size:20px}
	.collapsable > a small{display:block}
}

@media (max-width: 720px){
    
}