/*====================ROOTS==================*/
.roboto-thin {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.roboto-regular {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.roboto-medium {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.roboto-bold {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.roboto-black {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.roboto-thin-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.roboto-light-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.roboto-regular-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.roboto-medium-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.roboto-bold-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.roboto-black-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: italic;
}
.btn-primary{
	background-color: #4295e4;
	border: #4295e4;
	color: #fff;
}

/*====================ROOTS==================*/





/*====================GENERAL==================*/
html, body{
	height: 100%;
}
body{
	min-width: 320px;
	/* padding-top: 56px; */
	font-family: "Roboto";
	font-weight: 200;
}
img{
	max-width: 100%;
	height: auto;
}/*====================GENERAL==================*/

/*====================HERO==================*/
.hero{
	background: url('../img/8.jpg') no-repeat center;
	background-size: cover;
	/* height: calc(100vh - 0px); */
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.wrapper{
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}
.hero-top{
	display: flex;
	justify-content: space-between;
	padding-top: 20px;
}
.hero-top-logo img{
	height: 80px;
	width: 100%;
	object-fit: cover;
}
.hero-top-right{
	display: flex;
	align-items: center;
}
.hero-top-tg{
	display: flex;
	justify-content: end;
	align-items: center;
	font-weight: 400;
	font-size: 20px;
	color: #fff;
	white-space: nowrap;
}
.hero-top-tg img{
	margin-right: 5px;
	width: 50px;
	object-fit: cover;
}
.hero-top-phone{
	margin-left: 50px;
	display: flex;
	justify-content: end;
	color: #fff;
	font-weight: 400;
	font-size: 20px;
	display: flex;
	align-items: center;
	text-align: right;
	white-space: nowrap;
}
.hero-midle{
	display: flex;
	flex-direction: column;
	margin-top: 150px;
}
.hero-bottom{
}
.hero h1{
	width: 60%;
	color: #fff;
	font-weight: 400;
	font-size: 48px;
}
.hero p{
	width: 60%;
	color: #fff;
	font-weight: 500;
	font-size: 22px;
	margin: 20px 0px;
}
.hero-btn{
	background-color: #4295e4;
	transition: all 0.3s ease;
	background: linear-gradient(90deg, #1baaf7, #573ff7);
	padding: 10px 20px;
}
.hero-btn:hover{
	background: linear-gradient(90deg, #3bb5ff, #6b55ff);
}
/*====================HERO==================*/

/*====================ADVANTAGES==================*/
.catalog{
	margin-top: 70px;
}
.catalog-title{
	text-align: center;
	font-weight: 100;
	font-size: 40px;
	display: flex;
	justify-content: center;
}
.catalog p{
	margin-bottom: 0px;
	font-weight: 300;
	font-size: 20px;
	display: flex;
	justify-content: center;
	text-align: center;
}
.catalog-bottom-label{
	text-align: center;
}
.catalog-cards{
	margin-top: 70px;
}
.catalog-bottom-label{
	margin-top: 10px;
	margin-bottom: 20px;
	font-weight: 400;
	font-size: 18px;
	display: flex;
	justify-content: center;
}
.product-card{
	display: flex;
	flex-direction: column;
	height: 100%;
}
.product-card-content h5{
	font-weight: 400;
	font-size: 30px;
}
.product-card-content h6{
	font-weight: 300;
	font-size: 20px;
}
.product-card-content span{
	font-weight: 500;
	font-size: 25px;
}
.product-card-content small{
	
	font-weight: 600;
	color: #099134;
}
.product-card:hover img{
	transform: scale(1.3);
}
.product-card-thumb{
	display: inline-block;
	overflow: hidden;
	margin-top: 20px;
}
.product-card-thumb img{
	width: 100%;
	height: 195px;
	object-fit: cover;
	transition: 1s;
	display: block;
	/*Для контроля размеров картинок задать height и object-fit*/
}
a.btn.btn-primary.catalog-card-btn{
	margin: 0px;
}
h5.d-flex.justify-content-center{
	margin: 0px;
}
.product-card-desc{
	color: ;
	font-size: 15px;
	font-weight: 600; 
}
.product-card-footer{
	margin-top: auto;
	padding-top: 10px;
}
.catalog-card-btn{
	margin-top: 10px;
	padding: 10px 50px;
	transition: all 0.3s ease;
	background: linear-gradient(90deg, #1baaf7, #573ff7);
}
.catalog-card-btn:hover{
	background: linear-gradient(90deg, #3bb5ff, #6b55ff);
}

.desc{
	margin-top: 100px;
	padding: 30px 0px;
	background: url('../img/milad-fakurian-GAnCCU7mqIU-unsplash.jpg') repeat center;
}
.desc-top{
	display: flex;
	margin-bottom: 30px;
}
.desc-top-title{
	display: flex;
	align-items: center;
}
.desc-top h2{
	font-weight: 100;
	font-size: 45px;
}
.desc-top-desc{
	display: flex;
	align-items: center;
	margin-left: 100px;
	padding-left: 50px;
	border-left: 5px solid black;
}
.desc-top p{
	font-weight: 200;
	font-size: 18px; font-weight:400; padding: 0px; margin: 0px;
}
.desc-item{
	display: flex;
	margin: 15px 0px;
	/* background-color: #f7f7f7; */
}
.desc-item-left{
	display: flex;
	align-items: flex-start;
	font-size: 66px;
	font-weight: 500;
	/* color: #ec6c06; */
}
.desc-item-right{
	margin-left: 20px;
	padding-top: 20px;
}
.desc-item-right h3{
	font-weight: 400;
}
.desc-item-right p{
	font-size: 18px;
	font-weight: 300;
}



.advantages{
	margin-top: 100px;
}
.advantages h2{
	font-weight: 100;
	font-size: 40px;
}
.advantages p{
	font-weight: 300;
	font-size: 25px;
}
.adv-card{
	padding: 15px 0px;
}
.adv-card-top{
	font-size: 20px;
	color: #2d3033;
	font-weight: 300;
}
.adv-card-bottom{
	padding: 0px 15px 10px 58px;
	color: #696969;
	font-size: 16px;
	font-weight: 300;
}
.adv-wraper-btn{
	margin-top: 0px; 
	margin-bottom: 20px; 
}
.adv-btn{
	padding: 10px 30px;
	transition: all 0.3s ease;
	background: linear-gradient(90deg, #1baaf7, #573ff7);
}
.adv-btn:hover{
	background: linear-gradient(90deg, #3bb5ff, #6b55ff);
}
/*====================ADVANTAGES==================*/

.rewievs{
	margin-top: 100px;
}

.rewievs h2{
	font-weight: 100;
	font-size: 45px;
	justify-content: center;
}
.rewievs p{
	font-weight: 100;
	font-size: 25px;
}
.rev-btn{
	transition: all 0.3s ease;
	background: linear-gradient(90deg, #1baaf7, #573ff7);
}
.rev-btn:hover{
	background: linear-gradient(90deg, #3bb5ff, #6b55ff);
}
.rev-card{
	padding: 20px;
	height: 100%;
}
.rev-card-top{
	display: flex;
}
.rev-card-body{
	margin-top: 10px;
	font-size: 15px;
	font-weight: 400;
	color: #271511;
	color: #000;
	-webkit-line-clamp: 10; /*Ограничение числа строк.*/
    display: -webkit-box; /*.........................*/
    -webkit-box-orient: vertical; /*.................*/
    overflow: hidden; /*Ограничение числа строк......*/
}
.rev-card-top-left{
	margin-right: 10px;
}
.rev-card-top-left img{
	width: 44px;
	height: 44px;
	border-radius: 999px;
	object-fit: cover;
	background: #f1f3f5;
}

.rev-name {
	font-weight: 600;
	color: #111;
}
.rev-stars svg {
	width: 14px;
	height: 14px;
}
.rev-date {
	margin-left: 10px;
	color: #adb5bd;
	font-size: 12px;
}

.showrooms{
	margin-top: 100px;
	padding: 50px;
	background-color: #202022;
	color: #fff;
}
.showrooms h2{
	font-weight: 100;
	font-size: 45px;
}
.showrooms p{
	font-weight: 300;
	font-size: 18px;
}
div.col-12.col-lg-6.showrooms-img1{
	padding-right: 0px;
}
div.col-12.col-lg-6.showrooms-img2{
	padding-left: 0px;
}	
.sr-card{
	margin: 0px 1px;
	border: 2px solid #fff;
}
.sr-caption{
	padding: 20px 20px 10px 20px;
}
.sr-media img{
	width: 100%;
	height: 200px;
	object-fit: cover;
}


.footer{
	padding-top: ;
	padding-bottom: 50px;
	background-color: #202022;
	color: #fff;
}
.footer-items{
	display: flex;
}
.footer-left{
	padding: 50px 0px 50px 0px;
}
.footer-left h2{
	font-weight: 300;
}
.footer-left p{
	font-size: 36px;
}
.footer-right{
	padding: 50px 0px 50px 0px;
	font-weight: 400;
	font-size: 16px;
	
}
.footer-right span{
	font-size: px;
}


/*====================MEDIA==================*/
@media (max-width: 992px) {
	.hero-top-logo img{
		height: 50px;
		width: 100%;
	}
	.hero-top-tg{
	font-weight: 400;
	font-size: 18px;
}
.hero-top-tg img{
	margin-right: 5px;
	width: 30px;
	object-fit: cover;
}
.hero-top-phone{
	color: #fff;
	font-weight: 400;
	font-size: 18px;
}
	.hero h1{
	width: 70%;
	color: #fff;
	font-weight: 300;
	font-size: 44px;
}
.hero p{
	width: 70%;
	color: #fff;
	font-weight: 500;
	font-size: 18px;
	}
	.catalog-title{
	text-align: center;
	font-weight: 100;
	font-size: 30px;
	
	}
	.catalog p{
	margin-bottom: 50px;
	font-weight: 400;
	font-size: 16px;
	}
	.desc{
	margin-top: 50px;
	}
	.desc-top h2{
	font-weight: 100;
	font-size: 30px;
	}
	.desc-top p{
	font-weight: 300;
	font-size: 14px;
	padding: 0px;
	margin: 0px;
	}
	.advantages h2{
	font-weight: 100;
	font-size: 30px;
}
	.advantages p{
	font-weight: 300;
	font-size: 16px;
	}
	.rewievs{
	margin-top: 50px;
}
	.rewievs h2{
		font-weight: 100;
		font-size: 30px;
	}
	.rewievs p{
		font-weight: 300;
		font-size: 16px;
	}
	div.col-12.col-lg-6.showrooms-img1{
	/* border: 5px solid red; */
	padding-right: 12px;
}
	div.col-12.col-lg-6.showrooms-img2{
	/* border: 5px solid red; */
	padding-left: 12px;
	}
	.sr-card{
	margin: 1px 0px;
	}
}

@media (max-width: 767px) {
	.hero-top-right{
		display: block;
	}
	.hero h1{
	width: 70%;
	color: #fff;
	font-weight: 300;
	font-size: 40px;
	}
	.hero p{
	width: 70%;
	color: #fff;
	font-weight: 500;
	font-size: 18px;
	}
	.catalog-title{
	font-weight: 100;
	font-size: 30px;
	justify-content: center;
	}
	.catalog p{
	justify-content: start;
	margin-bottom: 50px;
	font-weight: 400;
	font-size: 20px;
	}
	.desc{
	margin-top: 50px;
	}
	.desc-top{
	display: inline;
	margin-bottom: 30px;
	}
	.desc-top-desc{
	display: flex;
	align-items: center;
	border-left: 5px solid black;
	margin-top: 5px;
	margin-bottom: 15px;
	margin-left: 4px;
	padding-left: 20px;
	}
	.desc-item{
	margin: 0px 0px;
	}
	.showrooms h2{
	font-weight: 100;
	font-size: 30px;
	}
	.adv-card-bottom{
	}
	.hero-top-logo img{
	height: 50px;
	width: 100%;
	object-fit: cover;
}
}
@media (max-width: 576px) {
	.hero h1{
	width: 70%;
	color: #fff;
	font-weight: 300;
	font-size: 30px;
}
	.hero p{
	width: 70%;
	color: #fff;
	font-weight: 500;
	font-size: 18px;
	}
	.desc{
	margin-top: 20px;
	}
	.hero h1{
		width: 100%;
		font-weight: 300;
	}
	.hero p{
		width: 100%;
		font-weight: 500;
	}
	.desc-item-right p{
		font-weight: 300;
		font-size: 15px;
	}
	h1.d-flex{
		justify-content: start;
	}
	.catalog p{
	margin-bottom: 30px;
	font-size: 14px;
	justify-content: center;
	}
	.catalog-bottom-label{
		font-size: 15px;
	}
	.advantages{
		margin-top: 30px;
	}
	.rewievs h2{
	justify-content: center;
	}
	.hero-top-logo img{
	height: 50px;
	width: 100%;
	object-fit: cover;
	}
}

@media (max-width: 450px) {
	.hero-top-logo img{
		height: 40px;
		width: 100%;
		object-fit: cover;
	}
	.hero-top-tg{
	font-weight: 300;
	font-size: 18px;
}
.hero-top-tg img{
	margin-right: 5px;
	width: 30px;
	object-fit: cover;
}
	.hero-top-phone{
	color: #fff;
	font-size: 18px;
	}
}

@media (max-width: 410px) {
	.product-card-thumb img{
	width: 100%;
	height: 170px;
	}
	.rewievs h2{
	justify-content: start;
	}
	/* .rewievs h2{
	justify-content: center;
	} */
	.rewievs p{
	justify-content: center;
	}
	.hero-top-logo img{
		height: 30px;
		width: 100%;
		object-fit: cover;
	}
	.hero-top-tg{
		font-size: 15px;
	}
	.hero-top-phone{
	color: #fff;
	font-weight: 300;
	font-size: 15px;
	display: flex;
	align-items: center;
	}
}/*====================MEDIA==================*/