

@font-face {
	font-family: 'ofont'; 
	src: local('ofont.ru_Gnuolane.ttf'),
		url(../fonts/ofont.ru_Gnuolane.ttf); 
}

h1,h2,h3,h4,h5,h6,p,span,strong,a {
	font-family: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
	font-weight: inherit;
}

.header {
	/*background-color:#21302F; */
	width: 100%;
	min-height: 30px;
/*	position: fixed;
    top: 0;*/
    /*z-index: 100;*/
}

#nav a {
	color: white;
}
 .menu {
	color: white;
}


.welcome_text {
	color: white;
	margin-left: 10px;
	border-radius: 5px;
	padding: 10px;
	background-color: rgba(40,41,35, 0.5);
}

.welcome_global img {
	height: 580px;
	object-fit: cover;
	transform: scaleX(-1);

}

/*catalog */


.catalog_ {
	width: 100%;
	background-image: url(../image/aplications/products-bg.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	-webkit-box-shadow: 1px 1px 21px 2px rgba(34, 60, 80, 0.8) inset;
	-moz-box-shadow: 1px 1px 21px 2px rgba(34, 60, 80, 0.8) inset;
	box-shadow: 1px 1px 21px 2px rgba(34, 60, 80, 0.8) inset;
}

.catalog_item {
	width: 250px;
	height: 320px;
	color: rgb(33,48,47);
	text-decoration: none;
	background-color: #ffffff;
	border-radius: 5px;
		border:#21302f dashed 5px;
	margin: 4px;
	-webkit-box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.34);
	-moz-box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.34);
	box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.34);
}

.item_img img {
	transform: scale(0);
	animation: float 3s ease-in-out infinite;
}

.item_img {
	width: 250px;
	height: 200px;

}

.item_img_block {
	width: 250px;
	height: 200px;
	overflow: hidden;
}


.item_img img{
	width: 100%;
	height: 250px;
	object-fit: cover;
}

.item_title {

	width: 100%;
}

.item_title span{

	font-size: 20px;
}
.welcome_global img {
	object-position: 0px -10px
}

.title span {
	color: white;
	background-color: rgba(33,48,47,0.8);
}


/*media*/

@media (max-width: 767px) {
 
 .welcome_global img {
 	height: 350px;
 	object-position: -5px 20px;
 }
 .welcome_global {
 	height: 350px;
 }

 .welcome_text h1{
	font-size: 17px;
}
 .welcome_text p{
	font-size: 13px;
}

.img_fix {
	width: 185px;
}

.catalog_item img{
	width: 100%;
	height: 200px;

}
.catalog_item {
	display: flex;
	justify-content: center;
	width: 166px;
    height: 275px;
}

.fimg {
	width: 166px;
	height: 166px;
}
.item_img_block{
	width: 166px;
	height: 162px;
}

.service_block {
	max-width: 100%;
	width: 100%;
}

.feed_bootom_personal img {
	object-position: -225px 0px
}

.feed_text p{
	font-size: 13px;
} 

.carousel-item {
	width: 100%;
	height: 230px!important;
}
.carousel-item img{
	width: 100%;
	height: 230px!important;
	border-radius: 5px;
}


}

.float {

}

.p_text_style {
	font-size: 1.05rem;
	text-align: center;
	color: #2a3a39;
	font-weight: 400;
	line-height: 1.6;
}

.p_text_style_1 {
	font-size: 1.05rem;
	color: #2a3a39;
	font-weight: 400;
	line-height: 1.6;
}




@keyframes float {
	0% {
		transform: scale(0.7);
	}
	50% {
		transform: scale(0.8);
	}
	100% {
		transform: scale(0.7);
	}
}

/*feedback_block*/

.feedback_block {
	width: 100%;
	background-color: #21302f;
	border-radius: 5px;
}

.feedbacks_inputs {
	padding: 50px;
}

.feedbacks_inputs {
	padding: 50px;
}

.feedbacks_inputs_name input{
	padding: 5px;
	font-size: 20px;
}

.feedbacks_inputs_name {
	padding: 10px 0px;
}
.feedbacks_inputs_name input{
	width: 70%;
}

.feedbacks_inputs_phone_number input{
	width: 100%;
	padding: 5px;
	font-size: 20px;
}
.feedbacks_inputs_phone_number {
		padding: 10px 0px;
}

.feedback_input {
	width: 70%;
	height: 50px;
	border-radius: 5px;
	color: white;
	background-color: #f8b34b;
	margin: 10px 0px;
	position: relative;
	transition: 0.3s;
}

.feedback_input:hover {
	transform: scale(0.970);
	border:solid 1px white;
}



input {
		border: none;
}



.feedback_text {
margin-top:25px;
padding-left: 15px;
}

/*services_block*/

section {
	width: 100%;
}

.service_block {
	width: 638px;
	padding: 10px;
	margin: 10px;
	-webkit-box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.2);
	-moz-box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.2);
	box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.2);
	background-color: #ffffff;



}

.service_items {
	position: relative;
	/*background-color: black;*/
	border-radius: 5px;
	height: 250px;

}

.service_items_img {
	width: 100%;
	height: 100%;
	overflow: hidden;


}

.service_items_img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: 1s;
	
}

.service_text {
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
}

.service_text h5{
	text-align: center;
	background-color: rgba(248,179,75, 0.7);
	padding: 10px;
	transition: 1.3s;
}

.service_block:hover .service_text h5 {
	background-color: rgba(33,48,47, 0.7);
	transform: scale(1.4);
}

.service_block:hover .service_items_img img {
	transform: scale(1.2);
	
}

.service_block:hover {
	color: #21302F;

}

.service_block {
	text-decoration: none;
	color: #21302F;
}


/*regions*/
.regions {
	width: 100%;
	flex-wrap: wrap;
	display: flex;
	justify-content: center;
	text-align: center;
}

.region_items {
	margin: 10px;
	border:10px solid #21302f;
	border-radius: 3px;
	width: 250px;
	padding: 50px;	
	/*transition: 1s;*/
}

.region_items h6 {
	font-size: 30px;
}

.regions a {
	text-decoration: none;
	color: #21302f;
}

.region_items:hover .region_img img {

	transform: scale(1.2);

}

.region_items:hover {
	background-color: #F8B34B;
	transition: 1s;

}

.region_img img {
	transition: 1s;
}



/*feed_bootom*/
.feed_bootom {
	width: 100%;
	height: 350px;
	background-image: url(../image/aplications/feed_botom.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}


.feed_bootom_personal {

}

.feed_bootom_personal img{
	width: 100%;
	height: 350px;
	object-fit: cover;

}

.feed_text {
	color: white;
}

/*footer*/
footer {
	width: 100%;
	/*height: 350px;*/
	background-color: #21302F;
}

.footer_icon {
}

.footer_icon img {
	max-width: 100%;
	height: 75px;
} 

.footer_text {
	color: white;
}
.footer_text_dark {
	color: #223130;

}

.footer_text a {
	color: white;
	text-decoration: none;
}

.footer_text_dark a {
	color: #223130;
	text-decoration: none;
}

.footer_nav {
 margin-bottom: 20px;
 text-align: center;
}

.footer_nav ul {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	list-style: none;
}

.footer_nav a{
	text-decoration: none;
	margin: 10px;
	/*color: #F8B34B;*/
}

.footer_nav ul>li>a:hover {
	color: #F8B34B!important;
	transition: 0.3s;
}


/*scrol_anim*/
.js-scroll {
  opacity: 0;
  transition: opacity 500ms;
}

.js-scroll.scrolled {
  opacity: 1;
}

.scrolled.fade-in {
  animation: fade-in 1s ease-in-out both;
}

.scrolled.fade-in-bottom {
  animation: fade-in-bottom 1s ease-in-out both;
}

.scrolled.slide-left {
  animation: slide-in-left 1s ease-in-out both;
}

.scrolled.slide-right {
  animation: slide-in-right 1s ease-in-out both;
}

/* ----------------------------------------------
 * Generated by Animista on 2021-2-11 23:32:31
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

@keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}



/*knopka-zvonka*/
.callback-bt {
    background: #223130;
    border-radius: 50%;
    box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3);
    cursor: pointer;
    border: 2px solid transparent;
    display: block;
    height: 75px;
    width: 75px;
    text-align: center;
    text-decoration: none;
    position: fixed;
    right: 8%;
    bottom: 7%;
    z-index: 999;
    transition: .3s ease-in-out;
    -webkit-animation: hoverWave linear 1s infinite;
    animation: hoverWave linear 1s infinite;
}

.callback-bt:hover {
    background: #fff;
    border: 2px solid #F8B34C;
}

.callback-bt .text-call {
    height: 75px;
    width: 75px;
    border-radius: 50%;
    position: relative;
}

.callback-bt .text-call:after {
    content: '\f095';
    display: block;
    font-family: fontawesome;
    color: #fff;
    font-size: 38px;
    line-height: 75px;
    height: 75px;
    width: 75px;
    opacity: 1;
    transition: .3s ease-in-out;
    animation: 1200ms ease 0s normal none 1 running shake;
    animation-iteration-count: infinite;
}

.callback-bt .text-call:hover:after {
    opacity: 0;
}

.callback-bt .text-call span {
    color:#223130;
    display: block;
    left: 50%;
    top: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    opacity: 0;
    font-size: 11px;
    line-height: 12px;
    font-weight: 500;
    text-transform: uppercase;
    transition: .3s ease-in-out;
    font-family: 'montserrat', Arial, Helvetica, sans-serif;
}

.callback-bt .text-call:hover span {
    opacity: 1;
}

@keyframes hoverWave {
    0% {
        box-shadow: 0 8px 10px rgba(248,179,76, 0.3), 0 0 0 0 rgba(248,179,76, 0.2), 0 0 0 0 rgba248,179,76, 0.2)
    }

    40% {
        box-shadow: 0 8px 10px rgba(248,179,76, 0.3), 0 0 0 15px rgba(248,179,76, 0.2), 0 0 0 0 rgba(248,179,76, 0.2)
    }

    80% {
        box-shadow: 0 8px 10px rgba(248,179,76, 0.3), 0 0 0 30px rgba(248,179,76, 0), 0 0 0 26.7px rgba(248,179,76, 0.067)
    }

    100% {
        box-shadow: 0 8px 10px rgba(248,179,76, 0.3), 0 0 0 30px rgba(248,179,76, 0), 0 0 0 40px rgba(248,179,76, 0.0)
    }
}

/* animations icon */

@keyframes shake {
    0% {
        transform: rotateZ(0deg);
        -ms-transform: rotateZ(0deg);
        -webkit-transform: rotateZ(0deg);
    }

    10% {
        transform: rotateZ(-30deg);
        -ms-transform: rotateZ(-30deg);
        -webkit-transform: rotateZ(-30deg);
    }

    20% {
        transform: rotateZ(15deg);
        -ms-transform: rotateZ(15deg);
        -webkit-transform: rotateZ(15deg);
    }

    30% {
        transform: rotateZ(-10deg);
        -ms-transform: rotateZ(-10deg);
        -webkit-transform: rotateZ(-10deg);
    }

    40% {
        transform: rotateZ(7.5deg);
        -ms-transform: rotateZ(7.5deg);
        -webkit-transform: rotateZ(7.5deg);
    }

    50% {
        transform: rotateZ(-6deg);
        -ms-transform: rotateZ(-6deg);
        -webkit-transform: rotateZ(-6deg);
    }

    60% {
        transform: rotateZ(5deg);
        -ms-transform: rotateZ(5deg);
        -webkit-transform: rotateZ(5deg);
    }

    70% {
        transform: rotateZ(-4.28571deg);
        -ms-transform: rotateZ(-4.28571deg);
        -webkit-transform: rotateZ(-4.28571deg);
    }

    80% {
        transform: rotateZ(3.75deg);
        -ms-transform: rotateZ(3.75deg);
        -webkit-transform: rotateZ(3.75deg);
    }

    90% {
        transform: rotateZ(-3.33333deg);
        -ms-transform: rotateZ(-3.33333deg);
        -webkit-transform: rotateZ(-3.33333deg);
    }

    100% {
        transform: rotateZ(0deg);
        -ms-transform: rotateZ(0deg);
        -webkit-transform: rotateZ(0deg);
    }
}


.page_img_style img {
	width: 100%;
	height: 350px;
	object-fit: cover;
}


.asphalt ul {
	list-style-position: inside;
	text-align: center;
	padding: 0px;
}




/*slide index*/
.carousel-item {
	width: 100%;
	height: 500px;
	border-radius: 5px;
}

.carousel-item img{
	width: 100%;
	height: 500px;
	object-fit: cover;
	border-radius: 5px;
	object-position: center;
}

.carousel-inner {
	border-radius: 5px;
}