/* #2C8068 */
        body{color: rgb(37, 37, 37); font-size: 19px;font-family: 'Quantico', sans-serif;}
        .top{background: #ffdcdc;}
        .call-icon i, .clock-box i {
            font-size: 2rem;
            color: #200e0e;
        }
        .call-text a, .clock-text a {
            font-size: 15px;
            text-decoration: none;
            color: #200e0e;
            font-weight: var(--bold);
        }
        .logo-img img {
            width: 250px;
        }
        h1, h2{font-size: 55px;}
        .headingText p{font-size: 21px;}
        .productBox{transition: 0.4s; border-radius: 5px; border: 1px solid grey; padding: 20px 10px;width: 100%; overflow: hidden;}
        .productBox img{width: 60%;}
        .btnWPbox{width: 100%; padding: 7px; border-radius: 5px; border: none; background: greenyellow;}
        .btnWPbox2{width: 100%; padding: 7px; border-radius: 5px; border: none; background:rgb(93, 171, 255);}
        
        .boxJoin{background: #575757; height:400px;position: relative;}
        .boxJoin .row2{ position: absolute; top: 50%; left: 55%; transform: translate(-50%,-50%); width: 100%;}
        .boxjoin2{padding: 15px; text-align: center; color: white;}
        .inputBox{margin-top: 15px;}
        .inputBox input{ padding: 6px; border-radius: 6px; font-size: 18px; width: 100%; border: none; margin-top: 15px;}
        .inputBox textarea{ padding: 6px; border-radius: 6px; font-size: 18px; width: 100%; border: none; margin-top: 15px;}
        .footerContact2{font-size: 25px;}
        .navBar{background: #ffffff; position: sticky; position: -webkit-sticky; width: 100%; z-index: 999; top: 0; line-height: 80px; box-shadow: 0px 2px 5px black;}
        .mobiNab{display: flex; justify-content: right;}
        .navBar a{text-decoration: none;}
        .li{color: rgb(0, 54, 108);padding: 0px 20px; font-size: 20px;line-height: 60px;line-height: 80px;}
        .li:hover{color: rgb(66, 20, 20);}
        .dropMain{position: relative;}
        .dropBox{display: none; position: absolute; width: 250px; background: #ffffff; line-height: 40px; z-index: 1000;}
        .dropLi{transition: 0.3s; padding: 5px 20px;color: rgb(0, 54, 108);}
        .dropMain:hover .dropBox{display: block;}
        .dropLi:hover{color: white;background: #4d6e63;}
        @import url('https://fonts.googleapis.com/css2?family=Almarai&display=swap');
    .faq-container {
      margin: 0 auto;
    font-family:'cairo',serif;
    }
    
    .faq-item {
      margin-bottom: 10px;
    }
    
    .faq-question {
      background-color: #000;
      color: #fff;
      padding: 10px;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      transition: background-color 0.5s ease;
      border-radius: 5px;
    }
    
    .faq-question.active {
      background-color: #000;
      color: #fff;
    }
    
    .faq-question:hover {
      background-color: #BF953F;
    }
    
    .faq-answer {
      display: none;
      background-color: #e6e6e6;
      padding: 10px;
      color: #000;
      transition: height 0.5s ease;
      overflow: hidden;
      border-radius: 5px;
    }
    
    .faq-answer.active {
      display: block;
    }
    
    .faq-icon {
      font-weight: bold;
      margin-left: 10px;
      transition: transform 0.5s ease;
    }
    
    .faq-icon.minus {
      transform: rotate(45deg);
    }
    
    /* Add transition to the height of the answer when closing */
    .faq-answer:not(.active) {
      height: 0 !important;
      transition: height 5s ease;
    }
    .logoForm{font-size: 2vw; margin-left: 10%; margin-top: 5px;}
    .menubtn{display: none;}
    .bannerImage{width: 100%; height: 80vh; background-position: center; background-size: cover; position: relative;}
        .textBanner{position: absolute; top: 50%; left: 10%; transform: translate(-10%, -50%); width: 40%;}
        .textBanner h1{font-size: 4.5rem; color: white;}
        .cusMargin{margin: 200px auto;}
        .blackBox{background: rgb(93, 58, 9); padding: 30px 0; font-size: 30px; font-weight: bold;}
        .textBannerMob h1{display: none;}
        .productImage{width: 80%;border-radius: 15px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
        .headerMobiNav{display: none;}
        .menuBtnThis{display: none;}
    @media(max-width:900px){
      .menuBtnThis{display: block; border-radius: 5px; background: rgb(0, 54, 108); border: none; margin-top: 20px;}
      .headerMobiNav img{display: block; border-radius: 5px; background: red; border: none; margin-top: 20px; width: 60px; float: right;}
      .logoForm{font-size: 25px; margin-left: 10%; margin-top: 5px;}
      .dropBox{display: block; position: inherit; width: 250px; background: white; background: #77131365; line-height: 40px; z-index: 1000;}
      .mobiNab{display: none; background: rgb(243, 243, 243); text-align: left;position: fixed; top: 0; right: 0; width: 80%;  height: 100%; overflow-y: scroll; box-shadow: 0px 5px 8px grey; z-index: 1000;}
      .menubtn{display: block; width: 39px; float: right;}
      .bannerImage{height: 40vh; background-position: right;}
      .textBanner{display: none;}
      .cusMargin{margin: 100px auto;}
      #boxJoin{height: 700px;}
      .textBannerMob h1{display: block; font-size: 30px; text-align: center; margin-top: 50px;}
      .productImage{width: 100%;border-radius: 15px; position: inherit; }
      .headerMobiNav{display: block; text-align: right; }
      .headerMobiNav img{width: 30px; margin-top: 8px; margin-right: 10px;}

    }