html {
  scroll-behavior: smooth;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
#navigation a{
    background-image: linear-gradientlinear-gradient(rgba(253, 14, 14, 0.888), rgb(248, 119, 119));
    color: #f8f7f4;
    font-weight: bold;
}

#navigation 
#navDemo{
    background-image: linear-gradient(rgba(253, 14, 14, 0.888), rgb(248, 119, 119));
    /* background-image: url('images/Web1.jpg');  opacity: 3; */
}
.header{
    display: flex;
     justify-content: space-between; /* Pushes logo to left, links to right */
     align-items: center;            /* Vertically centers everything */
      
}
#top{
    background-image: (rgb(117, 75, 2), rgb(4, 247, 166));
    color: #50049d;
      /* background-image: url('images/Web1.jpg');  opacity: 0.8; */
      
}
/* Navigation-bar */
.w3-top{
    display: flex;
    justify-content: space-between;
    background-image: linear-gradient(rgb(141, 1, 1), rgba(251, 3, 3, 0.991));
    box-shadow: 3px 3px 10px rgb(174, 233, 245);
}
.w3-margin-top{
    color: rgb(244, 184, 4);
}
.w3-bar-logo{
    width: 45px;
    height: auto;
    margin: 2px 2px 2px 20px;
    border: 1px solid rgb(251, 250, 250);
    text-align: center;
    margin-top: 2px;
}
.w3-bar-logo img{
    width: 90%;
    height: auto;
}
.w3-bar-logo:hover{
    box-shadow: 3px 3px 10px rgb(249, 249, 250);
}
.LogoFirstLetter1{
    background-image: (rgba(4, 252, 24, 0.712), rgba(230, 246, 8, 0.525));
    font-weight: bold;
    /* font-size: 25px; */
   
}
.LogoFirstLetter2{
    background-image: (rgba(248, 44, 44, 0.712), rgba(193, 235, 3, 0.525));
    font-weight: bold;
    /* font-size: 25px; */
}
.gradient-text1{
    background-image: linear-gradient(rgb(247, 7, 3), rgba(118, 1, 1, 0.991));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.gradient-text2{
    font-weight: bold;
    background-image: linear-gradient(rgb(36, 1, 53), rgba(190, 3, 3, 0.991));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.hero-section{
    
    /* background-image: linear-gradient(dodgerblue, rgb(0, 31, 61)); */
    margin-top: 48px !important;
    /* background-image: url('images/w\ \(4\).jpeg');; */
    background-repeat: no-repeat;
    box-sizing: border-box;
      
        /* background-image: linear-gradient(rgb(231, 252, 191), rgb(212, 250, 206));    */
}
.hero-section-main{
 /* background-image: url('images/Web.jpeg');  opacity: 1; */
    /* background-color: rgba(223, 6, 6, 0.053); */
    display: flex;
    justify-content: center;          
}
.hero-section-into-text{
    padding: 40px ;
    width: 90%;;
    margin-bottom: 30px;
    border:3px solid rgb(248, 191, 99) !important;
    border-radius:30px !important;    
    /* background-image: url('images/D7.jpeg');
       background-repeat: no-repeat; */
}
.hero-section-into-text h1{
    font-size: 60px !important;
    letter-spacing: 2px;
    font-weight: 800;
    font-family: sans-serif;    
}
.hero-section-into-text p{
    width: 40%;
    letter-spacing: 1px;
}
.section-text-header{
    margin: 60px 0px!important;
    /* border-left:6px solid rgb(82, 219, 8); */
    padding-left:30px !important;   
    text-transform: uppercase;
    font-weight: 600;    
    background-color:rgba(235, 8, 4, 0.932);
    font-size: 30px;
    text-align: center;
    color: rgb(241, 243, 242);
    background-image: linear-gradient(rgb(141, 1, 1), rgba(251, 3, 3, 0.991));

    border: 2px solid wheat;
    transition: 0.5s; */
}
.product-left-side{
    width:600px;
    height: 700px;
    margin-right: 20px;
}
.product-left-side img{
    height: 100%;
    width: 100%;
    object-fit: cover
}
.product-right-side{
    width:400px;
    display: grid;
    grid-template-rows: 1fr 1fr;
    grid-row-gap: 10px;    
}
.icons{
    font-size: 35px; 
    padding: 3px;
}
.product-right-side-1{    
    width:400px;
    height:340px;
}
.product-right-side-1 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow:hidden;
}
.product-right-side-2{
    height:337px;
    width:400px;
    margin-top: 8px;
    overflow:hidden ;
}
.product-right-side-2 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow:hidden ;
}
.articals > h2{
    color: rgb(175, 243, 5);
    margin-left: 50px;
    text-align: center;
}
.articals > p{
    color: rgb(175, 243, 5);
    margin-left: 50px;
    text-align: center;
}


<!-- About-us-section-start-here -->

#first-section{
    
    width: 1100px;
    margin: auto;
    justify-content: space-between;
    justify-content: center;
    background-image: linear-gradient(rgb(96, 3, 139), rgba(103, 2, 2, 0.991));
  
}
#first-container{
    
    width: 100%;
    margin: auto;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    justify-content: space-between;
    justify-content: center;
    flex-wrap: wrap;
    gap:25px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    
   
}
.box-one{
    width: 270px;
    /* border: 2px solid red; */
    text-align: center;
    padding: 30px 10px;
    transition: 0.5s;
    cursor: pointer;
    border-radius: 20px;
   
}
.box-one img{
    width: 200px;
    height: 150px;
    padding: auto;
    border-radius: 20px;
    transition: 0.7s;
}
.box-one img:hover{
  transform: scale(1.3);
}
.box-one > i{
    font-size: 100px;
}
.box-one > h2{
    margin: 15px 0;
    text-transform: uppercase;
    }
.box-one:hover{
    box-shadow: 3px 3px 10px blue;
}
.box-two{
    width: 270px;
    /* border: 2px solid rgb(64, 20, 223); */
    text-align: center;
    padding: 30px 10px;
    transition: 0.5s;
    cursor: pointer;
    border-radius: 20px;
}
.box-two img{
    width: 200px;
    height: 150px;
    padding: auto;
    border-radius: 20px;
    transition: 0.7s;
}
.box-two img:hover{
  transform: scale(1.3);
}
.box-two > i{
    font-size: 100px;
    
}
.box-two > h2{
        margin: 15px 0;
        text-transform: uppercase;
}
.box-two:hover{
    box-shadow: 3px 3px 10px blue;
}
.box-three{
    width: 270px;
    /* border: 2px solid rgb(9, 219, 41); */
    text-align: center;
    padding: 30px 10px;
    transition: 0.5s;
    cursor: pointer;
    border-radius: 20px;
}
.box-three img{
    width: 200px;
    height: 150px;
    padding: auto;
    border-radius: 20px;
    transition: 0.7s;
}
.box-three img:hover{
  transform: scale(1.3);
}
.box-three > i{
    font-size: 118px;
}
.box-three > h2{
    text-transform: uppercase;
    margin: 15px 0;
}
.box-three:hover{
    box-shadow: 3px 3px 10px blue;
}
.box-fourth{
    width: 270px;
    /* border: 2px solid rgb(9, 219, 41); */
    text-align: center;
    padding: 30px 10px;
    transition: 0.5s;
    cursor: pointer;
    border-radius: 20px;
}
.box-fourth img{
    width: 200px;
    height: 150px;
    padding: auto;
    border-radius: 20px;
    transition: 0.7s;
}
.box-fourth img:hover{
  transform: scale(1.3);
}
.box-fourth > i{
    font-size: 100px;
}
.box-fourth > h2{
    text-transform: uppercase;
    margin: 15px 0;
}
.box-fourth:hover{
    box-shadow: 3px 3px 10px blue;
}





/* Styles-section-start */
#Styles{
width: 100%;
margin: auto;
/* justify-content: space-between;
justify-content: center; */
}
.services{
   
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
justify-content: space-between;
justify-content: center;
flex-wrap: wrap;
gap:25px;
margin-bottom: 20px;
padding-bottom: 20px;
}
.card{
background:white;
padding:20px;
border-radius:20px;
box-shadow:0 10px 25px rgba(0,0,0,.08);
transition:.3s;
margin: 0 20px 0 20px;
}
.card:hover{
 box-shadow: 3px 3px 10px rgb(12, 28, 247);
transform:translateY(-10px);
}
.card p{
   text-align: center;
}

.styles-parent{
    width: 100%;
    margin: auto;
    display: grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    justify-content: space-between;
    justify-content: center;
     flex-wrap: wrap;
    grid-row-gap: 30px;
    grid-column-gap: 30px;
    border-radius: 25px;
    padding: 20px 0;
}

.styles-parent{
    margin-bottom: 20px;
    padding-bottom: 20px;
    
}
.styles-parent-div-item img{
    width: 60%;
    height: 280px;
    margin: auto;
    display: flex;
    grid-template-columns: auto;
    justify-content: center;
    border-radius: 20px;
    cursor: pointer;
    transition: 0.7s;
}
.styles-parent-div-item:hover img{
    box-shadow: 3px 3px 10px rgb(12, 28, 247);
    transform: scale(1.1);
}
.styles-parent-div-item:hover img{
        overflow: hidden;
}
.styles-parent-div-item h3{
    text-align: center;
    class="gradient-text1"
    text-transform: uppercase;
   
   
}
.styles-parent-div-item p{
    text-align: center;
}




<!-- Products-Section-Start -->
.products{

    width: 100%;
    margin: auto;
    justify-content: space-between;
    justify-content: center;
    overflow-x: hidden;
}

.new-arrived-products{
       
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    gap:30px;
    grid-row-gap: 60px;
    width:80%;
    margin: auto;
    overflow:hidden ;
}

.new-arrived-image{
    width:300px !important;
    height:300px !important;
    overflow:hidden ;
    transition: 0.5s;
    cursor: pointer;
    border-radius: 20px;
    transition: 0.7s;
}
.new-arrived-image:hover{
    transform: scale(1.1);
    box-shadow: 3px 3px 10px blue;
}
.new-arrived-image img{
    width:100% !important;
    height: 100% !important;
    object-fit: cover;
}





/* Capasity-Section-start-here */
#capacity{

    width: 100%;
    margin: auto;
    justify-content: space-between;
    justify-content: center;
    padding: 5px;
}
.service-area{
    width: 100%;
    margin: auto;
    
}
.services-area-titel{
    
    text-align: center;
    padding: 10px 0 10px 10px;
   
}
.services-area-titel > h2{
    font-size: 35px;
}
.each-services-parent{      
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
justify-content: space-between;
justify-content: center;
flex-wrap: wrap;
gap:25px;
margin-bottom: 20px;
padding: 30px;
border: 5px solid rgb(250, 250, 249);
}

.each-services{
    background-color: rgb(213, 234, 241);
    text-align: center;
    padding: 20px 0;
    transition: 0.7s;
    cursor: pointer;
    border-radius: 20px;
    transition: 0.7s;
    border: 3px solid rgb(248, 246, 217);
}
.each-services:hover{
    transform: scale(1.1);
    background-color: rgb(228, 228, 224);
    box-shadow: 3px 3px 10px rgb(247, 247, 114);
}
.each-services > P{
    font-size: 15px;
    color: #f70909;
    padding: 10px;
    margin: 10px;
}
.each-services > h2{
    font-size: 20px;
    margin: 8px;
    font-weight: bold;
   text-transform: uppercase;

}


/* Our Customer */
#customer{
    width: 100%;
    height: auto;
    justify-content: space-between;
    justify-content: center;
}
#main-section{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
justify-content: space-between;
justify-content: center;
flex-wrap: wrap;
gap: 30px;
margin: 10px 30px 10px 30px;
padding-bottom: 20px;
border: 3px solid rgb(237, 235, 235);
}
#single-items-parent{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
justify-content: space-between;
justify-content: center;
flex-wrap: wrap;
gap:30px;
margin: 10px;
padding-bottom: 20px;
border: 3px solid rgb(235, 233, 233);
}
.single-items{
    height: 210px;
    width: 300px;
    padding: 30px;
    border-radius: 20px;
    transition: 0.7s;
}
.single-items img{
    width: 100%;
    height: 100%;
    transition: 0.3s;
    cursor: pointer;
    border: 3px solid rgb(246, 249, 203);

}
.single-items:hover img{
    box-shadow: 3px 3px 10px rgb(12, 31, 247);
    transform: scale(1.3);
    border-radius: 20px;
}

.single-items div{
    display: flex;
    justify-content: space-between;
    color: rgb(2, 3, 90);
    margin-top: 10px;
}
.logo-name{
    text-align:center; 
}
.logo-name h5{
    font-weight: bold;
}





/* Our-Certification */----------------------------

#main-certification{
    width: 100%;
    height: auto;
    justify-content: space-between;
    justify-content: center;
    background-color: rgb(244, 243, 241);
    border: 3px solid red;
    padding-left: 20px;
    flex-wrap: wrap;
   
}
#certification-items-parent{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    justify-content: space-between;
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
    flex-wrap: wrap;
    gap:25px;
    margin: 20px;
    padding: 20px;
   
   
        
}
.certification-items{
    height: 190px;
    margin-left: 10px;
    border: 3px solid rgb(159, 244, 193);
    border-radius: 20px;
    text-align: center;
}
.certification-items{
    width: 300px;
    padding: 10px;
    margin: 10px;
    transition: 0.7s;
    justify-content: center;
     text-align: center;

}
.certification-items:hover img{
    box-shadow: 3px 3px 10px rgb(12, 31, 247);
    transform: scale(1.3);
    border-radius: 25px;
}
.certification-items img{
    width: 100%;
    height: 100%;
    transition: 0.3s;
    cursor: pointer;
   
}
.certification-items div{
    display: flex;
    justify-content: space-between;
    color: rgb(2, 3, 90);
    margin-top: 5px;
        
}
.logo-Buyer{
    text-align:center;
    
}
.logo-Buyer h5{
    
    font-weight: bold;
}


/* Managment Section Start here */

#management-top{
    width: 100%;
    margin: auto;
      /* background-image: url('images/Web2.jpeg');  opacity: 1; */
}
.management-box{
    display: grid;
    grid-template-columns:repeat(auto-fit,minmax(350px,1fr));
    justify-content: space-between;
    justify-content: center;
    text-align: center;
    grid-row-gap: 100px;
    grid-column-gap: 100px;
    margin-top: 20px;
    /* margin-left: 100px; */
    border-radius: 25px;
    border: #50049d;
    cursor: pointer;
}
.management-box-item{
    
    text-align: center;
    color: black;
    font-size: 10px;
    font-weight: bold;
    border: 5px solid rgb(175, 204, 225);
    border-radius: 20px;
   
}
.management-box-item img{
    width: 320px;
    height: 300px;
    margin-top: 20px;
    transition: 0.7s;
    border-radius: 20px;
    border: 3px solid rgb(241, 246, 248);
} 
.management-box-item:hover img{
    box-shadow: 3px 3px 10px blue;
    transform: scale(1.1);    
}

.management-text-p{
display: flex;
grid-template-columns:repeat(auto-fit,minmax(350px,1fr));
justify-content: center;
padding: 20 10px;
grid-row-gap: 30px;
grid-column-gap: 70px;
font-size: large;
font-style: oblique;
border: 3px solid rgb(250, 250, 250);
text-align: center;
padding: 50px;
color: #200366;
margin-left: 40px;
/* border: 2px solid rgb(178, 168, 244); */
background-image: url('images/Web-A2.jpg');  opacity: 1;
border-radius: 20px;
}
.management-text-p div{
    padding: 20px;
    border: 2px solid rgb(117, 75, 2);
    border-radius: 20px;
    font-width: bold;
    transform:translateY(-10px);
}
.articalscolor{
    border: 2px solid #200366;
    padding: 5px;
    margin: 10px;
    border-radius: 5px;
}


.title{
text-align:center;
font-size:38px;
font-weight: bold;
margin-bottom:30px;
color:#020958;

}
.stats{
  display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    justify-content: space-between;
    justify-content: center;
    flex-wrap: wrap;
    gap:25px;
    margin-bottom: 20px;
    padding-bottom: 20px;
   
    border: 3px solid rgb(250, 250, 250);
}

.stat{
background:white;
padding:30px;
border-radius:10px;
box-shadow:0 5px 15px rgba(253, 106, 62, 0.1);
border: 3px solid rgb(250, 254, 167);

}
.stat:hover{
    box-shadow: 3px 3px 10px blue;
    transform: scale(1.1);

}
.stat h2{
color:#ff9800;
font-size:42px;
font-weight: bold;
text-align: center;
}
.stat p{
    font-weight: bold;
    color: #200366;
    text-align: center;
}



/* Footer Section Start */
#contact{
   
    background-color: rgb(252, 251, 251);
    background-repeat: 1;
}

footer{
   
  
}
 
.footer-container{
    width:auto;
    margin: auto;
    font-width: bold;
    color: rgb(24, 1, 57);
    padding: 20px;
    
}
.footer-single-parent{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    justify-content: space-between;
    justify-content: center;
    flex-wrap: wrap;
    gap:25px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    
    
}
.footer-single-parent{
    border-radius: 20px;
    border: 3px solid burlywood;
}
.footer-singleitems{
    margin: 5px 5px 5px 10px;
    width: 270px;
    border-radius: 20px;
    border: burlywood;
    padding: 2px;
}
.gradient-text{
    background-image: linear-gradient(rgb(2, 7, 138), rgba(133, 3, 246, 0.991));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-transform: uppercase;
}
.footer-singleitems h3{
    margin: 60px 0 40px 0;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}
.footer-singleitems p{
    /* margin-left: 30px; */
    text-align: left;
    font-weight: bold;
    color: black;
    padding-left: 40px;
    font-size: small;
    border: 1px salmon red;
}
.g-map{
    text-align: center;
    padding: auto;
}
.footer-singleitems p a{
    margin-left: 100px;
}
.footer-firstdiv-p1{
    margin-bottom: 20px;
}
.footer-firstdiv-p2{
    margin: 10px 0;
}
.footer-singleitems i{
    color: #d90606;
}
.footer-single-parent .footer-singleitems:nth-child(2) p{
    margin: 10px 0;
}
.footer-single-parent .footer-singleitems:nth-child(3) p{
    margin: 10px 0;
}
.footer-single-parent .footer-singleitems:nth-child(4) p{
    margin: 10px 0;
}
.footer-single-parent .footer-singleitems:nth-child(4) a{
    text-decoration: none;
    color: rgb(3, 154, 26);
}
.footer-menuitem{
     
}
.footer-menuitem ul{
    display: flex;
    /* grid-template-columns:repeat(auto-fit,minmax(10px,1fr)); */
    justify-content: space-between;
    justify-content: center;
    border: 2px solid inherit;
    padding: 1px;
    background-color: #03c13f;
    flex-wrap: wrap;
}
.footer-menuitem ul li{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(20px,1fr));
    justify-content: space-between;
    justify-content: center;
    flex-wrap: wrap;  
    list-style-type: none;
    margin:8px;
    
}
.footer-menuitem ul li:hover a{
        transform: scale(1.1);
        box-shadow: 3px 3px 10px rgb(58, 41, 243);
}
.footer-menuitem ul li a{
    text-decoration: none;
    text-align: center;
    font-size: 10px;
    font-weight: bold;
    color: rgb(250, 252, 252);
    border: 2px solid rgb(249, 251, 251);
    padding: 8px 12px;
    border-radius: 5px;
    background-image: linear-gradient(rgb(141, 1, 1), rgba(251, 3, 3, 0.991));
}
.footer-menuitem p{
    justify-content: center;
    text-align: center;
    padding-bottom: 5px;
    font-weight: bold;
}
.footer-menuitem span{
    color: rgb(2, 97, 53);
}
hr{
    margin: 30px;
}



/* ------Responsive-Screen-651-to-992px----------- */
@media only screen and (min-width: 651px) and (max-width: 992px){
    
    .header{
    display: flex;
     justify-content: space-between; /* Pushes logo to left, links to right */
     align-items: center;  
     place-items: center;
    }
    .w3-top{
    display: flex;
    justify-content: space-between;
    background-image: linear-gradient(rgb(141, 1, 1), rgba(251, 3, 3, 0.991));
    box-shadow: 3px 3px 10px rgb(174, 233, 245);
    place-items: center;
}
#first-container{
    width: 100%;
    margin: auto;
    display:flex;
    grid-template-columns:repeat(auto-fit,minmax(2,1fr));
    place-items: center;
    flex-wrap: wrap;
    gap:25px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    justify-content: space-between;
    justify-content: center;
    text-align: center;
    /* place-items: center; */
    flex-wrap: wrap;
}
.styles-parent{
    width: 100%;
    /* margin: auto; */
    display: grid;
    flex-wrap: wrap;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    justify-content: space-between;
    justify-content: center;
    /* place-items: center; */
    grid-row-gap: 20px;
    grid-column-gap: 20px;
    border-radius: 25px;
    
    padding: 20px 0;
    
      
}
.services{
display:flex;
grid-template-columns:repeat(auto-fit,minmax(2,1fr));
flex-wrap: wrap;
gap:25px;
margin-bottom: 20px;
padding-bottom: 20px;
justify-content: space-between;
justify-content: center;
place-items: center;
flex-wrap: wrap;
}
.products{
    width: 100%;
    margin: auto;
    justify-content: space-between;
    justify-content: center;
    place-items: center;
    overflow-x: hidden;
}
.styles-parent{
    width: 100%;
    margin: auto;
    display: flex;
    grid-template-columns:repeat(auto-fit,minmax(2,1fr));
    justify-content: space-between;
    justify-content: center;
    grid-row-gap: 40px;
    grid-column-gap: 30px;
    border-radius: 25px;
    flex-wrap: wrap;
    padding: 20px 0;
    place-items: top;
}
#customer{
 width: 100%;
    height: auto;
    justify-content: space-between;
    justify-content: center;
    place-items: center;
}
    #main-certification{
    width: 100%;
    height: auto;
    justify-content: space-between;
    justify-content: center;
    background-color: rgb(244, 243, 241);
    border: 3px solid red;
    padding-left: 20px;
    flex-wrap: wrap;
    place-items: center;
}

.management-box{
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    justify-content: space-between;
    justify-content: center;
    place-items: center;
    text-align: center;
   
    /* grid-row-gap: 100px;
    grid-column-gap: 100px;
    margin-top: 20px; */
    /* margin-left: 100px; */
    border-radius: 25px;
    border: #50049d;
    cursor: pointer;
    place-items: center;
}
.stats{
  display:flex;
    grid-template-columns:repeat(auto-fit,minmax(2,1fr));
    flex-wrap: wrap;
    gap:25px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    justify-content: space-between;
    justify-content: center;
    flex-wrap: wrap;
    border: 3px solid rgb(250, 250, 250);
    place-items: center;
}

.footer-single-parent{
    display:flex;
    grid-template-columns:repeat(auto-fit,minmax(2,1fr));
    flex-wrap: wrap;
    gap:25px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    justify-content: space-between;
    justify-content: center;
    flex-wrap: wrap;
    place-items: center;
    
}
}
/* -------------Responsive-Screen-0px-to650px---------------------- */

@media only screen and (max-width: 688px){
    .header{
    display: block;
     justify-content: space-between; /* Pushes logo to left, links to right */
     align-items: center;  
     place-items: center;
    }
    .w3-top{
    display: block;
    justify-content: space-between;
    background-image: linear-gradient(rgb(141, 1, 1), rgba(251, 3, 3, 0.991));
    box-shadow: 3px 3px 10px rgb(174, 233, 245);
    place-items: center;
}
#first-section{
}
    #first-container{
    width: 100%;
    margin: auto;
    display:block;
   margin: 20px;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    /* flex-wrap: wrap;
    
    justify-content: space-between;
    justify-content: center;
    place-items: center; */
    text-align: center;
    }
.styles-parent{
    width: 100%;
    margin: auto;
    display: block;
    grid-template-columns:repeat(auto-fit,minmax(260px, 1fr));
    justify-content: space-between;
    justify-content: center;
    place-items: top;
    grid-row-gap: 20px;
    grid-column-gap: 30px;
    border-radius: 25px;
    flex-wrap: wrap;
    padding: 20px 0;
}
.services{
display:block;
grid-template-columns:repeat(auto-fit,minmax(1,1fr));
flex-wrap: wrap;
gap:25px;
margin-bottom: 20px;
padding-bottom: 20px;
justify-content: space-between;
justify-content: center;
place-items: center;
flex-wrap: wrap;
}
.products{
    width: 100%;
    margin: auto;
    justify-content: space-between;
    justify-content: center;
    place-items: center;
    overflow-x: hidden;
}

#customer{
 width: 100%;
    height: auto;
    justify-content: space-between;
    justify-content: center;
    /* place-items: center; */
}

#main-certification{
    width: 100%;
    height: auto;
    justify-content: space-between;
    justify-content: center;
    /* background-color: rgb(244, 243, 241);
    border: 3px solid red;
    padding-left: 20px;
    flex-wrap: wrap;
    place-items: center; */
}
.management-box{
    display: block;
    /* justify-content: space-between;
    justify-content: center; */
    text-align: center;
    grid-template-columns:repeat(auto-fit,minmax(1,1fr));
    /* grid-row-gap: 100px;
    grid-column-gap: 100px;
    margin-top: 20px;
    border-radius: 25px;
    border: #50049d;
    cursor: pointer;
    place-items: center; */
}

.footer-single-parent{
    display:block;
    grid-template-columns:repeat(auto-fit,minmax(1,1fr));
    /* flex-wrap: wrap;
    gap:25px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    justify-content: space-between;
    justify-content: center;
    flex-wrap: wrap;
    place-items: center; */
    
}
.stats{
  display:block;
    grid-template-columns:repeat(auto-fit,minmax(1,1fr));
    /* justify-content: space-between;
    justify-content: center; */
    /* place-items: center;
    flex-wrap: wrap;
    gap:25px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    flex-wrap: wrap;
    border: 3px solid rgb(250, 250, 250); */
    
} 
}
@media only screen and (max-width: 940px){
    .header #navigation .w3-right span a{
        position: fixed;
        backgroun-color: rgb(158, 249, 31);
        height: 100vh;
        width: 100%;
        flex-direction: column;
    }
    
}