@font-face {
    font-family: Anton-reg;
    src: url(../Anton-Regular.ttf);
  }

  

/* --- other hero --- */
.other-hero1 {
    background-color: rgba(0, 0, 0, 0.7);
    position: relative;
    min-height: 40vh;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .other-hero1::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0%;
    background-image: url(../images-new/com-ban.jpg);
    background-size: cover;
    background-position: bottom;
    background-attachment: fixed;
    z-index: -1;
  
  }

  /* ----- abt ------- */

  .abt-right{
    position: relative;
  }

  .com-rig{
    height: 400px;
    width: 100%;
    z-index: 2;
  }

  .com-rig img {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
  }


  
.why-us-con1{
    /* background-color: var(--c1); */
    position: absolute;
    bottom: 11%;
    left:10%;
    z-index: 2;
  }
  
  .clients-images {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    position: relative;
    
  }
  
  .clients-images img {
    object-fit: cover !important;
  
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin: 0 -10px;
    padding: 0;
  }

  .tri-ab2 {
    width: 100px;
    position: absolute;
    bottom: 40%;
    right: 0%;
    animation: animName 10s linear infinite;
  }
  
  @keyframes animName {
    0% {
      transform: rotate(0deg);
    }
  
    100% {
      transform: rotate(360deg);
    }
  }
  

 /* ------ service ------------  */

 .serv-card{
    width: 100%;
    background-color: #FFF;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-image: url(../images/20593-right.png);
    background-repeat: repeat;
    background-size: cover;
    border-radius: 0 30px;
    transition: all 0.5s;
    min-height: 385px;
  }

  .serv-card:hover{
    background-color: #333;
    /* color: #FFF !important; */
    transition: all .5s;
    background-image: unset;
  }
  .serv-card:hover .ser-head{
    color: #FFF !important;
    transition: all .5s;
  }
  .serv-card:hover .service-img{
    border: 2px solid var(--c1);
    overflow: hidden;
    transition: all .5s;
    transform: scale(1.1);
  }

  .serv-card1{
    width: 100%;
    background-color: #FFF;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-image: url(../images/20593-right.png);
    background-repeat: repeat;
    background-size: cover;
    border-radius: 30px 0;
    transition: all 0.5s;
    min-height: 385px;
  }

  .serv-card1:hover{
    background-color: #333;
    /* color: #FFF !important; */
    transition: all .5s;
    background-image: unset;
  }
  .serv-card1:hover .ser-head{
    color: #FFF !important;
    transition: all .5s;
  }
  .serv-card1:hover .service-img{
    border: 2px solid var(--c1);
    overflow: hidden;
    transition: all .5s;
    transform: scale(1.1);
  }

  .des-tx {
    background-image: url(../images-new/2149930941.jpg);
    display: inline-block;
    background-repeat: no-repeat;
    background-clip: text;
    background-position: 50%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: Anton-reg;
    font-weight: 900;
  }
  


  .fs-big1 {
    font-size: 70px;
    font-weight: 900;
  }

 /* ------------- time line -----------  */


  ul.timeline-list {
      position: relative;
      margin: 0;
      padding: 0
  }
  ul.timeline-list:before {
      position: absolute;
      content: "";
      width: 2px;
      height: 100%;
      background-color: var(--c1);
      left: 50%;
      top: 0;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
  }
  ul.timeline-list li {
      position: relative;
      clear: both;
      display: table;
  }
  .timeline_content {
      border: 2px solid var(--c1);
      background-color:#fff
  }
  ul.timeline-list li .timeline_content {
      width: 45%;
      color: #333;
      padding: 30px;
      float: left;
      text-align: right;
  }
  ul.timeline-list li:nth-child(2n) .timeline_content {
      float: right;
      text-align: left;
  }
  .timeline_content h4 {
      font-size: 22px;
      font-weight: 600;
      margin: 10px 0;
  }
  ul.timeline-list li:before {
      position: absolute;
      content: "";
      width: 25px;
      height: 25px;
      background-color: var(--c1);
      left: 50%;
      top: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      border-radius: 50%;
  }
  .timeline_content span {
      font-size: 18px;
      font-weight: 500;
      font-family: poppins;
      color: var(--c1);
  }


  
/* --------- counter --------------  */

/* ------------------- counter --------------*/
.count-div{
  position: relative;
  background-color: white;
}
.count-div::after{
  content: '';
  /* background-image: url(../images/agency-1.jpg); */
  background-attachment: fixed;
  background-position: right;
  background-size: cover;
  position: absolute;
  inset: 0%;
  height: 100%;
  width: 100%;
  z-index: -1;
}
.count-head{
  font-size: 50px;
  color: black !important;
  font-weight: bold;
}
.count-bx{
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color:  white;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  min-height: 180px;
  font-family: Poppins-Regular;
}
.cnt-nm{
   color: var(--c1) !important;
    display: inline-block;


    font-size: 38px;
    line-height: 1em;
    text-align: center;
    font-weight: 800;
    text-transform: uppercase;
}

.about-main1{
  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
}





  /* --------------------------------------make it responsive------------------------ */
  @media screen and (max-width:1400px) {


  }
@media screen and (max-width:1025px) {
         
}
@media screen and (max-width:1200px) {

}
@media screen and (min-width:960px) and (max-width:1030px) {

}

@media (min-width:920px) and (max-width:1200px) {
 
}

  @media screen and (max-width:920px) {
    .sm-js{
      text-align: justify !important;
    }


  }

  @media screen and (max-width:720px) {

  }



  @media screen and (max-width:660px) {
   
.sm-js{
  text-align: justify !important;
}

ul.timeline-list li .timeline_content {
    width: 45%;
    color: #333;
    padding: 30px;
    float: left;
    text-align: left !important;
}
ul.timeline-list li:nth-child(2n) .timeline_content {
    float: right;
    text-align: left;
}

ul.timeline-list:before {
    position: absolute;
    content: "";
    width: 2px;
    height: 100%;

    left: 0%;
    top: 0;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
}

ul.timeline-list li:before {
    position: absolute;
    content: "";
    width: 25px;
    height: 25px;
    
    left: 0%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    border-radius: 50%;
}
ul.timeline-list li .timeline_content {
    width: 100%;
    color: #333;
    padding: 30px;
    float: left;
    text-align: right;
}

  }
@media screen and (max-width:500px) {

}
@media screen and (max-width:400px) {

}
  @media screen and (max-width:380px) {

  }

  @media screen and (max-width:320px) {


  }

  @media screen and (min-width:321px) and (max-width:425px) {

  
}