body {
	color: #000;
	font-size: 14px;
	font-family: 'Roboto Condensed', sans-serif;

	line-height: 1;
	max-width: 100vw;
	overflow-x: hidden;
}



@font-face {
	font-family: Calibri;
	src: url(../font/calibri.ttf);
}

@font-face {
	font-family: Calibri light;
	src: url(../font/calibril.ttf);
}

* {
	transition-property: color, background, transform, opacity;
	transition-duration: .3s;
	transition-timing-function: cubic-bezier(0.250, 0.100, 0.250, 1.000);
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	margin: 0;
	padding: 0;
}


li {
	list-style-type: none;
}

a {
	text-decoration: none;
	color: #000;
}

.df-start {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}

.df-between {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	-ms-align-items: center;
	align-items: start;
}

.container {
	margin: 0 auto;
	max-width: 980px;
	width: 95vw;
	height: 100%;
	overflow-x: visible;

}

.ripple {
  position: relative;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
}

.ripple:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #fff 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform .7s, opacity 1s ease-out;
}

.ripple:active:after {
  transform: scale(0, 0);
  opacity: .2;
  transition: 0s;
}
.modal_status--ie {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
}

.modal_status--ie .success__description,
.modal_status--ie .error_description {
	position: fixed;
	left: 40%;
	top: 20%;
	margin: 0;
}


/*hero_section*/

#hero_section {
	position: relative;
	overflow-y: hidden;
	min-height: 500px;
	max-width: 100vw;
	overflow-x: hidden;
	padding-bottom: 140px;
	margin-bottom: 10px;
}

#hero_section:before {
	content: '';
	display: block;
	position: absolute;
	left: -2000px;
	right: 0;
	width: 5000px;
	min-width: 140vw;
	height: 3000px;
	top: -2450px;
	background: #c9c6b8;
	transform: rotate(-9deg);
	z-index: -1;
}

nav {
	padding: 15px 0 15px 0px;
	border-bottom: 1px solid #000;
	margin-bottom: 27px;
	flex-wrap: nowrap !important;
	align-items: center !important;
}

nav a {
	font-weight: bold;
	font-size: 16px;
	text-transform: uppercase;
	margin-bottom: 0px;
	font-family: roboto;
}

#arrow_icon {
	width: 25px;
	height: 8px;
}

#phone_icon {
	width: 10px;
	height: 19px;
	margin-right: 8px;
}

.logo {
	width: 200px;
	height: 35px;
	background: url(../img/logo.png) no-repeat center center / cover;
}

.contacatcs_list__item:first-child {
	margin-right: 55px;
}

.logo {
	font-size: 25px;
	font-weight: bold;
	text-transform: uppercase;
}

#contacts_list {
	align-items: center;
}


.contact_phone {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

/*offer*/

.offer_wrapper {
	height: auto;
	overflow-x: visible;
	position: relative;
	z-index: 3;
	padding-bottom: 150px;
}

.title {
	font-size: 42px;
	font-weight: 500;
	margin-bottom: 15px;
	font-family: 'Roboto Condensed', sans-serif;
}

.title_capture {
	font-size: 23px;
	margin-bottom: 20px;
}

.cta_btn,
.cta_btn:hover,
.cta_btn:active,
.cta_btn:focus {
	background-color: #000;
	color: #FFD400;
	text-transform: uppercase;
	outline: none;
	border:  1px solid transparent;
	font-size: 14px;
	box-sizing: border-box;
	cursor: pointer;
	transition: .2s ease-out;
	font-family: roboto;
}

.cta_btn:hover {
	box-shadow: 5px 5px 7px rgba(0, 0, 0, .3);
}

.header_btn {
	height: 46.5px;
	width: 220px;
}

.offer_offer__side {
	margin-top: 0;
	position: relative;
	z-index: 1;
}

.rent_wrapper {
	width: 158px;
	height: 178px;
	padding: 10px;
	background: url(../img/green_box.png) no-repeat center center / 100%;
	position: absolute;
	left: calc(-50% + -6px);
	top: -10px;
}

.rent_wrapper_mobile {
	display: none;
	left: calc(100% - 158px); top: -35px;
}

/*
.rent__amount span.amount {
	font-size: 117px;
	font-weight: 700;
	position: absolute;
	left: -30px;
	top: -63px;
	z-index: 9999;
} */

.center_imagess {
	height: 45vw;
	width: 870px;
	max-height: 440px;
	max-width: 890px;
	width: 95%;
	position: absolute;
	top: 92px;
	z-index: 1;
	perspective: 1000px;
	overflow-y: visible;
	left: calc(50% - 455px);
}

.paralax_man {
    z-index: 2;
    display: block;
    position: absolute;
    width: 145px;
 		height: 351px;
    left: -3vw;
    top: -7px;
    background: url(../img/bag_boy.png) no-repeat center / cover;
    transition: .2s ease-out;
    z-index: 3;
}

.mobile_paralax__man {
	display: none;
}

.center_imagess:after {
  position: absolute;
  content: '';
  display: block;
  width: 101%;
  height: 107%;
  background: url(../img/cofee_bg.png) no-repeat center / 75%;
  bottom: -36%;
  left: -20%;
  z-index: 3;
}

.girl__block {
	height: 45vw;
	max-height: 459px;
	width: 100%;
	background: url(../img/coffe-girl.jpg)
	no-repeat center 0 / cover;
	z-index: -1;
	border-top-right-radius: 800px;
	border-top-left-radius: 800px;
	transition: .11s ease-out;
	left: 50%;
    transform-style: preserve-3d;
    margin-left: -20px;
}

.animate_dots {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	background: url(../img/img_dots.png) repeat right top / cover;
	border-top-right-radius: 800px;
	border-top-left-radius: 800px;
	top: 0;
	left: 0;
	transition-delay: 0;
	transition: .25s ease-out;
}

.circles {
	width: 80%;
	height: 100%;
	position: relative;
	z-index: 99999999;
	padding-top: 46%;
	padding-left: 45%;
}

.rent__amount  .currency {
	font-size: 17px;
	padding-right: 10px;
	padding-bottom: 12px;
}

 .price span {
 	font-style: normal;
 	font-family: 'Roboto Condensed', sans-serif;
 }

 /* right side*/

 .triggers_list__wrapper {
 	background: #edeadd;
 	padding: 75px 25px 38px 25px;
 	margin-top: 15px;
 	position: relative;
 	overflow-y: visible;
 	z-index: -1;
 }

 .triggers_list__wrapper:after {
 	position: absolute;
 	display: block;
 	content: '';
 	bottom: -100px;
 	width: 51px;
 	height: 129px;
 	background: url(../img/show_btn__img.png) no-repeat center / contain;
 	left: 75%;
 }

.triggers_list__title {
	font-size: 31px;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	text-align: center;
	margin-bottom: 40px;
}
.triggers_list {
	position: relative;
}

 .triggers_list:before {
 	width: 76px; height: 95px;
 	position: absolute;
 	display: block;
 	content: '';
	z-index: 1;
 	top: calc(-100% - 57.5px);
 	left: calc(50% - 38px);
 	background: url(../img/shevron_logo.png) no-repeat center / contain;
 }

.triggers_list__item {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 500;
	font-size: 21px;
	display: flex;
	align-items: center;
	margin-bottom: 23px;
	height: 25px;
}

.triggers_list__item:last-child {
	margin-bottom: 37px;
}

.triggers_list__item:before {
	content: '';
	background: url(../img/checkbox.png) no-repeat center / cover;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	display: inline-flex;
	margin-right: 13px;
	margin-left: 8px;
	margin-bottom: 0;
	align-self: center;
	align-items: center;
}

.triggers_list__btn,
.triggers_list__btn:hover,
.triggers_list__btn:active,
.triggers_list__btn:focus {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	width: 100%;
	height: 47px;
	padding: 0;
}

.header_btn {
	position: relative;
}

.offer_title__side {
	position: relative;
}

/*main*/
#social {
	height: 274px;
}

#social .container {
	background: url(../img/footer_bg.jpg) no-repeat right 207% / 409px 232px;
}

.social_wrapper {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
	padding-top: 40px;
}

.social__title {
	font-size: 22px;
	font-family: Calibri, sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	margin-right: 33px;
}

.social_list {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
}

.solial_list__item {
	margin-right: 10px;
}

.social_link {
	width: 40px;
	height: 40px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
	border-radius: 50%;
}

.social_link img {
	display: block;
	width: 39px;
	height: 39px;
}

.social_btn {
	margin: 0 auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
	width: 210px;
	height: 46px;
	font-size: 14px;
	margin-top: 40px;
}

/*footer */

footer {
	background: #272C33;
	padding: 25px;

}

footer .container {
	position: relative;
}

footer .container:before {
	display: block;
	position: absolute;
	content: '';
	top: -75px; left: 0;
	width: 28px;
	height: 80px;
	background: url(../img/footer_girl.png) no-repeat center / contain;
}

.footer_text, .footer_text a {
	position: relative;
	font-family: Calibri light;
	font-size: 12px;
	color: #F5F6F6;
	padding-left: 115px;
}

.footer_text a {
	padding-left: 0;
}

/*modal*/

.overlay {

}

.overlay {
	position: fixed;
	width: 100vw;
	height: 100vh;
	top: 0; left: 0;
	z-index: 999;
	cursor: pointer;
	transition: transform .1s linear;
	transform: translateX(100%);
	transition-delay: .1s;

}

.modal {
	position: fixed;
	width: 532px;
	height: 304px;
	background-color: #EBE9DC;
	left: calc(50% - 266px); top: calc(50% - 152px);
	transition: opacity  .5s ease-in-out,  transform .6s linear,  height 0s linear;
	transition-delay: .1s;
	z-index: 9999;
	/* height: 0; */
	overflow: hidden;
	transition-delay: .3s;
}

.overlay--active {
	opacity: 1;
	transform: translateY(0);
	transition-delay: 0;
}

.modal_status {
	position: fixed;
	z-index: 99999;
	width: 100%;
	height: 100%;
	top: 0; left: 0;
	background: #edeadd;
	transform: translateY(100%);
	transition: .4s ease-out;
	display: none;
}

.modal_status--active {
	z-index: 99999;
	transition-delay: .1s;
	transform: translateY(0%);
	display: block;
}

.modal_success, .modal_error {
	transition: .4s ease-out;
	transform: translateY(200%);
	opacity: 0;
	text-align: center;
	padding: 5px;
	font-size: 16px;
}

.modal_success--active {transform: translateY(0%); opacity: 1;}
.modal_error--active {opacity: 1;}
.success__description {transform: translateY(300px);}

.modal_success--active .success__description {
	transform: translateY(180px);
	transition-delay: .4s;
	font-size: 18px;
	line-height: 1.4;
}

form {
	padding: 50px 0 0 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: bold;
}

.input__inner {
	width: 210px;
	height: 63px;
	margin: 0 auto;
	margin-bottom: 16px;
}

input {
	background-color: transparent;
	font-family: 'Roboto Condensed', sans-serif;
	margin-top: 6px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #000;
	height: 46px;
	font-size: 21px;
	font-weight: 500;
	width: 100%;
	padding-left: 15px;
	border-radius: 0;
}

#phone {
	margin-bottom: 22px;
	padding-left: 15px;
}

#phone__inner {
	position: relative;
	margin-bottom: 20px;
}

#phone__inner:before {
	display: block;
	content: '+ 380 ';
	font-size: 22.5px;
	font-weight: 500;
	position: absolute;
	top: 33px; left: 15px;
	font-family: 'Roboto Condensed', sans-serif;
	visibility: hidden;
}

label {
	margin-left: 37px;
	font-size: 11px;
}

#send_form {
	width: 210px;
	height: 46px;
	margin: 0 auto;
	display: block;
	font-weight: 500;
	letter-spacing: 1px;
}


canvas {
  display: block;
  vertical-align: bottom;
}

#particles-js {
  position: absolute;
  width: 100%;
  height: 100%;
  transition: .4s ease-out;
  border-top-right-radius: 800px;
  border-top-left-radius: 800px;
  overflow: hidden;
  transform: translateX(0%) translateY(2%);
  opacity: .8;
}

/* check animation */

svg {
  width: 100%;
  height: 70%;
}

path {
  stroke-dasharray: 99.47578430175781;
  stroke-dashoffset: -99.47578430175781;
  fill: transparent;
}

svg.animate path {
  animation: 1.7s ease forwards draw;
	opacity:1;
	animation-delay: .3s;
}

@keyframes draw {
  0% {
    opacity: 0;
		stroke-dashoffset: 0;
    fill: transparent;
    transform: translateY(0);
  }

  35% {
		stroke-dashoffset: 0;
		fill: #6acf66;
		opacity: 1;
  }

  60% {
		stroke-dashoffset: 0;
    fill: #6acf66;
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    fill: #6acf66;
    stroke-dashoffset:  0;
    opacity: 1;
    transform: translateY(0px);
  }
}

.check_container {
	width: 120px;
	height: 300px;
	margin: 0 auto;
	position: absolute;
	left: calc(50% - 60px);
}