/* 

 Theme Name: nordtrans
*/

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body, html {
	font-family: 'Montserrat', sans-serif;
	font-size: 10px;
	position: relative;
}

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

.burger {
	display: none;
	width: 32px;
	height: 32px;
}

.burger img {
	display: block;
	width: 32px;
	height: 32px;
}

.mobile {
	display: none;
	position: fixed;
	width: 60%;
	height: 100%;
	z-index: 9999;
	left: -999px;
	background-color: #fff;
}

.mobile .header__list {
	flex-direction: column;
	justify-content: space-around;
	align-items: flex-start;
	height: 100%;
}

.mobile .header__list .header__item .header__link {
	color: #000;
}

.header__item__phone {
	display: flex;
	flex-direction: column;
}

.header__item__phone a {
	margin-top: 5px;
	margin-bottom: 5px;
}

.header {
	background-color: #000;
	padding-top: 15px;
	padding-bottom: 15px;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 9999;
}

.header__nav {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.header__logo {
	text-decoration: none;
	width: 150px;
}

.header__logo__img {
	display: block;
	width: 100%;
}

.header__list {
	list-style: none;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
}

.header__item {
	margin-left: 15px;
	margin-right: 15px;
}

.header__link {
	text-decoration: none;
	color: #fff;
	font-size: 16px;
}

.header__link:hover {
	color: #da251c;
	text-decoration: underline;
}

.header__consult {
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 150px;
	height: 40px;
	background-color: #da251c;
	color: #fff;
	border-radius: 25px;
	font-size: 16px;
}

/* Mainscreen */

.main {
	display: block;
	width: 100%;
	height: 80vh;
	background: url('./img/main.jpeg') no-repeat center center;
	background-size: cover;
	padding-top: 170px;
}

.main__img {
	background-color: rgba(255,255,255,0.7);
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 50px;
	padding-bottom: 50px;
	border-radius: 25px;
}

.main__title {
	font-size: 36px;
}

.main__text {
	font-size: 36px;
	margin-top: 20px;
}

.main__text span {
	font-weight: 700;
}

.main__price {
	display: inline-block;
	margin-top: 30px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 30px;
	background-color: #000;
	color: #fff;
	padding-left: 20px;
	padding-right: 20px;
}

.main__price span {
	color: #da251c;
}

.main__list {
	margin-left: 30px;
	list-style: none;
	font-size: 24px;
	margin-top: 30px;
}

.main__item {
	display: block;
	position: relative;
	margin-bottom: 10px;
}

.main__item::before {
	display: block;
	content: '';
	position: absolute;
	left: -30px;
	top: 6px;
	width: 16px;
	height: 16px;
	background: url('./img/star.png') no-repeat center center;
	background-size: cover;
}

.main__item span {
	font-weight: 700;
}

/* Callback */

.callback {
	display: block;
	width: 100%;
	height: 400px;
	padding-top: 75px;
	background: url('https://thumb.tildacdn.com/tild3262-3837-4234-a264-613131663032/-/format/webp/-.jpg');
}

.callback__form {
	width: 100%;
	height: 250px;
	background: url('./img/1.webp') no-repeat center center;
	background-size: cover;
	border-radius: 25px;
	border: 2px solid #da251c;
}

.callback__title {
	padding-top: 30px;
	padding-left: 30px;
	font-size: 24px;
}

.callback__text {
	padding-left: 30px;
	padding-top: 10px;
	font-size: 24px;
}

.callback__text span {
	color: #da251c;
}

.callback__form__actual {
	padding-left: 30px;
	padding-right: 30px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	margin-top: 30px;
}

.callback__column {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.callback__column label {
	font-size: 20px;
}

.callback__input {
	height: 40px;
	width: 270px;
	border: none;
	padding-left: 10px;
	font-size: 20px;
	/*margin-top: 20px;*/
	border-radius: 25px;
}

#phone2 {
	margin-top: 13px;
}

.callback__btn {
	margin-top: 60px;
	background-color: #da251c;
	color:  #fff;
	cursor: pointer;
}

/* Auto */

.auto {
	padding-top: 100px;
	padding-bottom: 100px;
}

.auto__title {
	font-size: 42px;
	color: #da251c;
	margin-bottom: 50px;
	text-align: center;
}

.auto__tabs {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.tab {
	margin-right: 20px;
	margin-left: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 20px;
	padding-right: 20px;
	color: #da251c;
	font-size: 16px;
	border: 1px solid #da251c;
	cursor: pointer;
}

.tab-active {
	background-color: #da251c;
	color: #fff;
}

.auto__info {
	margin-top: 50px;
	display: none;
	flex-direction: row;
	align-items: center;
	justify-content: space-around;
}

.auto__info__show {
	display: flex;
}

.auto__card {
	width: 400px;
	height: 500px;
}

.auto__card img {
	display: block;
	width: 100%;
}

.card__info {
	font-size: 20px;
	margin-top: 20px;
	margin-bottom: 10px;
	padding-left: 10px;
}

.card__info span {
	font-weight: 700;
}

.card__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 150px;
	height: 50px;
	color: #fff;
	background-color: #da251c;
	border-radius: 25px;
	cursor: pointer;
	border: none;
	margin: 0 auto;
	margin-top: 30px;
	font-size: 16px;
}

.card__btn:focus {
	outline: none;
}

/* Work */

.work {
	padding-top: 70px;
	padding-bottom: 70px;
}

.work__title {
	font-size: 42px;
}

.work__title span {
	color: #da251c;
	font-weight: 700;
}

.work__text {
	font-size: 24px;
	margin-top: 30px;
}

.work__text span {
	color: #da251c;
	font-weight: 700;
}

.work__flex {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	margin-top: 50px;
}

.work__card {
	display: block;
	width: 20%;
}

.work__card:last-child {
	margin-top: 25px;
}

.work__top {
	font-size: 40px;
	font-weight: 700;
	border-bottom: 2px solid #da251c;
	padding-bottom: 20px;
}

.work__bottom {
	margin-top: 20px;
	font-size: 18px;
	line-height: 1.5;
}

/* Adv */

.adv {
	background-color: rgb(242, 242, 242);
	padding-top: 100px;
	padding-bottom: 100px;
}

.adv__title {
	font-size: 42px;
}

.adv__title span {
	font-weight: 700;
	color: #da251c;
}

.adv__flex {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	margin-top: 50px;
}

.adv__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	width: 23%;
	min-height: 450px;
	background-color: #fff;
	padding: 30px 30px 40px;
	box-shadow: rgb(0 0 0 / 20%) 0px 0px 20px 0px;
}

.adv__img {
	width: 128px;
}

.adv__info {
	font-size: 24px;
	font-weight: 700;
	color: #da251c;
	margin-top: 30px;
	text-align: center;
}

.adv__text {
	text-align: center;
	font-size: 16px;
	margin-top: 20px;
	line-height: 1.5;
}

.adv__text span {
	font-weight: 700;
}

/* Steps */

.steps {
	background-color: rgb(242, 242, 242);
	padding-top: 100px;
	padding-bottom: 100px;
}

.steps__flex {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;
}

.steps__step {
	width: 33%;
	border-top: 1px solid #000;
	margin-bottom: 100px;
	padding-top: 30px;
	position: relative;
}

.step__title {
	font-size: 22px;
	color: #da251c;
	margin-top: 20px;
}

.step__text {
	font-size: 16px;
	margin-top: 20px;
	line-height: 1.5;
	padding-right: 20px;
}

.step__text span {
	font-weight: 700;
}

.step__text a {
	color: #da251c;
}

.step1::before {
	display: flex;
	align-items: center;
	justify-content: center;
	content: '1';
	width: 50px;
	height: 50px;
	background-color: #da251c;
	color: #fff;
	font-size: 20px;
	border-radius: 50%;
	position: absolute;
	left: 0;
	top: -25px;
}

.step2::before {
	display: flex;
	align-items: center;
	justify-content: center;
	content: '2';
	width: 50px;
	height: 50px;
	background-color: #da251c;
	color: #fff;
	font-size: 20px;
	border-radius: 50%;
	position: absolute;
	left: 0;
	top: -25px;
}

.step3::before {
	display: flex;
	align-items: center;
	justify-content: center;
	content: '3';
	width: 50px;
	height: 50px;
	background-color: #da251c;
	color: #fff;
	font-size: 20px;
	border-radius: 50%;
	position: absolute;
	left: 0;
	top: -25px;
}

.step4::before {
	display: flex;
	align-items: center;
	justify-content: center;
	content: '4';
	width: 50px;
	height: 50px;
	background-color: #da251c;
	color: #fff;
	font-size: 20px;
	border-radius: 50%;
	position: absolute;
	left: 0;
	top: -25px;
}

.step5::before {
	display: flex;
	align-items: center;
	justify-content: center;
	content: '5';
	width: 50px;
	height: 50px;
	background-color: #da251c;
	color: #fff;
	font-size: 20px;
	border-radius: 50%;
	position: absolute;
	left: 0;
	top: -25px;
}

.step6::before {
	display: flex;
	align-items: center;
	justify-content: center;
	content: '6';
	width: 50px;
	height: 50px;
	background-color: #da251c;
	color: #fff;
	font-size: 20px;
	border-radius: 50%;
	position: absolute;
	left: 0;
	top: -25px;
}

.steps__btn {
	display: block;
	margin: 0 auto;
	padding-left: 30px;
	padding-right: 30px;
	height: 50px;
	background-color: #da251c;
	color: #fff;
	font-size: 24px;
	border: none;
	border-radius: 25px;
	cursor: pointer;
}

.steps__title {
	text-align: center;
	font-size: 42px;
	margin-bottom: 100px;
}

/* Answers */

.answers {
	padding-top: 100px;
	padding-bottom: 100px;
}

.answers__answer {
	position: relative;
	border-bottom: 1px solid #000;
}

.answers__title {
	font-size: 42px;
	color: #da251c;
	text-align: center;
	margin-bottom: 50px;
}

.answers__quest {
	font-size: 24px;
	color: #da251c;
	padding-top: 30px;
	padding-bottom: 30px;
}

.answers__answer1 {
	border-top: 1px solid #000;
}

.answers__text {
	display: none;
	font-size: 18px;
	line-height: 1.5;
	padding-bottom: 30px;
}

.answers__text span {
	font-weight: 700;
}

.open {
	display: block;
	width: 36px;
	height: 36px;
	background-color: #da251c;
	border-radius: 50%;
	position: absolute;
	top: 28px;
	right: 10px;
	cursor: pointer;
}

.minus {
	display: block;
	width: 24px;
	margin-left: 6px;
	margin-top: 16px;
	height: 2px;
	background-color: #fff;
}

.plus {
	display: block;
	height: 24px;
	margin-left: 17px;
	margin-top: -13px;
	width: 2px;
	background-color: #fff;
}

.animate {
	transition: all 0.4s;
	transform: rotate(45deg);
}

.animate-back {
	transition: all 0.4s;
	transform: rotate(0deg);
}

/* About */

.about {
	padding-top: 100px;
	padding-bottom: 100px;
	background-color: rgb(242, 242, 242);
}

.about__title {
	font-size: 42px;
	color: #da251c;
	margin-bottom: 50px;
	text-align: center;
}

.item img {
	width: 300px !important;
}

/* Write */

.write {
	padding-top: 100px;
	padding-bottom: 100px;
	background-color: #fff;
}

.write__title {
	font-size: 42px;
	text-align: center;
	color: #da251c;
	margin-bottom: 100px;
}

.write__form {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.write__col {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 27%;
}

.write__col label {
	font-size: 20px;
	text-align: center;
	margin-bottom: 20px;
}

.write__col input {
	width: 100%;
	height: 60px;
	font-size: 16px;
	padding-left: 20px;
	padding-right: 20px;
	border-radius: 10px;
	border: 2px solid #da251c;
}

.wite__input__submit {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 140px;
	height: 60px;
	background-color: #da251c;
	color: #fff;
	border-radius: 10px;
	margin-top: 85px;
	border: none;
	font-size: 16px;
	text-align: center;
	cursor: pointer;
}

.policy {
	font-size: 12px;
	margin-top: 50px;
}

.policy a {
	color: #da251c;
}

/* Contacts */

.contacts {
	padding-top: 100px;
	padding-bottom: 100px;
	background-color: rgb(242, 242, 242);
}

.contacts__title {
	font-size: 42px;
	text-align: center;
	margin-bottom: 50px;
	color: #da251c;
}

.contacts__flex {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.contacts__info {
	width: 50%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
}

.contacts__phone {
	display: block;
	text-decoration: none;
	font-size: 18px;
	margin-bottom: 15px;
	position: relative;
	margin-left: 20px;
	color: #000;
}

.contacts__phone:hover {
	text-decoration: underline;
}

.contacts__phone:nth-child(3):hover {
	text-decoration: none;
}

.contacts__phone::before {
	display: block;
	content: '';
	position: absolute;
	left: -25px;
	top: 2px;
	width: 16px;
	height: 16px;
	background: url('./img/phone-call.png') no-repeat center center;
	background-size: cover;
}

.contacts__phone:nth-child(3)::before {
	background: url('./img/email.png') no-repeat center center;
	background-size: cover;
	top: 4px;
}

.contacts__phone:nth-child(4)::before {
	background: url('./img/location.png') no-repeat center center;
	background-size: cover;
	top: 3px;
}

.contacts__phone:nth-child(5)::before {
	background: url('./img/download.png') no-repeat center center;
	background-size: cover;
	top: 3px;
}

.contacts__map {
	width: 50%;
}

.contacts__link {
	text-decoration: underline;
	color: #da251c;
}

/* Footer */

.footer {
	padding-top: 100px;
	padding-bottom: 100px;
	background-color: #171717;
}

.footer__logo {
	display: block;
	width: 150px;
}

.footer__flex {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.footer__info {
	display: flex;
	flex-direction: column;
}

.footer__text {
	font-size: 24px;
	color: #fff;
	margin-bottom: 30px;
}

.footer__link {
	font-size: 18px;
	text-decoration: none;
	color: #fff;
	margin-bottom: 15px;
	position: relative;
	margin-left: 25px;
}

.footer__link:hover {
	text-decoration: underline;
}

.footer__link::before {
	display: block;
	content: '';
	position: absolute;
	left: -25px;
	top: 2px;
	width: 16px;
	height: 16px;
	background: url('./img/phone-call.png') no-repeat center center;
	background-size: cover;
}

.footer__link:nth-child(4)::before {
	background: url('./img/email.png') no-repeat center center;
	background-size: cover;
	top: 4px;
}

.designed {
	width: 100%;
	display: block;
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 16px;
	background-color: #000;
	color: #fff;
}

.designed a {
	color: #da251c;
	font-size: 20px;
}

/* Modal */

.overflow {
	overflow: hidden;
}

.modal__bg {
	display: none;
	align-items: center;
	justify-content: center;
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0,0,0,.6);
	z-index: 999999;
}

.modal {
	display: block;
	width: 500px;
	height: 820px;
	margin: 0 auto;
	background-color: #fff;
	border-radius: 25px;
	position: relative;
	padding-top: 50px;
	padding-left: 30px;
	padding-right: 30px;
}

.close {
	display: block;
	position: absolute;
	right: 20px;
	top: 20px;
	cursor: pointer;
	width: 32px;
	height: 32px;
}

.close::before {
	display: block;
	content: '';
	position: absolute;
	width: 30px;
	height: 2px;
	left: 1px;
	top: 14px;
	transform: rotate(45deg);
	background-color: #da251c;
}

.close::after {
	display: block;
	content: '';
	position: absolute;
	width: 30px;
	height: 2px;
	left: 1px;
	top: 14px;
	transform: rotate(-45deg);
	background-color: #da251c;
}

.modal__pic {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
}

.modal__img {
	display: block;
	width: 250px;
}

.modal__title {
	font-size: 36px;
	text-align: center;
	margin-top: 30px;
	color: #da251c;
}

.modal__text {
	display: block;
	text-align: center;
	font-size: 16px;
	margin-top: 20px;
}

.modal__form {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
}

.modal__box {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	width: 100%;
}

.modal__box label {
	font-size: 18px;
	margin-top: 30px;
}

.modal__input {
	display: block;
	width: 100%;
	border: 2px solid #da251c;
	padding-left: 20px;
	height: 50px;
	border-radius: 10px;
	/*margin-top: 10px;*/
	font-size: 16px;
}

.modal__box span {
	width: 100%;
}

.modal__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	width: 150px;
	height: 50px;
	background-color: #da251c;
	color: #fff;
	font-size: 18px;
	border-radius: 25px;
	border: none;
	margin-top: 50px;
	cursor: pointer;
}

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

	.container {
		padding-right: 15px;
		padding-left: 15px;
	}

	.main {
		height: 100%;
		padding-bottom: 100px;
	}

	.main__title {
		font-size: 24px;
	}

	.callback {
		height: 100%;
		padding-bottom: 70px;
	}

	.callback__form {
		height: 100%;
	}

	.callback__text {
		padding-right: 30px;
	}

	.callback__form__actual {
		flex-direction: column;
	}

	.callback__title {
		padding-right: 30px;
		text-align: center
	}

	.callback__input {
		margin-top: 10px;
		margin-bottom: 30px;
	}

	.auto {
		padding-top: 100px;
	}

	.auto__tabs {
		flex-wrap: wrap;
	}

	.tab {
		width: 120px;
		text-align: center;
		margin-bottom: 20px;
	}

	.auto__info {
		flex-direction: column;
	}

	.auto__card {
		width: 100%;
		height: 550px;
		margin-bottom: 30px;
	}

	.adv__flex {
		flex-direction: column;
	}

	.adv__card {
		width: 100%;
		margin-bottom: 30px;
	}

	.work__title {
		font-size: 36px;
	}

	.work__flex {
		flex-direction: column;
	}

	.work__card {
		width: 100%;
	}

	.steps__flex {
		flex-direction: column;
	}

	.steps__step {
		width: 100%;
	}

	.answers__quest {
		font-size: 20px;
		padding-right: 30px;
	}

	.item img {
		width: 100% !important;
	}

	.write__form {
		flex-direction: column;
	}

	.write__col {
		width: 100%;
	}

	.write__col label {
		margin-bottom: 10px;
		margin-top: 20px;
	}

	.contacts__flex {
		flex-direction: column;
	}

	.contacts__info, .contacts__map {
		width: 100%;
	}

	.contacts__map {
		margin-top: 30px;
	}

	.footer__flex {
		flex-direction: column;
	}

	.footer__info {
		margin-top: 30px;
	}

	.modal {
		width: 100%;
		height: 100%;
		padding-top: 30px;
	}

	.modal__img {
		display: none;
	}

	.modal__box label {
		margin-top: 20px;
	}

	.modal__btn {
		margin-top: 20px;
		margin-bottom: 30px;
	}

	.header__menu {
		display: none;
	}

	.header__consult {
		display: none;
	}

	.burger {
		display: block;
	}

	.mobile {
		display: block;
	}

	body {
		overflow-x: hidden;
	}
}