/* @import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700&subset=cyrillic'); */
@import url('https://fonts.googleapis.com/css?family=Comfortaa:700');

* {margin:0; padding:0; font-family: 'Open Sans Condensed',Arial,sans-serif;  box-sizing:border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; line-height:110%;}
html {min-height:100%; height:100%;}
body {color:#333333; width:100%; height:100%; min-width:320px; font-size:16px; background-color:#fff;}

* {outline: none;}	
a {color:#333333; outline:none; text-decoration:none;}
a:hover {}
img {border:none; max-width:100%;}
input {vertical-align: middle;}
h1, h2, h3, h4, h5, h6 {font-weight:normal;}
textarea:focus, input:focus{outline: none;}
input::-webkit-input-placeholder {opacity:0.8;}
input:-moz-placeholder {opacity:0.8;}
input::-moz-placeholder {opacity:0.8;}
input:-ms-input-placeholder {opacity:0.8;}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}
input[type='number'] {
    -moz-appearance:textfield;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
	select:focus, textarea:focus, input:focus {
        font-size: 16px;
    }
}

textarea::-webkit-input-placeholder {opacity:0.8;}
textarea:-moz-placeholder {opacity:0.8;}
textarea::-moz-placeholder {opacity:0.8;}
textarea:-ms-input-placeholder {opacity:0.8;}

.info {cursor:help; color: #9087a8;}

.underline {text-decoration:underline;}
.underline:hover {text-decoration:none;}
.link {color:#3c92ca; transition: color 0.3s linear 0s;}
.link:hover {color:#151515;}

/* icon */
.icon {display:inline-block; fill: currentColor; width: 1em; height: 1em;}
svg use {pointer-events: none;}
.icon--logo {width:4.173274351055838em;}
.icon--basket {width:0.7188em;}

.fw--300 {font-weight:300;}

.clear {clear:both;}

.upper {text-transform:uppercase;}

.hider {overflow:hidden;}

.link {color:#00aeff; transition: color 0.3s linear 0s;}
.link:hover {color:#151515;}

.mt-15 {margin-top:15px;}
/* wrapper */
.wrapper {overflow:hidden; min-height:100%;}
.main {padding-bottom:30px;}
.main--inner {}
	@media (max-width: 767px) {   /* 320 */
		.main--inner {}
	}

.h2 {font-size:44px; text-align:center; padding-bottom:32px;}
	@media (max-width: 768px) {
		.h2 {font-size:34px; padding-bottom:22px;}
	}
	
/* wrap *************************************************************/	
.wrap {max-width:960px; margin:0 auto; min-height:100%; padding-left:30px; padding-right:30px;}
	@media (max-width: 939px) {   /* 768 */
		.wrap {padding-left:20px; padding-right:20px;}
	}
	@media (max-width: 767px) {   /* 320 */
		.wrap {padding-left:20px; padding-right:20px;}
	}

.wrap--inner {padding-top:50px;}

/* btn *************************************************************/	
.btn-blue {display:flex; flex-direction:column; align-items:center; justify-content:center; background-color:#00aeff; font-size:20px; color:#fff; text-align:center; padding:5px 22px; border:none; font-weight:300; transition:background 0.3s linear 0s; cursor:pointer; min-height:60px; text-transform:uppercase;}
.btn-blue:hover {background-color:#009ee7;}
.btn-blue s {font-size:16px; text-decoration:none; display:block;}

.btn-blue.btn--loading {color:transparent; cursor:default; position:relative;}
.btn-blue.btn--loading:before {content:""; width:20px; height:20px; display:block; border:2px solid transparent; border-top:2px solid #fff; position:absolute; top:50%; left:50%; margin:-12px 0 0 -12px; border-radius:50%; animation-name: spin; animation-duration: 900ms; animation-iteration-count: infinite; animation-timing-function: linear;}
@keyframes spin {
    from { transform:rotate(0deg);   }
    to   { transform:rotate(360deg); }
}
	@media (max-width: 767px) {   /* 320 */
		.btn-blue {padding:5px 10px; font-size:26px;}
	}

/* hide  *************************************************************/
	.hide-1000  {display:none;}
	
	@media (max-width: 999px) {   /* 768 */
		.hide-768  {display:none;}
	}
	@media (max-width: 767px) {   /* 320 */
		.hide-320  {display:none;}
	}

/* header *************************************************************/
.header {height:60px; background-color:#f9f9f9; position:fixed; z-index:11; top:0; left:0; width:100%; min-width:320px; box-shadow:0 0 10px rgba(0,0,0,0.2);}
.header-sizer {height:60px;}
.header .wrap {position:relative;}

.header__logo {position:absolute; top:0px; left:30px; color:#000000; transition:color 0.3s linear 0s;}
.header__mid {line-height:20px; display:inline-block; margin-top:13px;}
.header__logo img {vertical-align:middle;}
.header__logo:hover {color:#00aeff;}
.header__logo .header__dop {font-size:16px; color:#747474; transition:color 0.3s linear 0s; position:relative; top:-5px;}
.header__logo:hover .header__dop {color:#00aeff;}

.header__menu {font-size:0; position:absolute; right:30px; top:15px;}
.header__menu a {vertical-align:top; display:inline-block; font-size:24px; font-weight:300; transition:color 0.3s linear 0s; line-height:30px ;}
.header__menu a:hover, 
.header__menu a.selected {color:#00aeff;}
.header__menu s {display:inline-block; text-decoration:none; font-size:24px; margin:4px 14px 0 14px;}

.header__show-mob-menu {display:none;}
.header__hide-mob-menu {display:none;}

	@media (max-width: 939px) {   /* 768 */
		.header__logo {left:20px;}
	}
	@media (max-width: 767px) {   /* 320 */
		.header__logo {left:20px;}
	}
	@media (max-width: 767px) {   /* 320 */
		
		.header__show-mob-menu {display:block; font-size:30px; color:#333333; height:50px; position:absolute; top:0; right:0; line-height:50px; width:50px; text-align:center; cursor:pointer; padding-top:5px; transition:color 0.3s linear 0s;}
		.header__show-mob-menu:hover {color:#9187a9;}
		
		.header__mob-menu {position:fixed; top:-100%; left:0; height:100%; width:100%; z-index:99; background-color:#fff; overflow-y:auto; font-size:0; transition: top 0.5s ease-in-out 0s;}
		.header__mob-menu.header__mob-menu--show {top:0;}
		.header__mob-menu:before {display:inline-block; height:100%; vertical-align:middle; content:"";}
		.header__mob-menu__mid {display:inline-block; width:100%; vertical-align:middle;}
		
		.header__menu {position:static;}
		.header__menu a {display:block; font-size:40px; line-height:50px; text-align:center; padding:10px 0;}
		.header__menu s {display:none;}
		
		.header__search {position:relative; right:0; bottom:0; margin:15px auto 0 auto; width:220px;}
		
		.header__hide-mob-menu {display:block; position:absolute; top:0; right:0; padding:10px; font-size:16px; color:#9187a9; cursor:pointer;}
	}

	
/* page *************************************************************/
.page p {font-size:18px; color:#4b4b4b; font-weight:300; line-height:120%;}
.page p + p {margin-top:6px;}
.page h2 {font-size:24px; margin:26px 0 10px 0; color:#4b4b4b;}
.page hr {border:none; height:1px; background-color:#c0c0c0; border:none; margin:15px 0;}
.page ul {margin:15px 0; padding-left:20px;}
.page ul li + li {margin-top:10px;}
.page a {color:#9087a8; cursor:pointer; text-decoration:underline;}
.page a:hover {text-decoration:none;}

/* loader  ************************************** */
.loader {height:80px; margin-top:20px; display:block; vertical-align:top; position:relative; color:transparent; cursor:default; opacity:0;}
.loader:before {content:""; width:80px; height:80px; display:block; border:3px solid transparent; border-top:3px solid #978fad; position:absolute; top:50%; left:50%; margin:-40px 0 0 -40px; border-radius:50%; animation-name: spin; animation-duration: 900ms; animation-iteration-count: infinite; animation-timing-function: linear;}
.loader--show {opacity:1;}

.loader--fixed {position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(255,255,255,0.95); margin:0; z-index:999; display:none;}
.loader--fixed.loader--show {display:block;}

.loader--sm {width:30px; height:30px;}
.loader--sm:before {width:30px; height:30px; margin:-15px 0 0 -15px;}






/* portf  главная************************************** */		
.portf {padding:0px 0;}
.portf:after {content:""; display:block; clear:both;}
.portf__item {display:block; float:left; width:50%; position:relative; top:0px;}
.portf__item__desc {padding-bottom:16px;}
.portf__item__desc .h {font-size:34px; transition:color 0.3s linear 0s;}
.portf__item__desc .t {font-size:24px; color:#696969; transition:color 0.3s linear 0s;}
.portf__item:hover  .h   {color:#00aeff;}
.portf__item__img {overflow:hidden;}
.portf__item__img img {max-width: 100%; transform: translateZ(0px); transition: all 0.5s ease 0s;}
.portf__item:hover img {transform: scale(1.15) translateZ(0px);}

.portf__item:nth-child(odd) {top:-207px;}
.portf__item:nth-child(even) {margin-top:122px; text-align:right;}
.portf__item:nth-child(1) {top:0;}
.portf__item:nth-child(2) {margin-top:329px;}

	@media (max-width: 939px) {   /* 768 */
		.portf__item:nth-child(odd) {top:-22vw;}
		.portf__item:nth-child(even) {margin-top:13vw; text-align:right;}
		.portf__item:nth-child(1) {top:0;}
		.portf__item:nth-child(2) {margin-top:35vw;}
	}
	@media (max-width: 499px) {   /* 320 */
		.portf__item {position:static; width:auto; float:none; max-width:450px; margin:30px auto 0 auto;}
		.portf__item:nth-child(odd) {top:0;}
		.portf__item:nth-child(even) {margin:30px auto 0 auto; text-align:left;}
		.portf__item:nth-child(1) {top:0; margin-top:0;}
		.portf__item:nth-child(2) {margin:30px auto 0 auto;}
		
		
	}

/* work  ************************************** */	
.work {}
.work:after {display:block; content:""; clear:both;}
/*.work__images {width:47%; float:left;}
.work__decsr {width:48%; float:right;}*/
.work__images {padding-top:30px;}

.work-text {text-align:center;}	
.work-text h1 {font-size:40px; margin:0px 0 10px 0; color:#2fbdfe;}
.work-text h2 {font-size:30px; margin:30px 0 5px 0; color:#2fbdfe;}
.work-text p {font-size:24px; color:#1c1c1c; font-weight:300; line-height:120%;}
.work-text p + p {margin-top:10px;}
.work-text a {text-decoration:underline;}
.work-text a:hover {text-decoration:none;}
.work-text .signature {text-align:right; font-style:italic;}
.work__review {text-align:left;}
.work__review h2 {margin-bottom:10px;}

/* order  ************************************** */	
.work__images {padding-bottom:50px; font-size:0;}
.work__images__img {position:relative; display:inline-block; cursor:zoom-in; border:1px solid rgba(180, 179, 179, 0.5); box-shadow:0 0 10px rgba(0,0,0,0.05); overflow:hidden; border-radius:10px;} /*transition:border 0.4s linear 0s, box-shadow 0.4s linear 0s;*/
.work__images__img + .work__images__img {margin:50px 0 0 0;}
.work__images__img img {vertical-align:top;}
.work__images__img:hover {border:1px solid #2abbfe; box-shadow:0 0 15px rgba(0,0,0,0.1);}
/*
.work__images__img:after {content:""; display:block; position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(42,187,254,1) url("../images/zoom.svg") no-repeat 50% 50%; background-size:20% auto; opacity:0; transition:opacity 0.4s linear 0s;}
.work__images__img:hover:after {opacity:0.6;}	
*/
.work__decsr {text-align:left;}

@media (max-width: 599px) {   /* 768 */
	.work__images {width:auto; float:none; padding-top:40px;}
	.work__decsr {width:auto; float:none;}
}
	
.work-bg { background-attachment:fixed; background-position:50% 0px; background-size:cover; position:relative; box-shadow:inset 0 0 10px rgba(0,0,0,0.2); background-repeat:no-repeat;}
.work-bg .wrap {height:300px; line-height:290px;}
.work-bg .t {display:inline-block; vertical-align:middle; font-size:40px; color:#000000; position:relative; background-color:rgba(255,255,255,0.8); padding:0px 10px 5px 10px;}
.work-bg .t .name {font-size:64px; color:#29bafe;}
/*.work-bg:before {content:""; display:block; position:absolute; top:0; right:0; bottom:0; left:0; background-color:rgba(255,255,255,0.6);}*/
	@media (max-width: 999px) {   /* 768 */
		.work-bg .wrap {height:200px; line-height:190px;}
	}
	@media (max-width: 769px) {   /* 768 */
		.work-bg .wrap {}
		.work-bg .t {font-size:30px;}
		.work-bg .t .name {font-size:44px; display:block;}
		.work-bg .t .s {display:none;}
	}

.work-bg.work-bg--nobg {background:none; box-shadow:none;}
.work-bg.work-bg--nobg .wrap {height:auto; line-height:30px; padding-top:50px;}
.work-bg.work-bg--nobg .t {padding:0px;}
    @media (max-width: 999px) {   /* 768 */
		.work-bg .wrap {height:auto; line-height:30px; padding-top:30px;}
	}
    
.work-bg.work-bg--nobg + .wrap--inner {padding-top:20px;}
    
/* contacts  ************************************** */
.contacts {background-color:#f9f9f9; padding:40px 0 70px 0; border-bottom:1px solid #D0D0D0; box-shadow:0 0 10px rgba(0,0,0,0.1);}
.contacts:after {display:block; content:""; clear:both;}
.contacts__info {width:50%; float:left;}

.contacts__info h2 {font-size:34px;}
.contacts__info p {font-size:30px; padding-top:22px;}
.contacts__info p + p {}
.contacts__info p b {font-size:20px; display:block; padding-bottom:5px;}
.contacts__info a {transition:color 0.3s linear 0s;}
.contacts__info a:hover {color:#00aeff;}

.contacts--index {margin-top: -200px;}
    @media (max-width: 939px) {   /* 768 */
		.contacts--index {margin-top: -150px;}
	}
	@media (max-width: 499px) {   /* 320 */
        .contacts--index {margin-top: 0px;}
    }
	@media (max-width: 400px) {   /* 768 */
		.contacts {padding:20px 0 40px 0;}
	}
	
/* form  *************************************************************/
.contacts__form {width:50%; float:left;}
.contacts__form h2 {font-size:34px;}

.form {padding-top:30px;}
.form .row {}
.form .row + .row {margin-top:30px;}
.form .row:after {clear:both; content:''; display:block;}
.form .row .cell {width:calc(50% - 15px); float:left;}
.form .row .cell:first-child {margin-right:30px;}
.form input[type="text"],
.form input[type="email"] {height:50px; border:none; padding:0 15px; color:#797979; font-size:20px; width:100%;}
.form textarea {width:100%; height:130px; border:none; color:#797979; font-size:20px; padding:15px; resize:vertical;}
.form .row-button {text-align:center;}
.form .row-button .btn {width:calc(50% - 15px); padding:5px;}

.error {box-shadow: 0px 0px 1.5px 1px red;}
	@media (max-width: 800px) {
		
		.form .row + .row {margin-top:20px;}
		.form .row .cell {width:100%; float:none; margin-top:20px;}
		.form .row:first-child  .cell:first-child {margin-top:0px;}
		.form .row-button .btn {width:100%;}
	}
	
	@media (max-width: 700px) {   /* 768 */
		.contacts__info {width:auto; float:none; text-align:center;}
		.contacts__form {width:auto; float:none; padding-top:30px; margin-top:30px; border-top:1px solid #D0D0D0;}
		.contacts__form h2 {text-align:center;}
		.form {max-width:506px; width:100%; margin:0 auto;}
	}
	
/* footer *************************************************************/
.footer {height:50px; background-color:#f9f9f9; position:relative;}
.footer .wrap {display:flex; flex-direction:row; align-items:center; justify-content:center; font-size:18px; color:#333333; font-weight:300;}
.footer__copy {width:50%;}
.footer__tesla {width:50%; text-align:right;}
.footer__tesla a {transition:color 0.3s linear 0s;}
.footer__tesla a:hover {color: #009cff;}
	
	@media (max-width: 767px) {
		.footer .wrap {font-size:16px;}
	}
	@media (max-width: 450px) {
		.footer__tesla {font-size:0;}
		.footer__tesla a {font-size:16px;}
	}

/* popup  *************************************************************/
.body-hider {overflow:hidden;}
.popup_closer {position:fixed; z-index:999; top:0; right:0; left:0; bottom:0; text-align:center; background-color:rgba(0,0,0,0.6); font-size:0; padding:30px; overflow-y:auto; display:none;}
.popup_closer:before {display:inline-block; height:100%; vertical-align:middle; content:"";}


.popup {display:inline-block; vertical-align: middle; background-color:#f9f9f9; padding:30px; position:relative; font-size:24px;}
.popup__close {font-size:30px; color:#f9f9f9; position:absolute; top:0px; right:-50px; cursor:pointer; opacity:0.7; transition:opacity 0.3s linear 0s;}
.popup__close:hover {opacity:1;}
	@media (max-width: 500px) {
		.popup {position:fixed; z-index:999; top:0; right:0; left:0; bottom:0; padding-top:40px; overflow-y:auto;}
		.popup__close {font-size:20px; color:#151515; position:absolute; top:10px; right:10px;}
	}

#success .popup {padding:50px;}
#success h2 {padding-bottom:22px;}
	@media (max-width: 800px) {
		#success .popup {max-width:400px;}
	}
	@media (max-width: 500px) {
		#success .popup {max-width:999px; position:relative;}
		#success .popup {padding:40px 20px;}
	}
	
	
/* NEW */
/* btn *************************************************************/	
.btn {display:inline-block; background-color:#f2c40f; border:3px solid #f2c40f; font-size:20px; font-weight:bold; text-transform:uppercase; color:#fff; text-align:center; width:100%; max-width:260px; padding:15px 5px 17px 5px;  transition: background 0.3s linear 0s, color 0.3s linear 0s; cursor:pointer; position: relative; border-radius:30px;}
.btn:hover {background-color:#fff; color:#f2c40f;}

.btn--loading {color:transparent; background-color:#fff; cursor:default; position:relative;}
.btn--loading:hover {color:transparent; background-color:#fff;}
.btn--loading:before {content:""; width:20px; height:20px; display:block; border:2px solid transparent; border-top:2px solid #f2c40f; position:absolute; top:50%; left:50%; margin:-12px 0 0 -12px; border-radius:50%; animation-name: spin; animation-duration: 900ms; animation-iteration-count: infinite; animation-timing-function: linear;}


.btn.btn--border {background-color:#fff; color:#f2c40f;}
.btn.btn--border:hover {background-color:#f2c40f; color:#fff;}

.btn.btn--border.btn--loading {background-color:#f2c40f; color:transparent;}
.btn.btn--border.btn--loading.btn--loading:hover {color:transparent; background-color:#f2c40f;}
.btn.btn--border.btn--loading:before {border-top:2px solid #fff;}
	

	@keyframes spin {
		from { transform:rotate(0deg);   }
		to   { transform:rotate(360deg); }
	}

	@media (max-width: 1099px) {   /* 768 */
		.btn {border:2px solid #f2c40f; width:auto; max-width:999px; padding:15px 20px 17px 20px; font-size:16px;}
	}

	@media (max-width: 767px) {   /* 320 */
		.btn {}
	}
	
/* hide  *************************************************************/
	.hide-1000  {display:none;}
	
	@media (max-width: 999px) {   /* 768 */
		.hide-768  {display:none;}
	}
	@media (max-width: 767px) {   /* 320 */
		.hide-320  {display:none;}
	}
	
/* section  *************************************************************/	
section {}
section .wrap {padding-top:60px; padding-bottom:60px; max-width:1280px;}
	@media (max-width: 768px) {
		section .wrap {padding-top:30px; padding-bottom:30px;}
	}
	
section h2 {font-size:44px; text-align:center; padding-bottom:32px; margin-top:-19px;}
	@media (max-width: 768px) {
		section h2 {font-size:34px; padding-bottom:22px; margin-top:-13px;}
	}
	
.bg--grey {background-color:#f9f9f9;}

.block-1 {text-align:center;}
.block-1 img  {width:478px;}
.block-1 .btn-wrap  {padding-top:32px;}

/* iw  *************************************************************/
.iw {width:110px; height:110px; background-color:#f9f9f9; border-radius:50%; text-align:center; position:relative;}
.iw .icon {font-size:64px; vertical-align:middle; position:absolute; top:50%; left:50%; margin:-32px 0 0 -32px;}
	@media (max-width: 1099px) {
		.iw {width:90px; height:90px;}
		.iw .icon {font-size:50px; margin:-25px 0 0 -25px;}
	}
	
/* card  *************************************************************/
.block-2 .wrap {font-size:0;}
.card {display:inline-block; width:calc(33.333333% - 30px); background-color:#fff; vertical-align:top; text-align:center; margin:0 15px; padding:30px;}
.card__icon {margin:0 auto 25px auto;}
.card__h {font-size:34px;}
.card__p {font-size:22px; padding:10px 0 35px 0;}
.card__btn {}

.card__price {font-size:28px; padding:20px 0 10px 0;}
.card__price b {font-size:34px;}
.card__price b span {font-size:28px;}

	@media (max-width: 1099px) {
		.card {padding:20px 10px;}
	}
	@media (max-width: 899px) {
		.card {display:block; width:100%; margin:30px auto 0 auto; padding:20px; max-width:350px;}
		.card:first-child {margin-top:0;}
	}
	@media (max-width: 768px) {
		.card__icon {margin:0 auto 15px auto;}
		.card__h {font-size:28px;}
		.card__p {font-size:18px; padding:10px 0 25px 0;}
		
		.card__price {font-size:24px; padding:10px 0 5px 0;}
		.card__price b {font-size:30px;}
		.card__price b span {font-size:24px;}
	}
	
/* columns  *************************************************************/
.block-3 .wrap {}
.columns {}
.columns:after {display:block; clear:both; content:'';}
.columns__colmn {width:50%; float:left; padding:0 30px;}

	@media (max-width: 899px) {
		.columns__colmn {width:100%; float:none; padding:0 30px; max-width:500px; margin:0 auto;}
		.columns__colmn:first-child .icon-text:first-child {margin-top:0px;}
	}


/* icon-text  *************************************************************/
.icon-text {display:table; margin-top:30px;}
.icon-text:first-child {margin-top:0;}
.icon-text > * {display:table-cell; vertical-align:middle;}
.icon-text__i {width:110px;}
.icon-text__t {font-size:26px; padding:0 30px;}
	@media (max-width: 1099px) {
		.icon-text__t {padding:0 20px; font-size:22px;}
		.icon-text__i {width:90px;}
	}
	@media (max-width: 899px) {
		.icon-text:first-child {margin-top:30px;}
	}
	@media (max-width: 400px) {
		.icon-text {display:block; margin-top:30px;}
		.icon-text > * {display:block;}
		.icon-text__i {margin:0 auto;}
		.icon-text__t {font-size:26px; padding:5px 0 0 0; text-align:center;}
	}

/* block-4  *************************************************************/
.block-4 .wrap {text-align:center; font-size:0;}

	@media (max-width: 1099px) {
		.block-4 .card {width:calc(40% - 30px);}
	}
	@media (max-width: 899px) {
		.block-4 .card{display:inline-block; width:calc(40% - 30px); margin:0 15px; padding:20px; max-width:350px; min-width:350px;}
		.block-4 .card:first-child {margin-top:0;}
	}
	@media (max-width: 800px) {
		.block-4 .card {display:block; width:100%; margin:30px auto 0 auto; padding:20px; max-width:350px; min-width:350px;}
		.block-4 .card:first-child {margin-top:0;}
	}
	@media (max-width: 400px) {
		.block-4 .card {min-width:0px; width:100%;}
		
	}
	
/* block-5  *************************************************************/
.block-5 {}
.block-5 .icon-text__t {line-height:130%; padding-right:50px;}
.block-5 a {transition:color 0.3s linear 0s;}
.block-5 a:hover {color:#f2c40f;}
	@media (max-width: 1099px) {
		.block-5 .icon-text__t {padding-right:20px;}
	}
	@media (max-width: 800px) {
		.block-5 .icon-text__t {padding-right:0;}
	}
    
    
/* block-about  *************************************************************/    
.block-about {}   
.block-about .wrap {max-width:800px;}   
.block-about .icon-text {margin:0 auto;}   
.block-about .icon-text__i {}   
.block-about .icon-text__t {line-height:33px;} 
.block-about .hr {width:50%;}
.block-about .link {font-size:20px;}

    @media (max-width: 1099px) {
		.block-about .hr {width:auto;}  
	}
    
    
/* block-about  *************************************************************/    
.block-portfolio {padding-bottom:200px;}   
.block-portfolio .wrap {max-width: 960px;} 
    @media (max-width: 499px) {   /* 320 */
        .block-portfolio {padding-bottom:0px;} 
	}


/* scene  *************************************************************/
.scene-wrap {height:100vh; width:100%;}
.scene {position:absolute; top:0; left:0; right:0; bottom:0; overflow:hidden;}
.scene__bg {position:absolute; top:0%; left:0%; margin:-10% 0 0 -10%; height:130%; width:120%; background: url(../images/sky.jpg) no-repeat 50% 50%; background-size:cover; }
.scene__black {position:absolute; top:0; left:0; right:0; bottom:0; background-color:rgba(0,0,0,0.5); z-index:1;}

.scene__mountains {position:absolute; top:0%; left:0%; margin:0% 0 0 -10%; height:100%; width:200%; background: url(../images/mountains.png) repeat-x 50% 100%; background-size:auto 20%; z-index:4; opacity:0.80;}

.scene__forest {position:absolute; top:0%; left:0%; margin:10% 0 0 -10%; height:100%; width:200%; background: url(../images/forest.png) repeat-x 50% 100%; background-size:auto 20%; z-index:5;  border-bottom:100px solid #000;}

.scene__wood {position:absolute; top:0%; left:0%; margin:10% 0 0 10%; height:100%; width:100%; background: url(../images/bonsai-silhouette-3.png) no-repeat 100% 100%; background-size:auto 80%; z-index:5;}

.scene canvas {position:absolute; width:100%; height:100%; top:0; left:0; z-index:2;}

.scene__logo {position:absolute; top:0%; left:0%; height:100%; width:100%; font-size:40px; color:#fff; z-index:3; text-align:left;}

.scene__logo span {
  position:absolute; top:20px; left:20px;
}

    @media (max-width: 1024px) {
        .scene__mountains {margin:5% 0 0 -10%; background-size:auto 20%;}
		.scene__forest {display:none!important;} 
        .scene__wood {margin:10% 0 0 20%; background-size:auto 50%;}
	}
    @media (max-width: 899px) {
        .scene__wood {margin:10% 0 0 10%;background-size:auto 60%;}
	}
    @media (max-width: 767px) {
        .scene__mountains {margin:5% 0 0 -10%; background-size:auto 30%;}
        .scene__wood {display:none!important;}
	}


/* loader  *************************************************************/    
#loader {position:fixed; top:0; left:0; right:0; bottom:0; z-index:99999; text-align:center;}
.loader__bg {position:absolute; top:0; left:0; right:0; bottom:0; background-color:#111111; transition: opacity 0.5s linear 0s; opacity:1;}
#loader canvas {width:33%; max-width:300px; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%);}

.closeAnimation .loader__bg {opacity:0;}
.closeAnimation .loader__bg {opacity:0;}

    @media (max-width: 1099px) {
		#loader canvas {width:46%; max-width:300px;}  
	}
    @media (max-width: 768px) {
		#loader canvas {width:80%; max-width:300px;}  
	}
    
    
/* panel-btn  *************************************************************/
@media (max-width: 767px) {
    .panel-btn {
        cursor: pointer;
        height: 30px;
        position:absolute; 
        top:15px; 
        right:20px;
        width: 30px;
        z-index:101;
    }
    .panel-btn:hover .panel-btn__item {
        background-color: #009ee7;
    }
    .panel-btn:hover .panel-btn__item_first {
        top: 45%;
    }
    .panel-btn:hover .panel-btn__item_second {
        
    }
    .panel-btn:hover .panel-btn__item_third {
        top: 55%;
    }
    .panel-btn-wrap {
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
    }
    .panel-btn__item {
        background: #333333 none repeat scroll 0 0;
        height: 2px;
        left: 50%;
        margin: -1px 0 0 -15px;
        position: absolute;
        top: 50%;
        width: 30px;
    }
    .ie6-8 .panel-btn__item {
        display: none;
    }
    .panel-btn__item_first {
        margin-top: -9px;
        transform: rotate(0deg);
    }
    .panel-btn__item_second {
        opacity: 1;
    }
    .panel-btn__item_third {
        margin-top: 7px;
        transform: rotate(0deg);
    }
    .js-panel-btn_open .panel-btn__item {
        background: #333333 none repeat scroll 0 0;
    }
    .js-panel-btn_open .panel-btn__item_first {
        margin-top: -1px;
        transform: rotate(45deg);
    }
    .js-panel-btn_open .panel-btn__item_second {
        opacity: 0;
    }
    .js-panel-btn_open .panel-btn__item_third {
        margin-top: -1px;
        transform: rotate(-45deg);
    }
    .js-panel-btn_open.panel-btn:hover .panel-btn__item {background-color:#009ee7; top: 50%;}

    .panel-btn__item, .panel-page {
        transition: all 0.3s ease-in-out 0s;
    }
}


/* panel-btn  *************************************************************/
.logo {fill:#747474; height:24px; vertical-align:middle; position:relative; top:-4px;}
.logo > * {transition: all 0.5s ease-in-out 0s; position:relative; top:0px;}

.logo__t {}
.logo__e {}
.logo__s {}
.logo__l {}
.logo__a {}

.logo__s2 {}
.logo__t2 {}
.logo__u {}
.logo__d {}
.logo__i {}
.logo__o {}

.header__logo:hover .logo > * {fill:#00aeff;}