:root {


    --color-1: #000080;
    --color-2: #25314C;
    --color-3: #F4F4F6;
    --color-4:#194BFB;
    --color-5:#717184;
    --color-6:#42424D;

    --radius-1:8px;

}
.header{
background: linear-gradient(179.38deg, #F8F8FF 68.42%, rgba(208, 208, 255, 0.55) 110.02%);
border-radius: 110px;
}
.header .form-box{
  border-radius: 16px;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.header .form-select:focus {
  box-shadow: 0 0 0 .15rem rgba(0, 0, 128, 0.24);
}
.customers img{
    border:2px solid var(--color-1);
}
.customers img:first-child{
    z-index: 3;
    right: 0;
}
.customers img:nth-child(2){
    z-index: 2;
    right:35px
}
.customers img:last-child{
    z-index: 1;
    right:65px
}
.customers .pic{
    height: 54px;
    width: 120px;
}
 .title{
    /*border-right:3px solid var(--color-1);*/
}
.title .eng{
letter-spacing: 0.5em;
}
.services .custom-col{
    width: 12.5%;
    flex: 0 0 auto;
}
.services .service-box{
    border-radius: 8px;
    background-color: white;
}
.services .name-service{
  height: 2.75rem;
  display: flex;
  justify-content: center;
  align-items: center;
    font-weight: bold;
    color: var(--color-5);
}
.services a:hover .service-box{
    background-color: white;
    transition: 0.5s;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;

}

.service-logo-rotate {

}

.service-box:hover .service-logo-rotate {
    animation: rotate-loop 2s infinite ease-in-out ;
}


  .swiper .swiper-button-next::after, .swiper .swiper-button-prev::after{
    display: none;
  }
  .swiper .swiper-button-next, .swiper-button-prev{
    right: unset !important;
    left: unset !important;
    top: unset !important;
    margin-top: unset !important;
    width: auto !important;
    height: auto !important;
    background-color: #E5E5FF;
    color: black;
    border: 1px solid transparent;
    border-radius: 8px !important;
  }

  .swiper .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{
    background-color: white;
    color: var(--color-1);
    opacity: 1;
    border-color: #C8C8D0;
  }
  .pro-box .img-box{
    border-radius: 16px;
  }

.propery-p-hover {
    transition: 0.3s ease-in-out;
}

.pro-box:hover .propery-p-hover {
    color: #000000; !important;
}


  .about .btn-list li{
    width: fit-content;
  }
  .join{
      background-image: url('../img/yakhjal-re.webp');
    background-size: cover;
    background-position: center;

  }
  .join .img-box{
    background-image: url('../img/people-equipment-construction-renovation-concept_343059-3527.jpg');
    background-position: center;
    background-size: cover;
  }
  .numbers{
    /*background-image: url('../img/plumbing-professional-doing-his-job_23-2150721518-2.webp');*/
    /*  background-image: url('../img/home-appliance-repair_prev_ui.png');*/

    background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  }
  .numbers::after{
    content: '';
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    top: 0;
/*background: linear-gradient(219.2deg, rgba(0, 0, 128, 1) 3.87%, rgba(0, 0, 128, 0.6) 107.83%);*/
      background: rgb(0,0,0);
      background: linear-gradient(180deg, rgba(0,0,0,0.5047268907563025) 0%, rgba(0,0,0,1) 100%);
  }
  .numbers .num{
    font-family: sans;
  }
  .comments{
    background-color: #F7F6FE;
  }
  .comments .cm-box{
    border-radius: 16px;
  }
  .comment-rate .star-rating {
    background: url('../img/StarFill3.webp') repeat-x;
    height: 20px;
    width: 100px;
    overflow: hidden;
    padding:0;
}
.comment-rate .star-rating .star-rating-fill {
    background: url('../img/StarFill3.webp') repeat-x;
    background-position-x: 0%;
    background-position-y: 0%;
    background-position: 0 100%;
    float: left;
    height: 20px;
    display: block;

}
.FAQ{
  background-color: #FCFCFC;
}
.FAQ .accordion-button:not(.collapsed)::after{
    background-image: url('../img/remove_24dp_000000_FILL0_wght400_GRAD0_opsz24.svg');
  background-size: 100%;
  width: 30px;
  height: 30px;

}
.FAQ .accordion-button:not(.collapsed){
  background-color: #F7F6FF;
  color: black;
  box-shadow: none;
}
.FAQ .accordion-button:focus{
  box-shadow: none;
}
.FAQ .accordion-button::after{
    background-image: url('../img/add_24dp_000000_FILL0_wght400_GRAD0_opsz24.svg');
  background-size: 100%;
  width: 30px;
  height: 30px;
  margin-right: 10px;
}
.blog-box img{
  border-radius: 12px;
}
.blog-box .tag{
  background-color: #E5E7EA;
  border-radius: 4px;
  padding: 4px 5px;

}
.honor-box{
  /*background-color: #F9F9FA;*/
  border-radius: 12px;
}
.honor .swiper-slide{
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: end;
}

@media (max-width:576px){
    .services .custom-col{
        width: 33.3%;
    }
  }
  @media (min-width:576px) and (max-width:768px){
    .services .custom-col{
        width: 25%;
    }
  }
  @media (min-width:768px) and (max-width:992px){
    .services .custom-col{
        width: 16.6%;
    }
  }
  @media (min-width:992px) and (max-width:1200px){
    .services .custom-col{
        width: 16.667%;
    }
  }
  @media (min-width:1200px) and (max-width:1400px){
    .services .custom-col{
        width: 16.667%;
    }
  }
  @media (min-width:1400px){

  }
@media(max-width:992px){
  .numbers{
    background-attachment:unset;
  }

    .header{
        border-radius: 0;
        }
        .pro-box .img-box img{
          width: 60px;
          height: 60px;
        }
        .about .btn-list li{
          width: 100%;
        }
        .join .img-box{
          background-image:unset;
        }
}
