@media screen and (min-width: 1920px){
	#promo{background-position: 0 50%;}
}

@media screen and (max-width: 1479px){
	header .container,.container{width: 100%; padding: 0 35px;}

	#quote,#request{padding-left: 35px; padding-right: 35px;}

	header nav li{margin-left: 10px;}
}


@media screen and (max-width: 1259px){
	.section__title.flex{margin-bottom: 50px;}
	.section__title .bt{margin-bottom: 30px;}
	.section__title .bt,.section__title .text{max-width: 100%; width: 100%;}


	header{position: relative;}
	header .data{margin-right: 60px}
	header nav ul{display: none;}
	header .pull{display: block; position: absolute; border-radius: 50%; width: 44px; height: 44px; top: calc(50% - 22px); right: 35px; background: #FBF2FC url("../img/pull.svg") 50% 50% no-repeat;}
	header .lang{display: none;}


	#navigation{padding: 15px 35px 40px; position: fixed; top: 0; right: 0; width: 100%; box-sizing: border-box; height: 100%; overflow-y: auto; z-index: 999; color: #fff; background: rgba(255, 255, 255, 0.8);}
	#navigation.open{display: block;}
	#navigation .nav__inn{position: fixed; top: 0; left: 0; height: 100%; z-index: 3; width: 200px;}
	#navigation:after{width: calc(100% - 200px); position: fixed; top: 0; right: 0; height: 100%; content: ''; background: #A800C7;}
	#navigation .container{padding: 0 0 0 200px!important; width: 100%!important; z-index: 2; position: relative;}
	#navigation .close{position: absolute; top: 0; right: 0; width: 44px; height: 44px; background: rgba(255, 255, 255, 0.20) url("../img/closen.svg") 50% 50% no-repeat; border-radius: 50%;}
	#navigation .lang{width: 180px; position: relative; cursor: pointer; margin-bottom: 65px; box-sizing: border-box; border-radius: 8px; padding: 11px 30px 11px 14px; background: rgba(255, 255, 255, 0.20) url("../img/arr_dw.svg") calc(100% - 14px) 50% no-repeat; font-size: 14px; font-weight: 500;}
	#navigation .lang ul li{display: flex; align-items: center; font-size: 14px;}
	#navigation .lang ul li svg{margin-right: 6px}
	#navigation .lang ul li svg path{fill: #fff}
	#navigation .lang.open{color: #fff; background: #000 url("../img/arr_dw.svg") calc(100% - 14px) 50% no-repeat;}
	#navigation .lang.open ul li svg path{fill: #fff;}
	#navigation .lang ul ul{display: none; overflow: hidden; position: absolute; top: 100%; margin-top: 10px; text-align: right; right: 0; width: 100%; min-width: 160px; background: #fff; border-radius: 8px; box-sizing: border-box; box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12);}
	#navigation .lang.open ul ul{display: block;}
	#navigation .lang ul ul li{display: block;}
	#navigation .lang ul ul li a{display: block; padding: 13px 15px; border-bottom: 1px solid rgba(38, 33, 13, 0.1); font-size: 13px; font-weight: 500; color: rgba(38, 33, 13, 0.5)}
	#navigation .lang ul ul li a:hover{color: #26210D}
	#navigation .lang ul ul li:last-child a{border: none;}
	#navigation nav{padding-bottom: 30px}
	#navigation nav li{margin-bottom: 50px;}
	#navigation nav li a{font-size: 28px; font-weight: 500; line-height: 160%; color: #fff;}
	#navigation .btn{width: 100%; text-transform: none; padding: 16px; font-size: 15px; font-weight: 600;}
	#navigation .contacts{padding: 40px 0;}
	#navigation .contacts a{color: #fff; font-size: 16px}
	#navigation .title{font-size: 16px; font-weight: 700; line-height: 110%; margin-bottom: 20px; width: 100%;}
	#navigation .socials a{color: #fff; display: block; padding: 3px 0 3px 30px; background: url("../img/facebook.svg") 0 50% no-repeat; font-size: 14px;}
	#navigation .socials a:first-child{margin-left: 0}
	#navigation .socials a.instagram{background: url("../img/instagram.svg") 0 50% no-repeat;}
	#navigation .socials a.whatsapp{background: url("../img/whatsapp.svg") 0 50% no-repeat;}
	#navigation .socials a.viber{background: url("../img/viber.svg") 0 50% no-repeat;}


	#promo{padding: 80px 0 580px; background: url("../img/bg_promo_t.jpg") 50% 100% no-repeat; background-size: auto 540px}
	#promo .flex{justify-content: flex-start;}
	#promo h1{font-size: 60px; line-height: 110%;}


	#advantages{padding: 100px 0 80px;}
	#advantages .item{width: calc(100% / 2 - 10px); margin-bottom: 20px;}


	#become .tabs li{width: 100%; min-height: 96px;}


	#about .text{margin: 390px 0 20px; width: 100%; max-width: 100%; padding: 30px;}
	#about .swiper-button-prev, #about .swiper-button-next{top: 435px;}
	#about .swiper-button-next{right: 60px}
	#about .swiper-button-prev{left: calc(100% - 150px)}


	#quote,#fertilization{padding-bottom: 100px}
	#quote .container{padding: 180px 40px 60px; background-position: 50% 60px; font-size: 26px; font-weight: 400; line-height: 160%;}


	#review{padding: 520px 0 40px; background: #A800C7 url("../img/bg_review_t.jpg") 50% 0 no-repeat; background-size: auto 480px}


	#services{padding: 100px 0;}
	#services li{width: calc(50% - 8px)}


	#guarantee{padding: 100px 0;}
	#guarantee li{width: calc(50% - 5px); padding: 20px; margin-bottom: 10px;}
	#guarantee li:last-child h3{font-size: 26px;}
	#guarantee li:last-child p{font-size: 14px;}


	#faq{padding-bottom: 100px;}


	#fertilization .etaps{padding: 40px}
	#fertilization .item{padding-bottom: 100px}
	#fertilization .item .image{width: 100%;}
	#fertilization .item .image img{margin: 0 auto;}
	#fertilization .item .text{margin: 0; width: 100%;}
	#fertilization .item .title{font-size: 26px; font-weight: 500; line-height: 120%;}
	.for__nav{bottom: 40px; left: calc(50% - 54px);}
	.swiper-button-next, .swiper-button-prev{top: 100%; margin-top: -48px;}
	.swiper-button-prev{left: calc(50% - 46px);}
	.swiper-button-next{right: calc(50% - 46px);}


	footer .col:first-child{width: 100%;}
	footer .col .item{margin-bottom: 40px;}
}




@media screen and (max-width: 767px){
	header .container,.container{width: 100%; padding: 0 20px;}

	#quote,#request{padding-left: 20px; padding-right: 20px;}
	.section__title.flex{margin-bottom: 40px;}
	.bt{margin-bottom: 20px!important; font-size: 32px; font-weight: 400; line-height: 120%;}


	header .data{display: none;}
	header img{max-width: 180px;}
	header .pull{right: 20px;}

	#navigation{width: 100%; padding: 20px 20px 10px;}
	#navigation:after{width: 100%;}
	#navigation .container{padding: 0!important}
	#navigation nav{padding-bottom: 10px}
	#navigation nav li{margin-bottom: 40px;}
	#navigation nav li a{font-size: 22px;}
	#navigation .contacts{display: none;}
	#navigation .socials{padding-top: 30px;}
	#navigation .socials a{width: 50%; margin: 0 0 10px; box-sizing: border-box;}
	#navigation .nav__inn{display: none;}


	#promo{padding: 60px 0 440px; background-size: auto 400px;}
	#promo h1{font-size: 40px; font-weight: 300; line-height: 110%;}
	#promo p{font-size: 15px; line-height: 110%;}
	#promo .btn{max-width: 100%; width: 100%;}


	#advantages{padding: 80px 0 60px;}
	#advantages .item{width: 100%; margin-bottom: 20px;}


	#become{padding-bottom: 60px}
	#become .filters{margin-bottom: 20px;}
	#become .filters li{font-size: 14px; overflow: hidden; padding: 0; line-height: 44px; height: 44px;}
	#become .tabs li{padding: 20px 20px 20px 96px; font-size: 15px; font-weight: normal; line-height: 140%;}
	#become .tabs li span{left: 20px;}


	#quote,#fertilization{padding-bottom: 80px;}
	#quote .container{padding: 130px 25px 40px; font-size: 18px; font-weight: 400; line-height: 160%; background-position: 50% 40px; background-size: 80px;}
	#quote p{margin-bottom: 40px;}
	#quote .btn{max-width: 100%; width: 100%;}


	#review{padding: 380px 0 20px; background-size: auto 360px}


	#about .text{margin: 290px 0 20px; padding: 20px 20px 55px; font-size: 15px;}
	#about .swiper-button-prev, #about .swiper-button-next{top: 435px; display: none;}
	#about .swiper-pagination{display: block; bottom: 36px}
	#about .swiper-pagination span{width: 12px; height: 12px; background: #26210D; opacity: 0.2}
	#about .swiper-pagination span.swiper-pagination-bullet-active{opacity: 1; background: #A800C7}


	#services{padding: 80px 0 70px;}
	#services li{width: 100%; margin-bottom: 10px;}


	#guarantee{padding: 80px 0 70px;}
	#guarantee li{width: 100%; margin-bottom: 10px;}


	#faq{padding: 0 0 80px;}
	#faq h3{font-size: 16px; font-weight: 600; line-height: 120%; padding: 20px 70px 20px 10px}
	#faq h3:after{right: 0;}
	#faq .answer{padding: 0px 20px 20px 10px}


	#request{padding-bottom: 80px;}
	#request .container{padding: 140px 20px 40px; background-position: 50% 40px; background-size: 80px;}
	#request p{margin-bottom: 30px;}
	#request .btn{max-width: 100%; width: 100%;}


	#fertilization .filters{position: absolute; bottom: -16px; left: 25px; width: calc(100% - 50px);}
	#fertilization .etaps{padding: 25px;}
	#fertilization .item .title{margin-bottom: 20px; font-size: 20px; font-weight: 500; line-height: 120%; margin-top: 20px;}
	#fertilization .filters{padding: 0; z-index: 1}
	#fertilization .swiper-fertilization{position: relative; z-index: 2}
	#fertilization .filters li{display: none; width: 100%; background: transparent!important; color: #000!important}
	#fertilization .filters li.active{display: block; z-index: 2}
	.swiper-button-next{right: 10px; z-index: 3}
	.swiper-button-prev{left: 10px; z-index: 3}
	.for__nav{display: none;}


	footer{padding-top: 40px;}
	footer .socials a{width: 50%; margin: 0 0 20px; box-sizing: border-box;}
	footer .copyright{margin-top: 20px;}


	.lity-container{margin: 0; border-radius: 0;}
	.flex input, .flex select{width: 100%;}
	.modal__window .bt{text-align: center; font-size: 24px; font-weight: 400; line-height: 120%;}
	.modal__window .note{padding: 10px 0 20px;}
	.lity-container{max-width: 100%; width: 100%; box-sizing: border-box; height: 100%; left: 0; top: 0; right: 0; bottom: 0; margin: 0; padding: 15px 20px;}
	.privacy{padding: 20px 0}

	.modal__window{padding-top: 100px}
	.modal__window .logo{display: block; border-bottom: 1px solid #EAE9EA; padding-bottom: 15px; width: calc(100% + 40px); position: fixed; left: -20px; margin-bottom: 25px; top: -3px}
	.modal__window .logo img{max-width: 180px; margin-left: 20px}
}