@media (max-width:1024px){
    *{
        color: black;
        box-sizing: border-box;
    }

    #BG-img{
        visibility: hidden;
    }

    #Date{
        visibility: hidden;
        z-index: 0;
    }

    .sideBarHome{
        width: 100vh !important;
    }    

    #body{
        height: 100vh !important;
        width: 100% !important;
        display: grid !important;
        position: relative !important;
    }
    #sideBar{
                    width: 80vh !important;
            height: 22% !important;
            /* padding: 10%; */
            z-index: 2 !important;
            position: absolute !important;
            display: flex !important
;
        
    }
    h7{
        visibility: hidden;
} 

    #logo{
        width: 40% !important;
        height: 60% !important;
        margin-bottom: 10px !important;
        z-index: 2 !important;
        /* display: flex; */
        padding-right: 10% !important;
        position: absolute !important;
    }
    #logo img{
        width: 100% !important;
        height: 100% !important;
        z-index: 2 !important;
        transition: 0.2s !important;
        /* position: absolute; */
        
    }

    #textUNderLogo{
        visibility: hidden;
        display: none;
    }

    #CoName{
        display: none;
    }


    #pages{
        display: flex !important;

        /* position: relative; */
        padding-top: 14.5% !important;
        padding-bottom: 6% !important;
        font-size: smaller !important;
        justify-content: space-around !important;
        position: absolute !important;
    }

    #links{
        padding-left: 6% !important;
    }


    .card{
            width: 110%;
            margin-top: 0%;
            margin-bottom: 2%;
            padding-top: 3%;
            padding-bottom: 3%;
            margin-left: 20%;
            height: 10%;
        
    }   

    #services{
    font-size: small;    
    }  
    #service-icon {
        display:block;
    }

        


        #Welcome{
                    font-size: small;
        height: 9%;
        margin-left: 0%;
        position: relative;
        width: 155%;
        z-index: 2;
        color: black;
        padding-left: 2%;
        margin-top: 25%;
        background-color: rgba(160, 160, 160, 0.7);
            
        }

        #main{
                    display: block;
        margin-top: 45%;
        height: 70%;
        margin-left: 2%;
        width: 50vh !important;
        }
        
        #footer{
            width: 80vh;
            position: absolute;
            margin-top: 75%;
            top: 130%;
            
        }

        

}


@media (max-width:1024px){
    #left-side{
        /* visibility: hidden; */
        position: absolute;
        margin-top: 20%;
        width: 128%;
        /* margin-left: 10%; */
        
    }
    #left-side img{
        width: 100%;
    }
    #right-side {
        margin-left: 30%;
        scrollbar-color: black ;
        width: 300%;
        margin-top: 28%;
        padding-bottom: 19%;
    }
    .co-us{
        visibility: hidden;
    }

    #bar{
        text-align: center !important ;
        width: 100vh !important;
        margin-left:15.8% ;
        margin-top: 2%;
    }

    



    #our-clients-button{
        height: 10% !important;
    }

    .footer-1{
        /* margin-left: 50%; */
    margin-top: 40%;
        width: 80vh !important;

    }

    #Contact-us-service{
        margin-top: 50% !important;
    }

    #main-quality{
        margin-top: 50%;
        height: 70%;
        width: 100vh;
    }
    /* .bar-quality{
        margin-top: 48% !important;
        margin-left: 0% !important;
        width: 100vh !important ;
    } */

    #Quality-text{
        margin-left: -293%;
        margin-top: 45% !important;
        margin-bottom: -40% !important;        
    }

    #main-content {
            display: flex
;
    width: 100%;
    height: 100%;
    margin-left: 15%;
    padding-top: 15%;
    padding-bottom: 50%;
    }

    #companies{
        margin-top: 20%;
    }

    #main-consulting{
        margin-top: 23%;
        margin-left: -65%;
        width: 52vh !important;
    }
    


    
    #consulting-text {
            width: 62vh !important;
            margin-left: 30%;
            width: 150%;
            overflow: scroll;
            margin-top: 2%;
            margin-top: 87%;
            height: 50% !important;
            padding-bottom: 10%;
            margin-left: -28% !important;
    }
    

    #consulting-scroll{
        
        margin-top: 33.4% !important;
        margin-left: 160% !important;
        width: 27% !important;
        height: 89% !important;
    }
    
    [dir="rtl"] #consulting-scroll{
        margin-left: 50% !important;
    }

    #constraction-container-img{

        margin-top: 10%;
                    position: absolute;
            height: 101% !important;
            width: 75% !important;

    }


    span{
        width: 100% !important;
        transform: rotate(0) !important;
        font-size: smaller !important;
        margin-left: 2% !important;
        margin-top: -20% !important;
        
    }

    #elctro-main{
        margin-left: -10%;
        margin-top: -26% !important;
    }
    #elctro-links {
        margin-left: 130% !important;
        margin-top: 49% !important;
    }

    .main-constraction{
        margin-top: 33.3% !important;
    }
    .constraction-text12{
        margin-top: 86% !important;
        margin-left: -25% !important;
        width: 57vh !important;
        height: 47% !important;
    }

    #constraction-container-img{
        margin-left: -28%;
    }

    #consulting-container-img{
        margin-left: -28% !important;
    }

    
            #consulting-container-img {
            position: absolute;
            height: 101% !important;
            width: 61vh !important;
            margin-left: -28% !important;
        }
    

    #main-album{
                    margin-top: 20%;
            margin-right: 70% !important;
    }

    #album-container-img{
        width: 135% !important;
    }

    #album-scroll{
        margin-top: 23% !important;
            width: 36% !important;
            margin-inline-start: 177% !important;
    }
    [dir="rtl"] #album-scroll{
        margin-inline-start: 0% !important;
    }
    [dir="rtl"] #elctro-links{
        margin-right: 130% !important;
    }
}