*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: sans-serif;
    scroll-behavior: smooth;
  
}
/* custom-scrollbar(S) */
/* Works on Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #0072b9 black;
}

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 5px;
}

*::-webkit-scrollbar-track {
  background: #0072b9;
  border-radius: 20px;
}

*::-webkit-scrollbar-thumb {
  background-color: #00afef;
  border-radius: 20px;
  border: 3px solid black;
  scroll-behavior: smooth;
}
/* custom-scrollbar(E) */

.foot .right{
  text-align: center;
  font-size: 16px;
}


.shown{
  border: 1px solid red;
  width: 50%;
  height: 100px;
  overflow-x: scroll;
  box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px;
}








/* back-to-top-button(S) */
.rounded-circle{
  color: white;
  background-color: #00afef;
border: 1px solid black;
  position: fixed;
  z-index: 1;
  right: 0;
  bottom: 0;
  padding: 20px;
  transform: translate(-50%,-50%) !important;
  cursor: pointer;
  font-size: 10px;
  border-radius: 50%  !important;
  line-height: 0.5rem;
  box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px;
  

}
.back{
  display: none;
}

/* back-to-top-button(E) */



























.cont .cont-content .butn{
  /* border: 1px solid red; */
  text-align: center;
  
  
}
.butn h4{
  color:#0072B9;
  font-weight: bold;

}
.butn .btn{
  
  color: red;
  border: none;
 
  font-weight: bold;
}

.specification{
  /* border: 1px solid cyan; */
  margin: 20px 0;
  padding: 20px 3%;
  overflow-x: auto;
  scroll-behavior: smooth;

}

.specification  h2{
  text-align: center;
  font-weight: bold;
}
 th{
  background:#0072B9;
}

table, th, td {
  border:1px solid black;
}

table{
  margin: 20px 0;
overflow: scroll;
/* background: #0072B9; */
}

table,td{
  text-align: center;
}

/* Alerter-code Redsign-navbar(S) */
 
svg.line-top {
	width: 100%;
	/* background-color: #17141d; */
}
svg.line-bottom {
	width: 100%;
}
.menu {
  	width: 750px;
    height: 70px;
	  margin: 0 auto;
}
ul {
	padding: 0;
	margin: 0;
}

ul #me  {
	margin: 0;
	/* padding: 10px 0 24px 0; */
	width: 25%;
	height: 10px;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	color: black;
	cursor: pointer;
	display: inline-block;
	letter-spacing: 3.5px;
	transition: all 0.5s ease-out;
}

#me.active {
	color: #3163ff;
	transform: scale(1.1);
}
.menu ul li a{
  text-decoration: none;
}
polygon {
	stroke-width: 2px;
	stroke: black;
	fill: #2f60ff;
}

/* Alerter-code(E) */
.change{
 
    background-color: #5352ed!important;
    font: 400 10px "Lato", sans-serif;
    font-size: 15px;
  }


/* Alerter-code Redsign-navbar(E) */


.hea{
    margin: 10px;
    /* border: 1px solid red; */
    padding-left: 70px;
    
    
    
  }
  .fiex #navbarCollapse a {
  
    font-family: 'Gill Sans MT';
    
  
  }
  

  .hea p{
    margin: 0 ;
  }
  
  .privacy{
    /* border: 1px solid red; */
    display: flex;
    flex-direction: column;
    padding: 10px 0;
  }
  
  .privacy .nav-item a{
    padding: 10px 0;
  }


.under:hover{
    text-decoration: underline;
}


#bottom h6{
    font-weight: bold;
    text-decoration: underline;
    
  
   }
 
/* empty-bar(S) */
#position .empty{
    width: 100%;
    height: 20px;
    /* border: 1px solid red; */
    background-color: #0072B9;
    position: relative;
    bottom: 0.6px;
  
  
  }
  
  .foot .soc a{
    color: white !important;
  
  }
  
  .foot .soc a:hover{
    background-color: black !important;
    color: white !important;
  }

  /* empty-bar(E) */
   

/* Background- position-fixed(S) */

/* Background- position-fixed(e) */



.items{
    /* border: 1px solid red; */
    width: 300px;
    height: 300px;
    cursor: pointer;
}

/* navbar-text (S) */
.nav-item{
 font-size: 20px;
 font-weight: bolder;
 margin: 0 20px;
}

#position #navbarCollapse a {
    color: #f8f9fa!important;
    text-decoration: none ;
    
  }
  #position #navbarCollapse a:hover{
color: black !important;
  }
  .foot a:hover {
    color: black !important;
   text-decoration: underline;
 }
  .text-primary {
    color: white !important;
 }



   #position #navbarCollapse .active{
    color: black !important;
}
/* navbar-text (E) */

  /* footer-iso-img(S) */
      

  .certify img{
    /* border: 1px solid red; */
    width: 80px;
    height: 80px;
  margin:  10px;
    border-radius: 60px;
   }
  /* footer-iso-img(E) */






/* New-product-code(S) */
.contain{
    margin-top: 190px;
    /* border: 1px solid cyan; */
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.contain .heading h1{
    font-size: 30px;
    font-weight: bolder;
}
.heading{
    
    /* border: 1px solid cyan; */
    text-shadow: 5px 3px 5px rgba(0, 0, 0, 0.3);
}
.prdcuts{
    /* border: 1px solid red; */
    width: 80%;
    height: fit-content;
    display: flex;
    flex-wrap: wrap;
    
    justify-content: center;

}
/* detail-btn(S) */


/* detail-btn(e) */

.pro1{
    width: 300px;
    height: 400px;

    margin: 30px 80px;
}
.pro1 img{
    width: 100%;
    height: 65%;
    /* border: 1px solid chartreuse; */
}
.pro1 h3{
    margin-top: 20%;
    /* font-family: sans-serif; */
    text-shadow: 5px 3px 5px rgba(0, 0, 0, 0.3);
    text-align: center;
    font-size: 18px;
    font-weight: bolder;
    
    /* border: 1px solid red; */
}
.pro1:hover{
    
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px;
    cursor: pointer;
  }
  /* .pro1:hover h3{
    color: white;
    background-color: #000;
    border-radius: 5px;
  } */




/* New-product-code(E) */


/* product-popup-code(S) */

.cont{
    /* border: 1px solid cyan; */
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transform: scale(1.1);
    transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;
    
}

.cont-content {
   
    /* border: 1px solid red; */
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    padding: 30px;
   /* width: 50%; */
    border-radius: 0.5rem;

  
  
}
.cont-content h1{
    text-align: center;
}

.cont .cont-content .clbutton {

    float: right;
    font-size: 50px;
    text-align: center;
    cursor: pointer;
    /* border: 1px solid red;
    */
}

.clbutton i{
    color: black;
}

.clbutton i:hover {
    color: red;
}



.show-cont {
    opacity:1;
    visibility: visible;
    transform: scale(1.0);
    transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;
}
.box{
    /* border: 1px solid green; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

}
.details{
    /* padding: 10px 2%; */
    width: 50%;
  height: 500px;
  overflow: auto;
 
    
    /* border: 1px solid red; */
    
}
.box .image{
    width: 50%;
    /* border: 1px solid cyan; */
    display: flex;
    justify-content: center;
    align-items: center;
   
}
.box .image img{
    width: 450px;
    height: 450px;
    
}


/* fonts-for-sub-headings (S)*/

h1{
    text-shadow: 5px 3px 5px rgba(0, 0, 0, 0.3);
}
p{
  
    font-size: 14px;
    font-weight: 300;  
    
}
/* fonts-for-sub-headings (E)*/
/* product-popup-code(E) */



.fiex{
    top: 120px;
    /* background: #000; */

}

/* .fixed-top{
    background: #fff;
    z-index: 100 !important;
} */
.navbar{
    background-color: #00afef!important;
    position: relative;
    bottom: 0.8px;
}
.change {
    background-color: #0072B9!important; 
    margin-left:  0 !important;
    margin-right: 0 !important;
}
/* .change p{
    font-size: 16px;
  font-weight: lighter;
} */


/* nav-bar-positioning(E) */

/* logo-resize-code(S) */
.navbar-brand{
   position: relative;
   left: 20px;
    width: 80px;
    height: 80px;
    
}
/* .log .navbar-brand {
    position: relative;
    bottom: 15px;

} */
#logo{
    /* width: 100%; */
    height: 100%;
    
}


/* logo-resize-code(E) */
/* footer(S) */
.text-white{
    background-color: #0072B9!important; 
}
.f-logo{
    /* border: 1px solid red; */
    /* width: 100px!important;
    height: 100px !important; */

}
.f-logo img{
    width: 100px;
    height: 100px;
}
/* footer(e) */



.navbar-toggler-icon{
    /* border: 1px solid red; */
  
  }
  .navbar-toggler-icon .bars{
    color: black;
    font-size: 30px;
  }
  #position{
    /* border: 2px solid  fuchsia; */
    width: 100%;
    height: 20%;
    position: fixed;
    top: 0;
    z-index: 2;


}


@media screen and (min-device-width:320px) and (max-device-width:480px) {
  .foot .right{
    text-align: start;
  }

    .certify .small{
        text-align: left !important;
      }

    .certify img{
        width: 80px;
        height: 80px;
    }
    .contain{
        margin-top: 160px;
    }

    /* Refrences(s) */
  
  .change{
    padding-top: 3px !important;
    padding-bottom: 3px !important;

    
  }
  .change p{
 font-size: 15px !important;

  }
  .change .change2 p,.change3{
    margin-bottom: 0 !important;
  }
  #position .empty{
    height: 10px;
  }

/* Refrences(e) */

    /* nav-bar-positioning(S) */


    .position{
        /* border: 1px solid red; */
        width: 100%;
        height: 20%;
        position: fixed;
        top: 0;
        z-index: 2;


    }
    
    
    #bar{
        background-color: aqua;
          padding-top: 0px !important;
     display: none ; 
    }

    .foot{
        /* border: 5px solid cyan; */
        position: relative;
        z-index: 0;
    }
.fiex{
/*     
    top: 74px; */
    background: #000;

}
  /* nav-bar-positioning(S) */ 


    /* New-product-code(S) */


     .pro1{
         /* border: 1px solid darkblue; */
        width: 100%;
        height: 100%;
       margin: 10px 0;
       display: flex;
       flex-direction: column;
       align-items: center;
}

.pro1 img{
  width: 80%;
  
}
    /* New-product-code(E) */
     /* popup code(s) */
     .cont .cont-content{
        width: 90%!important;
        height: 80%;
        padding: 10px 0;
        
     }
     .cont-content .box{
      display: flex;
      /* flex-direction: column-reverse!important; */
      height: 85%;
      margin: 15px 0;
      gap: 50px;
      

        
     }
     .cont-content .box .image{
        /* border: 1px solid red; */
        width: 100%;
        height: 250px;
     }
    
     .cont-content .box .image img{

        width: 90%;
        height: 100%;
       
     }
         
     .cont-content .box .details{
        /* border: 1px solid  black; */
        width: 100%;
        padding: 0 2%;
     }
    
     .cont .cont-content h1{
        font-size: 20px;
        font-weight: bolder;
        position: relative;
        top: 50px;
     }
    
     
 
     
     .cont-content .box .details h3{
        font-size: 15px;
        font-weight: bolder;
       
     }
     .cont-content .box .details h2{
        font-size: 18px;
        font-weight: bolder;
     }
     .cont .cont-content .clbutton{
       /* background-color: red; */
       font-size: 10px;
    
        /* border: 1px solid cyan; */
        background-image: url("imgages/x.png");
     }
     .cont .cont-content .clbutton i{
        font-size: 30px;
    
     
     }
     .navbar{
        position: relative;
        bottom: 0.8px;
     }

     .navbar-brand {
        left: 0;
       }
  

 }

 /* @media screen and (min-device-width:410px) and (max-device-width:480px) { 
    .fiex{
        top: 145px;
        background: #000;
    
    }

} */
 @media screen and (min-device-width:481px) and (max-device-width:768px) {
  .foot .right{
    text-align: start;
  }
    #position .empty{
        height: 15px;
      }
      .certify .small{
        text-align: left !important;
      }

      .change{
        
        font: 400 10px "Lato", sans-serif !important;
        font-size: 15px !important;
        padding-top:  3px !important;
        padding-bottom: 3px !important;
   
      
      }
       .change p{
        font-size: 15px;
       }
     
    
  
    .certify img{
        width: 80px;
        height: 80px;
    }

    .pro1{
        /* border: 1px solid darkblue; */
        width: 80%;
        height: 100%;
        margin: 10px 0;
        display: flex;
        flex-direction: column;
        align-items: center;


        }

        .pro1 img{
          width: 70%;
        }
          /* popup code(s) */
          .cont-content{
            width: 80%!important;
            height: 75%;
            padding: 10px 5%!important;
         }
          
          .cont-content .box{
            display: flex;
            /* flex-direction: column-reverse!important; */
            height: 78%;
            /* margin: 40px 0; */
            align-items: center;
             
          }
         .cont-content .box .image{
            width:100%;
            height: 100%;
            /* border: 1px solid crimson; */
         }
         .cont-content .box .image img{
            width: 100%;
            height: 100%;
         }
         .cont-content .box .butn{
          /* position: relative;
          top: 2%; */
          /* margin: 40px 0; */
         }
         .cont-content .box .details{
            /* border: 1px solid  black; */
            width: 100%;
            height: 80%;
            padding: 0 2%;
            
         }
     
    
         .cont .cont-content h1{
          margin: 30px 0;
            font-size: 20px;
            font-weight: bolder;
            
         }
         .box .details h3{
            font-size: 15px;
        font-weight: bolder;
         }
         .box .details h2{
            font-size: 18px;
            font-weight: bolder;
         }
         
         .cont .cont-content .clbutton {
            font-size: 30px;
            /* border: 1px solid cyan; */
        
         }
         /* popup code(E) */ 
   
         .contain{
            margin-top: 200px;
        }
         /* nav-bar-positioning(S) */
         .fiex{
    
            /* top: 180px; */
            background: #000;
        
        }

        .position{
            /* border: 1px solid red; */
            width: 100%;
            height: 22%;
            position: fixed;
            top: 0;
            z-index: 2;


        }
        #bar{
            background-color: aqua;
        }

        .foot{
            /* border: 5px solid cyan; */
            position: relative;
            z-index: 0;
        }
         /* nav-bar-positioning(E) */

 }
 @media screen and (min-device-width:769px) and (max-device-width:998px) {

  .butn .btn{
    font-size: 20px;
  }
  #position .empty{
    height: 18px;
  }
      /* nav-bar-positioning(S) */
   
      .change{
        padding-top: 4.5px !important;
        padding-bottom: 4.5px !important;
      }
      .change p{
        font-size: 15px ;

      }
   

    .fiex{
    
        /* top: 180px; */
        background: #000;
    
    }

    .position{
        /* border: 1px solid red; */
        width: 100%;
        height: 22%;
        position: fixed;
        top: 0;
        z-index: 2;


    }
    #bar{
        background-color: aqua;
    }

    .foot{
        /* border: 5px solid cyan; */
        position: relative;
        z-index: 0;
    }
     /* nav-bar-positioning(E) */
    .cont .cont-content .box{
        display: flex;
        /* flex-direction: column-reverse!important; */
        height: 85%;
        /* margin-top: 40px; */
        align-items: center;
        gap: 30px;
        
       
        
        
         
      }
      .cont-content .box .image{
        width: 80%;
        height: 60%;
        
        /* border: 1px solid crimson; */
     }
    .cont-content .box .image img{
        width: 100%;
        height: 100%;
    }
    .cont-content {
        /* border: 1px solid crimson; */
        width: 70%;
        height: 70%;
        

    }

    .cont-content .box .details{
        /* border: 1px solid  black; */
        width: 100%;
        height: 60%;
        padding: 0 2%;
        
     }
     .cont .cont-content .clbutton {
        font-size: 30px;
        /* border: 1px solid cyan; */
    
     }
    .cont .cont-content h1{
        font-size: 26px;
        font-weight: bolder;
        font-weight: bolder;
        padding-top: 20px;
        
     }
     .box .details h3{
        font-size: 15px;
    font-weight: bolder;
     }
     .box .details h2{
        font-size: 18px;
        font-weight: bolder;
     }

     
    .certify img{
        width: 80px;
        height: 80px;
    }
    
 }

 @media screen and (max-device-width:992px)  {
    .menu{
        display: none;
    }
  
  }
  
  @media screen and (min-device-width:991px)  {
  
     .navbar-nav{
      display: none;
       
        
    }
    
  }

 @media only screen and (min-width: 1000px) {
     /* nav-bar-positioning(s) */

     .position{
        /* border: 1px solid red; */
        width: 100%;
        height: 32%;
        position: fixed;
        top: 0;
        z-index: 2;


    }
    #bar{
        background-color: aqua;
    }

    .foot{
        /* border: 5px solid cyan; */
        position: relative;
        z-index: 0;
    }

     /* nav-bar-positioning(E) */

    .cont .cont-content h1{
        font-size: 26px;
        font-weight: bolder;
        font-weight: bolder;
        /* padding-top: 20px; */
        
     }
     .box .details h3{
        font-size: 15px;
    font-weight: bolder;
     }
     .box .details h2{
        font-size: 18px;
        font-weight: bolder;
     }
     .cont .cont-content .clbutton {
        font-size: 30px;
        /* border: 1px solid cyan; */
    
     }

     .cont .cont-content{
        width: 50%;
     }
     .certify img{
        width: 100px;
        height: 100px;
    }
    
    .change p{
      font-size: 15px;
    }


 }


/* Changes code(E) */