/* General */
body{font-family: 'Manrope'; font-size: 16px; font-weight: 400; min-height: 100vh; min-width: 320px; flex-direction: column; overflow-x: hidden;}
h1, h2, h3, b, strong{font-weight: 700;}
img{max-height: inherit;}
.container{max-width: 1200px; padding: 0 15px; margin: 0 auto;}
.flex{display: flex;}
.btn{cursor: pointer; user-select: none; outline: none; text-decoration: none; color: #fff; font-weight: 600; height: 50px; padding: 11px 37px 13px; border: 0; border-radius: 250px; display: inline-block; transition: all .2s;}
.btn.btn-light{background-color: #7387AD; border: 1px solid transparent;}
.btn.btn-light:hover{color: #1e2d4a; background-color: #fff; border-color: #7387AD;}
.btn.btn-dark{background-color: #1e2d4a; border: 1px solid transparent;}
.btn.btn-dark:hover{color: #1e2d4a; background-color: #fff; border-color: #1e2d4a;}
.btn.btn-white{color: #000; background-color: #fff; border: 1px solid transparent;}
.btn.btn-white:hover{color: #fff; background-color: transparent; border-color: #fff;}
.h-phones{display: flex;flex-direction: column;}
.h-phone{display:inline-block;white-space:nowrap;}

/* Header */
.header .row{padding: 14px 0; align-items: center;}
.header .logo{flex-grow: 1;}
.header .logo a{text-decoration: none; align-items: center;}
.header .logo a picture{flex-shrink: 0;}
.header .logo a .slogan{font-weight: 600; margin-left: 30px;}

.header .logo a img, .footer .logo a img{max-width:169px;}

.header .phone{font-size: 22px; font-weight: 800;}
.header .btn{margin-left: 25px;}
.header .icon-menu{display: none;}


/* Menu */
.menu{font-size: 14px; color: #fff; text-transform: uppercase; line-height: 100%; padding: 18px 0; background-color: #1e2d4a;}
.menu ul.flex{justify-content: space-between;}
.menu ul.flex > li{position: relative;}
.menu a, .menu .fake-link{cursor: pointer; text-decoration: none; border-bottom: 1px solid transparent;}
.menu li:hover a, .menu li:hover .fake-link{border-color: #fff;}
.menu .fake-link::after{content: '\f107'; font-family: 'Font Awesome Solid'; position: absolute; top: 1px; right: -20px;}

.menu ul li:hover .submenu{display: block;}
.submenu{color: #000; line-height: 140%; width: 230px; border-radius: 0 0 20px 20px; box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.1); position: absolute; top: 100%; left: 0; display: none; z-index: 10; overflow: hidden;}
.submenu li:first-child{padding-top: 20px; margin-top: 10px; border-radius: 20px 20px 0 0;}
.submenu li:last-child{padding-bottom: 20px;}
.submenu li{background-color: #fff; padding: 3px 25px;}
.submenu li a:hover{text-decoration: underline;}


/* Main */
.main{flex-grow: 1;}
.main section:not(.main-slider):not(.single-page){margin-top: 60px;}
.section-heading{font-size: 36px; font-weight: 800; text-transform: uppercase; line-height: 130%;}


/* single-page */
.single-page{margin: 30px 0 60px;}
.single-page h1{font-size: 30px; text-transform: uppercase;}
.single-page h2{font-size: 22px; text-transform: uppercase; margin: 30px 0 20px;}
.single-page p{margin: 15px 0;}

.single-page .image.center{margin: 20px 0; justify-content: center;}

.single-page ul{margin: 25px 0;}
.single-page .disc li, .single-page .list li{display: flex;}
.single-page ul:not(.slick-dots) li:not(:first-child){margin-top: 10px;}

.single-page .disc li::before{content: '\f111'; font-family: 'Font Awesome Solid'; font-size: 6px; color: #444444; margin: 10px 10px 0 0;}
.single-page .list li::before{content: '—'; margin-right: 8px;}

.single-page .gall{margin: 20px -1% 0; flex-wrap: wrap;}
.single-page .gall .item{margin: 0 1% 2%;}
.single-page .gall .item img{border-radius: 10px; width: 100%; height: 277px; object-fit: cover;}
.single-page .gall.col3 .item{width: 31.333%;}
.single-page .gall.col6 .item{width: 14.666%;}
.single-page .gall.col4 .item{width: 23%;}

/* Main slider */
.main-slider{color: #fff;}
.main-slider > .slide:not(:first-child){display: none;}
.main-slider .slide{padding: 90px 0;}
.main-slider .slide.sl1{background: linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.5)),url('/assets/pic/main_slider/sl1.jpg') center/cover no-repeat;}
.main-slider .content{max-width: 620px;}

.main-slider h2{font-size: 40px; font-weight: 800; text-transform: uppercase; line-height: 53px;}
.main-slider .desc{margin: 20px 0 40px;}


/* About */
.about .row{align-items: center;}
.about .photo{max-width: 535px; flex-shrink: 0;}
.about .photo img{border-radius: 20px;}
.about .text{padding-left: 40px; flex-grow: 1;}
.about .text p{margin-top: 30px;}


/* Services */
.single-page .services{margin-top: 30px;}
.services .items{margin: 0 -1%; flex-wrap: wrap;}
.services .item{font-size: 15px; color: #fff; text-decoration: none; text-align: center; padding: 30px 20px; margin: 0 1% 2% 1%; width: 18%; background-color: #1e2d4a; border-radius: 10px; flex-direction: column; align-items: center; transition: all .2s;}
.services .item:hover{background-color: #334a75;}
.services .item .name{line-height: 120%; margin-top: 10px;}


/* Sliders */
.slider .items{margin: 30px -10px 0;}
.slider .items:not(.slick-slider){display: flex; justify-content: space-between;}
.slider .items .item{text-decoration: none; flex-direction: column;}
.slider .items .item .photo{height: 255px;}
.slider .items .item .photo img{width: 100%; height: inherit; border-radius: 20px; object-fit: cover;}
.slider .items .item .desc{line-height: 140%; margin-top: 10px;}
.slider .items .item .date{color: #606060; margin-top: 15px;}

.slider .prev, .slider .next{cursor: pointer; width: 54px; height: 54px; background-color: #fff; border-radius: 50%; box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1); align-items: center; justify-content: center; position: absolute; top: 100px; z-index: 10;}
.slider .prev::before, .slider .next::before{font-family: 'Font Awesome Solid'; font-size: 23px; color: #d6d6d6; transition: color .2s;}
.slider .prev:hover::before, .slider .next:hover::before{color: #000;}
.slider .prev::before{content: '\f053';}
.slider .next::before{content: '\f054';}
.slider .prev{left: -75px;}
.slider .next{right: -75px;}

.portfolio .slider .prev, .portfolio .slider .next{width: 37px; height: 37px; top: 135px; opacity: 0.5; transition: opacity .2s;}
.portfolio .slider .prev:hover, .slider .next:hover{opacity: 1;}
.slider .prev::before, .slider .next::before{font-size: 19px; color: #000;}
.portfolio .slider .prev{left: 15px;}
.portfolio .slider .next{right: 15px;}
.portfolio .slick-track .slick-slide{margin: 0;}
.portfolio .slick-dots{width: 100%; margin: 0 0 15px; position: absolute; bottom: 0; left: 0; z-index: 10;}
.portfolio .slick-dots li button{background-color: #008cff;}
.portfolio .slick-dots li:not(.slick-active) button{opacity: 0.4;}

.slider.gallery .items > .item:not(:nth-child(-n + 3)){display: none;}
.slider.gallery .items > .item{width: 32%;}

.slider.news-feed .items > .item:not(:nth-child(-n + 4)){display: none;}
.slider.news-feed .items > .item{width: 23%;}

.single-slider .items{margin-top: 30px; width: 100%;}
.single-slider .items > .item:not(:first-child){display: none;}
.single-slider .photo{max-height: 75px;}
.single-slider .desc{margin-top: 10px;}
.single-slider .author{text-align: right; font-weight: 800; margin-top: 10px;}

.slick-list{width: 100%;}
.slick-track .slick-slide{margin: 0 10px;}

/* Portfolio */
.portfolio .items{margin: 30px -1% 0; flex-wrap: wrap;}
.portfolio .item{width: 31.333%; margin: 0 1% 2%; overflow: hidden;}
.portfolio .item img{width: 100%; height: 300px; object-fit: cover;}
.portfolio .item .images{cursor: pointer; position: relative;}
.portfolio .item .images::before{content: ''; width: 24px; height: 24px; background-color: #fff; border-radius: 5px; opacity: 0.7; position: absolute; top: 15px; right: 15px; z-index: 10; transition: opacity .2s;}
.portfolio .item .images::after{content: '\f424'; font-family: 'Font Awesome Solid'; font-size: 15px; position: absolute; top: 17px; right: 19px; z-index: 20;}
.portfolio .item .images > a:not(:first-child){display: none;}
.portfolio .item .name{margin-top: 10px;}

.portfolio .item .images:hover .prev, .portfolio .item .images:hover .next, .portfolio .item .images:hover::before{opacity: 1;}

/* Page navigation */
.page-nav{display: flex;}
.page-nav a, .page-nav span{font-size: 14px; color: #000; text-align: center; line-height: 195%; width: 30px; height: 30px; border: 1px solid blue; border-radius: 50%; margin-right: 5px;}
.page-nav span.dots{border-color: #fff;}
.page-nav a{font-weight: 500; text-decoration: none; transition: background-color .1s;}
.page-nav span.active, .page-nav a:hover{color: #fff; background-color: blue;}

/* Reviews */
.reviews .row{align-items: center;}
.reviews .row .col:first-child{width: 70%; padding-right: 50px; flex-grow: 1;}
.reviews .row .col:last-child{width: 30%; flex-shrink: 0;}

/* News feed */
.news-feed{padding: 60px 0 70px; background-color: #efefef;}

/* Contacts */
.contacts{margin-top: 20px; flex-wrap: wrap;}
.contacts .map, .contacts .desc{width: 50%;}
.contacts .desc{color: #fff; padding: 60px 40px; background-color: #1e2d4a; flex-direction: column; justify-content: center;}
.contacts .title{font-size: 25px; font-weight: 600; text-transform: uppercase;}
.contacts .desc ul{margin-bottom: 10px;}
.contacts a:hover{text-decoration: none;}

.page-contacts.form{padding: 0; margin: 40px auto 0; background-color: #fff;}
.page-contacts.form .title{font-size: 30px; color: #000; margin-bottom: 20px;}
.page-contacts.form input[type="text"]{max-width: 576px; border: 1px solid #D0D5DD;}

/* Form */
.form{color: #fff; line-height: 100%; text-align: center; padding: 40px 35px; width: 100%; background-color: #1e2d4a; border-radius: 20px; flex-direction: column; align-items: center;}
.form .title{font-size: 20px; font-weight: 600; text-transform: uppercase;}
.form .subtitle{line-height: 140%; margin: 10px 0;}
.form input[type="text"]{padding: 13px 20px; margin-top: 15px; width: 100%; border: 1px solid transparent; border-radius: 7px;}
.form input[type="text"].error{border-color: #ff0000; box-shadow: 0px 0px 5px 0px rgb(255, 123, 123);}
.form input[type="text"]:focus{outline: none;}
.form .btn{margin-top: 20px;}
.surname{display:none;}

/* Online order */
.online-order{flex-direction: column;}
.online-order label{width: 100%;}
.online-order label:not(:first-child){margin-top: 15px;}
.online-order .name{font-weight: 600;}
.online-order .name sup{color: red; font-weight: 800; vertical-align: 3px; margin-left: 1px;}
.online-order textarea{height: 110px; resize: none;}
.online-order input[type="text"], .online-order textarea, .online-order select{padding: 10px 15px 13px; margin-top: 5px; width: 100%; border: 1px solid #D0D5DD; border-radius: 7px; transition: border-color .2s;}
.online-order select{height: 49px;}
.online-order input[type="text"]:focus, .online-order textarea:focus, .online-order select:focus{border-color: #1e2d4a; outline: none;} 
.online-order .btn-container{margin-top: 30px; justify-content: center;}

/* Error page */
.error{text-align: center; padding: 40px 0 10px 0; justify-content: center;}
.error .notice{flex-direction: column; justify-content: center; align-items: center;}
.error .icon::before{content: '\f071'; font-family: 'Font Awesome Solid'; font-size: 60px; color: #cb3c3c;}
.error .title{font-weight: 600; font-size: 21px;}
.error .button{margin-top: 10px;}

/* Footer */
.footer .row{padding: 24px 0; align-items: center;}
.footer .logo{flex-grow: 1;}
.footer .logo a{text-decoration: none; align-items: center;}
.footer .logo a .slogan{font-weight: 600; margin-left: 30px;}

.footer .social{margin-right: 20px;}
.footer .social a{text-decoration: none;}
.footer .social a:not(:last-child){margin-right: 8px;}
.footer .social a::before{font-family: 'Font Awesome Brands'; font-size: 35px; color: #1e2d4a; line-height: 100%;}
.footer .social a.vk::before{content: '\f189';}
.footer .social a.fb::before{content: '\f082';}

.footer .phone{font-size: 22px; font-weight: 800;}
.footer .btn{margin-left: 25px;}

.footer .copyright{color: #fff; font-size: 14px; padding: 14px 0; background-color: #1e2d4a;}
.footer .footer-row {padding-bottom:0;}
.footer .bottom-row{padding-top:0;}
.a-policy{display:inline-block;margin:0 0 0 auto;color: #1e2d4a;font-size:13px;text-decoration:underline;}

/* Modal */
.mfp-content .popup{max-width: 900px; margin: 0 auto; display: flex; justify-content: center;}
.popup{padding: 0 70px 0 420px; min-height: 480px; background: #fff url('../img/popup.png') left no-repeat; border-radius: 56px 0 56px; align-items: center; display: none;}
.popup .title{font-size: 24px; font-weight: 800; text-align: center; line-height: 110%;}
.popup .subtitle{text-align: center; padding-top: 10px;}
.popup .popup-form{margin-top: 20px; flex-direction: column; align-items: center;}
.popup .popup-form input[type="text"]{padding: 13px 20px; margin-top: 15px; width: 100%; border: 1px solid #D0D5DD; border-radius: 20px;}
.popup .popup-form input[type="text"]:focus{outline: none;}
.popup .popup-form input[type="text"].error{border-color: #cb3c3c; box-shadow: 0px 0px 5px 0px rgba(203,60,60,1);}
.popup .popup-form .btn{margin-top: 20px;}

.popup .form-response{text-align: center; display: none;}
.popup .form-response .flex{flex-direction: column; align-items: center;}
.popup .form-response .icon{flex-shrink: 0; margin-bottom: 25px;}
.popup .form-response .icon::after{content: '\f058'; font: 400 75px 'Font Awesome Solid'; color: #2aa45b;}
.popup .form-response p{margin-top: 10px;}


@media(max-width: 1200px){
  /* About */
  .about .photo{max-width: 450px;}

  /* Footer */
  .footer .logo a .slogan{display: none;}
}

@media(max-width: 992px){
  /* Header */
  .header{box-shadow: 10px 5px 50px 10px rgba(0,0,0,0.2);}
  .header .row{padding: 15px 0;}
  .header .logo a .slogan, .header .phone span, .header .btn{display: none;}
  /*.header .phone{width: 40px; height: 40px; background-color: #1e2d4a; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
  .header .phone::before{content: '\f095'; font-family: 'Font Awesome Solid'; color: #fff; font-size: 18px;}*/
  
  .header .row{padding: 10px 0;}
  .header .logo a img, .footer .logo a img{max-width:119px;}

  .header .icon-menu{margin-left: 20px; display: block; position: relative;}
  .header .icon-menu.active{z-index: 110;}
  .header .icon-menu .bar1, .icon-menu .bar2, .icon-menu .bar3{width: 25px; height: 2px; background-color: #1e2d4a; margin: 6px 0;}
  
  /* Menu */
  .header .menu, .menu .useful{display: none;}
  .mfp-content .menu{font-size: 16px; color: #000; text-transform: none; width: 100%; height: 100vh; background-color: #fff; display: block;}
  .mfp-content .menu .container{height: 100%; display: flex; align-items: center; justify-content: center;}
  .mfp-content .menu ul{flex-direction: column; align-items: center;}
  .mfp-content .menu ul li:not(:first-child){margin-top: 15px;}

  /* About */
  .about .row{flex-direction: column;}
  .about .photo{max-width: 100%;}
  .about .photo img{border-radius: 10px;}
  .about .text{padding-left: 0; margin-top: 30px;}

  /* Portfolio */
  .portfolio .item{width: 48%;}
  .portfolio .item .images::before, .portfolio .item .images::after{display: none;}

  /* Services */
  .services .items{flex-wrap: wrap;}
  .services .item{width: 31.333%; transition: none;}

  /* Sliders */
  .slider.gallery .items > .item:not(:nth-child(-n + 3)){display: initial;}
  .slider.gallery .items > .item:not(:nth-child(-n + 2)){display: none;}
  .slider.gallery .items > .item{width: 49%;}

  .slider.news-feed .items > .item:not(:nth-child(-n + 4)){display: initial;}
  .slider.news-feed .items > .item:not(:nth-child(-n + 2)){display: none;}
  .slider.news-feed .items > .item{width: 49%;}

  /* Reviews */
  .reviews .row{flex-wrap: wrap;}
  .reviews .row .col:first-child, .reviews .row .col:last-child{width: 100%;}
  .reviews .row .col:first-child{padding-right: 0;}
  .reviews .row .col:last-child{margin-top: 40px;}

  /* Form */
  .form *{max-width: 480px;}

  /* Modal */
  .mfp-content .popup{max-width: 576px;}
  .popup{padding: 70px; background: #fff;}

  /* single-page */
  .single-page h1{font-size: 24px;}
  .single-page h2{font-size: 20px;}

  .single-page .gall .item:not(:first-child){margin-top: 15px;}
  .single-page .gall .item img{width: 100%;}
  .single-page .gall .item{margin-bottom: 0!important;}
  .single-page .gall.col3 .item, .single-page .gall.col4 .item, .single-page .gall.col6 .item{width: 100%;}

  /* Contacts */
  .contacts{flex-direction: column;}
  .contacts .map, .contacts .desc{width: 100%;}
  .contacts .desc{padding: 30px;}
  .contacts .title{font-size: 22px;}
  .page-form.form .title{font-size: 22px; line-height: 140%;}
  .contacts .btn-phone{text-decoration: underline;}
}

@media(max-width: 768px){
  /* Services */
  .services .item{width: 48%;}

  /* Portfolio */
  .portfolio .items{margin: 30px 0 0;}
  .portfolio .item{width: 100%; margin: 0 0 30px;}

  /* Footer */
  .footer .menu{padding: 25px 0;}
  .footer .menu ul{align-items: center;}
  .footer .menu ul li:not(:first-child){margin-top: 13px;}
  .footer .row, .footer .menu ul{flex-direction: column;}
  .footer .social{margin-right: 0;}
  .footer .social, .footer .btn{margin-top: 15px;}
  .footer .phone{font-size: 18px; margin-top: 10px;}
  .footer .btn{margin-left: 0;}
  .footer .copyright{text-align: center;}
  .a-policy{text-align:center;margin:15px auto 0}
}

@media(max-width: 576px){
  /* Main slider */
  .main-slider .slide{padding: 60px 0;}
  .main-slider h2{font-size: 26px; line-height: 42px;}
  
  .h-phone {font-size:16px;}

  /* About */
  .about .text p{margin-top: 20px;}

  /* Main */
  .main section:not(.main-slider):not(.single-page){margin-top: 40px;}
  .section-heading{font-size: 26px;}

  /* Sliders */
  .slider.gallery .items > .item:not(:nth-child(-n + 2)), .slider.news-feed .items > .item:not(:nth-child(-n + 2)){display: initial;}
  .slider.gallery .items > .item:not(:first-child), .slider.news-feed .items > .item:not(:first-child){display: none;}
  .slider.gallery .items > .item, .slider.news-feed .items > .item{width: 100%;}
  .single-slider .author{text-align: left;}

  /* News feed */
  .news-feed{padding: 40px 0;}

  /* Modal */
  .mfp-content .popup{max-width: 100%;}
  .popup{padding: 20px; width: 100%; height: 100vh; border-radius: 0;}
}

@media(max-width: 480px){
  /* Services */
  .services .items{margin: 0;}
  .services .item{margin: 0 0 15px; width: 100%;}
}

@media(max-width: 320px){
  /* Pager */
  .page-nav span.dots{width: 15px;}
}






.privacy-label {
  display: flex;
  align-items: flex-start;
  cursor: pointer;
  margin: 10px 0 5px;
  user-select: none;
  font-size: 13px;
}
.privacy-checkbox {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.custom-checkbox {
  min-width: 18px;
  max-width: 18px;
  height: 18px;
  border: 2px solid #D0D5DD;
  border-radius: 4px;
  margin-right: 10px;
  position: relative;
  transition: all 0.2s ease;
}
.b-form .custom-checkbox {
	border: 2px solid #fff;
}
.privacy-label:hover .custom-checkbox {
  border-color: #000;
}
.b-form .privacy-label:hover .custom-checkbox {
  border-color: #ccc;
}
.custom-checkbox::before {
  content: '';
  position: absolute;
  top: 2px;
  left: 5px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg) scale(0);
  transition: transform 0.2s ease;
}
.b-form .custom-checkbox::before {
	border: solid #000;
  border-width: 0 2px 2px 0;
}
.privacy-checkbox:checked + .custom-checkbox {
  background-color: #222;
  border-color: #222;
}
.b-form .privacy-checkbox:checked + .custom-checkbox {
	background-color: #fff;
	border-color: #fff;
}
.privacy-checkbox:checked + .custom-checkbox::before {
  transform: rotate(45deg) scale(1);
}
.label-text {
  color: #333;
  line-height: 1.3;
  text-align:left;
}
.b-form .label-text {
	color: #fff;
}
.privacy-label.has-error .custom-checkbox {
  border-color: #ff3333;
  background-color: #ffe6e6;
  animation: shake 0.4s ease-in-out;
}
.b-form .privacy-label.has-error .custom-checkbox {
	border-color: #fff;
}
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}