@charset "utf-8";

:root {
    --color:#0c6aa8;
    --light-blue:#6ab8ee;
    --light-color:rgba(12,106,168,0.05);
    --yellow:#ffea00;
    --shadow:10px 0px 50px 0px rgb(61 110 146 / 10%), 0px 1px 3px 0px rgb(61 110 146 / 25%);
    --font: 'Montserrat', sans-serif;
    --font-title: 'Montserrat', sans-serif;
}

html {scroll-behavior: smooth;}

*, *:before, *:after {-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}

iframe {display:block;max-width:100%;}

body.overflow {overflow:hidden}
body, h1, h2 {font-family: var(--font);margin:0;padding:0}
select {width:100%;padding:10px;border: 1px solid #e5e5e5;border-radius:5px;height: 40px;line-height: 40px;font-size: 14px;}
section h2 {text-align:center;font-size:20px;}

img {display:block;max-width:100%}

.clearfix:before,.clearfix:after {display:table;content:" "}
.clearfix:after {clear:both}

.container {max-width:1500px;margin: 0 auto;padding: 0 10px;}

.elem-16,.elem-20,.elem-25,.elem-30,.elem-33,.elem-40,.elem-50,.elem-60,.elem-66,.elem-70,.elem-75,.elem-80 {float:left}
.elem-16 {width:16.66666666%}
.elem-20 {width:20%}
.elem-25 {width:25%}
.elem-30 {width:30%}
.elem-33 {width:33.33333333%}
.elem-40 {width:40%}
.elem-50 {width:50%}
.elem-60 {width:60%}
.elem-66 {width:66.66666666%}
.elem-70 {width:70%}
.elem-75 {width:75%}
.elem-80 {width:80%}

#app {padding-top:72px;}
.splide__pagination__page.is-active {background:var(--color)}

.social-list ul {margin:0 0 0 30px;padding:0;}
.social-list ul li {display:inline-block;margin-left:15px}
.social-list ul li a {display:block;width:23px;height:23px;}

section .title-line h2 {text-align:left;font-size:30px;font-weight:700;margin:30px 0}
section .title-line span {text-transform:uppercase;font-weight:600;font-size:15px;color:var(--color)}

section.gray-bg,
footer{background: url(../images/dot2.png) 0 0 repeat}

.button {display:inline-block;background:var(--yellow);padding:15px 25px;text-decoration:unset;color:#000;border-radius:5px}

.dots-image {position:relative}
.dots-image .dots {position: absolute;left: -20%;bottom: -15%;width: 101%;height: 55%;background: url(../images/dot.png) 0 0 repeat}
.dots-image img {position:relative;z-index:1;width:100%}

.menu {position:absolute;top:0;left:0;right:0;height:72px;transition:.2s all;z-index: 2;background: #fff;}
.menu .container {display:flex;padding:10px}
.menu .container > * {margin:auto 0;}
.menu .logo {width:200px}
.menu .logo img {width:100%}
.menu .phone {padding-left:30px}
.menu .phone span {font-size:13px;text-transform:uppercase;font-weight:600;opacity:.6;letter-spacing: 1px;}
.menu .phone a {color:unset;font-weight:600;text-decoration: none;letter-spacing: 2px;text-justify:justify}
.menu .phone a b {font-weight:600;display:inline-block;vertical-align:middle}
.menu .phone a img {width:20px;display:inline-block;vertical-align:middle;margin-left:10px}
.menu nav ul li {display:inline-block;padding-left:20px}
.menu nav ul li a {text-decoration:none;text-transform: uppercase;font-size: 14px;font-weight: 600;letter-spacing: 1px;color: unset;}
.menu.fixed {position:fixed;top:0;background: rgba(255,255,255,1);box-shadow:0 0 10px rgba(0,0,0,0.1);z-index: 2;}

nav label[for=menuCheck] {display:none;font-size: 25px;}
nav input#menuCheck {display:none}
nav svg {width:50px;padding-left:15px}
nav .menu-mask {visibility:hidden;opacity:0;position:fixed;top:0;right:0;bottom:0;left:0;background: rgba(0,0,0,0.9);transition:.2s all;}


footer {padding:80px 0}
footer .container {max-width:1100px}
footer .title-block:before {display:block;content:'';width:100px;height:3px;border-bottom:4px solid var(--yellow)}
footer .title-block h2 {text-align:left;margin-top:50px;text-transform:uppercase;font-size:18px;color:#999;width:100px}
footer h3 {margin:0;font-size:20px}
footer p {margin:30px 0;color:#666;font-weight:600}
footer .email a {color:unset;text-decoration: none;color:#666;}
footer .phone span {display:block;text-transform: uppercase;font-weight: 600;color:#666;}
footer .phone a {display:inline-block;font-size:30px;color:unset;text-decoration: none;margin:20px 0}
footer .phone b {display:block;font-weight:500}
footer .phone a img {display:inline-block;width:35px;margin:10px 10px 0 0}
footer .social-list ul {margin:0;}
footer .social-list ul li {margin:0 15px 0 0}
footer + .container {padding:30px 10px}
footer + .container .links {float:right}
footer + .container .links .copy {float:left}
footer + .container .links a {display:inline-block;color:#333;font-size:14px;margin-left:20px}
.copy {font-size:13px;opacity:.7;}
.copy p {margin:0}


section#home {position:relative;background-image:url('../images/bg2.jpg');background-size: cover;padding-top: 72px;}
section#home:before {content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.3)}
section#home .container {display:flex;min-height:80vh;max-width: 1100px;}
section#home .container .block {position:relative;margin: auto 0;padding-left:50px;color:#fff;max-width: 500px;}
section#home .container .block:before {content:'';position:absolute;top:-80px;left:0;bottom:-80px;width:50%;border:4px solid var(--yellow)}
section#home .container .block h1 {position:relative;font-size:43px;font-weight: 700;line-height: 1.2em;}
section#home .container .block h1 span {font-size:14px;display:block;margin-bottom:30px;text-transform:uppercase;font-weight:600;letter-spacing: 1px;}
section#home .container .block a {display:block;position:relative;color:unset;text-decoration:none;margin-top:50px;}
section#home .block-form h2 {font-weight:500;margin:0 0 30px;max-width:300px}
section#home .block-form {position:relative;margin:auto 0;z-index:1;width: 100%;}
section#home .block-form .form-content {margin:0 30px 0 auto;background:#fff;padding:30px;text-align:center;border-radius: 10px;box-shadow: 0 0 15px rgba(0,0,0,0.3);max-width: 400px;}
section#home .block-form .line {padding:5px}
section#home .block-form .line input {width:100%;padding:15px 25px;font-size:15px}

section#about {padding:70px 0}
section#about .elem-33 {margin-left:15%}
section#about .container {max-width:1000px}
section#about p {line-height:1.6em;opacity:.7;margin:10px 0;}
section#about ul {margin:0;padding-left:15px}
section#about ul li {opacity:.7;padding:0 0 10px 0;}
section#about .years b {display:inline-block;vertical-align: middle;position:relative;font-size:90px;padding:25px;margin-left:45px;}
section#about .years b:before {position:absolute;content:'';left:-45px;right:45px;bottom:0;top:0;border:5px solid var(--yellow);z-index:-1}
section#about .years span {display:inline-block;vertical-align: middle;font-size:23px;font-weight:300;margin-left:-20px;width:100px}

section#services {margin-top:70px;padding:80px 0}
section#services .title-block:before {display:block;content:'';width:100px;height:3px;border-bottom:4px solid var(--yellow)}
section#services .title-block h2 {text-align:left;margin-top:50px;text-transform:uppercase;font-size:18px;color:#999;width:100px}
section#services .title-line h2 {text-align:center;margin:0 0 30px}
section#services .check-list {margin:0 auto;display:flex;flex-wrap: wrap;}
section#services .item {position:relative;padding-left: 100px;width: 50%;}
section#services .item:before {content:'';position:absolute;top:0;left:0;background-image:url('../images/check.svg');width: 70px;height: 70px;background-size: 100%;}
section#services .item h3 {margin:20px 0 10px;font-size:18px;font-weight:700;}
section#services .item p {color:#333;line-height:1.8em;font-size:14px;max-width:85%}

section#buildings {padding:70px 0;}
section#buildings .title-line {max-width:1000px;margin:0 auto;}
section#buildings .title-line h2 {text-align:center;margin-bottom:50px;line-height:1.7em}
section#buildings .elem-33 {padding:5px}
section#buildings .item {position:relative;display:block;overflow:hidden}
section#buildings .item:before {position:absolute;content:'';top:0;right:0;bottom:0;left:0;background: linear-gradient(0deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 100%);z-index:1}
section#buildings .item img {width:100%;transition:.2s all}
section#buildings .item:hover img {transform:scale(1.1)}
section#buildings .title-container {position:absolute;bottom:0;left:0;right:0;color:#fff;padding:30px;z-index:1;text-align: center;}
section#buildings h3 {font-size:25px}
section#buildings h3 b {color:var(--yellow)}
section#buildings span {font-size:14px;letter-spacing:1px;font-weight: 300;}

section#reviews {padding:70px 0;overflow: hidden;}
section#reviews h2 {text-align:center}
section#reviews .container {max-width:1100px;}
section#reviews .splide__list {height:auto;}
section#reviews .splide__slide {padding:20px;}
section#reviews .items {margin:0 -20px}
section#reviews .item {position:relative;background:#fff;padding:50px;}
section#reviews .item:before {content:'';position:absolute;top:0;right:0;height:80px;width:80px;background-image:url('../images/quote.svg');background-size:cover}
section#reviews .item span {font-size:18px;font-weight:600}
section#reviews .item p {line-height: 1.8em;font-size:14px;opacity:.7}

section#team {margin-top:70px;padding:80px 0}
section#team .container {max-width:1100px}
section#team .title-block:before {display:block;content:'';width:100px;height:3px;border-bottom:4px solid var(--yellow)}
section#team .title-block h2 {text-align:left;margin-top:50px;text-transform:uppercase;font-size:18px;color:#999;width:100px}
section#team .rielts img {width:100%;}
section#team .rielts .elem-33 {padding:0 0 20px 20px}
section#team .rielts .item {position:relative;}
section#team .rielts .item .title-container {position:absolute;bottom:0;left:0;right:0;top:0;background:#0c6aa8c2;padding:20px;opacity: 0;visibility: hidden;transition:.2s all}
section#team .rielts .item .title-container .title-content {display:block;position: absolute;bottom:0;padding: 20px;color: #fff;font-size: 20px;}
section#team .rielts .item .title-container .title-content img {filter:invert(100)}
section#team .rielts .item .title-container .title-content span {font-weight:600;}
section#team .rielts .item .title-container .title-content p {font-size:15px;font-weight:300;}
section#team .rielts .item .title-container .title-content ul {margin:0;padding:0;}
section#team .rielts .item .title-container .title-content ul li {display:inline-block;width:20px;margin-right:20px;}
section#team .rielts .item:hover .title-container {opacity:1;visibility: visible}

section#steps {padding:50px 0}
section#steps h2 {text-align:center;font-size:30px;margin-bottom:50px;}
section#steps h2 i {color:var(--color);font-style:unset;}
section#steps .step {overflow:hidden}
section#steps .steps-content {position:relative}
section#steps .steps-content:before {position:absolute;display:block;content:'';left:50%;width:2px;top:0;bottom: 0;height:100%;background:var(--color);}
section#steps .step-block {width:50%;padding: 0;position: relative;text-align: right;}
section#steps .step:nth-child(2n) .step-block {margin-top:10px;text-align:left;float:right}
section#steps .step:nth-child(2n) .num {right:auto;left:-25px}
section#steps .step p {font-size:18px;font-weight:600}

section#steps .step .num {position:absolute;right:-25px;width:50px;height:50px;text-align:center;}
section#steps .step i {display:block;height:100%;font-size:20px;font-weight:500;font-style:unset;background:var(--color);color:#fff;border-radius:50px;padding:10px 0;border:3px solid #fff;}
section#steps .step .content {padding:10px 50px 30px;font-size:20px;font-weight:200}
section#steps .step .content p {margin:0 0 10px;font-size:25px;color:var(--color);}
section#steps .step .content span {display:inline-block;max-width:250px}

section#bank h2 {text-align:center}
section#bank .item {height: 100%;display: flex;}
section#bank .item img {width:100%;padding:0 30px;margin:auto 0;display: inline-block;}
section#bank .splide__list {height:auto}
section#bank ul.splide__list {padding:30px 0 50px !important;}

section#city {padding:50px 0 70px;}
section#city .splide__list {height:auto}
section#city .splide__pagination {bottom:-30px;}
section#city h2 {font-size:20px;text-align:center;max-width:550px;margin:50px auto}
section#city .item {position:relative;padding:0 10px;height: 100%;text-align:center;overflow: hidden;}
section#city .item img {object-fit: cover;min-height:100%;min-width: 100%;}
section#city .item h3 {position:absolute;bottom:0;left:10px;right:10px;color:#fff;margin:0;padding:10px 0;background: linear-gradient(0deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%);}

@media only screen and (max-width : 1100px) {
    
    nav {width: 100px;}
    nav label[for=menuCheck] {display:block;position: fixed;right: 0;top: 0;padding: 15px 20px;background: #fff;}
    nav ul {position:fixed;visibility: hidden;/* text-align: left; */opacity: 0;right: 20px;top: 70px;width: 250px;z-index: 3;transition:.2s all;}
    nav ul li {display: block;margin-left: -180px;text-align:left;padding: 0;transition: .2s all;}
    .menu nav ul li a {position: relative;display: inline-block;padding: 15px 25px;margin: 5px 0;color: #fff;width: auto;font-family: var(--font-title);font-size: 20px;font-weight: 600;letter-spacing: 1px;}
 
    nav ul li:nth-child(2) {margin-left:-250px;}    
    nav ul li:nth-child(3) {margin-left:-350px;}
    nav ul li:nth-child(4) {margin-left:-450px;}
    nav ul li:nth-child(5) {margin-left:-550px;}
    nav ul li:nth-child(6) {margin-left:-650px;}
    nav ul li:nth-child(7) {margin-left:-750px;}

    nav.fixed {background:none;box-shadow:none;}
    nav.fixed label[for=menuCheck] {padding: 0;background: #fff;box-shadow: 0 0 10px rgba(0,0,0,0.2);color: var(--dark-color);fill: var(--dark-color);}
    nav #menuCheck:checked + ul {visibility:visible;opacity:1}
    nav #menuCheck:checked + ul li {margin-left: 0;}
    nav #menuCheck:checked + ul {}
    nav #menuCheck:checked + ul + .menu-mask {visibility:visible;opacity:1}

    section.moovie iframe {height:400px}
    
    section#buildings .elem-25 {width:50%}
    
}

@media only screen and (max-width : 850px) {
    section#home .block-form {display:none}
    section#services .elem-25 {width:50%}
    footer .elem-25, footer .elem-75 {width:100%;}
    footer .title-block:before {position:absolute;margin-top:15px}
    footer .title-block h2 {margin:0 0 40px 140px;width: auto;font-size: 23px;}
}
    
@media only screen and (max-width : 640px) {
    .menu .phone span {display:block}
    .menu .phone span {display:block;font-size: 11px;}
    
    section#home .container .block:before {top:-50px;bottom:-50px}
    
    section#about .elem-50 {width:100%}
    section#about .elem-33 {display:none}
    
    section#buildings .elem-33 {width:100%}
    
    section#steps .steps-content:before {display:none}
    section#steps .steps-content .step {width:100%;float:unset;text-align: left;}
    
    section#services .elem-25 {width:100%}
    section#services .title-block:before {position:absolute;margin-top:15px}
    section#services .title-block h2 {margin:0 0 40px 140px;width: auto;font-size: 23px;}
    section#services .check-list {display:block;}
    section#services .check-list .item {width:100%}
    
    footer .elem-50 {width:100%;margin-bottom:20px;}

    footer + .container .links {float:unset;text-align:center}
    footer + .container .copy {float:unset;text-align:center;margin-top:30px}
}

@media only screen and (max-width : 495px) {
    .menu .phone {display:none}
    
    section#home .container .block h1 {font-size:30px}
        
    section#steps .step .num,
    section#steps .step:nth-child(2n) .num {right:auto;left:0;}
    section#steps .step-block {width:100%;text-align: left;}
    section#steps .step .content {padding:5px 10px 30px 70px}
}