*{    margin: 0;    padding: 0;    }body{    background-color: rgb(241, 239, 239);}nav{    padding: 10px;    display: flex;    justify-content: space-between;    align-items: center;    background-color: transparent;    /* border-bottom: 2px solid silver; */    position: fixed;    top: 0;    z-index: 2000;    width: 100%;    transition: .2s ease-in;}.company-name{    color: rgb(255, 145, 0);    font-size: 25px;    font-family: 'segoe ui';    padding-left: 20px;}.nav-content{    display: inline-block;    justify-content: space-between;    align-items: center;    list-style-type: none;    margin-right: 50px;}.nav-content li{  margin: 0 10px;  }.nav-content li a{    color: white;    text-decoration: none;    border-bottom: 2px solid rgb(255, 145, 0);    padding: 10px 15px;    font-size: 14px;    font-family:'berlin sans FB';    transition: .2s ease-in-out;} .nav-content li a:hover{   color: rgb(255, 145, 0);   border-bottom: 2px solid silver;}.banniere{    width: 100%;    height: 400px;    position: relative;}.bannimg{  width: 100%;  height: 100%;}.bannimg img{   width: 100%;   height: 100%;   filter: brightness(40%);}.banncontent{    position: absolute;    top: 60%;    left: 50%;    transform: translate(-50%,-50%);}.banncontent input{  width: 500px;  font-size: 20px;  padding: 10px 15px;  border: none;  outline: none;  font-family: 'trebuchet MS';}section{    padding: 20px;    margin: 25px 20px;}  .company-contact{      /* display: grid;      grid-template-columns: 1fr 700px;      gap: 20px; */      margin: 80px 30px;     margin-top: 150px;  }  .compdescimg2{    width: 500px;    height: auto;    position: relative;    /* border: 4px solid rgb(255, 145, 0); */}.compdescimg2 img{    width: 100%;    height: auto;    filter: brightness(40%);}  /* .compdesccontent2{    margin-top: 40px;  } */  .compdesccontent2 h2{    text-align: right;    color: rgb(51, 51, 51);    font-family: 'berlin sans FB';    font-size: 30px;    margin: 10px 0;    padding-bottom: 5px;    border-bottom: 2px solid rgb(255, 145, 0);      }    .compdesccontent2 p{      text-align: right;      color: rgb(51, 51, 51);      font-family: helvetica;      font-size: 14px;      margin: 20px 15px;    }    .compdescimgcontent2{        position: absolute;        top: 50%;        left: 50%;        transform: translate(-50%,-50%);    }    .compdescimgcontent2 h2{       color: rgb(51, 51, 51);       text-align: center;       font-size: 25px;       font-family: fantasy;           }    .compdescimgcontent2 h2 a{        color: white;        text-align: center;        font-size: 25px;        font-family: cursive;        text-decoration: none;        transition: .2s ease-in-out;     }     .compdescimgcontent2 h2 a span{        color: rgb(255, 145, 0);        text-align: center;        font-size: 25px;        margin-right: 15px;        transition: .2s ease-in-out;     }     .compdescimgcontent2 h2 a:hover{         color: rgb(255, 145, 0);     }     .compdescimgcontent2 h2 a:hover > .telspan{        color: white;            }  .productscontainer{      margin: 40px 10px;        }  .productheader{    margin-bottom: 20px;  }  .productheader h2{   color: rgb(51, 51, 51);   font-size: 25px;   font-family: fantasy;   border-bottom: 2px solid white;   margin: 0 50px;   padding: 0 15px;   padding-bottom: 5px;  }  .allproductscontainer{      margin-top: 20px;      padding-top: 20px;        }   .sliderscontainer{       width: auto;       height: auto;       position: relative;       padding: 0 90px;   }       .arrow1 > .slick-prev{     position: absolute;     top: 40%;     left: 0;     z-index: 100;     color: white;     background-color: rgba(192, 192, 192, 0.493);     font-size: 20px;     padding: 20px 25px;     border: none;     outline: none;     border-radius: 50%;     cursor: pointer;   }   .arrow1 > .slick-next{    position: absolute;    top: 40%;    right:0;    z-index: 100;    color: white;    background-color: rgba(192, 192, 192, 0.493);    font-size: 20px;    padding: 20px 25px;    border: none;    outline: none;    border-radius: 50%;    cursor: pointer;  }  .arrow2 > .slick-prev{    position: absolute;    top: 40%;    left: 0;    z-index: 100;    color: white;    background-color: rgba(192, 192, 192, 0.493);    font-size: 20px;    padding: 20px 25px;    border: none;    outline: none;    border-radius: 50%;    cursor: pointer;  }  .arrow2 > .slick-next{   position: absolute;   top: 40%;   right:0;   z-index: 100;   color: white;   background-color: rgba(192, 192, 192, 0.493);   font-size: 20px;   padding: 20px 25px;   border: none;   outline: none;   border-radius: 50%;   cursor: pointer; } .arrow3 > .slick-prev{    position: absolute;    top: 40%;    left: 0;    z-index: 100;    color: white;    background-color: rgba(192, 192, 192, 0.493);    font-size: 20px;    padding: 20px 25px;    border: none;    outline: none;    border-radius: 50%;    cursor: pointer;  }  .arrow3 > .slick-next{   position: absolute;   top: 40%;   right:0;   z-index: 100;   color: white;   background-color: rgba(192, 192, 192, 0.493);   font-size: 20px;   padding: 20px 25px;   border: none;   outline: none;   border-radius: 50%;   cursor: pointer; } .arrow4 > .slick-prev{    position: absolute;    top: 40%;    left: 0;    z-index: 100;    color: white;    background-color: rgba(192, 192, 192, 0.493);    font-size: 20px;    padding: 20px 25px;    border: none;    outline: none;    border-radius: 50%;    cursor: pointer;  }  .arrow4 > .slick-next{   position: absolute;   top: 40%;   right:0;   z-index: 100;   color: white;   background-color: rgba(192, 192, 192, 0.493);   font-size: 20px;   padding: 20px 25px;   border: none;   outline: none;   border-radius: 50%;   cursor: pointer; }    .packofeight1, .packofeight2, .packofeight3, .packofeight4{    width: 100%;    height: 400px;    margin-bottom: 60px;      } .products{     width: 100%;      } .product{     width: 240px;     height: 350px;     margin: 20px  ;     padding-bottom: 10px;     display: block;     text-decoration: none;     position: relative;     overflow: hidden; } .product-img{     width: 100%;     height:auto;     padding: 10px 0; } .product-img img{     width: 100%;     height: auto; } .productcontent{     position: absolute;     bottom: 0;     width: 100%;     /* margin-top: 10px; */     padding: 5px 0;     display: flex;     justify-content: space-between;     align-items: center;     background-color: rgba(0, 0, 0, 0.589);    }    .productname p {     font-size: 20px;     text-decoration: none;     color: white;     font-family: 'trebuchet MS';     padding: 0 5px;    }    .productprice p{        color: rgb(255, 222, 0);        font-size: 20px;        font-family: 'trebuchet MS';        padding: 0 5px ;    } .singleproductcontainer{     position: relative;     width: 280px;     height: auto; }        .productorder {        background-color: rgb(255, 145, 0);        display: block;        text-decoration: none;        width: 100%;        height: 0;        margin: 20px ;        transition: .2s ease-in;        /* position: absolute;        top: 120%; */    }    .productorder p{        color: white;        padding: 10px 0;        font-size: 15px;        font-family: 'trebuchet MS black';        text-align: center;     }       .singleproductcontainer:hover > .productorder{        height: 35px;        text-decoration: none;    }    .singleproductcontainer:hover > .product{       border: 2px solid rgb(255, 145, 0);    }    .productpages{        margin: 40px 0;    }    .productpages span{        color: rgb(51, 51, 51);        margin: 0 10px ;        font-size: 14px;        font-family: 'berlin sans FB';    }    .otherproducts{        display: flex;        align-items: center;        justify-content: center;    }    .changeproductpage{        padding: 10px 15px;        border: 1px solid rgb(51, 51, 51);        border-radius: 5px;        color: rgb(51, 51, 51);        margin: 0 10px;        font-size: 14px;        font-family: fantasy;        cursor: pointer;    }    .active{        background-color: rgb(255, 145, 0);        color: white;        border: none;    }    /* screen <= 1200px */    @media screen and (max-width: 1278px) {        .company-name h2 {          font-size: 30px;        }        .nav-content li a{            font-size: 12px;        }        .compdesccontent2{            margin-top: 20px;                    }        .compdesccontent2 h2{            font-size: 20px;          }        .product{          width: 200px;          height: 300px;        }      }/* screen <= 900px */      @media screen and (max-width: 900px) {        .company-name h2 {          font-size: 20px;        }        .nav-content li a{            font-size: 14px;        }        .banncontent input{          width: 400px;          font-size: 10px;        }        .compdesccontent2 h2{          font-size: 15px;                  }        .compdesccontent2 p{          font-size: 10px;                  }        .compdescimgcontent2 h2 a{          font-size: 16px;       }      }      /* screen <= 784px */      @media screen and (max-width: 784px) {                .company-name h2 {          font-size: 16px;        }        .nav-content li a{            font-size: 10px;        }        .nav-content{          margin-right: 10px;        }        .banncontent input{          width: 200px;          font-size: 10px;        }        .compdesccontent2{          margin: 2px 0;        }       .compdesccontent2 h2{         font-size: 14px;       }       .compdesccontent2 p{        font-size: 10px;        margin: 5px 10px;      }       .compdescimgcontent2{         top: 30%;       }       .compdescimgcontent2 h2 a{        font-size: 14px;        }       .productheader h2{         font-size: 14px;         margin: 0 ;       }      .sliderscontainer{        padding: 15px;      }       .packofeight1, .packofeight2, .packofeight3, .packofeight4{        width: 100%;        height: 200px;        margin-bottom: 60px;              }       .product{         width: 95px;         height: 185px;       }       .productcontent{         height: 30px;         padding: 10px 0;       }      .productname p{        font-size: 7px;      }      .productprice p{        font-size: 7px;      }     .productorder{      width: 100%;     }     .productorder p{       font-size: 10px;     }       .singleproductcontainer{        width: 100px;        height: auto;    }     .arrow1 > .slick-prev{       font-size: 10px;       padding: 15px 18px;            }     .arrow1 > .slick-next{      font-size: 10px;      padding: 15px 18px;          }      section{        margin: 25px 0;      }      .singleproductcontainer:hover > .product{        border: none;     }      }