:root{
    --reb-black-color:#89162F;
    --yellow-color: #DBB128;
    --reb-main-color:#E12810;
    --gray-color:#B1B5C3;
    --big-borde-hero: 30vh;
    --main-liner-gradeint: linear-gradient(to right,var(--reb-black-color),var(--reb-main-color));
}
@media (max-width:789px) {
    /* body{
        width: 50%;
        background: #000;
    } */
     /* .container{
        background: #000;
     } */
    .nav-bar{
        width: 100vw;
    }
    /* .nav-bar .link{
        
    } */
    .nav-bar .right-icons ul{
        display: none;
    }
    .mobile-navbar{
        display: flex;
    }
    .mobile-navbar.active{
        border-radius: 0;
        left: 0;
    }
    /* .mobile-navbar .link{
        width: 70%;
    } */
    .mobile-navbar .link ul{
        display: flex;
        flex-direction: column;
        gap: 15px;
        /* width: 100%; */
    }
    .mobile-navbar .link ul li{
        list-style: none;
        text-align: left;
        /* width: 100%; */
        margin-left: -30vw;
        /* background: #000; */
        height: 30px;
        transition: .3s all ease-in;
    }
    .mobile-navbar.active .link ul li{
        margin-left: 0;
    }
    .mobile-navbar .link ul li a{
        color: #fff;
        text-decoration: none;
        font-size: 20px;
        text-transform: capitalize;
    }
    .mobile-navbar .link ul li a:hover,
    .mobile-navbar .link ul li a:current{
        align-items: 30px;
    }
    .nav-bar .right-icons .bars{
        display: flex;
    }
    .nav-bar .logo{
        margin-left: 20px;
    }
    .nav-bar .link{
        visibility: hidden;
        opacity: 0;
        position: absolute;
    }
    .hero-slide-section .content{
        /* background: linear-gradient(30deg, #89162fd0 0%, transparent 100%); */
        background: linear-gradient(
            to top,
            rgba(137, 22, 47, 0.9) 0%,
            rgba(137, 22, 47, 0.7) 30%,
            rgba(137, 22, 47, 0.4) 55%,
            rgba(137, 22, 47, 0.1) 75%,
            transparent 100%
        );
    }
    .hero-slide-section .content .texture-side{
        width: 80%;
        padding-left: 10vw;
        position: absolute;
        bottom: 15vh;
        /* padding-bottom: 10vh; */
    }
    .hero-slide-section .one-slide:nth-child(2) .content .texture-side{
        gap: 10px;
    }
    .hero-slide-section .one-slide .content .texture-side h1{
        font-size: 18px;
    }
    .hero-slide-section .one-slide .content .texture-side p{
        font-size: 15px;
    }
    .hero-slide-section .one-slide .content .texture-side p span{
        font-size: 15px;
    }
    .hero-slide-section .one-slide .texture-side .services button{
        font-size: 15px;
        padding: 5px;
    }
    .hero-slide-section .dots .dot.active{
        background: #fff;
    }
    .contact-us .main-title,
    .our-service .main-title,
    .about-us .main-title{
        font-size: 24px;
    }
    .our-service,
    .contact-us,
    .about-us{
        padding: 7vh 0;
    }
    .about-us .content .tabs{
        flex-direction: column;
        min-height: 70vh;
        height: max-content;
    }
    .about-us .content .tabs .tab{
        flex-direction: column;
        min-height: 70vh;
        height: max-content;
    }
    .about-us .content .whoweare .text-side{
        width: 95%;
    }
    .about-us .content .whoweare .text-side p{
        font-size: 13px;
    }
    .about-us .content  .whoweare .image-side{
        width: 85vw;
        height: 35vh;
    }
    .about-us .content .whoweare .image-side img:first-child{
        width: 25vh;
    }
    .about-us .content .whoweare .image-side img:last-child{
        width: 20vh;
    }
    .about-us .content .whoweare{
        flex-direction: column;
        align-items: center;
        min-height: 50vh;
    }
    .about-us .content .leadership{
        gap: 20px;
        margin: 1rem;
    }
    .about-us .content .leadership .single-leader{
        width: 70vw;
        height: 60vh;
        gap: 20px;
        flex-direction: column;
    }
    .about-us .content .leadership .single-leader .text{
        width: 85%;
        gap: 20px;
    }

    .about-us .content .leadership .single-leader:last-child{
        display: none;
    }
    .our-service .heading-captions svg{
        display: none;
    }
    .our-service .heading-captions p{
        font-size: 15px;
        width: 80vw;
    }
    .our-service .services-container{
        flex-direction: column;
        align-items: center;
        justify-content: start;
    }
    .our-service .services-container .service-row{
        margin: 0;
    }
    .contact-us .content-section{
        flex-direction: column;
    }
    .contact-us .content-section svg{
        width: 80vw;
    }
    footer .content.pc{
        display: none;
    }
    footer .content.mobile{
        display: flex;
        flex-direction: column;
        gap: 50px;
    }
    footer .content.mobile .text-container{
        display: flex;
        flex-direction: row;
        justify-content: center;
        /* background: #000; */
        height: 85px;
    }
    footer .content.mobile .text-container .column-content-container{
        width: 150px;
        display: flex;
        justify-content: space-between;
    }
    footer .content.mobile .text-container h1{
        font-size: 18px;
    }
    footer .content.mobile .text-container .links{
        width: 100px;
        height: 40px;
        display: flex;
        justify-content: space-between;
    }
    footer .content.mobile .text-container p,
    footer .content.mobile .text-container .links .colum a{
        font-size: 10px;
    }
    /* footer .content.mobile  .text-container{
        height: 40px;
    } */
    footer .content.mobile  .text-container .left-side{
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: space-between;
        /* gap: px; */
    }
    footer .content.mobile  .text-container .left-side .column-content-container .links{
        width: 150px;
        height: 20px;
    }
    footer .content.mobile  .text-container .left-side .icons{
        flex-direction: row;
    }
    footer .content.mobile  .text-container .left-side .icons a{
        font-size: 16px;
    }
    footer .copy-right{
        font-size: 12px;
        padding-left: 15px;
    }
}