/* connection fonts */
@font-face {
  font-family: 'DINPro-Regular';
  src: url('../fonts/DINPro-Regular.eot'); /* IE9 Compat Modes */
  src: url('../fonts/DINPro-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/DINPro-Regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/DINPro-Regular.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/DINPro-Regular.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/DINPro-Regular.svg#svgFontName') format('svg'); /* Legacy iOS */
       font-weight: 400;
}

@font-face {
  font-family: 'Geometria';
  src: url('../fonts/Geometria.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Geometria.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/Geometria.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/Geometria.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/Geometria.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/Geometria.svg#svgFontName') format('svg'); /* Legacy iOS */
       font-weight: 400;
}

@font-face {
  font-family: 'Geometria-Bold';
  src: url('../fonts/Geometria-Bold.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Geometria-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/Geometria-Bold.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/Geometria-Bold.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/Geometria-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/Geometria-Bold.svg#svgFontName') format('svg'); /* Legacy iOS */
       font-weight: 700;
}



body {
	font-family: 'Roboto', sans-serif;
	letter-spacing: 0em;
	margin: 0;
	padding: 0;
	font-size: 14px;
}

div, p, form, input, a, span, button {
	box-sizing: border-box;
}

ul, li {
	display: block;
	padding: 0;
	margin: 0;
}

p {
	margin: 0;
	font-size: 16px;
	font-weight: 300;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
}

h2, .number {
	font-family: 'Geometria';
	font-size: 36px;
	font-weight: 400;
}

h5 {
	font-weight: 500;
	font-size: 18px;
}

a, a:hover, a:active {
	text-decoration: none;
}

a, button, input {
	transition: all 0.5s ease;
}

input, input:hover, input:focus, input:active,
button, button:hover, button:focus, button:active {
	outline: none;
}


.menu .dropdown {
    position: relative;
    margin-right: 10px;
}

.menu .dropdown-menu {
    width: 270px;
}

.dropdown-menu {
    display:none;
    width: 470px;
    position: absolute;
    background-color: #fff;
    padding: 40px 50px 10px;
    top: 100%;
    left: -30px;
    -webkit-box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15);
    -webkit-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;

}

.footer-menu .item, .dropdown-menu .item {
    padding-bottom: 25px;
}

.dropdown-menu .item-title {
    padding: 4px 0 4px 34px;
    background-repeat: no-repeat;
    background-position: left center;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 500;
}

.dropdown-menu .item-list {
    padding-top: 20px;
    font-size: 14px;
    font-weight: 300;
}

.item-list li a, .item-title {
    color:#000;
}

.dropdown-menu .item-list li {
    padding: 0 0 6px;
}

.footer-menu .item-list a, .dropdown-menu .item-list a {
    display: inline-block;
    position: relative;
}

.dropdown-menu a {
    padding: 0;
}


.container {
	margin: 0 auto;
	max-width: 1100px; 
}

.d-flex {
	display: flex;
}

.alc {
	align-items: center;
}
/* ---------- Header ---------- */
.header {
	background: url('../img/bg.png') no-repeat center top/cover;
	padding-top: 41px;
	padding-bottom: 258px;
	color: #eaeaea;
}

.navigation {
	align-items: center;
}

.navigation__logo:after {
	content: " ";
	display: block;
	width: 1px;
	height: 55px;
	background: #2e2f31;
	margin-left: 38px;
}

.menu {
	margin-left: 35px;
	margin-right: 230px;
}

.menu__icon {
    color: #fff;
	background: none;
	border: 0;
	margin-right: 11px;
}

.menu__text {
    color: #fff;
	font-family: 'DINPro-Regular';
}

.contact {
	margin-left: auto;
}

.social, .contact {
	align-items: center;
}

.social__text {
	margin-right: 13px;
}

.social__wrap li:not(:last-child) {
	margin-right: 6px;
}

.social__wrap li {
	width: 30px;
	height: 30px;
	background: #000;
	text-align: center;
	border-radius: 50px;
	line-height: 32px;
}

.social__icon {
	color: #fff;
	font-size: 17px;
}

.contact__text, .social__text {
	font-size: 10px;
	font-weight: 300;
}

.contact__phone {
	font-weight: 500;
    color: #fff;
    font-size: 16px;
    margin-left: 15px;
}

.menu-open {
	display: none;
}

.main-content {
	margin-top: 129px;
}

.main-content__adv {
	max-width: 403px;
	width: 100%;
}

.main-content__img {
	margin-right: 80px;
}

.main-content__title {
	font-family: 'Geometria-Bold';
	font-size: 46px;
	margin-bottom: 30px;
}

.title-t {
	color: #4bf8ef;
}

.title-k {
	color: #f70056;
}

.main-content__text {
	font-weight: 300;
	font-size: 18px;
	line-height: 30px;
	margin-bottom: 45px;
}

.main-content__btn {
	max-width: 200px;
	width: 100%;
	background-color: #fff;
	color: #000;
	font-weight: 400;
	font-size: 16px;
	text-align: center;
	padding: 12px 0;
	border: none;
	cursor: pointer;
	box-shadow: -7px -7px 0px -1px #2f8683, 7px 7px 0px -1px #850936;
}

.main-content__btn:hover {
	box-shadow: none;
}
/* ---------- Advantages ---------- */
.advantages {
	padding-top: 92px;
}

.number {
	color: #e6e5e5;
}

.advantages-block__title {
	margin-top: 20px;
}

.advantages__wrap {
	justify-content: space-between;
}

.advantages-content {
	max-width: 525px;
	justify-content: space-between;
}

.advantages-content__item {
	margin-top: 45px;
}

.advantages-content__item img, .advantages-content__title{
	margin-bottom: 14px;
}

.advantages-content__text {
	max-width: 217px;
}

/* ---------- Agency ---------- */
.agency {
	padding-top: 42px;
}

.agency__wrap {
	justify-content: space-between;
}

.agency-content {
	max-width: 470px;
	margin-top: 95px;
}

.agency-content__title {
	margin-top: 20px;
	margin-bottom: 45px;
}

/* ---------- Cooperation ---------- */
.cooperation {
	padding-top: 95px;
	padding-bottom: 90px;
}

.cooperation .number, .cooperation__title, .cooperation__text  {
	text-align: center;
}

.cooperation__title {
    max-width: 708px;
    width: 100%;
    margin: 14px auto;
}

.cooperation-company {
	margin-top: 50px;
}

.cooperation-company__wrap_1 {
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 50px;
}

.cooperation-company__wrap_2 {
	justify-content: center;
}

.cooperation-company__item:not(:last-child) {
	margin-right: 77px;
}

/* ---------- Benefit ---------- */
.benefit {
	padding-bottom: 195px;
}

.benefit__title {
	margin-top: 14px;
}

.benefit-content__item {
	max-width: 320px;
	width: 100%;
	background-color: #000;
	padding: 28px 0;
	box-shadow: -11px -11px 0px -1px #00f2ea, 11px 11px 0px -1px #ff004f;
}

.benefit-content__item img {
	margin-bottom: 35px;
}

.benefit-content {
	justify-content: space-between;
	margin-top: 50px;
	color: #fff;
	text-align: center;
}

.benefit-content__text {
	font-weight: 500;
	font-size: 18px;
	max-width: 280px;
	margin: 0 auto;
}

/* ---------- Tariff ---------- */
.tariff {
	background: #fafcfd;
	padding: 90px 0 94px;
}

.tariff .number, .tariff__title {
	text-align: center;
}

.tariff__title {
	margin-bottom: 48px;
}

.tariff-wrap {
	justify-content: space-between;
}

.tariff-content {
	background: #fff;
	max-width: 322px;
	width: 100%;
	padding: 45px 0;
	position: relative;
	text-align: center;
	z-index: 0;
	height: 100%;
}

.tariff-content__bg {
	position: absolute;
	color: #f2f2f2;
	font-size: 52px;
	text-transform: uppercase;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
	top: 3%;
}

.tariff-content__title {
	z-index: 1;
	font-size: 24px;
	font-weight: normal;
	margin-bottom: 33px;
}

.tariff-content__list li {
	font-size: 16px;
	font-weight: 300;
	max-width: 273px;
	margin: 0 auto;
}

.tariff-content__list li:not(:last-child):after {
	content: '';
	width: 54px;
	height: 1px;
	background: #e6e5e5;
	display: block;
	margin: 12px auto;
}

.tariff-price {
	margin-top: 35px;
	justify-content: center;
	align-items: center;
}

.tariff-price__text {
	font-size: 24px;
	font-weight: normal;
}

.tariff-price__btn {
	max-width: 150px;
	width: 100%;
	background: #ff004f;
	border: none;
	padding: 14px 0;
	font-size: 16px;
	color: #fff;
	font-weight: normal;
	margin-left: 13px;
	cursor: pointer;
}

.tariff-content__color {
	background: #ff004f; 
	color: #fff;
}

.tariff-content__bg_color {
	color: #ff587e;
}

.tariff-price__btn_color {
	background: #ffff;
	color: #ff004f;
}

/* ---------- Footer ---------- */
.footer {
	padding: 60px 0 35px;
	background: url('../img/bg2.png') no-repeat center top/cover;
	color: #fff;
}

.footer__logo {
	margin-bottom: 20px;
}

.footer-of__content {
	margin-top: 30px;
}

.footer-of__content a, .footer-social__link li a {
	display: block;
	margin-bottom: 10px;
	color: #fff;
	font-weight: 300;
}

.footer-of__title {
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	color: #b7b7b7;
	margin-left: 8px;
}

.footer-of__wrap {
	margin-bottom: 19px;
}

.footer-social {
    width: 100%;
    max-width: 170px;
    margin: 97px auto 0;
}

.footer-data__text {
	font-size: 14px;
	font-weight: 300;
	margin-left: 20px;

}

.footer-data__wrap{
	margin-top: 30px;
	align-items: center;
}

.mt {
	margin-top: 20px;
	margin-left: 0;
}

.footer-contact__title {
	font-size: 20px;
	margin-bottom: 20px;
	font-weight: 800;
}

.footer-contact__mon {
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 5px;
}

.footer-contact__text {
	font-size: 14px;
	font-weight: 400;
}

.footer-contact__item {
	align-items: center;
	margin-bottom: 15px;
}

.footer-contact__icon {
	width: 38px;
    height: 38px;
    text-align: center;
    line-height: 37px;
    font-size: 18px;
    margin-right: 7px;
    border: 2px solid #fff;
}

.footer-contact__bnt {
	max-width: 236px;
	width: 100%;
	padding: 12px;
	background: transparent;
	cursor: pointer;
	font-size: 13px;
	color: #f85c5c;
	border: 2px solid #f85c5c;
	margin-top: 10px;
}

.footer-block {
	max-width: 398px;
	width: 100%;
	display: block;
	padding: 10px;
	background: #fff;
}

.footer-network {
	border: 1px solid #000;
	padding: 5px 25px 12px;
}

.fa-globe-africa, .fa-check-circle {
	color: #f85c5c;
}

.footer-network__title {
	font-size: 18px;
	color: #000;
	font-weight: 600;
}

.footer-network__wrap {
	margin-bottom: 20px;
}

.fa-globe-africa {
	font-size: 31px;
	margin-right: 15px;
}

.footer-network__text {
	font-size: 14px;
	font-weight: 400;
	color: #000;
}

.fa-check-circle {
    font-size: 24px;
    margin-right: 10px;
}

.footer-network__item {
	margin-top: 10px;
}

.footer-network-social__text {
	font-size: 14px;
	color: #848383;
	padding-right: 10px;
}

.footer-network-social__icon {
	font-size: 18px;
	color: #fff;	
	display: block;
	width: 25px;
	text-align: center;
	height: 25px;
	line-height: 26px;
}

.footer-network-social__icon_vk, .socials__wrap {
	background: #4c6991;
}

.footer-network-social__icon_facebook, .socials__wrap-fase {
	background-color: #4c6991;	
}

.footer-network-social__icon_ok {
	background-color: #e3703c;
}

.footer-network-social__icon_goole {
	background-color: #dd4b39;
}

.socials__wrap-inst {
	background: #e96aab;
}

.footer-network-social__icon_twitter {
	background: #50abf1;
}

.footer-network-social, .footers-socials {
	justify-content: center;
}

.footers-socials {
	margin-top: 10px;

}

.footer-network-social__item {
	margin-right: 5px;
}

.footer-network-social {
	margin-top: 20px;
	margin-bottom: 27px;
}

.line {
	width: 100%;
	background-color: #c6c6c6;
	height: 1px;	
	margin-bottom: 20px;
}

.footer-social__title {
	text-align: center;
	font-size: 18px;
	font-weight: 400;
	color: #000;
}

.socials__wrap {
	border-radius: 50%;
    width: 47px;
    height: 47px;
    font-size: 28px;
    display: block;
    margin-right: 7px;
    text-align: center;
    line-height: 49px;
}

.socials__wrap a {
	color: #fff;
}

.footer-social, .footer__info, .footer-data  {
	justify-content: space-between;
}

.footer-socials__bnt {
	max-width: 227px;
	width: 100%;
	background: #f85c5c;
	padding: 11px;
	font-size: 14px;
	font-weight: 400;
	color: #fff;
	display: block;
    cursor: pointer;
    margin: 23px auto;
	border: none;
}

.footer-data__text_m {
	font-size: 14px;
	font-weight: 300;
	text-align: center;
	color: #a2a2a2;
}

#name-error, #tel-error {
	position: absolute;
    display: block;
    color: red;
    bottom: -19px;
}

.fields {
	position: relative;
}


/* Modal */

.arcticmodal-container {
	background-color: rgba(255, 1, 206, 0.43);
}

.box-modal {
	max-width: 800px;
	width: 100%;	
	background: #fff;
    padding: 24px 26px 68px 50px;

}
.box-modal_close { position: absolute; right: 10px; top: 6px; font-size: 11px; line-height: 15px; color: #999; cursor: pointer; }
.box-modal_close:hover { color: #666; }

.modal__close {
	color: #cdcdcd;
	font-size: 20px;
	color: #cdcdcd;
	font-size: 20px;
	background: none;
	border: none;
	cursor: pointer;
	display: block;
	margin-left: auto;
}

.modal__title {
	font-size: 30px;
	text-transform: uppercase;
	font-weight: 400;
	margin-bottom: 61px;
	text-align: center
}

.modal__title  span {
	color: #ff447c;
}

.fields__input {
	padding: 11px 36px;
	max-width: 300px;
	width: 100%;
	border: 1px solid #a8a8a8;
	font-size: 20px;
	font-weight: 300;
	color: #a8a8a8;
}

.fields__input_name {
	background: url('../img/user.png') no-repeat center left 7px;
}

.fields__input_tel {
	background: url('../img/phone.png') no-repeat center left 7px;
}


.fields {
	justify-content: space-evenly;
}

.modal__btn {
    max-width: 250px;
    width: 100%;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    display: block;
    text-transform: uppercase;
    padding: 13px 0;
    margin: 33px auto 50px;
    border: none;
    background: #ff004f;
}

.modal__text2 {
	font-size: 12px;
	font-weight: 400;
	text-align: center;
	color: #6b6b6b;
}

.modal__text2_mt {
	margin-top: 20px;
}

/* Media Queries */
/*992-1200px*/
@media screen and (max-width: 1200px) {
	.container {
	    width: 951px;
	}	
}

/*768-992px*/
@media screen and (max-width: 992px) {
	.container {
	    width: 700px;
	}
	.menu {
	    margin-left: 7px;
	    margin-right: 25px;
	}

	.menu__text {
		display: none;
	}
	.contact__phone {
	    font-size: 14px;
	}
	.menu__icon {
		margin-right: 0;
	}
	.menu  {
		margin-right: 10px;
	}
	.agency__img img {
		width: 100%;
	}
	.cooperation-company, .benefit__wrap {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		justify-content: space-evenly;
	}
	.cooperation-company__wrap, .benefit-content, .footer__info  {
		flex-direction: column;

	}
	.cooperation-company__item:not(:last-child) {
		margin-right: 0;
	}
	.cooperation-company__item {
		margin-bottom: 30px;
	}
	.benefit-content__item {
		margin-top: 50px;
	}
	section {
		padding: 50px 0!important; 
	}
	.tariff-wrap {
		flex-wrap: wrap;
    	justify-content: space-around;
	}
	.footer-wrap {
		flex-direction: column;
		text-align: center;
	}
	.footer-of__wrap {
		justify-content: center;
	}
	.footer-contact__title {
		text-align: center;
	}
	.footer-contact__bnt {
		display: block;
		margin: 10px auto 30px;
	}
	.footer-block {
		margin: auto;
	}
	.footer-contact {
		margin: 20px 0;
	}
	.footer-contact__list {
		width: 218px;
		margin: auto;
	}

}

/*576-768px*/
@media screen and (max-width: 768px) {
    .op{
          opacity: 0;
    }

        #name-error, #tel-error {
width:100%;
text-align: center;
    bottom: -4px;
    left: 0;
    font-size: 14px;
    left: 50%;
    transform: translateX(-50%);
}
    .dropdown-menu {
        left: 50%;
    transform: translateX(-50%);
    }
	.container {
	    width: 520px;
	}
	.navigation__logo:after, .main-content__img, .advantages__img {
		display: none;
	}
	.navigation, .agency__wrap, .benefit__wrap, .fields  {
		flex-direction: column;
	}
	.contact {
    	margin-left: inherit;
	}
	.main-content {
		text-align: center;
		justify-content: center;
		margin-top: 69px;
	}
	.agency__img {
		text-align: center;
	}
	.agency__img img {
    	width: 38%;
	}
	.tariff .number, .tariff__title, .cooperation .number, .cooperation__title, .cooperation__text {
		text-align: start;
	}
	.cooperation__title {
		font-size: 33px;
	}
	.benefit-content {
		margin: auto;
	}
	.modal__title  {
		font-size: 24px;
	}
	.fields__input {
		margin: 0 auto 25px;
	}

}

/*320-576px*/
@media screen and (max-width: 576px) {
	.container {
	    width: 90%;
	}
	.advantages-content, .footer-data  {
		flex-direction: column;
	    text-align: center;
	}
	.advantages-content__text {
		max-width: 100%;
	}
	.cooperation__title {
	    font-size: 29px;
	}
	.cooperation-company {
		flex-direction: column;
	}
	.cooperation-company__wrap {
		align-items: center;
	}
	.footer-data__text_m {
		margin-top: 20px;
	}
	.modal__title {
	    font-size: 13px;
	    margin-bottom: 20px;
	}
	.fields__input {
	    margin: 0 auto 15px;
	}
	.fields__input {
	    padding: 8px 36px;
	    font-size: 13px;
	}
	.modal__btn {
	    font-size: 12px;
	    margin: 7px auto 28px;
	}
	.box-modal {
	    padding: 16px 9px 31px 9px;
	}
}