/*==========  Desktop First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1370px) and (max-height : 768px) {

	section.top__screen {
		height: 100vh;
	}

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 1280px) {

	nav.nav,
	.header__call {
		display: none;
	}

	.burger {
		display: flex;
		align-items: center;
		position: relative;
	}

	.burger__text {
	    margin-right: 20px;
	    font-size: 14px;
	    color: #fff;
	    text-transform: uppercase;
	    transition: all .5s ease;
	}

	.burger__lines {
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		cursor: pointer;
		max-width: 30px;
	}
	
	.burger__line {
		position: absolute;
		width: 30px;
		height: 2px;
		background: #fff;
		transition: all .5s ease;
	}

	.burger__line:nth-child(1) {
	    top: 0;
	}
	
	.burger__line:nth-child(2) {
	    top: 10px;
	}

	.modal__nav {
		width: 100vw;
		height: 100vh;
		z-index: 999;
		position: fixed;
		background: linear-gradient(0deg, rgb(67 56 40) 0%, rgb(0 0 0) 100%);
		display: flex;
		justify-content: center;
		align-items: center;
		transition: all .5s ease;
		transform: translateY(-100%);
	}
	
	.nav__list ul li {
		list-style: none;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: 10px;
		border-bottom: 1px dotted #c9a45f42;
		padding-bottom: 10px;
	}
	
	.nav__list ul li:last-child {
		border-bottom: none;
	}
	
	a.modal__nav__link {
		color: #fff;
		font-size: 20px;
		text-transform: uppercase;
		font-weight: 500;
		/* border-bottom: 1px solid #c9a45f47; */
	}
	
	
}

@media only screen and (max-width : 1180px) {

	h1.section__title {
		font-size: 24px;
	}
	
	.help__items ul li {
		font-size: 16px;
	}
	
	section.top__screen {
		height: 75vh;
	}
	
	img.person {
		max-width: 400px;
	}
	
	.section__wrapper.main {
		max-width: 720px;
		top: -70px;
	}
	
	.form__wrapper {
		max-width: 720px;
		width: 100%;
		flex-direction: column;
		align-items: center;
	}
	
	h2.form__title {
		max-width: 100%;
		margin-top: 0;
	}
	
	h2.section__title.color, h2.section__title {
		font-size: 32px;
		margin-top: 10px;
	}
	
	.section__wrapper {
		max-width: 720px;
		
	}
	
	.about__text {
		font-size: 14px;
	}
	
	.about__img img {
		max-width: 300px;
	}
	
	.facts {
		margin-top: 70px;
	}
	
	.fact__info {
		font-size: 14px;
		line-height: 1.4;
	}
	
	span.small__text {
		font-size: 14px;
		line-height: 1.4;
	}
	
	.fact__title {
		line-height: 1.4;
	}
	
	.project__name {
		font-size: 14px;
	}
	
	.project__item {
		padding: 15px 0;
	}
	
	.work__btn {
		font-size: 14px;
	}
	
	.work__btn__wrapper {
		width: 230px;
	}
	
	span.work__text {
		font-size: 12px;
	}
	
	.work__btns {
		margin-bottom: 30px;
	}
	
	a.work__modal.btn {
		font-size: 14px;
		margin: 0 7px;
		padding: 12px 16px;
		border-radius: 8px;
	}
	
	h3.benefits__title {
		font-size: 16px;
	}
	
	.benefits__item img {
		width: 45px;
	}
	
	.benefits__item {
		width: 24%;
		align-items: center;
		justify-content: center;
		display: flex;
		text-align: center;
	}
	
	.step__num {
		width: 70px;
		height: 70px;
		font-size: 36px;
		line-height: 1;
	}
	
	.step__text {
		font-size: 14px;
		line-height: 1.4;
	}
	
	.rating__btns {
		flex-direction: column;
	}
	
	.rating__btn.btn.recomend__btn {
		margin-top: 10px;
	}
	
	.contact__info {
		padding: 15px 30px;
	}
	
	.contact__item {
		font-size: 13px;
	}
	
	.footer__wrapper {
		max-width: 720px;
	}

	.nav__list ul {
		margin: 0;
		padding: 0;
	}

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

	.header__wrapper {
		padding: 10px 20px;
	}
	
	.section__wrapper.main {
		flex-direction: column-reverse;
		padding: 0 20px;
		margin-top: 0;
		max-width: 100%;
		height: 100%;
	}
	
	section.top__screen {
		height: 100vh;
		padding-top: 120px;
		padding-bottom: 100px;
	}
	
	h1.section__title {
		font-size: 18px;
		margin-top: 0;
	}
	
	.help__items ul li {
		font-size: 14px;
	}
	
	.section__wrapper.main {
	}
	
	img.person {
		max-width: 355px;
		width: 100%;
	}

	h2.form__title {
		font-size: 18px;
		text-align: center;
		margin: 0 0 20px 0;
	}
	
	section.top__form {
		padding: 0 20px;
	}
	
	.form__wrapper {
		max-width: 100%;
		padding: 15px 20px;
	}
	
	.form__input {
		margin-right: 0;
		width: 100%;
		margin-bottom: 10px;
		font-size: 14px;
	}
	
	form#form_1 {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
	}
	
	input.form__submit {
		font-size: 14px;
	}
	
	.about__info {
		flex-direction: column;
	}
	
	.about__text {
		max-width: 100%;
		margin-bottom: 30px;
		font-size: 16px;
	}
	
	.about__img img {
		max-width: 100%;
	}
	
	h2.section__title.color, h2.section__title.color {
		font-size: 30px;
		margin-top: 0px;
		margin-bottom: 20px;
	}
	
	.section__wrapper {
		max-width: 100%;
		padding: 0 20px;
	}
	
	section.about {
		position: relative;
		top: -70px;
	}
	
	span.author {
		margin-top: 20px;
	}
	
	.facts {
		flex-wrap: nowrap;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	
	.fact {
		width: 100%;
	}
	
	.fact__title {
		line-height: 1.6;
		font-size: 60px;
	}
	
	.fact__info {
		font-size: 16px;
		line-height: 1.5;
	}
	
	span.small__text {
		font-size: 16px;
		line-height: 1.5;
	}
	
	.about__text {}
	
	.fact:last-child {
		margin-bottom: 0;
	}
	
	.projects__items {
		flex-wrap: nowrap;
		flex-direction: column;
	}
	
	.project__item {
		width: 100%;
	}
	
	.project__name {
		font-size: 16px;
	}
	
	.work__btns {
		flex-direction: column;
		align-items: center;
	}
	
	.work__btn__wrapper {
		width: auto;
		margin: 0 0 10px 0;
	}
	
	.work__items {
		flex-direction: column;
	}
	
	.work__container {
		flex-direction: column;
		align-items: center;
	}
	
	.work__item {
		width: 100%;
	}
	
	span.work__text {
		font-size: 16px;
	}
	
	.work__item img {
		width: 36px;
	}
	
	.work__modals {
		flex-direction: column;
	}
	
	a.work__modal.btn {
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 0 0 10px 0;
	}
	
	h2.section__title {
		text-align: center;
	}
	
	.benefits__items {
		/* flex-direction: column; */
		align-items: center;
		flex-wrap: wrap;
	}
	
	.benefits__item {
		width: 50%;
		margin-bottom: 25px;
	}
	
	h3.benefits__title {
		margin: 5px 0 0 0;
		font-size: 15px;
	}
	
	.step {
		flex-direction: row;
		width: 100%;
		justify-content: space-between;
		margin-bottom: 10px;
	}
	
	.steps__items {
		flex-direction: column;
	}
	
	.step__text {
		text-align: left;
		margin-left: 0px;
		max-width: 80%;
		width: 100%;
		font-size: 16px;
	}
	
	.step__num {
		width: 50px;
		height: 50px;
		font-size: 24px;
		margin-bottom: 0;
	}
	
	.rating .section__wrapper {
		flex-direction: column;
		align-items: center;
	}
	
	.rating h2.section__title {
		max-width: 100%;
		font-size: 22px;
		text-align: center;
	}
	
	.rating__btns {
		flex-direction: row;
		align-items: center;
		width: 100%;
		justify-content: space-between;
		max-width: 360px;
	}
	
	.rating__btn.btn.recomend__btn {
		margin-top: 0;
	}
	
	.rating__btn.btn {
		margin-left: 0;
		width: 170px;
		font-size: 13px;
	}
	
	.map {
		position: relative;
	}
	
	section.contacts {
		flex-direction: column;
		padding: 0;
		margin-top: 50px;
	}
	
	.contacts .section__wrapper {
		padding: 0;
	}
	
	.contact__info {
		padding: 40px;
		width: 100%;
	}
	
	.contact__item {
		font-size: 16px;
	}
	
	.contact__value {
		max-width: 100%;
	}

	.footer__wrapper {
		max-width: 100%;
		padding: 0 20px;
	}
	
	.copyright__text {
		text-align: center;
		margin-top: 10px;
	}

	.footer__wrapper {
		max-width: 100%;
		padding: 0 20px;
	}
	
	.copyright__text {
		text-align: center;
		margin-top: 10px;
	}
	
	.modal {
		padding: 0 20px;
	}
	
	.modal__wrapper {
		padding: 30px;
	}
	
	.politics label {
		font-size: 12px;
		line-height: 1.2;
	}
	
	h3.modal__title {
		font-size: 18px;
		margin-top: 25px;
	}
	
	.recomend__modal__wrapper {
		max-width: 100%;
		max-height: 100%;
		height: 100vh;
		width: 100vw;
		border-radius: 0;
		padding: 60px 20px 20px 20px;
	}
	
	.recomend__item {
		flex-direction: column;
	}
	
	.recomend__items {
		max-height: 90%;
	}
	
	.recomend__info {
		margin: 15px 0 0 0;
	}
	
	.recomend__info__title {
		text-align: center;
		margin-bottom: 5px;
	}

}

@media only screen and (max-width: 370px) {
	section.top__screen {
		padding: 150px 0 50px 0;
	}
	
	.benefits__items {
		flex-wrap: nowrap;
		flex-direction: column;
	}
	
	.rating__btns {
		flex-direction: column;
	}
	
	.rating__btn.btn.recomend__btn {
		margin-top: 10px;
	}

	h3.recomend__title {
		line-height: 1.2;
	}
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {

}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}


/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {

}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {

}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {

}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

}