/* PRELOADER */
	.main-preloader {
		position: fixed;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		text-align: center;
		background: #f9f9f9;
		overflow: hidden;
		z-index: 999999999;
    }

    .main-preloader .main-preloader-inner {
		position: absolute;
		top: 50%;
		width: 100%;
    }
    .main-preloader .preloader-percentage {
		margin: 0;
		color: #353535;
		font: 45px/45px "Roboto-Light", Arial, sans-serif;
		font-weight: 100;
    }

    .preloader-bar-outer {
    	position: fixed;
    	bottom: 5vh;
    	left: 0;
    	width: 100vw;
    	height: auto;
    }

    .preloader-bar {
    	width: 0;
    	height: 5px;
    	border-radius: 5px;
    	background: #f11e00;
    }

    .body-animation .preloader-bg {
		content: '';
		position: fixed;
		top: -110vh;
		left: 50%;
		width: 0vw;
		height: 0vw;
		background: transparent;
		border: 100vw solid #f9f9f9;
		border-radius: 50%;
		transform: translate(-50%, -50%);
		opacity: 0;
		animation: preloader-fade 1s linear;
		pointer-events: none;
		z-index: 9999;
	}

	@keyframes preloader-fade {
		0% { top: 50%; width: 200vw; height: 200vw; border: 100vw solid #f9f9f9; opacity: 1; }
		100% { top: 50%; width: 315vw; height: 315vw; border: 100vw solid #f9f9f9; opacity: 1; }
	}
/* /PRELOADER */

/* DOTS-MENU */
	#dot-menu {
		position: fixed;
		top: 20vh;
		right: 60px;
		z-index: 999;
	}

	#dot-menu > ul { margin: 0; }

	.body-animation #dot-menu ul li { transform: scale(0); }

	#dot-menu .section-dots ul:nth-child(1) li a {
		display: block;
		position: relative;
		margin-top: 20px;
		padding: 0px;
		width: 28px;
		min-height: 28px;
	}

	#dot-menu .section-dots ul:nth-child(1) li a::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 28px;
		height: 28px;
		border: 1px solid transparent;
		border-radius: 50%;
	}

	#dot-menu.black-dots .section-dots.active-dots ul:nth-child(1) li a::before { border-color: #000; }
	#dot-menu.white-dots .section-dots.active-dots ul:nth-child(1) li a::before { border-color: #fff; }

	#dot-menu .section-dots ul:nth-child(1) li a::after {
		content: '';
		position: absolute;
		top: 50%;
		left: 50%;
		width: 17px;
		height: 17px;
		border-radius: 50%;
		-webkit-transform: translate(-50%, -50%);
		   -moz-transform: translate(-50%, -50%);
		    -ms-transform: translate(-50%, -50%);
		     -o-transform: translate(-50%, -50%);
		        transform: translate(-50%, -50%);
	}

	#dot-menu.black-dots .section-dots ul:nth-child(1) li a::after { background: #000; }
	#dot-menu.white-dots .section-dots ul:nth-child(1) li a::after { background: #fff; }

	#dot-menu .section-dots.active-dots ul:nth-child(2) li a {
		display: block;
		position: relative;
		margin: 25px auto;
		width: 28px;
		height: 10px;
	}

	#dot-menu .section-dots.active-dots ul:nth-child(2) li a::before {
		content: '';
		position: absolute;
		left: 50%;
		top: 0;
		width: 10px;
		height: 10px;
		border-radius: 50%;
		transform: translate(-50%, 0);
	}

	#dot-menu.black-dots .section-dots.active-dots ul:nth-child(2) li a::before { border: 1px solid #000; }
	#dot-menu.white-dots .section-dots.active-dots ul:nth-child(2) li a::before { border: 1px solid #fff; }

	#dot-menu.black-dots .section-dots.active-dots ul:nth-child(2) li.dot-visited a::before,
	#dot-menu.black-dots .section-dots.active-dots ul:nth-child(2) li.active a::before { background: #000; }
	#dot-menu.white-dots .section-dots.active-dots ul:nth-child(2) li.dot-visited a::before,
	#dot-menu.white-dots .section-dots.active-dots ul:nth-child(2) li.active a::before { background: #fff; }
/* DOTS-MENU */

/* COMMON */
	#top {
		position: absolute;
		top: 0;
		left: 0;
		width: 0;
		height: 0;
		opacity: 0;
		margin: 0;
		padding: 0;
		pointer-events: none;
	}

	#anchor-top {
		display: none;
		position: fixed;
		bottom: 10vh;
		right: 50px;
		width: 50px;
		height: 50px;
		border-radius: 50%;
		background: url('../img/top-grey.png') no-repeat 50%/contain;
		z-index: 999;
	}

	/*
	.black-top { background: url('../img/top-black.png') no-repeat 50%/contain; }
	.white-top { background: url('../img/top-white.png') no-repeat 50%/contain; }
	*/

	.figure-mob { display: none; }

	.anchor {
		position: absolute;
		top: 0;
		left: 0;
		width: 0;
		height: 0;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}


	.overflow { overflow: hidden; }

	body {
		background: #f9f9f9;
		-ms-overflow-style: none;
		overflow: -moz-scrollbars-none;
	}

	body::-webkit-scrollbar { display: none; width: 0; }

	section {
		position: fixed !important;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		padding: 0 60px;
		z-index: 0;
	}

	section.fp-completely { opacity: 1; z-index: 1; }

	article {
		position: relative;
		width: 100%;
		height: 100%;
	}

	.section-1 { background: url('../img/bg-section-1.jpg') no-repeat 50%/cover; }
	.section-2 { background: url('../img/bg-section-2.jpg') no-repeat 50%/cover; }
	.section-3 { background: url('../img/bg-section-3.jpg') no-repeat 50%/cover; }
	.section-4 { background: url('../img/bg-section-4.jpg') no-repeat 50%/cover; }
	.section-5 { background: url('../img/bg-section-5.jpg') no-repeat 50%/cover; }
	.section-6 { background: url('../img/bg-section-6.jpg') no-repeat 50%/cover; }

	.container {
		position: relative;
		height: 100%;
	}

	.container > div {
		position: absolute;
		top: 50%;
		left: 0;
		padding-left: 40px;
		transform: translate(0, -50%);
		z-index: 10;
	}

	video {
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: 50%;
		background: #000;
	}

	section .title-white { margin-bottom: 50px; }

	section .title-white h2 { position: relative; overflow: hidden; }

	section h2 span {
		position: relative;
		top: 45px;
		color: #353535;
		font: 45px/45px "Roboto-Bold", Verdana, sans-serif;
	}

	section p,
	section a {
		display: inline-block;
		margin-bottom: 15px;
		color: #231f20;
		font: 18px/20px "Roboto-Light", Verdana, sans-serif;
		text-decoration: none;
	}

	section p b { font-family: "Roboto-Bold", Verdana, sans-serif; }

	section small p {
		color: #231f20;
		font: 12px/12px "Roboto-Light", Verdana, sans-serif;
	}

	figure {
		position: absolute;
		top: 50%;
		right: 5vw;
		transform: translate(0, -50%);
	}

	.object { position: relative; }

	.object img { position: absolute; }

	figure .shadow {
		position: absolute;
		bottom: 0;
		left: 50%;
		width: 100%;
		height: 70px;
		object-fit: contain;
		object-position: 50% 50%;
		transform: translate(-50%, 0);
	}

	figure h3 {
		position: absolute;
		bottom: 20vh;
		left: 25px;
		overflow: hidden;
		z-index: 1;
	}

	figure h3 span {
		position: relative;
		top: 32px;
		color: #353535;
		font: 32px/32px "Roboto-Bold", Verdana, sans-serif;
	}
/* /COMMON */

/* HEADER */
	header {
		position: fixed;
		top: 0;
		left: 0;
		padding: 45px 60px 0;
		width: 100%;
		z-index: 10;
		opacity: 0;
	}

	.header__black.active { opacity: 1; }
	.header__white.active { opacity: 1; }

	header .logo { display: inline-block; transform: translate(0, -85px); }

	header .social { float: right; }

	header .social li { display: inline-block; margin-left: 50px; }

	header .social li a { display: inline-block; vertical-align: top; }

	header .social li a i { font-size: 30px; }

	.header__black.active .social li a i { color: #000; }
	.header__white.active .social li a i { color: #fff; }
/* /HEADER */

/* SECTION-1 */
	.kv-mob { display: none; }

	.title-block {
		position: absolute;
		top: 50%;
		left: 0;
		transform: translate(0, -50%);
		z-index: 2;
	}

	.title-block p {
		display: block;
		margin: 0;
		padding-bottom: 2px;
		font: 100 32px/32px "Roboto-Bold", Verdana, sans-serif;
		overflow-y: hidden;
	}

	.title-block p span { display: block; transform: translate(0, 32px); }

	.section-1 .kv-movie {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 560px;
		transform: translate(-50%, -50%) scale(0);
		overflow: hidden;
		z-index: 1;
	}

	.kv-movie .letter {
		display: inline-block;
		position: relative;
		font-size: 0;
		vertical-align: bottom;
	}

	.kv-movie .letter-m { margin-bottom: 40px; margin-right: 40px; }

	.kv-movie .letter-m span {
		position: absolute;
		bottom: -2px;
		width: 0px;
		height: 0%;
		border: 18px solid #fff;
		border-radius: 50px;
	}

	.kv-movie .letter-m span::before {
		content: '';
		position: absolute;
		top: -19px;
		left: -17.5px;
		width: 0;
		height: 0;
		border: 17.5px solid #231f20;
		border-radius: 50px;
	}

	.kv-movie .letter-m span:nth-of-type(1) { left: 0; }
	.kv-movie .letter-m span:nth-of-type(2) { left: 0; right: 0; margin: 0 auto; }
	.kv-movie .letter-m span:nth-of-type(3) { right: 0; }

	.letter-o {
		margin-bottom: 40px;
		width: 232px;
		height: 232px;
	}

	.letter-o span {
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		width: 100%;
		height: 100%;
		border: 35px solid #231f20;
		border-radius: 50%;
		transform: translate(-50%, -50%);
	}

	.kv-movie .letter-v { margin-right: 40px; }

	.kv-movie .letter-v span {
		position: absolute;
		top: -5px;
		width: 0px;
		height: 50%;
		border: 19px solid #fff;
		border-radius: 50px;
	}

	.kv-movie .letter-v span::before {
		content: '';
		position: absolute;
		bottom: -21px;
		left: -18px;
		width: 0;
		height: 0;
		border: 18px solid #231f20;
		border-radius: 50px;
	}

	.kv-movie .letter-v span:nth-of-type(1) { left: 15px; transform: rotate(-25deg); }
	.kv-movie .letter-v span:nth-of-type(2) { right: 15px; transform: rotate(25deg); }
	
	.kv-movie .letter:nth-child(4) { margin-right: 35px; }

	.kv-movie .letter:nth-child(4) img { display: block; }

	.section-1 .arrow-bottom {
		position: absolute;
		bottom: 0;
		left: 50%;
		margin: 0;
		height: 150px;
		transform: translate(-50%, 0%);
		overflow: hidden;
	}

	.section-1 .arrow-bottom img { transform: translate(0, -150%); height: 90px; }

	.stick { position: absolute; z-index: 1; }

	.section-1 .stick-1 { top: -440px; left: 11vw; }
	.section-1 .stick-2 { top: -596px; left: 17vw; }
	.section-1 .stick-3 { bottom: -240px; left: 9vw; }
	.section-1 .stick-4 { top: -240px; right: 23vw; z-index: 0; }
	.section-1 .stick-5 { top: -297px; right: 12vw; }
	.section-1 .stick-6 { bottom: -478px; right: 24vw; }
/* /SECTION-1 */

/* SECTION-2 */
	.section-2 small { position: absolute; top: 50vh; left: 0; }

	.section-2 figure { width: 637px; height: 802px; }

	.section-2 .object img:nth-child(1) { top: 0; left: 0; }
	.section-2 .object img:nth-child(2) { top: 0; left: 0; transform-origin: 46% 50%; }
/* /SECTION-2 */

/* SECTION-3 */
	.stick-mob { display: none; }
	.section-3 .stick { bottom: -100px; right: -50px; }

	.section-3 figure { width: 637px; height: 822px; }
/* /SECTION-3 */

/* SECTION-4 */
	.section-4 figure { width: 637px; height: 784px; }

	.section-4 .stick { bottom: -60px; left: 55px; }
/* /SECTION-4 */

/* SECTION-5 */
	.section-5 figure { width: 637px; height: 825px; }

	.section-5 .stick { bottom: -280px; left: 25%; }
/* /SECTION-5 */

/* SECTION-6 */
	.section-6 figure { width: 609px; height: 642px; }

	.section-6 .object { width: 100%; height: 100%; }

	.section-6 .object span {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 250px;
		height: 250px;
		background: rgba(0, 0, 0, 0.3);
		border-radius: 50%;
		transform: scale(1.5);
	}

	#lens { position: absolute; top: 0; left: 0; }
	
	.body-animation section.fp-completely.section-6 .object.object-brain img:nth-child(2) { z-index: 0; }
/* /SECTION-6 */

/* CASES */
	.case-block {
		padding: 0 60px;
		background-color: #999;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 50%;
	}

	.active-chapter.animation-leave { z-index: 1; }

	.case-01 { background-image: url("../img/cases/chapter-1/01.jpg"); }
	.case-02 { background-image: url("../img/cases/chapter-1/02.jpg"); }
	.case-03 { background-image: url("../img/cases/chapter-1/03.jpg"); }
	.case-04 { background-image: url("../img/cases/chapter-1/04.jpg"); }
	.case-05 { background-image: url("../img/cases/chapter-1/05.jpg"); }
	.case-06 { background-image: url("../img/cases/chapter-1/06.jpg"); }

	.case-07 { background-image: url("../img/cases/chapter-2/01.jpg"); }
	.case-08 { background-image: url("../img/cases/chapter-2/02.jpg"); }
	.case-09 { background-image: url("../img/cases/chapter-2/03.jpg"); }
	.case-10 { background-image: url("../img/cases/chapter-2/04.jpg"); }
	.case-11 { background-image: url("../img/cases/chapter-2/05.jpg"); }
	.case-12 { background-image: url("../img/cases/chapter-2/06.jpg"); }
	
	.case-13 { background-image: url("../img/cases/chapter-3/01.jpg"); }
	.case-14 { background-image: url("../img/cases/chapter-3/02.jpg"); }
	.case-15 { background-image: url("../img/cases/chapter-3/03.jpg"); }
	.case-16 { background-image: url("../img/cases/chapter-3/04.jpg?v=2"); }
	.case-17 { background-image: url("../img/cases/chapter-3/05.jpg"); }
	.case-18 { background-image: url("../img/cases/chapter-3/06.jpg"); }

	.case-block__wrapper {
		position: relative;
		width: 100%;
		height: 100%;
	}

	.case-block .case-text {
		position: absolute;
		top: 50%;
		left: 0px;
		width: 550px;
		transform: translate(0, -50%);
	}

	.case-text .title-case {
		position: relative;
		margin-bottom: 40px;
		padding-bottom: 20px;
	}

	.case-text .title-case h3 { position: relative; overflow: hidden; }

	.case-text .title-case h3 span {
		position: relative;
		top: 25px;
		color: #fff;
		font: 22px/22px "Roboto-Regular", Verdana, sans-serif;
	}

	.case-text .title-case .underline {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 0;
		height: 5px;
		background: #fff;
		border-radius: 5px;
	}

	.case-text .title-name { margin-bottom: 40px; }

	.case-text h2 { margin: 0; }

	.case-text h2 span {
		top: 45px;
		color: #fff;
		font: 45px/45px "Roboto-Bold", Verdana, sans-serif;
	}

	.case-text h4 {
		position: relative;
		top: 50px;
		opacity: 0;
		color: #fff;
		font: 22px/22px "Roboto-Light", Verdana, sans-serif;
	}

	.case-text p {
		position: relative;
		top: 50px;
		color: #fff;
		font: 18px/20px "Roboto-Light", Verdana, sans-serif;
		opacity: 0;
	}

	.case-text ul { margin-bottom: 30px; }

	.case-text ul li {
		position: relative;
		top: 50px;
		margin-bottom: 15px;
		padding-left: 35px;
		color: #fff;
		font: 18px/20px "Roboto-Light", Verdana, sans-serif;
		opacity: 0;
	}

	.case-text ul li::before {
		content: '';
		position: absolute;
		top: 5px;
		left: 0;
		width: 10px;
		height: 10px;
		background: #fff;
		border-radius: 50%;
	}

	.case-text small {
		position: relative;
		top: 100px;
		color: #fff;
		font: 12px/12px "Roboto-Light", Verdana, sans-serif;
		opacity: 0;
	}
/* /CASES */

/* CONTACTS */
	.contacts { background: url('../img/bg-contacts.jpg') no-repeat 50%/cover; }

	.contacts figure { width: 548px; height: 489px; }

	.contacts .heart-zipp {
		position: absolute;
		top: 105px;
		left: -25px;
		width: 100%;
		clip: rect(auto 0px auto auto);
		overflow-x: hidden;
	}

	.contacts .transparent-block {
		position: absolute;
		top: 0;
		left: 0;
		width: 500px;
		height: 250px;
		z-index: 100;
	}

	.body-animation section.contacts.fp-completely .object .heart-zipp img {
		display: block;
		position: relative;
		animation: none;
	}

	.contacts .stick-1 { top: 100%; right: 11vw; }
	.contacts .stick-2 { bottom: -100%; left: 0px; }
/* /CONTACTS */


.section-25 p a {
	margin-bottom: 0px;
	text-decoration: underline;
}


.section-25 .arrow-bottom {
		position: absolute;
		bottom: 10px;
		left: 50%;
		margin: 0;
		height: 150px;
		transform: translate(-50%, 0%) rotate(180deg);
		overflow: hidden;
	}

	.section-25 .arrow-bottom img { transform: translate(0, -150%); height: 90px; }