*{
    margin: 0;
    padding: 0;
}
body
{
    background: #F7F6F1;
}
header {
    height: auto;
    margin: 20px 40px;
    background: none;
    border-radius: 0px;
}
.header-class
{
    height: 120px;
}
ul li a{
    color: #000;
}
ul li a:hover{
    color: #FCC233;
}
ul li .active{
    color: #FCC233;
}

/* top banner start */
/* .menu-color div span {
    color: #000000 !important;
} */
.menu_icon div span {
    background-color: #000000 !important;
}   
.top-banner{
    height: 250px;
    margin: 30px 50px 60px 50px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("../imgs/top-banner.png");
    border-radius: 30px 30px 130px 30px;
    background-size: cover;
    align-items: center;
    justify-content: center;
    display: flex;
    color: #fff;
    font-size: 20px;
}
.top-banner-menu a {
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    padding: 5px;
    text-decoration: none;
}
.top-banner-menu a .active{
    color: #FCC233;
}
.about-img{
    align-items: center;
    justify-content: center;
    display: flex;
    height: 100%;
}
.about-img img {
    width: 100%;
    height: auto;
}
.about-content {
    padding-top: 0px;
    overflow-x: hidden;
}
.about{
    overflow-x: hidden;
}
.about-page-content{
    padding: 80px 0px 0px 0px;
}
.about-page-content h2{
    padding: 20px 0px;

}
.items{
    display: flex;
    padding-left: 60px;
    padding-top: 20px;
}
.items img{
    padding-right: 20px;
    width: 40px;
    height: 25px;
}
.about{
    padding: 30px 0px !important;
}

/************ service start ***********/
.service-box{
    padding-bottom: 50px;
}
.service-rows{
    padding-bottom: 100px;
}
.service-content h6{
    font-family: 'Space Grotesk';
    font-weight: 700;
    font-size: 50px;
    line-height: 64px;
    text-transform: capitalize;
    color: #FCC233;
    padding: 20px 0px;
}
.services h2{
    font-family: 'Space Grotesk';
    font-weight: 700;
    font-size: 40px;
    color: #FCC233;
}
.service-details h5{
    font-family: 'Nunito Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 22px;
    line-height: 30px;
    text-transform: capitalize;
    color: #000000;
    letter-spacing: 0px;
    padding-right: 20px;
}
.service-details p{
    font-size: 17px;
    padding: 10px 0px 20px 0px;
}
.service-img-1{
    background-image: url(../imgs/Air-Conditioning.jpg) !important;
    background-size: cover;
    background-position: center;
    height: 350px;
}
.service-img-2{
    background-image: url(../imgs/Electromechanical.jpg) !important;
    background-size: cover;
    background-position: center;
    height: 350px;
}
.service-img-3{
    background-image: url(../imgs/Floor.jpg) !important;
    background-size: cover;
    background-position: center;
    height: 350px;
}
.service-img-4{
    background-image: url(../imgs/Painting.jpg) !important;
    background-size: cover;
    background-position: center;
    height: 350px;
}
.service-img-5{
    background-image: url(../imgs/Carpentry.jpg) !important;
    background-size: cover;
    background-position: center;
    height: 350px;
}
.service-img-6{
    background-image: url(../imgs/gallery/img-20.jpg
    ) !important;
    background-size: cover;
    background-position: center;
    height: 350px;
}
.service-img-7{
    background-image: url(../imgs/Partitions.jpg) !important;
    background-size: cover;
    background-position: center;
    height: 350px;
}
.service-img-8{
    background-image: url(../imgs/Plaster.jpg) !important;
    background-size: cover;
    background-position: center;
    height: 350px;
}
.service-img-9  {
    background-image: url(../imgs/Building.jpg) !important;
    background-size: cover;
    background-position: center;
    height: 350px;
}
.service-details{
    text-align: left;
}
.service-details a{
    background-color: #926800;
    box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.25);
    border-radius: 4px;
    padding: 14px 30px;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    margin-right: 10px;
    text-transform: capitalize;
}
.service-details a:hover{
    background: linear-gradient(90deg, #C29628 0%, #FCC233 100%);
}

/************ service end ***********/


/************ project start ***********/
.projects{
    padding-bottom: 60px;
    overflow-x: hidden;
}
.project-details{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom: 20px;
}
.projects h1{
    font-size: 45px;
    font-weight: 700;
    text-transform: capitalize;
    color: #FCC233;
    text-align: center;
    padding-bottom: 50px;
}
.project-contents{
    text-align: center;
    padding-bottom: 20px;
}
.project-contents h2{
    font-family: 'Space Grotesk';
    font-weight: 500;
    font-size: 35px;
    line-height: 45px;
    text-transform: capitalize;
    color: #000000;
    padding: 20px 0px 0px 0px;
}
.project-contents p{
    font-family: 'Space Grotesk';
    font-weight: 500;
    font-size: 20px;
    text-transform: capitalize;
    color: #970000;
}
.project-img{
    height: 400px;
    width: auto;
}
.project-img img{
    height: 100%;
    width: auto;
}
/************ project end ***********/

/************ gallery start ***********/
.gallery{
    padding-bottom: 100px;
}
.gallery h1{
    font-size: 45px;
    font-weight: 700;
    text-transform: capitalize;
    color: #FCC233;
    text-align: center;
    padding-bottom: 30px;
}
.gallery-img{
    margin: 10px;
}
.gallery-img img{
    width: 100%;
    height: 250px;
    object-fit: cover;
    transition: transform .2s;
}
.gallery-img img:hover{
    transform: scale(1.2);
}
/************ gallery end ***********/

/************ contact start ***********/
.contact-us{
    text-align: center;
    padding-top: 50px;
    margin-bottom: 50px;
}
.contact-us h5{
    font-family: 'Poppins';
    font-weight: 400;
    font-size: 20px;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: #000000;
}
.contact-us h1{
    padding-bottom: 30px;
    color: #FCC233;
    font-size: 45px;
    font-weight: 700;
}
.contact-us-map{
    height: 400px;
}
.contact-us-map iframe{
    border-radius: 30px;
}
.social-box{
    background: #fff;
    margin: 100px 0px;
    padding: 50px 0px;
}
.social-box{
    font-family: 'Space Grotesk';
    font-style: normal;
    font-weight: 500;
    font-size: 44px;
    text-align: center;
    text-transform: capitalize;
    color: #000000;
    border-radius: 50px;
    box-shadow: inset -4px -4px 20px rgba(0, 0, 0, 0.25);
}
.social-box-icon a{
    text-decoration: none;
    padding: 0px 20px;
}
.social-box-icon a i{
    color: #808287;
    transition: transform .2s;
}
.social-box-icon a i:hover{
    transform: scale(1.5);
}
.social-box-icon a i:hover{
    color: #C29628;
}
.social-contacts{
    display: flex;
    justify-content: space-around;
    padding-top: 50px;
}
.social-contacts h2{
    font-size: 20px;
    color: #808287;
}
.social-contacts a{
    color: #808287;
    font-size: 20px;
}
.social-contacts img{
    width: 50px;
    padding-bottom: 20px;
}
.social-contacts .our-call img{
    width: 35px;
}
/************ contact end ***********/