html {overflow-x:hidden;}
body {
	background: #fefefe;
	font-family: "Century Gothic";
	margin:0;
	overflow-x: hidden;
}
/*Общие параметры*/
a:active, a:focus { outline: none; }

input, textarea {outline:none;}
input:active, textarea:active {outline:none;}
:focus {outline:none;}
textarea {resize:none;}
textarea {resize:vertical;}
textarea {resize:horizontal;}
button:active, button:focus {
  outline: none;
}
button::-moz-focus-inner {
  border: 0;
}
h1, h2, h3 {
	font-weight: bold;
}
h2 {
  font-size: 25px;
  width: 100%;
}
h3 {
	font-size:22px;
}
h4 {
	font-size: 20px;
}
.blocks {
	padding: 50px 0 40px 0;
}
.input {
	border: 1px solid #ccc;
	border-radius: 10px;
	width: 100%;
	height: 46px;
	font-size: 18px;
	padding-left: 8px;
}
.input::placeholder {
	color:#ccc;
	font-family: "Century Gothic";
}
hr {
	background-color: #eee;
    border: none;
    height: 1px;
}
button.blue-button, input.blue-button {
	background: #00B3FF;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	border:none;
	height: 46px;
	font-size: 18px;
	padding: 0 10px;
	width:100%;
	color:#fefefe;
	font-weight: bold;
	cursor: pointer;
}
button.grey-button {
    background: #dadada;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	border:none;
	height: 46px;
	font-size: 18px;
	padding: 0 10px;
	width:100%;
	color:#333;
	font-weight: bold;
	cursor: pointer;
}
.button-a-div {
	margin-top:30px;
}
.button-a-div a:hover {
	text-decoration: none;
}
a.blue-button {
	background: #00B3FF;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	border:none;
	font-size: 18px;
	padding: 18px 22px;
	width:100%;
	color:#fefefe;
	font-weight: bold;
	cursor: pointer;
}
.blue-back {
	background-color:#00b3ff;
	color:#fefefe;
}
button.white-button {
	background: #fefefe;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	border:none;
	height: 52px;
	font-size: 18px;
	padding: 0 10px;
	width:100%;
	color:#333;
	font-weight: bold;
}
a.white-button {
	background: #fefefe;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	border:none;
	font-size: 18px;
	padding: 18px 22px;
	width:100%;
	color:#333;
	font-weight: bold;
}
.text-center {
	text-align:center;
}
.terms-agree {
	display: flex;
	font-size: 13px;
	color:#a2a2a2;
}
.terms-agree label {
	margin-left:5px;
	text-align: left;
}
.terms-agree label a {
	color:#a2a2a2;
	text-decoration: underline;
}
.head {
	margin-bottom: 15px;
}
.head h2 {
	margin-bottom: 0;
}
.head p {
	margin-top:5px;
	margin-bottom:5px;
}

/*Десктопная навигация*/
header {
	background: #00b3ff;
	position: fixed;
    width: 100%;
    z-index: 999;
}
.logo {
	margin-top:25px;
	width:11%;
}
.header-ul {
	list-style-type: none;
	margin-top:30px;
	width:62%;
}
.header-ul li {
	display: inline;
	margin-left:17px;
}
.header-ul li a {
	color:#fefefe;
	text-decoration: none;
	font-size:15px;
}
header #mobile-burger {
    display:none;
}
.callback {
	margin-top:22px;
	width:27%;
}
.callback p {
	color: #fefefe;
	font-size:15px;
	font-weight: 500;
	margin:0;
}
.callback-button {
	background: #FEFEFE;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 15px;
	padding: 8px 15px;
	font-size:15px;
	border:none;
	font-family: "Century Gothic";
	margin-left: 10px;
	cursor: pointer;
}
header .callback a {
    color:#fefefe;
}

/*Скрываем мобильную навигацию*/
#mobile-nav {
    display:none;
}

/*Первый блок*/
#first-block {
	background-color: #00b3ff;
    background-image: url(../img/main.svg);
    background-repeat: no-repeat;
    background-position-x: 100%;
    background-position-y: 100%;
    padding: 180px 0;
}
#first-block h1 {
	font-size:30px;
	color:#fefefe;
}
#first-block ul {
	font-size:18px;
	color:#fefefe;
	list-style-type:none;
	padding-left: 10px;
}
#first-block ul li {
	margin-top:20px;
}
#first-block ul li img {
	vertical-align: text-bottom;	
}
.first-block-bottom-div {
	margin: 30px 0 20px 0;
}
.first-block-button {
	background: linear-gradient(91.12deg, rgba(255, 135, 0, 0.62) 3.46%, rgba(255, 255, 255, 0) 99.76%), #FF5C00;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	border:none;
	padding: 18px 22px;
	color:#fefefe;
	font-size:18px;
	font-weight: bold;
	margin-top:10px;
	margin-bottom: 10px;
	width: 100%; 
	cursor: pointer;
}
.first-block-button:hover {
	color:#fefefe;
	text-decoration: none;
}
.first-block-bottom-a {
	color:#fefefe;
	border-bottom:1px dashed #fefefe;
}
.first-block-bottom-a:hover {
	color:#fefefe;
}
.first-block-bottom-a:active {
    text-decoration:none;
}

/*Второй блок*/
#second-block{
	padding-bottom: 20px;
}
#second-block h2 {
	margin-bottom: 0;
}
#second-block .mobile-next, #second-block .mobile-prev {
    display:none;
}
.second-block-contacts {
	padding-top:30px;
}
.select p {
	font-weight: bold;
	margin-top:5px;
	margin-bottom:10px;
}
#second-block .select label {
    margin-bottom:0.25rem;
}

/*Третий блок - преимущества*/
#third-block{
	padding-bottom: 60px;
}
#third-block .img-box img {
	width: 100%;
	border-top-left-radius: 35px;
	border-top-right-radius: 35px;
	border-bottom-left-radius: 35px;
}
#third-block .img-box .blue-circle {
	width: 72px;
    height: 72px;
    background-color: #00b3ff;
    position: absolute;
    left: -5%;
    bottom: -10%;
    border-radius: 50%;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
#third-block .img-box .white-circle {
	width: 39px;
    height: 39px;
    background-color: #fff;
    position: absolute;
    left: 9%;
    bottom: -9%;
    border-radius: 50%;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
#third-block .img-box .dots {
	position: absolute;
    top: -8%;
    right: 0;
    line-height: 1;
    color:#333;
}
#third-block h3 {
	margin-top:50px;
}
#third-block button {
	margin-top:30px;
}
/*Четвертый блок - таблица*/
#block-4{
	padding-bottom: 60px;
}
#block-4 table {
	color:#333;
}
#block-4 table tbody {
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	background-color:#fefefe;
}
#block-4 table thead th {
	text-align: center;
}
#block-4 table thead .table-an-kluch {
	background-color:#00b3ff;
	color:#fefefe;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}
#block-4 table tbody tr td {
	padding: 10px 20px;
	vertical-align: top;
}
#block-4 table tbody tr td:first-child {
	font-weight: bold;
}
#block-4 table tbody tr:nth-child(2n) {
	background-color:#f6f6f6;
}
#block-4 table tbody tr td.blue-td {
	background-color:#F0FBFF;
}
#block-4 table tbody tr td.dark-blue-td {
	background-color:#DFF6FF;
}
#block-4 .table-cta {
	padding:3px 15px;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	color:#333;
	background-color:#fefefe;
}
#block-4 .table-cta img {
    width:110px;
    margin-bottom:10px;
}
#block-4 .table-cta .table-cta-head, .table-cta-name {
	font-weight: bold;
}
#block-4 .table-cta .table-cta-name span {
	font-size:12px;
	font-weight: normal;
}
#block-4 .table-cta textarea {
	height:auto;
}

/*Пятый блок - акции*/
#block-5{
	padding-bottom: 75px;
}
#block-5 h2 {
	position: relative;
	z-index: 1;
}
#block-5 .orange-circle {
	width: 50px;
    height: 50px;
    background: #FF9900;
    position: absolute;
    border-radius: 50%;
    top: -37%;
    right: 26%;
    z-index: 0;
}
#block-5 .block-5-item {
	padding:20px 0;
	margin:15px 0;
	background-repeat: no-repeat;
    background-size: contain;
}

/*Шестой блок - Калькулятор ипотеки */
#mortgage-calculator-section {
	margin-top:50px;
}
.mortgage-calculator {
	padding:70px;
	border-radius: 4px;
	box-shadow: 0px 2px 13px rgba(0, 0, 0, 0.08);
}
.mortgage-calculator label {
	font-size:16px;
	color:#333;
}
.mortgage-calculator .range-output span {
	color:#333;
}
.mortgage-calculator datalist {
display: flex;
justify-content: space-between;
padding-top:7px;
}

.mortgage-calculator datalist option {
display: inline;
color: #ccc;
font-weight: 300;
font-size: 12px;
}
.mortgage-calculator input[type="range"] {
	-webkit-appearance: none;
    width: 100%;
    height: 3px;
    border-radius: 4px;
    background: #00b3ff;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.mortgage-calculator input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 17px;
  height: 17px;
  border-radius: 50%; 
  background: #fff;
  border:2px solid #00b3ff;
  cursor: pointer;
}
.
.mortgage-calculator input[type="range"]::-moz-range-thumb {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: #4CAF50;
  cursor: pointer;
}
.mortgage-calculator .range-output {
	border:1px solid #ccc;
	padding:10px;
	border-bottom: none;
	border-radius: 4px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
.mortgage-calculator #percent {
	display:block;
}
.mortgage-calculator #percent #bank-select {
	width: 80%;
    float: left;
    background: #fff;
    border: 1px solid #ccc;
    height: 42px;
    border-radius: 4px;
}
.mortgage-calculator #percent .bank-percent {
	width: 15%;
    float: left;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 9px;
    margin-left:5%;
    text-align: center;
    color: #04B040;
    font-size:16px;
}
.mortgage-calculator .mc-item-first {
	margin-top:27px;
	padding-left:20px;
}
.mortgage-calculator .mc-item {
	padding-left:20px;
}
.mortgage-calculator .mc-item p {
	line-height:1;
	color:#333;
}
.mortgage-calculator .mc-item-safe {
	margin-top: 30px;
    background: #f9f9f9;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    padding:20px;
}
.mortgage-calculator .mc-item p.mc-item-number {
	color:#04B040;
	font-size:22px;
}
.mortgage-calculator .mc-item-bottom {
	margin-top:40px;
}
.mortgage-calculator .mc-item-bottom p {
	font-size:18px;
	color:#333;
	font-weight: 500;
}
.mortgage-calculator .mc-item-bottom button {
	background:#00b3ff;
	color:#fefefe;
	border-radius: 4px;
	padding:13px 20px;
	border:none;
}
.form-group .text-input {
	border:none;
	padding:0;
}
.form-group .text-input-percent {
	border:none;
	padding: 0;
	text-align:center;
	width: 65%;
}
.ipoteka-calc-partner-banks {
	width:100%;
	padding-top:65px;
}
.ipoteka-calc-partner-banks svg {
	max-width: 50%;
}

/*Седьмой блок - Акции*/
#block-7{
	padding-top: 40px;
	padding-bottom: 60px;
}
#block-7 .sale {
	padding:45px 30px;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	color:#fefefe;
	height:320px;
}
#block-7 .sale p:first-child {
	font-weight: bold;
	font-size:20px;
}
#block-7 .sale img {
    position: absolute;
    bottom: 15%;
    width: 40px;
}
#block-7 .sale-1 {
	background: linear-gradient(221.67deg, #0CE5E5 2.17%, rgba(255, 255, 255, 0) 84.17%), #00B3FF;
}
#block-7 .sale-2 {
	background: linear-gradient(223.4deg, #E1E50C -8.32%, rgba(255, 255, 255, 0) 85.99%), #FFB800;
}
#block-7 .sale-2 img {
    width: 35px;
}
#block-7 .sale-3 {
	background: linear-gradient(217.77deg, #00c6b4 2.79%, rgba(255, 255, 255, 0) 84.07%), #7DDF00;
}
#block-7 .sale-3 img {
    width:50px;
}
#block-7 .sale-4 {
	background: linear-gradient(205.76deg, #FF2E00 16.27%, rgba(255, 255, 255, 0) 78.81%), #FF4D00;
}
#block-7 .sale-5 {
	background: linear-gradient(224.05deg, #0CB1E5 1.33%, rgba(255, 255, 255, 0) 84.79%), #FF00E5;
}
#block-8 {
	background-color: #f8f8f8;
	padding-bottom: 50px;
}
#block-8 form {
    width:100%;
}

/*9 блок - лучшие предложения недели*/
#block-9 .kvartira {
    border-radius:10px;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
#block-9 .kvartira .kv-text {
    padding:20px;
}
#block-9 .kvartira .kv-text .kv-price {
    font-weight:bold;
    font-size:18px;
}
#block-9 .kvartira .kv-text .kv-info {
    margin-bottom:5px;
}
#block-9 .kvartira .kv-text a {
    padding: 5px 10px;
    border: 1px solid #00b3ff;
    border-radius: 10px;
    color: #00b3ff;
}
#block-9 .kvartira .kv-text a:hover {
    text-decoration:none;
}
#block-9 .kvartira .kv-img {
    width:100%;
    height:150px;
    background-size:cover;
    background-position:center;
    border-radius: 10px 10px 0 0;
}


/*10 блок - процесс работы*/
#block-10 {
	font-weight: bold;
	padding-bottom: 80px;
}
#block-10 img {
	width:50px;
	margin-bottom: 10px;
}
#block-10 .process-cta p {
	font-size:20px;
}
#block-10 .process-cta p, #block-10 .process-cta button {
	z-index: 1;
	position: relative;
}
#block-10 .process-cta span {
	width: 200px;
    height: 200px;
    background: #059DDD;
    position: absolute;
    z-index: 0;
    left: 23%;
    top: -29%;
    border-radius: 50%;
}

/*11 блок - осторожно*/
#block-11 {
	background-image: url(../img/warning.png);
    background-repeat: no-repeat;
    background-position: right;
    margin-bottom: 50px;
}
#block-11 .head img {
	width:44px;
	margin-bottom:10px;
}
#block-11 .shadow-box {
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	padding: 25px;
	background-color:#fff;
	height: 180px;
}
#block-11 .shadow-box p {
	margin-top:15px;
}
#block-11 #partners {
	margin-top:40px;
	margin-bottom: 15px;
}
#block-11 .builders-mobile {
    display:none;
}
#block-11 .carousel-indicators{
	bottom: -40%;
}
#block-11 .carousel-indicators li {
	height: 10px;
    width: 10px;
    border-radius: 50%;
    border: 2px solid #00b3ff;
}
#block-11 .carousel-indicators li.active {
	background-color:  #00b3ff;
	height: 10px;
    width: 10px;
}
#block-11 .company-item {
	border-radius:10px;
	border: 1px solid #ccc;
	display: flex;
	background-color: #fff;
	padding: 30px 20px;
    height: 140px;
}
#block-11 .company-item .company-item-name {
	width:35%;
}
#block-11 .company-item .company-item-name p {
	font-weight: bold;
}
#block-11 .company-item .company-item-name img {
	width: 50px;
}
#block-11 .company-item .company-item-stats {
	width:65%;
}
#block-11 .company-item .company-item-stats ul li::marker {
	color:#ccc;
}

/*12 блок - о компании*/
#block-12 .achive {
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	padding: 30px 40px;
	background: linear-gradient(299.21deg, #0CE5E5 0%, rgba(255, 255, 255, 0) 59.18%), #00B3FF;
	color:#fefefe;
	font-size: 18px;
	height:217px;
}
#block-12 .achive:first-child {
	padding: 30px;
}
#block-12 .achive span {
	font-weight: bold;
}
#block-12 .achive span.span-1 {
	font-size: 50px;
}
#block-12 .achive span.span-2 {
	font-size: 30px;
}
#block-12 .row.mobile {
    display:none;
}

/*Блок 13 - фото команды*/
.carousel {
    width:100%;
}

/*14 блок - обращение директора*/
#block-14 {
	padding-bottom:90px;
}
#block-14 img.director-photo {
	width: 100%;
	box-shadow:30px 30px 0px #00b3ff;
}
#block-14 img.quote {
	width: 173px;
	position: absolute;
	right: 0;
}

/*15 блок - CTA*/
#block-15 {
	background-color:#F8F8F8;
}
#block-15 .img-box img {
	width: 100%;
	border-radius: 50px 50px 0px 50px;
}
#block-15 .img-box .blue-circle {
	width: 72px;
    height: 72px;
    background-color: #00b3ff;
    position: absolute;
    left: -4%;
    bottom: -2%;
    border-radius: 50%;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
#block-15 .img-box .white-circle {
	width: 39px;
    height: 39px;
    background-color: #fff;
    position: absolute;
    left: 7%;
    bottom: -2%;
    border-radius: 50%;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
#block-15 .img-box .dots {
	position: absolute;
    top: 2%;
    right: 0;
    line-height: 1;
    color:#ccc;
}
#block-15 form input {
	margin-bottom: 10px;
}

/*Подвал*/
footer .text-box {
	margin-left: 20%;
    padding: 25px 15px 15px 15px;
}
footer .text-box ul {
	list-style-type: none;
	padding-left: 0;
}
footer .text-box ul li {
	margin-bottom: 10px;
}
footer .text-box ul li a {
    color:#fefefe;
}
footer .sber-text {
    font-size:10px;
}
footer .politika {
	margin-top:10%;
}
footer .politika a {
	color:#fefefe;
	font-size:10px;
}

/*Адаптив*/

/*Первый блок*/
@media screen and (max-width:430px) {
    a.blue-button, a.white-button {
        display:block;
    }
    h1{
    	font-size:26px !important;
    }
    h2{
    	font-size: 22px;
    }
    h3{
    	font-size: 20px;
    }
    .container-scroll {
        overflow-x:auto;
    }
    .container-scroll .row {
        width:450%;
    }
    header .row {
        padding: 0 20px;
    }
    header .header-ul {
        display:none;
    }
    header .logo {
        width:40%;
        margin-top:19px;
    }
    header .logo svg {
        width:100px;
    }
    header .callback {
        width:60%;
        text-align:right;
    }
    header .callback #mobile-burger img {
        margin-left:8px;
    }
    header .callback-button {
        display:none;
    }
    header #mobile-burger {
        display:inline;
    }
    .terms-agree{
    	margin-top: 12px;
    }
    #first-block {
        padding:130px 0 70px 0;
    }
    .first-block-button {
        display:block;
    }
    #second-block form .select {
        display:none;
    }
    #second-block .second-block-contacts {
        display:none;
    }
    #second-block form .select.active {
        display:block;
    }
    #second-block .second-block-contacts.active {
        display:block;
    }
    #second-block .second-block-contacts {
        padding-top:0;
    }
    #second-block .mobile-next, #second-block .mobile-prev {
        display:block;
        margin-top:10px;
    }
    #third-block .additional .col-md-3 {
        display:inline-flex;
        padding-top:15px;
    }
    #third-block .additional .col-md-3 img {
        width:40px;
        height:40px;
    }
    #third-block .additional .col-md-3 p {
        margin-left:10px;
    }
    #third-block .blue-button {
    	text-align: center;
    }
    #mobile-nav .overlay{
        width: 100%;
        height: 100%;
        position: fixed;
        z-index:999;
        background:rgba(0,0,0,0.5);
    }
    #mobile-nav .navigation {
        width:70%;
        height:100%;
        position:fixed;
        right:0;
        z-index:9999;
        background:#fff;
    }
    #mobile-nav .navigation ul li a {
        color:#333;
    }
    #mobile-nav .navigation ul li::marker {
        color:#ccc;
    }
    #mobile-nav .navigation p {
        padding:20px 20px 0 0;
        text-align:right;
    }
    #mobile-nav .navigation p span img {
        width:25px;
    }
    #first-block {
        background-image:none;
    }
    #block-4 .table-is-here {
        overflow-x:auto;
    }
    #block-4 .table-cta {
        box-shadow:none;
        background-color:#fff;
        border-radius:0;
        margin-top:30px;
    }
    #block-5 .orange-circle {
        display:none;
    }
    #mortgage-calculator-section .mortgage-calculator {
        padding:0;
        box-shadow:none;
    }

    /*10 блок*/
    #block-10 {
    	padding-bottom:40px;
    }
    #block-10 .process-cta{
        margin-top: 20px;
    }
    #block-10 .process-cta span {
        display:none;
    }
    #block-10 .process-item{
    	display:flex;
    }
    #block-10 .process-item img{
    	width: 30px;
    	height: 30px;
    	margin-right: 5px;
    }
    #block-11 .shadow-box {
    	height: auto;
        margin-top:10px;
    }
    #block-11 .builders-desktop {
        display:none;
    }
    #block-11 .builders-mobile {
        display:block;
    }
    #block-11 .company-item{
    	height: auto;
    	padding: 10px;
    }
    #block-11 .company-item-name{
    	text-align: center;
    }
    #block-12 .row.desktop {
        display:none;
    }
    #block-12 .row.mobile {
        display:flex;
    }
    #block-12 .achive {
    	font-size: 15px;
        padding:23px;
    }
    #block-12 .mobile .col-12 {
        margin-top:20px;
    }
    #block-14 {
    	padding-bottom:50px;
    }
    #block-14 img.director-photo {
        box-shadow: 10px 10px 0px #00b3ff;
        width:80%;
    }
    #block-14 .col-md-5 {
        margin-top:50px;
    }
    #block-15 .bottom-cta {
        margin-top:30px;
    }
    footer .text-box {
        margin-left:0;
    }
}