/****Krasnove Framework v.1.1 @06.06.2022****/
//Детали
html {min-height:100%; height: 100%;}
body {font-size:16px; color: @txt; .nunitoL; font-weight:300; margin:0; background:#F8F8F8; line-height:24px; height: 100%; -webkit-font-smoothing: antialiased; font-variant-numeric: lining-nums; -moz-font-feature-settings: "lnum"; -webkit-font-feature-settings: "lnum"; font-feature-settings: "lnum"; padding-top:160px;
	&.hold {overflow:hidden;} 
} 
.wrapper {.flex; flex-direction: column; position:relative; min-height:100%;}
.container_wrap {flex: 1 0 auto;}
footer {flex: 0 0 auto; margin-top:50px;}
* {box-sizing:border-box;}
p {margin: 10px 0;}
a{color:#202945; text-decoration: none;}
a:hover {color: #40B3E0; text-decoration: none;}
:focus {outline: none;}
img{border:0; max-width:100%; display:inline-block;}
table {border-collapse: collapse;}
h1, h2, h3, h4, h5, h6 {font-weight:normal; margin:0;}
audio, canvas, img, svg, video {max-width: 100%; height: auto; box-sizing: border-box;}
iframe {max-width:100%;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {-webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0;}
input[type=number]{-moz-appearance: textfield;}
.anchor {position:relative; top:-0;}
fieldset {padding:0;}
select {-moz-appearance: none;}
ul {padding:0; margin:0;}
fieldset {border:none;}
label {display:block; margin-bottom:5px; font-size:16px;}
.tooltip {display:none !important;}
.animated {-webkit-transition: @animate-speed !important; -moz-transition: @animate-speed; -o-transition: @animate-speed; transition: @animate-speed; animation-timing-function:ease-in-out;}
.animated-slow {-webkit-transition: @animate-speed-slow !important; -moz-transition: @animate-speed-slow; -o-transition: @animate-speed-slow; transition: @animate-speed-slow; animation-timing-function:ease-in-out;}
.sys-messages {text-align: left;}

//Цвета
@brand: #FF7E7C;
@brand-hover: #ff5553;
@txt: #202945;
@link: #583f91;
@hover: #583f91;
@border: #dedede;

//Скорость анимации
@animate-speed: all 200ms; 
@animate-speed-slow: all 500ms; 

.presentation {display: inline-block; padding-left: 30px; position: relative; margin-top: 20px; font-size: 18px;
	&::before {content:''; display: inline-block; width:25px; height:25px; background:url(../../../images/icons/pdf.svg) no-repeat center center; background-size:contain; position: absolute; left:0; top:-2px;}
}

@font-face {font-family: 'nunitoL'; src: url('../fonts/Nunito-Light.ttf') format('truetype');}
@font-face {font-family: 'nunitoR'; src: url('../fonts/Nunito-Regular.ttf') format('truetype');}
@font-face {font-family: 'nunitoM'; src: url('../fonts/Nunito-Medium.ttf') format('truetype');}
@font-face {font-family: 'nunitoB'; src: url('../fonts/Nunito-Bold.ttf') format('truetype');}
@font-face {font-family: 'MontserratL'; src: url('../fonts/Montserrat-Light.ttf') format('truetype');}
@font-face {font-family: 'MontserratR'; src: url('../fonts/Montserrat-Regular.ttf') format('truetype');}
@font-face {font-family: 'MontserratM'; src: url('../fonts/Montserrat-Medium.ttf') format('truetype');}
@font-face {font-family: 'MontserratB'; src: url('../fonts/Montserrat-Bold.ttf') format('truetype');}

.nunitoL {font-family: 'nunitoL';}
.nunitoR {font-family: 'nunitoR';}
.nunitoM {font-family: 'nunitoM';}
.nunitoB {font-family: 'nunitoB';}
.montserratL {font-family: 'MontserratL';}
.montserratR {font-family: 'MontserratR';}
.montserratM {font-family: 'MontserratM';}
.montserratB {font-family: 'MontserratB';}

.grecaptcha-badge {display:none !important;}

.upper {text-transform:uppercase;}
.underline {text-decoration:underline;}

//Миксины
.flex {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;}
.wrap {-webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; -o-flex-wrap: wrap; flex-wrap: wrap;}
.nowrap {-webkit-flex-wrap: nowrap; -moz-flex-wrap: nowrap; -ms-flex-wrap: nowrap; -o-flex-wrap: nowrap; flex-wrap: nowrap;}
.between {-webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between;}
.around {-webkit-justify-content: space-around; justify-content: space-around;}
.start {-webkit-justify-content: flex-start; justify-content: flex-start;}
.end {-webkit-justify-content: flex-end; justify-content: flex-end;}
.center {-webkit-justify-content: center; justify-content: center;}
.align-top {align-items:flex-start; align-content: flex-start;}
.align-center {align-items:center; align-content: center;}
.align-bottom {align-items:flex-end;}
.column {flex-direction: column;}
.stretch {align-items: stretch;}

.centered {width:100%; max-width:1280px; margin-left:auto; margin-right:auto;
	&.thinner {max-width:1170px;}
}

.align {text-align:center;}

.breadcrumbs {
	ul, ol {.flex; .start; .align-center; .wrap; padding-left: 0px; margin-left:0;
		li {list-style:none; padding-left: 0px;
			&::after, &::before {display: none;}
			&:nth-child(1) {display:none;}
			&:last-child a::after {display:none;}
			a {color:@txt;
				&:hover {color:@hover;}
				&::after {content:' / ';}
			}
		}
	}
}
b {.nunitoB; font-weight:normal;}


/*Swiper*/
.navi-parent {position: relative;
	.prev {background:url(../../../images/arrow-left.svg) no-repeat center center; background-size:contain; width:50px; height:50px; position:absolute; top:45%; left:-60px; cursor:pointer; z-index: 5;}
	.next {background:url(../../../images/arrow-right.svg) no-repeat center center; background-size:contain; width:50px; height:50px; position:absolute; top:45%; right:-60px; cursor:pointer; z-index: 5;}
}

.swiper-scrollbar {margin-top:30px;}

/**/


//Мобильная панель
.mob-panel {display:none;}

//Попапы
.overlay {position: fixed; height: 100%; width: 100%; background: rgba(0, 0, 0, 0.6); display: none; z-index: 100; top: 0; left: 0;
	.layout {height:100%;}
	.inner {padding: 50px; max-width: 490px; background: #1F262B; height: auto; border-radius: 5px; margin: 0 auto; position: relative; color:white; }
	.form {width:100%; max-width:630px;
		.formRow  {
			.rsform-block {width:49%;}
		}
	}
	h2 {margin-bottom: 40px; line-height: 50px;}
	button {width: 100%;}
	&.opened {top:0;}
	input {.align;}
	.data-info {line-height:28px;}
	.title {.nunitoB; font-size: 18px; margin-bottom:20px; text-transform: uppercase;}
	.form-item {margin-bottom:10px;
		label {text-transform: uppercase; font-size: 13px; margin-bottom:10px; letter-spacing:1px;}
		input {border-radius:5px; width:100%;}
		textarea {border-radius:5px; width:100%; height:140px;}
	}
	.rsform-block-name {width:100%;}
	.rsform-block-phone {width:100%;}
	.rsform-block-note {width:100%;}
	.politic {width:100%; font-size:14px; line-height:18px;}
	.rsform-block-send {width:100%; text-align:right;
		button {border:none;}
	}
	.rsform-block-source {display: none;}
}


/*==============КНОПКИ И ФОРМЫ==============*/


.rsfp_thankyou_popup_inner {.align;
	button {font-size:16px; margin-top:10px;}
}


//Кнопка открытия
.menu-btn {width: 20px; height: 30px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; z-index: 10;
	span {display: block; position: absolute; height: 4px; width: 100%; background:#2f3f4c; border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
		span:nth-child(1) {top:0px;}
		span:nth-child(2) {top:14px;}
		span:nth-child(3) {top:27px;}
		&.open {
			span:nth-child(1) {top: 10px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg);}
			span:nth-child(2) {opacity: 0; left: -60px;}
			span:nth-child(3) {top: 10px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg);}
			span {background:@brand;}
		}
}

//Кнопка закрытия
.close-left-menu, .close-btn {width: 30px; height: 24px; position: absolute; top:10px; right:10px; cursor: pointer; z-index: 10;
	span {display: block; position: absolute; height: 3px; width: 100%; background:@txt; border-radius: 9px; opacity: 1; left: 0; 
		&:nth-child(1) {top: 10px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg);}
		&:nth-child(2) {opacity: 0; left: -60px;}
		&:nth-child(3) {top: 10px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg);}
	}
}


//Инпуты и формы
input, textarea {.animated; color:@txt; border: 1px solid #e0e2e2; .nunitoR;
	&:hover {border-bottom:1px solid @brand;}
	&:focus {border-bottom:1px solid @brand;}
}


div.formBody {display: block; float: none;} 

input[type="text"], input[type="phone"], input[type="tel"], input[type="email"] {height:50px; line-height:50px; padding:0 20px; font-size: 16px; width:100%; max-width: 100%; background:white; border:1px solid #e7e7e7; text-align:left; border-radius:20px;}
select {height:50px; line-height:50px; padding:0 20px; .align; font-size: 16px; width:100%; max-width: 100%;color: #353535; border: 1px solid #e0e2e2; .nunitoB;}


.btn-brand {background:@brand; color:white; .nunitoM;
	&:hover {background:@brand-hover; color:white;}
}
.btn {-webkit-transition: .4s all ease; -o-transition: .4s all ease; transition: .4s all ease; font-size: 16px; line-height: 50px; text-align: center; border-radius: 50px; padding: 0px 20px; height: 50px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding-top: 0px; }
.btn {cursor:pointer;}

.btn {position: relative; overflow: hidden; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
.ink{display: block; position: absolute; background: rgba(255, 255, 255, 1.0); border-radius: 100%; -webkit-transform: scale(0); -moz-transform: scale(0); -o-transform: scale(0); transform: scale(0); z-index: 20; }

.animate {webkit-animation: ripple 2s linear infinite; -moz-animation: ripple 2s linear infinite; -ms-animation: ripple 2s linear infinite; -o-animation: ripple 2s linear infinite; animation: ripple 2s linear infinite; }
@keyframes ripple {  
	50% {opacity: 0; transform: scale(2.5); }
	100% {opacity: 0; transform: scale(2.5); }
}    


//Placeholders
@placeholder-txt-size: 16px;
::-webkit-input-placeholder {font-size:@placeholder-txt-size; color: @txt; .nunitoL; font-variant-numeric: lining-nums; -moz-font-feature-settings: "lnum"; -webkit-font-feature-settings: "lnum"; font-feature-settings: "lnum";}
::-webkit-textarea-placeholder {font-size:@placeholder-txt-size; color: @txt; .nunitoL; font-variant-numeric: lining-nums; -moz-font-feature-settings: "lnum"; -webkit-font-feature-settings: "lnum"; font-feature-settings: "lnum";}
::-moz-placeholder {font-size:@placeholder-txt-size; color: @txt; .nunitoL; font-variant-numeric: lining-nums; -moz-font-feature-settings: "lnum"; -webkit-font-feature-settings: "lnum"; font-feature-settings: "lnum";}
:-moz-placeholder {font-size:@placeholder-txt-size; color: @txt; .nunitoL; font-variant-numeric: lining-nums; -moz-font-feature-settings: "lnum"; -webkit-font-feature-settings: "lnum"; font-feature-settings: "lnum";}
:-ms-input-placeholder {font-size:@placeholder-txt-size; color: @txt; .nunitoL; font-variant-numeric: lining-nums; -moz-font-feature-settings: "lnum"; -webkit-font-feature-settings: "lnum"; font-feature-settings: "lnum";}


.menu-btn {width: 20px; height: 20px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: 0.5s ease-in-out; -moz-transition: 0.5s ease-in-out; -o-transition: 0.5s ease-in-out; transition: 0.5s ease-in-out; cursor: pointer; z-index: 10;}
.menu-btn span {display: block; position: absolute; height: 2px; width: 100%; background: #2f3f4c; border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: 0.25s ease-in-out; -moz-transition: 0.25s ease-in-out; -o-transition: 0.25s ease-in-out; transition: 0.25s ease-in-out;}
.menu-btn span:nth-child(1) {top: 3px;}
.menu-btn span:nth-child(2) {top: 10px;}
.menu-btn span:nth-child(3) {top: 17px;}
.menu-btn.open span:nth-child(1) {top: 10px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg);}
.menu-btn.open span:nth-child(2) {opacity: 0; left: -60px;}
.menu-btn.open span:nth-child(3) {top: 10px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg);}
.menu-btn.open span {background: #2f3f4c;}


/*--------------------------------DESKTOP------------------------------------------------*/

a {.animated;}

.container {max-width:1280px; width:100%; margin-left:auto; margin-right:auto;}
.mob-panel {display: none; background:#2f3f4c; box-shadow: rgba(149, 157, 165, 0.5) 0px 8px 24px;}

.shadow {box-shadow: 5px 5px 20px rgba(32, 41, 69, 0.1);}
.icon-shadow {box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.15);}

.round-icon {.icon-shadow; border-radius:50px; .flex; .center; .align-center; margin-right:20px; background: white; width: 40px; height: 40px; .animated; position: relative; top:0;
	&:hover {top:2px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);}
	img {display: block; height:20px; display: block;}
	&.email img {height:15px;}
}

header {position:fixed; top:0; left:0; width:100%; z-index:5; 
	.container {padding: 0px 20px 15px; border-radius: 0px 0px 20px 20px; background:white;
		.top {padding: 15px 0 5px; font-size: 14px; border-bottom: 1px solid #e2e2e2; margin-bottom: 10px; .flex; .between; .align-center;
			.logo {.flex; .start; .align-center;
				img {width:60px; display: block; margin-right:10px;}
				.text {display: block;
					.title {.montserratB; text-transform: uppercase; font-size: 21px; line-height: 21px; letter-spacing: 3px; margin-bottom:2px; display: block;}
					.desc {.montserratR; text-transform: uppercase; font-size: 12px; line-height: 12px; letter-spacing: 4.8px; display: block;}
				}
			}
			.right {.flex; .between; .align-center;
				.info {text-align: center; border-right:1px solid #E4E4E4; padding:0 10px;
					p {margin:3px 0;}
					p:nth-child(1) {font-size: 12px; line-height:12px;}
					p:nth-child(2) {font-size: 16px; line-height:16px;}
				}
				.contacts {margin-left:40px; .flex; .between; .align-center;
					.phone {position: relative; margin-right:15px; font-size: 18px; line-height: 18px;
						&::before {content: ''; display: block; position: absolute; width: 20px; height: 20px; left: -26px; top: 0px; background:url(../../../images/icons/phone.svg) no-repeat center center; background-size:contain;}
					}
					.phone-mobile {display: none;}
					.round-icon {margin-right:15px;}
				}
				.btn {}
				.menu-call {display: none;}
			}
		}
		.bottom {
			.mod-menu {.flex; .between; .align-center; flex-basis:100%; flex-shrink:1;
				li {list-style:none;
					a {.animated;}
					a:hover {color:@brand; text-decoration: none;}
					&.current {
						a {
							color:@brand; .nunitoB; position: relative; padding-left:15px;
							&::before {content: ''; position: absolute; left: 0px; top: 7px; background: #FF7E7C; width: 7px; height: 7px; border-radius: 50px;}
						}
					}
				}
			}
		}
	}
}


section {margin-top:50px;
	.form {margin-top:80px;}
}

h1 {font-size: 32px; line-height:40px; .montserratR; text-transform: uppercase;
	b {.montserratB;}
}

.title-block {margin-bottom:50px;
	.before-title {letter-spacing: 0.1em; text-transform: uppercase;}
	h2 {font-size: 32px; text-transform: uppercase; margin:5px 0; .montserratL; max-width: 600px; line-height: 36px;
		b {.montserratB;}
	}
	.under-title {}
	&.nomargin {margin-bottom:0;}
}

.inner-title {
	.title-block {margin-bottom:0px; background:white; padding:40px 20px; background:white; border-radius:20px; .shadow;}
}

.mainoffer {
	h1 {max-width:800px;}
	.container {.flex; .between; .stretch;}
	.left {.shadow; flex-basis:100%; flex-shrink:1; margin-right:20px; padding:40px 30px; background: white; border-radius:20px;
		.undertitle {margin-top:20px;
			span.rocket {display: inline-block; position: relative; padding-left:20px; margin-left: 7px;
				&::before {content: ''; position: absolute; left: 0px; top: 2px; background: url(../../../images/icons/rocket.svg) no-repeat center center; width: 16px; height: 21px;}
			}
			&.desktop {display: block;}
			&.mobile {display: none;}
		}
		ul {margin-top:20px; max-width:550px;
			li {list-style:none; position: relative; padding-left:25px; margin-bottom:15px;
				&::before {content: ''; position: absolute; left: 0px; top: 2px; background: url(../../../images/icons/star.svg) no-repeat center center; width: 19px; height: 18px;}
			}
		}
		.btn {margin-top:20px;}
	}
	.right {.shadow; flex-basis:440px; flex-shrink:0; background:#282828; color:white; padding:40px 30px; border-radius:20px;
		img {width:130px; float:left; margin-right:20px; border-radius:20px; display: block;}
		p {
			b {.nunitoR;}
		}
	}
}

.items {.flex; .between; .stretch; .wrap;
	&.col2 .item {width:49%;}
	&.col3 .item {width:31%;}
	&.col4 .item {width:24%;}
}

.comfort {
	.items {
		.item {.shadow; padding:40px 30px; border-radius:10px; background:white; position: relative;
			.title {.nunitoM; font-size: 21px; margin-bottom:20px;}
			p {}
			&.black {background:#282828; color:white;}
			&:first-child::before {content: ''; position: absolute; right: -70px; top: -30px; background: url(../../../images/icons/arrow.svg) no-repeat center center; background-size:contain; width: 104px; height: 16px;}
		}
	}
	.under-block {text-transform: uppercase; text-align: center; letter-spacing:1px; margin-top:50px;}
}

.white-wrap {background:white; padding:50px 0; margin-top:50px;
	&.martop0 {margin-top:0; padding:50px 0 0;
		section {margin-top:0px;}
	}
	section {margin-top:0px;}
}

.section-top {.flex; .between; .align-center;
	.title-block {width:49%; margin-bottom:0;}
	.quotes-block {width:49%;}
	.white-square {width:49%; background:white; border-radius:20px; padding:40px 20px;}
}

.quotes-block {.shadow; border-radius:10px; background-color:white; background-image:url(../../../images/icons/quotes.jpg); background-repeat:no-repeat; background-position:20px 20px; background-size:110px; padding:30px 30px;
	p {margin:0;}
	.face-signature {margin-top:20px;}
}

.face-signature {.flex; .start; .align-center;
	img {width:60px; border-radius:50px; margin-right:10px;}
	.text {
		p {margin:0;}
		p:nth-child(1) {font-size: 18px; .nunitoM;}
		p:nth-child(2) {color:#787878;}
	}
}

.more {text-align: center; margin-top:20px;
	p {}
	.btn {}
}

.portfolio {
	.portfolio-items {.flex; .between; .stretch; .wrap; margin-top:0px;
		.item {width:49%; margin-top:50px; background: white; padding: 40px 20px; border-radius: 20px; .shadow; .animated;
			&:hover {background: #202945; color: #fff;}
			.top-row {.flex; .between; .align-bottom; margin-bottom:10px;
				.title {.nunitoM; font-size: 21px;}
				.theme-n-year {padding-right:20px; font-size: 14px;}
			}
			img {display: block; border-radius:20px;}
			&.empty {padding:0; background:none; margin:0; box-shadow:none;}
		}
	}
}


.price {
	.price-listing {margin-top:80px;}
	.quotes-bottom-block {margin:50px auto 0; max-width:600px;}
}

.dopprice {
	.price-listing {margin-top:0; .stretch;}
	.price-listing .item .about p {text-transform: none;}
}

.price-listing {.flex; .between; .align-top;
	.item {background:white; border-radius:10px; padding:20px; .shadow; width:31%;
		&.optimal {background:#2F3F4C; color:white; margin-top:-40px; position: relative;
			&::before {content: ''; position: absolute; margin-left: auto; margin-right: auto; left: 0; right: 0; text-align: center; background: white; width: 32px; height: 32px; top:-20px; border-radius:50px;}
			&::after {content: ''; position: absolute; margin-left: auto; margin-right: auto; left: 0; right: 0; text-align: center; background: url(../../../images/icons/star.svg) no-repeat center center; background-size:contain; width: 18px; height: 18px; top: -13px;}
			.about {background:white; color:#202945;
				li::before {background: url(../../../images/icons/chbx-colored.svg) no-repeat center center;}
			}
			span::after {filter: brightness(300%);}
			.about-full {
				.row {border-bottom:1px solid white;}
				a {color:white; text-decoration: underline;
					&:hover {color:@brand;}
				}
			}
		}
		.top-row {text-align: center; text-transform: uppercase; font-size: 14px;}
		.budget {text-align: center; .nunitoB; font-size: 30px; line-height:30px; margin:5px 0 0;
			span {font-size: 24px;}
		}
		.short-desc {font-size: 14px; text-align: center;}
		.about {background:#2F3F4C; border-radius:10px; padding:20px; color:white; margin-top:20px;
			p {text-transform: uppercase; font-size: 14px;}
			ul {
				li {list-style: none; position: relative; padding-left:22px; margin-bottom:5px;
					&::before {content: ''; position: absolute; left: 0px; top: 3px; background: url(../../../images/icons/chbx-white.svg) no-repeat center center; background-size:contain; width: 18px; height: 18px;}
				}
			}
		}
		.showmore {text-align: center; margin-top:20px; cursor:pointer;
			span {position: relative;
				&::after {content: ''; position: absolute; right: -15px; top: 9px; background: url(../../../images/icons/arrow-down.svg) no-repeat center center; background-size:contain; width: 9px; height: 6px; .animated;}
			}
			&.open {
				span::after {transform: rotate(180deg);}
			}
		}
		.about-full {margin-top:20px; display: none;
			.row {padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid #2F3F4C;
				.question {font-size: 14px; text-transform: uppercase; margin-bottom:0; .nunitoR;}
				.answer {}
			}
			a {color:#40B3E0; .nunitoR;}
		}
	}
}

.price-opened .price-listing .item {
	.showmore {display: none;}
	.about-full {display: block;}
}

.form {.shadow; padding: 80px 40px; border-radius:20px; .flex; .between; .align-center; background: white;
	.left {text-align: center; width: 300px;
		img.face {display: block; border-radius:50px; margin:-130px auto 40px; border:10px solid white;}
		.info {
			p {margin:0;}
			p:nth-child(1) {font-size: 14px; line-height:14px; margin-bottom: 5px;}
			p:nth-child(2) {font-size: 18px; line-height:16px;}
		}
		.phone {display: block; .montserratB; font-size: 24px; margin-top:15px;}
		.underphone {}
		.mail {margin-top:30px; font-size: 18px; margin-bottom:10px; display: block; .nunitoR;}
		.messengers {.flex; .center; .align-center;
			a.round-icon {margin:0 5px;}
		}
	}
	.right {
		h1, h2 {font-size: 27px; text-transform: uppercase; margin: 5px 0; font-family: 'MontserratB'; line-height: 36px;}
		.undertitle {}
		.formContainer {margin-top:30px;
			.rsform-block {width:32%;
				.formRequired {color:@brand;}
				label {}
				span {}
				input {width:100%;}
				button {width:100%; border:none;}
			}
		}
		.bottom-line {margin-top:20px;
			a {.flex; .align-center; .start; width:32%;
				img {display: block; margin-right:5px;}
			}
			.attention {width:32%; font-size: 14px; line-height: 16px;}
		}
	}
	&.marbot100 {margin-bottom:100px;}
}

.library {
	.blog-articles {padding:20px 20px 40px;
		&.nopaddings {padding:0;}
		&.lib-items {.flex; .between; .stretch; .wrap; margin-top:40px;}
	}
	.item {.shadow; width:385px; display: block; border-radius:10px 10px 10px 10px; background:white; padding-bottom:20px;
		&:hover {color:#202945;
			.title {color:@brand;}
		}
		img {display: block; border-radius:10px 10px 0 0; margin-bottom:15px;}
		.title {font-size: 21px; .nunitoM; display: block; padding:0 20px; .animated;}
		p {display: block; padding:0 20px;}
		.bottom {.flex; .between; .align-center; padding:0 20px;
			.time {position: relative; padding-left:30px;
				&::before {content: ''; position: absolute; left: 0; top: px; background: url(../../../images/icons/clock.svg) no-repeat center center; background-size:contain; width: 22px; height: 22px;}
			}
			.btn {}
		}
		&.empty {background:none; padding:0; margin:0; box-shadow:none;}
	}
	&.comcontent .item {margin-bottom:20px;}
}

.swiper-button-next, .swiper-button-prev {color:#ccc;}
.swiper-pagination-bullets {
	.swiper-pagination-bullet-active {background:@brand;}
}

.clients {.flex; .between; .align-center;
	h2 {font-size: 32px; text-transform: uppercase; margin-right:20px; .montserratL; flex-basis:280px; flex-shrink:0; margin-right:20px;
		b {.montserratB;}
	}
	.items {.flex; .between; .stretch; flex-basis:100%; flex-shrink:1;
		.item {.shadow; background:white; .flex; .center; .align-center; width:24%; height: 125px; margin-bottom:10px; padding:10px;
			img {display: block; max-width:100%; max-height:100%;}
		}
	}
}

.testimonials-swiper {padding:20px 0 40px; margin-top:30px;
	img {border-radius:10px;}
}
.swiper-3d .swiper-slide-shadow-left {background-image:none;}
.swiper-3d .swiper-slide-shadow-right {background-image:none;}

footer {margin-top: 50px;
	.container {padding: 20px; border-radius: 20px 20px 0px 0px; background:white;}
	.logo {.flex; .start; .align-center;
		img {width:60px; display: block; margin-right:10px;}
		.text {display: block;
			.title {.montserratB; text-transform: uppercase; font-size: 21px; line-height: 21px; letter-spacing: 3px; margin-bottom:2px; display: block;}
			.desc {.montserratR; text-transform: uppercase; font-size: 12px; line-height: 12px; letter-spacing: 4.8px; display: block;}
		}
	}
	.text {text-align: center;
		p {margin:0;}
		.footer-policy {}
	}
	.contacts {margin-left:40px; .flex; .between; .align-center;
		.phone {position: relative; margin-right:15px; font-size: 18px; line-height: 18px;
			&::before {content: ''; display: block; position: absolute; width: 20px; height: 20px; left: -26px; top: 0px; background:url(../../../images/icons/phone.svg) no-repeat center center; background-size:contain;}
		}
		.round-icon {margin-right:15px;}
	}
}

.top-page {border-radius:20px; padding:40px 20px; background:white; .shadow;
	.mod-breadcrumbs__wrapper {font-size: 14px;
		ol {.flex; .start; padding: 0; margin: 0;
			li {list-style: none; margin-right:0;
				&:nth-child(1) {display: none;}
				&:last-child a {
					&::after {display: none;}
				}
				a {color: grey; .nunitoM;
					&:hover {color: #40B3E0;}
					&::after {content:'/'; display: inline-block; margin:0 5px;}
				}
			}
		}
	}
	h1 {.montserratB; font-size: 36px; margin:10px 0;}
	.undertitle {max-width:680px;}
}

.first-after-top {margin-top:40px;}

.me-other {.flex; .between; .stretch;
	.title {font-family: 'nunitoM'; font-size: 30px; margin-bottom: 20px;}
	p {margin:15px 0;}
	ol {padding:0 0 0 40px;
		li {margin:15px 0;}
	}
	.left {.shadow; padding:40px 20px; background:white; border-radius:20px; width:49%;}
	.right {.shadow; background:#282828; color:white; padding:40px 20px; border-radius:20px; width:49%;}
}

.file.pdf {position: relative; padding-left:40px; color:#40B3E0; .nunitoR;
	&::before {content: ''; position: absolute; left: 0px; top: -8px; background: url(../../../images/icons/pdf.svg) no-repeat center center; width: 33px; height: 38px;}
	&:hover {text-decoration: underline;}
}

.steps {
	.section-top {
		.title-block {}
		.white-square {
			.title {font-family: 'nunitoM'; font-size: 24px; margin-bottom: 20px; position: relative; padding-left:25px;
				&::before {content: ''; position: absolute; left: 0px; top: 2px; background: url(../../../images/icons/star.svg) no-repeat center center; width: 19px; height: 18px;}
			}
			p {
				&.bigger {font-size: 21px; line-height:27px; position: relative; padding-left:25px;
					&::before {content: ''; position: absolute; left: 0px; top: 2px; background: url(../../../images/icons/rocket.svg) no-repeat center center; width: 19px; height: 18px;}
				}
			}
		}
	}
	.items {.flex; .between; .stretch; .wrap;margin-top:50px;
		.item {width:49%; position: relative; margin-bottom:30px; padding-top:60px;
			.num {.montserratB; font-size: 90px; color:#818181; line-height: 90px; position: absolute; top:0px; z-index:1; .animated;}
			.body {height:100%; padding:40px 20px; border-radius:20px; .shadow; position: relative; z-index:2; background:white;
				.title {font-family: 'nunitoM'; font-size: 24px; margin-bottom: 10px;}
				.undertitle {font-size: 18px; color:#929292;}
				ul {margin:20px 0;
					li {position: relative; padding-left:10px; list-style:none; margin:10px 0;
						&::before {content: ''; position: absolute; left: 0px; top: 7px; background: #FF7E7C; width: 7px; height: 7px; border-radius: 50px;}
					}
				}
			}
			&:hover {
				.num {top: -15px; font-size: 60px; color:@brand;}
			}
			&.prototypes {.flex; .between; .align-center;
				.example {width:49%; height:100%; border-radius:10px; .shadow; position: relative; cursor:pointer;
					&::before {content: ''; position: absolute; left: 46%; top: 46%; background: url(../../../images/icons/zoom.svg) no-repeat center center; background-size:cover; width: 42px; height: 42px; .animated;}
					&:hover::before {width:80px; height:80px; left: 42%; top: 42%;}
				}
			}
			&.designs {
				.body {.flex; .center; .align-center;
					img {width:85%;}
				}
			}
			&.fullrow {width:100%;
				.body {padding-right:25%;}
			}
			&.w32 {width:32%;}
		}
	}
}

.time-price {
	.title-block {
		h2 {font-family: 'MontserratB'; font-size: 32px; text-align: center; width:100%; max-width:100%;}
	}
	.items {.flex; .between; .stretch; text-align: center;
		.item {background:white; .shadow; border-radius:20px; width:49%; padding:40px 40px;
			.title {text-align: center; width:100%; font-family: 'MontserratB'; font-size: 24px; margin-bottom: 30px;}
			p {text-align: center; width:100%;}
			.num {font-family: 'MontserratB'; font-size: 30px; text-align: center; width:100%; margin:30px 0;}
			.btn {display: inline-block; width:200px;}
		}
	}
}

.about-me {.flex; .between; .stretch; .wrap;
	.left {width:49%; background:white; .shadow; padding:20px; border-radius:20px;
		img {border-radius:20px;}
	}
	.right {width:49%; .shadow; background:white; padding:40px 20px; border-radius:20px;}
}

.team {.flex; .between; .stretch; .wrap;
	.item {background:white; .shadow; border-radius:20px; width:32%; padding-bottom:40px; margin-bottom:40px;
		.photo {border-radius:20px;}
		.name {font-family: 'nunitoB'; font-size: 24px; margin-top:15px; padding:0 20px;}
		.role {color: #929292; margin-bottom: 10px; padding:0 20px;}
		.skill {margin-bottom: 10px; padding:0 20px;}
		.dop {padding:0 20px;
			b {.nunitoM;} 
		}
		.contacts {.flex; .between; .align-center; padding:0 20px; margin-top:10px;
			.phone {position: relative; padding-left:28px; font-size: 18px; .nunitoM; margin-right:20px;
				&::before {content: ''; display: block; position: absolute; width: 20px; height: 20px; left: 0px; top: 3px; background: url(https://krasnove.ru/images/icons/phone.svg) no-repeat center center; background-size: contain;}
			}
			.round-icon {margin-right: 0px;}
		}
	}
}


.requisites {background:white; .shadow; border-radius:20px; padding:40px 20px;
	h2 {font-size: 27px; text-transform: uppercase; margin: 5px 0; font-family: 'MontserratB';}
	p.links {margin-top:20px;}
	&.marbot100 {margin-bottom:100px;}
}

.article-page {
	.top-page {max-width:1000px; margin:0 auto 0px;}
}

.content-block {background:white; .shadow; padding:40px 20px; border-radius:20px; max-width:1000px; margin:30px auto 0;
	h2 {font-family: 'nunitoB'; font-size: 24px; margin-bottom: 10px;}
	.gallery.swiper {padding-bottom:10px;
		.swiper-pagination {bottom:-10px;}
	}
	a:hover {color:#202945;}
	.gallery {.flex; .between; .align-top;
		.alt {text-align: center; font-size: 14px; color: grey;}
		img {border-radius:10px; .shadow;}
		&.col1 a {display: block; margin:0 auto;
			img {width:auto; max-height:400px;}
		}
		&.col2 a {display: block; width:49%; margin:0 auto;
			img {width:100%;}
		}
		&.col3 a {display: block; width:32%; margin:0 auto;
			img {width:100%;}
		}
	}
}


.portfolio-mini-block {
	.short-description {margin:20px 0;}
	.chars {.flex; .start; .align-center;
		.char {.flex; .start; .align-center;
			.round-icon {margin-right:10px;}
		}
		.link {margin-right:20px;}
		.theme {margin-right:20px;}
		.deadlines {}
	}
}








/*--------------------------------------------------------------------------------------------------------------*/

@media all and (max-width:1280px) {
h1, .top-page h1 {font-size: 24px; line-height: 32px;}
.container {padding-left:20px; padding-right:20px;}
.title-block h2, .requisites h2 {font-size: 24px; line-height: 32px;}
.title-block .before-title {font-size: 14px;}
.form .right h1, .form .right h2 {font-size: 24px; line-height: 32px;}
.library .item {width: 32%;}
.team .item .contacts .phone {font-size: 16px; margin-right:0;}
}

@media all and (max-width:1100px) {
header .container .top .logo .text .title {font-size: 14px; margin-bottom: 0px;}
header .container .top .logo .text .desc {font-size: 11px; line-height: 12px; letter-spacing: 1.6px;}
header .container .top .logo img {width: 35px;}
header .container .top .right .info.i1 {display: none;}
header .container .top .right .contacts .phone {display: none;}
header .container .top .right .contacts .phone-mobile {display: flex;}
header .container .top .right .contacts {margin-left: 10px;}
body {padding-top: 90px;}
header .container .top {padding: 5px 0 5px;}
.clients {.wrap;}
.clients h2 {width:100%; margin-bottom:30px;}
.team .item {width: 49%;}
}

@media all and (max-width:1000px) {
.mainoffer .container {.wrap;}
.mainoffer .left {margin-right: 0; margin-bottom:30px;}
.mainoffer .right {flex-basis:100%;}
footer .contacts {display: none;}
.library .item {width: 49%;}
}

@media all and (max-width:900px) {
.items.col3 .item {width: 100%; margin-bottom: 30px;}
.comfort .items .item:first-child::before {display: none;}
.section-top {.wrap;}
.section-top .title-block {width:100%; margin-bottom:30px;}
.section-top .quotes-block {width:100%;}
.portfolio .portfolio-items .item {width:100%; margin-top:30px;}
.price-listing {.wrap;}
.price-listing .item {width:100%; margin-bottom:30px;}
.price .price-listing {margin-top: 30px;}
.price-listing .item.optimal {margin-top:0;}
.price .quotes-bottom-block {margin: 10px auto 0;}
.form {.wrap; margin-top:70px;}
.form .left {width: 100%; margin-bottom:30px;}
.form .right {width: 100%;}
.me-other .left {width:100%; margin-bottom:30px;}
.me-other .right {width:100%; margin-bottom:30px;}
.section-top .white-square {width: 100%;}
.steps .items .item.w32 {width: 100%;}
.time-price .items .item {width: 100%; margin-bottom:30px;}
.about-me .left {width:100%; margin-bottom:30px;}
.about-me .right {width:100%;}
}

@media all and (max-width:750px) {/*УМЕНЬШАЕМ PADDINGS*/
header .container .top .right .info.i2 {display: none;}
.btn, input[type="text"], input[type="phone"], input[type="tel"], input[type="email"] {height:50px;}
/*header .container .bottom {overflow-y:scroll; position: relative; padding-right:20px;
	&::before {content:''; display: block; background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); width:30px; height:24px; position: fixed;     right: 20px; top: 65px;}
}
header .container .bottom .mod-menu {min-width:750px;}*/
header .container .top .right .menu-call {display: flex; margin-right: 0; margin-left: 15px;}
header .container .bottom .mod-menu {display: none; padding:30px 0px; position: relative;
	&::before {content:''; width:0%; display: block; height:1px;position: absolute; left:0; top:10px; background:#e2e2e2; .animated-slow;}
	&.opened::before  {width:100%;}
}
header .container {padding: 2px 20px 3px;}
header .container .top {border-bottom:none; margin-bottom: 0px;}
header .container .bottom .mod-menu li a {font-size: 21px;}
header .container .bottom .mod-menu li {margin-bottom: 20px;}
header .container .bottom .mod-menu li.current a::before {top:11px;}

.mainoffer .left .undertitle span.mobhide {display: none;}
.mainoffer .left .undertitle span.rocket {display: block; margin-top:15px;}
.mainoffer .left .undertitle span.rocket::before {left: -5px;}
.mainoffer .left .undertitle.desktop {display: none;}
.mainoffer .left .undertitle.mobile {display: block;}
.mainoffer .right {line-height: 23px;}
.comfort .under-block {margin-top:20px;}
.portfolio .portfolio-items .item .top-row {.wrap;}
.portfolio .portfolio-items .item .top-row .title {width:100%; display: block;}
.portfolio .portfolio-items .item .top-row .theme-n-year {width:100%; display: block;}
.portfolio .portfolio-items .item img {border-radius: 10px;}
.form .right h2, .form .right .undertitle {text-align: center;}
.form .rsform-block-send {margin-top:20px;}
.top-page {width:calc(100% - 40px);}
.steps .items .item.designs {padding-top: 0px;}
.article-page .top-page {width:100%;}
.content-block .gallery {.wrap;}
.library .item {box-shadow: 5px 5px 10px rgba(32, 41, 69, 0.1);}
.price.container {padding-left:0; padding-right:0;}
.price.container .section-top {padding-left:20px; padding-right:20px;}
.price .quotes-bottom-block {margin: 10px 20px 0; }
.price.dopprice .title-block {padding-left:20px; padding-right:20px;}
.title-block {margin-bottom: 30px;}
.clients .items .item {width:49%;}
.library .item {width: 100%;}
.team .item {width: 100%;}
.mainoffer .left, 
.mainoffer .right, 
.comfort .items .item, 
.quotes-block, 
.portfolio .portfolio-items .item, 
.form, 
.top-page, 
.about-me .right, 
.inner-title .title-block {padding: 30px 20px;}
.team .item .photo {width: 100%;}
.form .left img.face {margin: -80px auto 10px;}
h1 {font-size: 27px; line-height: 32px; text-transform: none; }
.steps .items .item {width: 100%;}
.steps .items .item.prototypes .example {height:400px;}
.steps .items .item.prototypes {padding-top: 0px;}
.steps .items .item.fullrow .body {padding-right: 20px;}
}

@media all and (max-width:700px) {
.form .right .formContainer, .form .right .bottom-line {.wrap;}
.form .right .formContainer .rsform-block, .form .right .bottom-line a, .form .right .bottom-line .attention {width: 100%; margin-bottom:10px;}
.content-block .gallery.col3 a {width: 100%;}
}

@media all and (max-width:650px) {
header .btn {display: none;}
header .container .top .right .contacts .round-icon.wa {margin-right:0;}
footer .container {.wrap;}
footer .logo {margin:0 auto;}
footer .container > .text {width:100%; margin-top:30px;}
.portfolio-mini-block .chars {.wrap;}
.portfolio-mini-block .chars .char {width:100%; margin-bottom:15px;}

}

@media all and (max-width:450px) {
header .container .top .right .contacts .round-icon {margin-right: 5px;}
header .container .top .right .menu-call {margin-left:5px;}
}

@media all and (max-width:420px) {
header .container .top .logo img {width: 30px;}
header .container .top .logo .text .title {letter-spacing:1px; font-size: 13px;}
header .container .top .logo .text .desc {letter-spacing: 0.5px; font-size: 10px;}
}

@media all and (max-width:420px) {
header .container .top .right .contacts .round-icon.email {display: none;}
}

@media all and (max-width:350px) {
header .container .top .right .contacts .round-icon.tg {display: none;}
}

@media all and (max-width:1000px) and (orientation:landscape) {

}