:root {

	--white: #fff;

	--black: #000;

	--yelow: #eebd1f;

	--blue: #06132c;

	--brown: #be7b30;

	--open-sans: "Open Sans", serif;

	--montserrat: "Montserrat", serif;

}

body{

	font: 16px/26px var(--open-sans);

	color:var(--black);

}

#wrapper{

	position: relative;

	overflow: hidden;

	width: 100%;

	padding: 59px 31px 0;

}

.yellow-color{

	color: var(--yelow);

}

@media only screen and (min-width: 1399.98px){

	.container{

		max-width: 1193px;

	}

}

#header{

	position: absolute;

	left: 0;

	right: 0;

	top: 0;

	z-index: 10;

}

#header:before{

	position: absolute;

	left: 0;

	right: 0;

	top: 0;

	height: 59px;

	background: var(--white);

	content: '';

	z-index: -1;

}

#header .right-top{

	border-radius: 0 0 13px 13px;

	background: var(--yelow);

	padding: 16px 24px 17px 40px;

	position: relative;

	margin: 0 12% 0 1%;

}

#header .logo{

	max-width: 199px;

	display: block;

	padding: 7px 0 6px;

}

#header .right-top:before {

    position: absolute;

    left: -29px;

    top: -24px;

    bottom: 0;

    content: '';

    background: var(--yelow);

    width: 80px;

    border-radius: 10px;

    transform: rotate(62deg);

    margin: 0;

    height: 60px;

	z-index: -1;

}

#header .right-top:after {

    position: absolute;

    right: -22px;

    top: -40px;

    bottom: 0;

    content: '';

    background: var(--yelow);

    width: 99px;

    border-radius: 10px;

    transform: rotate(31deg);

    margin: 0;

    height: 78px;

    z-index: -1;

}

#header .right-top .contact{

	display: flex;

	justify-content: center;

}

#header .right-top .info,

#header .right-top .social{

	margin: 0;

	padding: 0;

	list-style: none;

	display: flex;

	gap: 52px;

}

#header .right-top .social{

	gap: 17px;

}

#header .right-top .info a,

#header .right-top .social a{

	text-decoration: none;

	color: var(--white);

	transition: all ease 0.5s;

}

#header .right-top .info a,

#header .right-top .social a{

	font-size: 16px;

	line-height: 1.2;

	font-weight: bold;

}

#header .right-top .social a{

	font-size: 20px;

}

#header .right-top .info a:hover,

#header .right-top .social a:hover{

	color: var(--black);

}

#header .nav-area .navbar-collapse{

	justify-content: center;

}

@media only screen and (min-width: 767.98px){

	#header .close-toggler{

		display: none;

	}

	#header .nav-area .nav-item:hover .dropdown-menu{

		display: block;

	}

	#header .nav-area .nav-item:hover .dropdown-menu .dropdown-item:hover{

		background: #eebd1f;

		color: #fff;

	}

}

#header .nav-area .navbar-nav .nav-link{

	font-size: 16px;

	font-weight: bold;

	text-transform: uppercase;

	color: var(--black);

}

#header .nav-area .navbar-nav .nav-link.active,

#header .nav-area .navbar-nav .nav-link:hover{

	color: var(--yelow);

}

#header .nav-area .navbar-nav{

	flex-grow: 1;

    gap: 30px;

	justify-content: center;

	padding: 14px 0 18px;

}

#header .right-bottom{

	position: relative;

}

#header .right-bottom:after{

	position: absolute;

	left: 0;

	right: 123px;

	top: -2px;

	bottom: 0;

	content: '';

	background: var(--white);

	z-index: -1;

}

#header .right-bottom:before{

	position: absolute;

	right: 100%;

	top: -2px;

	bottom: 0;

	content: '';

	background: var(--white);

	z-index: -1;

	width: 1000%;

	margin-right: -2px;

}

#header .right-bottom .btn-area{

	position: absolute;

	left: 100%;

	top: 0;

	min-width: 215px;

	margin: 25px 0 0 -25px;

}

.btn-primary{

	background: var(--yelow);

	border: 0;

	font: bold 16px/1.2 var(--montserrat);

	max-width: 215px;

	border-radius: 30px;

	padding: 8px 8px 8px 29px;

	display: flex;

    justify-content: space-between;

    align-items: center;

}

.btn-primary .ico{

	width: 41px;

	height: 41px;

	border-radius: 100%;

	background: var(--white);

	color: var(--black);

	display: inline-block;

	vertical-align: middle;

	padding: 11px 0;

}

.btn-primary .txt{

	display: inline-block;

	vertical-align: middle;

}

.btn-primary:hover{

	background: var(--blue);

}

.about-area .btn-primary{

	box-shadow: 0px 7px 16px -2px rgba(0,0,0,0.29);

	-webkit-box-shadow: 0px 7px 16px -2px rgba(0,0,0,0.29);

	-moz-box-shadow: 0px 7px 16px -2px rgba(0,0,0,0.29);

}

#header .right-bottom .nav-area{

	margin-right: 108px;

	position: relative;

}

#header .right-bottom .nav-area:before{

	background: url(../images/bg-overlay.png) no-repeat;

	background-size: cover;

	width: 115px;

	height: 99px;

	content: '';

	position: absolute;

	left: 100%;

	top: -9px;

	margin-left: -16px;

	pointer-events: none;

	z-index: -1;

}

.hero-section{

	min-height: 944px; 

	background-size: cover;

	background-position: center;

	border-radius: 30px;

	overflow: hidden;

	display: flex;

	align-items: flex-end;

	padding-bottom: 57px;

	position: relative;

}

.hero-section .curve,

.breadcrumbs .curve{

	width: 30px;

    height: 30px;

    overflow: hidden;

    position: absolute;

    top: 88px;

    transform: rotate(90deg);

}

.breadcrumbs .curve{

	left: 0;

}

.hero-section .curve:before,

.breadcrumbs .curve:before{

    bottom: 0;

    left: 0;

    box-shadow: -30px 30px 0 0 #fff;

	content: "";

    display: block;

    width: 200%;

    height: 200%;

    position: absolute;

    border-radius: 50%;

}

.breadcrumbs:after{

	display: none;

}

.hero-section .caption{

	text-align: center;

	color: var(--white);

}

.hero-section .caption h1{

	margin: 0 0 25px;

	font: 800 60px/1 var(--montserrat);

}

.hero-section .caption .txt{

	max-width: 70%;

	margin: 0 auto;

	font: 700 18px/1.2 var(--open-sans);

}

.heading .title{

	display: inline-block;

	font-weight: bold;

	font-family: var(--montserrat);

	text-transform: uppercase;

	color: var(--yelow);

	position: relative;

	padding-left: 22px;

}

.heading .title:before,

.heading .title:after{

	content: '';

	width: 3px;

	height: 18px;

	background: var(--yelow);

	position: absolute;

	left: 2px;

	top: 3px;

	transform: rotate(23deg);

}

.heading .title:after{

	left: 12px;

}

.heading h2{

	color: var(--blue);

	font: 700 40px/1.2 var(--montserrat);

}

.heading h2 span{

	font-weight: 800;

}

.about-area{

	padding: 60px 0;

}

.about-area .heading{

	padding-right: 30px;

}

.about-area .heading h2{

	margin: 0 0 13px;

}

.about-area .info{

	display: flex;

	gap: 30px;

}

.about-area p{

	margin-bottom: 26px;

}

.about-area .info .right .list{

	margin: 0;

	padding: 15px 0 40px;

	list-style: none;

}

.about-area .info .list li{

	padding-left: 40px;

	position: relative;

	font: 700 18px/1.2 var(--open-sans);

	padding-bottom: 14px;

}

.about-area .info .list li:before{

	font-family: "Font Awesome 6 Free";

	-webkit-font-smoothing: antialiased;

    display: var(--fa-display, inline-block);

    font-style: normal;

    font-variant: normal;

    line-height: 1;

    text-rendering: auto;

	font-weight: 900;

	content: '\f058';

	position: absolute;

	left: 0;

	top: 4px;

	color: var(--yelow);

}

.about-area .img-right{

	position: relative;

	margin: 0 0 0 3px;

	padding: 7px 0 0;

}

.about-area .img-right img{

	border-radius: 280px 40px 40px 40px;

}

.about-area .img-right .caption{

	position: absolute;

	left: -50px;

	top: 0;

	width: 210px;

	height: 210px;

	border-radius: 100%;

	background: var(--brown);

	border: 10px solid var(--white);

	display: flex;

	flex-direction: column;

	text-align: center;

	justify-content: center;

	align-items: center;

	padding-bottom: 25px;

}

.about-area .img-right .caption .num{

	font: 700 72px/1 var(--open-sans);

	color: var(--white);

	padding: 0 0 3px;

}

.about-area .img-right .caption .txt{

	font: 700 18px/1.2 var(--open-sans);

	text-transform: uppercase;

	color: var(--white);

}

.our-services{

	background: #f5f6f8;

	padding: 63px 0 70px;

	border-radius: 40px;

}

.our-services .heading{

	text-align: center;

	padding-bottom: 29px;

}

.our-services .heading h2{

	font-size: 48px;

}

.our-services .heading h2 span{

	font-weight: 700;

}

.our-services .frame{

	padding: 28px;

	padding-bottom: 41px;

	background: var(--white);

	border-radius: 30px;

	text-align: center;

	position: relative;

	margin-bottom: 60px;

	transition: all ease 0.5s;

	transform: translateY(0);

}

.our-services .frame:hover{

	box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.15);

	-webkit-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.15);

	-moz-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.15);

	transform: translateY(-7px);

}

.our-services .frame .img{

	overflow: hidden;

	border-radius: 15px;

	margin-bottom: 33px;

}

.our-services .frame img{

	transition: all ease 0.5s;

}

.our-services .frame:hover .img img{

	transform: scale(1.1);

}

.our-services .frame h3{

	font: 700 24px/1.2 var(--open-sans);

	margin: 0 0 26px;

}

.our-services .frame h3 a{

	text-decoration: none;

	color: var(--blue);

	transition: all ease 0.5s;

}

.our-services .frame p{

	color: #5e5e5e;

	line-height: 24px;

}

.our-services .btn-holder{

	text-align: center;

	position: absolute;

	left: 0;

	right: 0;

	bottom: -27px;

}

.our-services .btn-holder a{

	text-decoration: none;

	color: var(--white);

	display: inline-block;

}

.our-services .btn-holder .ico{

	width: 63px;

	height: 63px;

	border-radius: 100%;

	border: 5px solid var(--white);

	background: var(--yelow);

	display: block;

	margin: 0 auto;

	font-size: 30px;

	display: flex;

	align-items: center;

	justify-content: center;

	transform: rotate(-45deg);

	transition: all ease 0.5s;

}

.our-services .frame:hover .btn-holder a .ico{

	transform: none;

}

.chat-area{

	background: url('../images/bg-road-paving.png') no-repeat;

	background-size: cover;

	min-height: 395px;

	border-radius: 40px;

	margin: 18px 0 40px;

	padding: 15px 0;

	display: flex;

	align-items: center;

}

.chat-area h3{

	font: 48px/59px var(--montserrat);

	color: var(--white);

}

.chat-area .btn-area{

	margin-bottom: 44px;

    margin-top: 10px;

}

.chat-area .btn-area .btn-primary{

	max-width: 273px;

    margin-left: 4px;

}

.chat-area .call-area{

	text-align: center;

}

.chat-area .call-area p{

	font: 700 16px/1.2 var(--montserrat);

	color: var(--white);

	margin: 0 0 5px;

}

.chat-area .call-area a{

	text-decoration: none;

	font: 700 36px/1.2 var(--montserrat);

	color: var(--yelow);

	transition: all ease 0.5s;

}

.chat-area .call-area a:hover{

	opacity: 0.7;

}

.choose-us{

	border-radius: 40px;

	overflow: hidden;

	background: var(--brown);

}

.choose-us .img{

	margin-left: calc((100vw - 1232px) / -2);

    margin-right: -54px;

}

.choose-us .img img{

	display: block;

	width: 100%;

	height: auto;

}

.choose-us .align-right{

	padding: 82px 0 0 4px;

}

.choose-us .heading h2{

	color: var(--white);

	font-weight: normal;

	font-size: 48px;

	padding-right: 2px;

	margin: 0 0 16px;

}

.choose-us .align-right p{

	color: #ecd8c1;

	line-height: 26px;

	margin: 0 0 34px;

}

.choose-us .align-right .list{

	margin: 0;

	padding: 0 0 13px;

	list-style: none;

}

.choose-us .align-right .list li{

	position: relative;

	display: inline-block;

	width: 48%;

	color: var(--white);

	font: 700 20px/1.2 var(--montserrat);

	padding-left: 64px;

	padding-bottom: 29px;

}

.choose-us .align-right .list li:before{

    font-family: "Font Awesome 6 Free";

    -webkit-font-smoothing: antialiased;

    display: var(--fa-display, inline-block);

    font-style: normal;

    font-variant: normal;

    line-height: 1;

    text-rendering: auto;

    font-weight: 900;

    content: '\f00c';

    position: absolute;

    left: 0;

    top: 0;

    color: var(--white);

	font-size: 30px;

	background: var(--yelow);

	width: 43px;

	height: 43px;

	border-radius: 100%;

	display: flex;

	justify-content: center;

	align-items: center;

}

.choose-us .features{

	display: flex;

	gap: 29px;

	margin: 0 0 50px;

}

.choose-us .features .box{

	background: rgba(255, 255, 255, 0.2);

	border: 1px dashed var(--white);

	border-radius: 25px;

	min-height: 208px;

	padding: 30px 30px 25px;

	display: flex;

	flex-direction: column;

    justify-content: space-between;

}

.choose-us .features .title{

	font: 700 16px/1.2 var(--open-sans);

	color: var(--white);

}

.choose-us .features .count{

	font: 700 48px/1.2 var(--montserrat);

	color: var(--white);

}

.choose-us .align-right .btn-area .btn-primary{

	max-width: 196px;

	box-shadow: 0px 7px 16px -2px rgba(0, 0, 0, 0.29);

    -webkit-box-shadow: 0px 7px 16px -2px rgba(0, 0, 0, 0.29);

    -moz-box-shadow: 0px 7px 16px -2px rgba(0,0,0,0.29);

}

.recent-projects{

	padding: 54px 0 59px;

}

.recent-projects .heading{

	text-align: center;

}

.recent-projects .heading h2{

	font-size: 48px;

	margin: 0 0 16px;

}

.recent-projects .heading p{

	font-size: 24px;

	margin: 0 0 39px;

}

.recent-projects .projects-slider{

	padding-top: 76px;

}

.recent-projects .swiper-button-next,

.recent-projects .swiper-button-prev{

	position: absolute;

	top: 30px;

	width: 40px;

	height: 40px;

	border-radius: 100%;

	background: #f9f0d1;

	left: 50%;

	font-size: 0;

	line-height: 0;

	margin-left: 5px;

}

.recent-projects .swiper-button-prev{

	margin-left: -50px;

}

.recent-projects .swiper-button-prev:before,

.recent-projects .swiper-button-next:before {

    font-family: "Font Awesome 6 Free";

    -webkit-font-smoothing: antialiased;

    display: var(--fa-display, inline-block);

    font-style: normal;

    font-variant: normal;

    line-height: 1;

    text-rendering: auto;

    font-weight: 900;

    content: '\f060';

    position: absolute;

    left: 10px;

    top: 9px;

    font-size: 20px;

	color: var(--brown);

}

.recent-projects .swiper-button-next:before{

	content: '\f061';

}

.recent-projects .swiper-button-prev:after,

.recent-projects .swiper-rtl .swiper-button-next:after,

.recent-projects .swiper-button-next:after,

.recent-projects .swiper-rtl .swiper-button-prev:after{

	display: none;

}

.recent-projects  .slick-slide {

	transition: transform 0.3s ease;

	position: relative;

}

.recent-projects .slick-slide .img img{

	padding: 0 12px;

}

.recent-projects .slick-slide .magnify,

.recent-projects .swiper-slide .magnify{

	width: 53px;

	height: 53px;

	border-radius: 100%;

	background: var(--yelow);

	position: absolute;

	right: 17px;

	top: 15px;

	display: flex;

	align-items: center;

	justify-content: center;

	text-decoration: none;

	color: var(--white);

	font-size: 24px;

	opacity: 0;

}

.recent-projects .slick-track{

	padding-bottom: 70px;

}

.recent-projects .slick-slide .caption,

.recent-projects .swiper-slide .caption{

	position: absolute;

	left: 0;

	right: 0;

	bottom: -65px;

	background: var(--black);

	max-width: 490px;

	margin: 0 auto;

	padding: 25px 33px 30px;

	border-radius: 20px;

	color: var(--white);

	opacity: 0;

	transition: all ease 0.5s;

}

.recent-projects .slick-slide.slick-center .caption,

.recent-projects .slick-slide.slick-center .magnify,

.recent-projects .swiper-slide.swiper-slide-active .caption,

.recent-projects .swiper-slide.swiper-slide-active .magnify{

	opacity: 1;

}

.recent-projects .slick-slide .caption .title,

.recent-projects .swiper-slide .caption .title{

	display: block;

	font-weight: bold;

	font-size: 24px;

	margin-bottom: 8px;

}

.recent-projects .slick-slide .caption p,

.recent-projects .swiper-slide .caption p{

	font-size: 16px;

	line-height: 24px;

	margin: 0;

}

.slick-slider{

    position: relative;

    display:block;

    box-sizing: border-box;

    -webkit-user-select: none;

       -moz-user-select: none;

        -ms-user-select: none;

            user-select: none;

    -webkit-touch-callout: none;

    -khtml-user-select: none;

    -ms-touch-action: pan-y;

        touch-action: pan-y;

    -webkit-tap-highlight-color: transparent;

}

.slick-list{

    position: relative;

    display: block;

    overflow: hidden;

    margin: 0;

    padding: 0;

}

.slick-list:focus{

    outline: none;

}

.slick-list.dragging{

    cursor: pointer;

    cursor: hand;

}

.slick-slider .slick-track,

.slick-slider .slick-list{

    -webkit-transform: translate3d(0, 0, 0);

       -moz-transform: translate3d(0, 0, 0);

        -ms-transform: translate3d(0, 0, 0);

         -o-transform: translate3d(0, 0, 0);

            transform: translate3d(0, 0, 0);

}

.slick-track{

    position: relative;

    top: 0;

    left: 0;

    display: block;

    margin-left: auto;

    margin-right: auto;

}

.slick-track:before,

.slick-track:after{

    display: table;

    content: '';

}

.slick-track:after{

    clear: both;

}

.slick-loading .slick-track{

    visibility: hidden;

}

.slick-slide{

    display: none;

    float: left;

    height: 100%;

    min-height: 1px;

}

[dir='rtl'] .slick-slide{

    float: right;

}

.slick-slide img{

    display: block;

}

.slick-slide.slick-loading img{

    display: none;

}

.slick-slide.dragging img{

    pointer-events: none;

}

.slick-initialized .slick-slide{

    display: block;

}

.slick-loading .slick-slide{

    visibility: hidden;

}

.slick-vertical .slick-slide{

    display: block;

    height: auto;

    border: 1px solid transparent;

}

.slick-arrow.slick-hidden {

    display: none;

}

.testimonial-area{

	background: #f9f0d1;

	border-radius: 40px;

	padding: 70px 0 78px;

}

.testimonial-area .heading{

	margin-bottom: 31px;

}

.testimonial-area .heading h2{

	font-weight: normal;

	color: #000;

	font-size: 48px;

}

.testimonial-area .heading h2 span{

	font-weight: bold;

}

.testimonial-area .review{

	background: var(--white);

	padding: 16px 40px 18px;

	border-radius: 15px;

	display: flex;

	gap: 30px;

	align-items: center;

	margin-right: 18%;

}

.testimonial-area .review .num{

	font: 800 48px/1.2 var(--montserrat);

}

.testimonial-area .review ul{

	margin: 0;

	padding: 0;

	list-style: none;

}

.testimonial-area .review ul li{

	display: inline-block;

	vertical-align: middle;

	color: var(--yelow);

}

.testimonial-area .review p{

	margin: 0;

	color: #505050;

	font-size: 18px;

	font-family: var(--montserrat);

	font-weight: bold;

}

.testimonial-area .carousel{

	padding: 14px 0 10px 22px;

}

.testimonial-area .carousel:before{

	position: absolute;

	left: -30px;

	top: 0;

	bottom: 0;

	width: 1px;

	border: 1px dashed #c7c0a7;

	content: '';

}

.testimonial-area .carousel .top-holder{

	display: flex;

	justify-content: space-between;

	padding-bottom: 19px;

	align-items: center;

}

.testimonial-area .carousel .icon{

	width: 60px;

	height: 60px;

	background: var(--yelow);

	border-radius: 100%;

	display: flex;

	justify-content: center;

	align-items: center;

	color: var(--white);

	font-size: 28px;

}

.testimonial-area .carousel .btn-holder{

	display: flex;

	gap: 15px;

}

.testimonial-area .carousel-control-next, 

.testimonial-area .carousel-control-prev{

	position: static;

}

.testimonial-area .carousel .btn-holder button{

	width: 40px;

	height: 40px;

	background: var(--white);

	border-radius: 100%;

	display: flex;

	align-items: center;

	justify-content: center;

}

.testimonial-area .carousel .btn-holder button i{

	color: var(--brown);

}

.testimonial-area .blockquote{

    margin-bottom: 0;

}

.testimonial-area .blockquote q{

	color: #2d313a;

	font: italic 20px/32px var(--open-sans);

	display: block;

	padding-bottom: 26px;

	padding-right: 19px;

	quotes: none;

}

.testimonial-area .blockquote q:after,

.testimonial-area .blockquote q:before{

    display: none;

}

.testimonial-area .blockquote q p{

    margin: 0;

}

.testimonial-area .blockquote cite{

	display: block;

	font: 700 18px/22px var(--montserrat);

	color: #1b1b1b;

}

 



#footer{

	margin: 53px 0 40px;

	padding: 40px 0 4px;

	background: #2e2c27;

	border-radius: 40px;

	overflow: hidden;

}

#footer .logo{

	max-width: 262px;

	display: block;

	padding-bottom: 21px;

}

#footer .social{

	margin: 0;

	padding: 0;

	list-style: none;

	text-align: center

}

#footer .social li{

	display: inline-block;

	vertical-align: middle;

	margin: 0 7px;

}

#footer .social a{

	text-decoration: none;

	color: var(--white);

	font-size: 20px;

	transition: all ease 0.5s;

}

#footer .social a:hover{

	opacity: 0.7;

}

#footer h3{

	margin: 0 0 20px;

	color: var(--white);

	font: 700 18px/1.2 var(--montserrat);

}

#footer .quick-links{

	margin: 0;

	padding: 0;

	list-style: none;

}

#footer .quick-links li{

	margin-bottom: 3px;

}

#footer .quick-links a{

	text-decoration: none;

	color: #bdbdbe;

	transition: all ease 0.5s;

	font-size: 14px;

}

#footer .quick-links a:hover{

	color: var(--white);

}

#footer .info-holder{

	display: flex;

	align-items: center;

	position: relative;

	padding-left: 36px;

	padding-bottom: 21px;

}

#footer .info-holder .txt{

	display: block;

	color: #898885;

	font-size: 14px;

	line-height: 1;

}

#footer .info-holder a,

#footer .info-holder .office-hours{

	text-decoration: none;

	color: var(--white);

	font-size: 14px;

	transition: all ease 0.5s;

}

#footer .info-holder a:hover{

	opacity: 0.7;

}

#footer .info-holder .tel{

	font-size: 20px;

	font-weight: 600;

}

#footer .info-holder .ico{

	position: absolute;

	left: 5px;

	top: 5px;

	color: var(--yelow);

	font-size: 20px;

}

#footer .quick-links.add li:first-child,

#footer .quick-links.add li:nth-child(2){

	width: 48%;

	display: inline-block;

}

#footer .border-top{

	margin: 16px 0 0;

	border-top: 3px solid var(--white) !important;

}

#footer .border-top p{

	margin-top: 17px;

	color: var(--white);

	color: #9a9a9a;

	font-size: 14px;

}

#footer .border-top p a{

	text-decoration: none;

	color: #9a9a9a;

}

#footer .border-top p a:hover{

	text-decoration: underline;

	color: var(--white);

}

.breadcrumbs{

	min-height: 290px;

	background: url('../images/asphalt-road-repair.png') no-repeat center center;

	background-size: cover;

	border-radius: 30px;

	position: relative;

	overflow: hidden;

	display: flex;

	align-items: flex-end;

	justify-content: center;

	z-index: 1;

}

.breadcrumbs.services{

	background-image: url(../images/bg-our-services.jpg);

}

.breadcrumbs.about{

	background-image: url(../images/bg-about-us.jpg);

}

.breadcrumbs.contact{

	background-image: url(../images/bg-contact-us.jpg);

}

.breadcrumbs.work{

	background-image: url(../images/bg-our-work.jpg);

}

.breadcrumbs::before{

	background: rgba(0, 0, 0, 0.5);

	position: absolute;

	left: 0;

	right: 0;

	top: 0;

	bottom: 0;

	content: '';

	z-index: -1;

}

.breadcrumbs h1{

	text-align: center;

	color: var(--white);

	margin: 0 0 30px;

}

.breadcrumbs .breadcrumbs-area{

	text-align: center;

}

.breadcrumbs .breadcrumbs-area .sub-menu{

    margin: 0;

	padding: 16px 40px;

    list-style-type: none;

    background: var(--yelow);

    min-width: 350px;

    display: inline-block;

    min-height: 30px;

    line-height: 30px;

    clip-path: polygon(6% 0, 94% 0, 100% 100%, 0 100%);

}

.breadcrumbs .breadcrumbs-area .sub-menu li{

	display: inline-block;

	color: var(--white);

}

.breadcrumbs .breadcrumbs-area .sub-menu li a:after {

    content: "\f101";

    position: relative;

    margin: 0 10px;

    font-weight: 600;

    font-size: 15px;

    color: #fff;

    font-family: 'Font Awesome 6 Free';

}

.breadcrumbs .breadcrumbs-area .sub-menu li a:hover{

	color: var(--black);

}

.breadcrumbs .breadcrumbs-area .sub-menu a{

	text-decoration: none;

	color: var(--white);

	transition: all ease 0.5s;

}

.projects-slider.unslick{

	display: flex;

	flex-wrap: wrap;

	gap: 20px;

	padding-top: 0;

}

.projects-slider.unslick .item {

	flex: 0 0 calc(25% - 20px); 

	box-sizing: border-box;

}

.projects-slider.unslick .magnify,

.projects-slider.unslick .caption{

	display: none;

}

.projects-slider.unslick .item .img img{

	cursor: pointer;

	transition: all ease 0.5s;

	transform: scale(1.1);

}

.projects-slider.unslick .item .img{

	overflow: hidden;

	border-radius: 12px;

}

.projects-slider.unslick .item:hover .img img{

	transform: scale(1);

}

.contact-page{

	padding: 60px 0;

	background: var(--seashell);

}

.contact-page .img-logo{

	max-width: 35px;

	margin: 0 auto 10px;

}

.contact-page .title-area .main-title{

	font-size: 36px;

}

.contact-page .contact-box,

.contact-page .contact-form{

	padding: 15px;

}

.contact-page .contact-box .small-title{

	margin-bottom: 10px;

}

.contact-page .contact-box .main-title{

	font-size: 33px;

	line-height: 1;

	font-weight: bold;

	margin-bottom: 25px;

}

.contact-page .contact-box .text p{

	margin-bottom: 40px;

}

.contact-page .contact-box .box{

	border: 2px solid #dbe3df;

    border-radius: 8px;

	padding: 20px 15px;

	margin-bottom: 20px;

	display: flex;

	align-items: center;

}

.contact-page .contact-box .box .ico{

	color: var(--yelow);

	font-size: 35px;

	min-width: 60px;

	min-height: 50px;

	text-align: center;

}

.contact-page .contact-box .box .txt{

	padding-left: 20px;

}

.contact-page .contact-box .box .txt address{

	margin: 0;

}

.contact-page .contact-box .box .title{

	display: block;

	font-size: 18px;

	padding-bottom: 5px;

}

.contact-page .contact-box .box .txt p{

	margin: 0;

	color: var(--black);

}

.contact-page .contact-box .box .txt .link{

	text-decoration: none;

	color: var(--black);

	transition: all ease 0.5s;

}



.contact-page .contact-box .box .txt .link:hover{

	opacity: 0.7;

}

.contact-page .contact-form{

	background: var(--white-color);

	box-shadow: 4px 19px 73px #f1f1f1;

	padding: 50px;

	border-radius: 10px;

}

.contact-page .contact-form label{

	display: block;

	font-size: 14px;

    font-weight: 500;

	margin-bottom: 2px;

}

.contact-page .contact-form .form-control,

.contact-page .contact-form .form-select{

	height: 40px;

	font-size: 14px;

	box-shadow: none;

	margin-bottom: 14px;

}

.contact-page .contact-form label sup{

	color: #ff0000;

}

.contact-page .contact-form textarea.form-control{

	min-height: 130px;

	resize: none;

}

.contact-page .contact-form .btn-submit{

	color: var(--white-color);

    text-transform: uppercase;

    background: var(--yelow);

    border-radius: 10px;

    font: 700 16px / 1.2 var(--open-sans);

    padding: 19px 34px;

    transition: 0.5s;

	border: 0;

	width: 100%;

}

.contact-page .contact-form .btn-submit:hover{

	background: var(--black);

	color: var(--white);

}

.map-holder {

	border-radius: 20px;

	overflow: hidden;

}

.map-inner iframe {

	border: 0;

	width: 100%;

	height: 350px;

}



@media only screen and (min-width: 768px){

    .recent-projects .swiper {

    	width: 100%;

    	max-width: 2000px;

    	padding: 80px 60px 70px 60px;

    }

    .recent-projects .swiper-slide {

    	width: 318px; 

    	height: 480px;

    	border-radius: 20px;

    	display: flex;

    	justify-content: center;

    	align-items: center;

    	font-size: 24px;

    	font-weight: bold;

    	transition: width 0.9s ease, background 0.4s ease;

    }

    .recent-projects .swiper-slide-active {

    	width: 678px; 

    	z-index: 2;

    	height: 480px;

    }

    .recent-projects .swiper-slide img{

    	height: 480px;

    	object-fit: cover;

    	border-radius: 20px;

    }

}



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

	.choose-us .img img{

		height: 989px;

		object-fit: cover;

	}

}

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

	#header .right-bottom .btn-area{

		margin-left: -44px;

	}

}

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

	#header .right-bottom .btn-area {

        margin-left: -144px;

    }

	#header .right-bottom:after{

		right: 240px;

	}

	#header .right-bottom .nav-area:before{

		left: auto;

		right: 21px;

	}

	#header .nav-area .navbar-nav{

		justify-content: flex-start;

	}

	.chat-area{

		padding: 15px 20px;

	}

	.choose-us .img {

    	margin-left: calc((100vw - 1177px) / -2);

		margin-right: 0;

	}

	.choose-us .align-right{

		padding-left: 0;

	}

	.choose-us .align-right .list li{

		padding-right: 40px;

	}

	.recent-projects .slick-slide .caption,

	.recent-projects .swiper-slide .caption{

		padding: 15px 20px;

	}

	.chat-area .btn-area{

		display: flex;

		justify-content: center;

	}

	.chat-area .btn-area .btn-primary{

		flex-grow: 1;

	}

}

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

	#header .right-top{

		margin: 0 5% 0 3%;

	}

	#header .nav-area .navbar-nav{

		gap: 8px;

	}

	#header .right-bottom .btn-area{

		margin-left: -169px;

		top: -6px;

	}

	#header .btn-area .btn-primary{

		padding: 8px 10px;

		max-width: 155px;

	}

	.our-services .frame h3{

		min-height: 58px;

		display: flex;

		align-items: center;

		justify-content: center;

	}

	.chat-area h3,

	.choose-us .heading h2{

		font-size: 42px;

		line-height: 1.2;

	}

	.choose-us .align-right{

		padding-top: 50px;

	}

	.choose-us .features .count{

		font-size: 38px;

	}

	.choose-us .features .box{

		padding: 15px;

		flex: 1;

	}

	.choose-us .align-right .list li{

		font-size: 18px;

	}

	.choose-us .img {

        margin-left: calc((100vw - 967px) / -2);

    }

	#header .right-top .info a .txt{

		display: none;

	}

	.recent-projects .slick-slide .caption,

	.recent-projects .swiper-slide .caption{

		left: 15px;

		right: 15px;

	}

	.recent-projects .slick-slide.slick-current .caption,

	.recent-projects .slick-slide.slick-current .magnify{

		opacity: 1;

	}

	.contact-page .contact-box .box .txt .link{

		word-break: break-all;

	}

}

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

	#wrapper{

		padding: 120px 15px 0;

	}

	#header .right-top:before,

	#header .right-top:after,

	#header .right-bottom:after,

	#header .right-bottom:before,

	#header:before,

	#header .right-bottom .btn-area,

	#header .right-bottom .nav-area:before,

	.hero-section .curve{

		display: none;

	}

	#header .right-top .info,

	#header .right-top .social{

		gap: 20px;

	}

	#header .right-top .info a{

		font-size: 20px;

	}

	#header .right-top{

		margin: 0;

		padding: 35px 20px;

	}

	#header .right-top .contact {

    	display: flex;

    	justify-content: flex-start;

    	gap: 30px;

	}

	#header .right-bottom .nav-area{

		margin-right: 0;

	}

	#header .navbar-toggler{

		position: absolute;

        right: 16px;

        top: -69px;

		background: var(--white);

	}

	#header .logo{

		max-width: 140px;

	}

	.hero-section{

		min-height: 600px;

	}

	.hero-section .caption h1{

		font-size: 50px;

	}

	.hero-section .caption .txt{

		max-width: 100%;

		font-weight: normal;

	}

	.about-area .img-right{

		padding: 0;

		margin: 60px 0 0;

	}

	.about-area .img-right img{

		display: block;

		margin: 0 auto;

	}

	.about-area .img-right .caption{

		left: 10px;

	}

	.our-services{

		padding-bottom: 20px;

	}

	.our-services .heading h2{

		font-size: 38px;

	}

	.our-services .frame{

		padding: 10px;

		padding-bottom: 41px;

	}

	.our-services .frame h3{

		min-height: inherit;

	}

	.chat-area h3{

		text-align: center;

		font-size: 32px;

	}

	.chat-area .btn-area{

		margin: 10px 0;

	}

	.choose-us .img{

		margin-left: 0;

		display: none;

	}

	.choose-us .align-right .list li {

        padding-right: 20px;

    }

	.choose-us .align-right{

		padding-bottom: 40px;

	}

	.recent-projects .slick-slide .caption,

	.recent-projects .swiper-slide .caption{

		bottom: 20px;

	}

	.testimonial-area .heading h2{

		font-size: 38px;

	}

	.testimonial-area .review{

		margin-right: 8%;

	}

	.testimonial-area .review{

		padding: 15px 30px;

	}

	.testimonial-area .carousel{

		padding-left: 0;

	}

	#footer .quick-links.add li:first-child,

	#footer .quick-links.add li:nth-child(2){

		width: 100%;

	}

	#header .close-toggler {

		background: none;

		color: #fff;

		padding: 5px;

		border: none;

		margin-top: 10px;

		font-size: 24px;

		position: absolute;

		top: 0;

		right: 15px;

		display: block;

    }

	#header .navbar-collapse{

		position: fixed;

		height: auto !important;

		right: 0;

		top: 0;

		bottom: 0;

		width: 64%;

		padding-right: 3rem;

        padding-left: 3rem;

        padding-top: 58px;

		background: rgba(0,0,0,0.8);

		z-index: 999;

	}

	#header .navbar .nav-item{

		margin: 0;

	}

	#header .nav-area .navbar-nav .nav-link{

		font-size: 16px;

		padding: 10px 5px;

		color: var(--white);

	}

	body.nav-active{

		overflow: hidden;

	}

	.contact-page .contact-box .box .txt{

		padding-left: 10px;

	}

	.contact-page .contact-form{

		padding: 30px 20px;

	}

	.contact-page .contact-box .box{

		padding-left: 5px;

	}

	#header .navbar .dropdown-menu{

		background: transparent;

		padding: 0;

		border: 0;

	}

	#header .navbar .dropdown-menu .dropdown-item{

		font-size: 16px;

        padding: 5px 25px;

        color: var(--white);

		text-transform: uppercase;

		font-weight: bold;

	}

}

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

	#header .right-top{

		display: none;

	}

	.hero-section .caption h1{

		font-size: 30px;

		line-height: 34px;

	}

	.hero-section .caption .txt{

		line-height: 24px;

	}

	.about-area .heading h2{

		font-size: 28px;

	}

	.about-area .info{

		flex-direction: column;

	}

	.about-area .info .img img{

		width: 100%;

	}

	.our-services .frame,

	.our-services .frame .img{

		border-radius: 12px;

	}

	.our-services .frame h3{

		min-height: 58px;

	}

	#footer .social{

		padding-bottom: 40px;

	}

	#footer .border-top{

		padding-top: 15px;

	}

	#footer .border-top p{

		margin: 0;

		text-align: center;

	}

	.breadcrumbs .curve{

		display: none;

	}

	.breadcrumbs{

		min-height: 250px;

	}

	.breadcrumbs .breadcrumbs-area .sub-menu{

		min-width: 250px;

		padding-top: 5px;

		padding-bottom: 5px;

	}

	.contact-page{

		padding: 30px 0;

	}

	.contact-page .contact-box .main-title{

		font-size: 20px;

	}

	.contact-page .contact-box .small-title{

		margin: 0;

		display: inline-block !important;

	}

	.breadcrumbs h1{

		margin-bottom: 50px;

	}

	.choose-us .align-right,

	.testimonial-area{

		padding: 35px 20px;

	}

	.testimonial-area .carousel:before{

		display: none;

	}

	.recent-projects .swiper {

      width: 100%;

      padding: 60px 20px 40px;

      box-sizing: border-box;

    }

    

    .recent-projects .swiper-slide {

      width: 100%; 

      height: auto;

      font-size: 18px;

      border-radius: 15px;

    }

    

    .recent-projects .swiper-slide img {

      width: 100%;

      height: auto;

      border-radius: 15px;

    }

}

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

	.about-area .img-right img,

	.our-services .frame img{

		width: 100%;

	}

	.testimonial-area .review{

		margin-right: 0;

		margin-bottom: 20px;

	}

	#footer{

		text-align: center;

		padding-bottom: 20px;

	}

	#footer .logo{

		margin: 0 auto;

	}

	#footer .info-holder .txt,

	#footer .info-holder{

		text-align: left;

	}

	#footer .quick-links.add{

		max-width: 180px;

		margin: 0 auto;

	}

	#footer .info-holder a{

		word-break: break-all;

	}

	#footer .social{

		padding-bottom: 10px;

	}

	#footer h3{

		border-top: 1px solid #898885;

		padding: 20px 0 0;

		margin-top: 25px;

	}

	.testimonial-area .review{

		flex-direction: column;

		gap: 0;

		justify-content: center;

		text-align: center;

		padding: 20px 10px;

	}

	.testimonial-area{

		padding-top: 40px;

		padding-bottom: 20px;

	}

	.our-services{

		padding-top: 40px;

	}

	.our-services .heading h2,

	.chat-area h3,

	.choose-us .heading h2,

	.recent-projects .heading h2{

		font-size: 28px;

	}

	.chat-area h3{

		font-size: 22px;

	}

	.btn-primary{

		font-size: 14px;

	}

	.chat-area .call-area p{

		font-size: 14px;

	}

	.chat-area .call-area a{

		font-size: 26px;

	}

	.choose-us .align-right p,

	.recent-projects .heading p{

		margin-bottom: 15px;

	}

	.choose-us .align-right .list li{

		display: flex;

		align-items: center;

		width: 100%;

		padding: 5px 0;

		font-size: 14px;

	}

	.choose-us .align-right .list li:before{

		width: 20px;

		height: 20px;

		font-size: 14px;

		position: static;

		margin-right: 10px;

	}

	.choose-us .features{

		flex-direction: column;

		gap: 10px;

	}

	.choose-us .features .box{

		min-height: 110px;

	}

	.choose-us .features{

		margin-bottom: 20px;

	}

	.recent-projects{

		padding-bottom: 0;

	}

	.recent-projects .slick-track{

		padding-bottom: 20px;

	}

	.recent-projects .heading p{

		font-size: 16px;

	}

	.recent-projects .projects-slider {

    	padding-top: 46px;

	}

	.recent-projects .slick-slide .img img{

		padding: 0 3px;

	}

	.recent-projects .slick-slide .caption,

	.recent-projects .swiper-slide .caption{

		display: none;

	}

	.recent-projects .slick-slide .magnify,

	.recent-projects .swiper-slide .magnify{

		width: 25px;

		height: 25px;

		font-size: 12px;

		top: 10px;

	}

	.recent-projects .slick-arrow{

		width: 30px;

		height: 30px;

	}

	.recent-projects .slick-arrow.slick-prev:before, 

	.recent-projects .slick-arrow.slick-next:before{

		font-size: 14px;

		top: 6px;

		left: 7px;

	}

	.our-services .frame .img{

		padding-bottom: 15px;

	}

	.our-services .frame h3{

		min-height: inherit;

		margin-bottom: 12px;

	}

	.testimonial-area .heading h2{

		font-size: 28px;

	}

	.testimonial-area .blockquote q{

		font-size: 16px;

		line-height: 24px;

		padding-right: 0;

	}

	.testimonial-area .blockquote cite{

		font-size: 14px;

	}

	#footer{

		margin-top: 30px;

	}

	.breadcrumbs{

		min-height: 200px;

	}

	.breadcrumbs.services{

		margin-bottom: 30px;

	}

}







.gallery-wrap .filters {

    position: relative;

    text-align: center;

}

.gallery-wrap .filters li {

    position: relative;

    display: inline-block;

    cursor: pointer;

    background: transparent;

    padding: 12px 20px;

    border-radius: 30px;

    font-weight: bold;

    font-size: 14px;

    color: #7a7a7a;

    margin: 0 5px 5px 0;

    text-transform: uppercase;

    display: inline-block;

    border: 1px solid #cdcdcd;

    -webkit-transition: all 0.5s ease-out;

    -moz-transition: all 0.5s ease-out;

    -ms-transition: all 0.5s ease-out;

    -o-transition: all 0.5s ease-out;

    transition: all 0.5s ease-out;

}

.gallery-wrap .filters li:hover, .gallery-wrap .filters li.active {

    color: #fff;

    background: #eebd1f; border-color:#eebd1f;

}

.gallery-wrap .filters li .txt {

    position: relative;

    display: block;

    z-index: 1;

}

.filter-tabs{display: flex	;

		align-items: center;

		overflow: auto;

		white-space: nowrap;

		justify-content: center;

	}





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

	.filter-tabs{ 

		justify-content: left;

	}

}







/* New Stylings */

.services-detail{

	padding-top: 30px;

}

.services-detail p img{

    float: left;

    margin-right: 25px;

    width: auto;

    margin-bottom: 15px;

    object-fit: cover;

    height: 270px;

    border-radius: 15px;

}

.list-icon{

	margin: 0;

    padding: 0 0 13px;

    list-style: none;

	font-size: 16px;

	line-height: 1.2;

}

.list-icon li{

	padding-left: 25px;

	padding-bottom: 10px;

	position: relative;

    color: #000;

}

.list-icon li:before{

	font-size: 18px;

	font-family: "Font Awesome 6 Free";

    -webkit-font-smoothing: antialiased;

    display: inline-block;

    font-style: normal;

    font-variant: normal;

    line-height: 1;

    text-rendering: auto;

    font-weight: 900;

    content: '\f058';

    position: absolute;

    left: 0;

    top: 1px;

    color: #eebd1f;

}


.otherservices{
	background: #F1F1F1;
	border-radius: 15px;
	padding: 40px 30px;
}
.otherservices h4{font-size: 24px; font-weight: 700; margin-bottom: 25px;}

.service-list{
	margin: 0;
	list-style: none;
	padding: 0;
}

.service-list li{
	position: relative;
}

.service-list li a{
	text-decoration: none;
	font-size: 18px;
	display: block;
font-weight: 600;
	padding:10px 0;
	padding-right: 33px;

	color: #000;

	position: relative;

	transition: all ease 0.5s;

}

.service-list li a:after{

    content: "\f061";

    position: absolute;

	right: 10px;

	top: 50%;

    margin: 0 10px;
    font-size: 18px;

    color: #000;

    font-family: 'Font Awesome 6 Free';

	transform: translateY(-50%);

	transition: all ease 0.5s;

}

.service-list li a.active,

.service-list li a.active:after,

.service-list li a:hover,

.service-list li a:hover:after{

	color: #eebd1f;

}


.service-list li a.active:after,
.service-list li a:hover:after{

	right: 5px;

}

.sitebarcta{background: #2e2c27; padding: 40px 30px; border-radius: 15px; margin-top: 30px; text-align: center;}
.sitebarcta .btn-area{margin-top: 15px;}
.sitebarcta .btn-area .btn-primary{max-width:none;}
.sitebarcta .btn-area .btn-primary:hover{background: #cfcfcf; color: #000;}
.sitebarcta h5{font-size: 24px; color: #fff; font-weight: 700;}
.sitebarcta p{color: #fff; margin-bottom: 5px;}
.sitebarcta .call-area{margin-top: 15px;}
.call-area a{font-size: 30px; text-decoration: none; color:var(--yelow); font-weight: 700;}



/*.services-detail .feature-img{*/

/*	margin-bottom: 20px;*/

/*	height: 250px;*/

/*	border-radius: 20px;*/

/*	overflow: hidden;*/

/*}*/

/*.services-detail .feature-img img{*/

/*	width: 100%;*/

/*	height: 100%;*/

/*	object-fit: fill;*/

/*}*/

.services-detail .feature-img{

	margin-bottom: 20px; 

	border-radius: 10px;

	overflow: hidden;

}

.services-detail .feature-img img{

	width: 100%;
	object-fit: cover;

}

.services-detail p a{

	text-decoration: underline;

	color: #eebd1f

}

.services-detail p a:hover{

	text-decoration: none;

}

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

	.services-detail {

		padding-top: 0;

	}

	.service-list{

		margin-bottom: 30px;

	}

	.services-detail .heading h2{

		font-size: 28px;

	}

}

