
/* About Start */
.about {
  position: relative;
  margin-bottom: 20px;
  /* min-height: calc(100vh - 80px); */

}

.about .about-bubles-right {
  position: absolute;
  top: -60px;
}

.about .about-container {
  align-items: center;
  justify-content: space-between;

}

.about .about-container .text-title{
margin-top: 40px;
margin-bottom: 60px;
  text-align: center;
}

.about .about-container .text-title h1{
  font-weight: 700;
  font-size: 50px;
  line-height: 1.1;
}

.about .about-container .text-title h2{
  font-weight: 700;
  font-size: var(--fs-h3 );
    line-height: 1.1;   
    margin-top: 20px;
}

/* .about .about-container .text-title P{
  font-size: 18px !important;
} */

.about .about-container .text-title .about-head-title{
  color: var(--title-color);
}
.about .about-container .about-content{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 80px;
}



.about-content .about-right h2{
  border-bottom: solid 2px var(--light-blue);
  margin-bottom: 15px;
  width: 85px;

  
}

.about-content .about-right h4{
  font-size: 18px;
  line-height: 1.8;
}

.about-content .about-right p{
  margin-bottom: 10px;

}

.about-content .about-footer{
  border-top: 1px solid rgb(219, 219, 219);
  display: flex;
  padding-top: 20px;
  align-items: center;
  margin-top: 20px;
}

.about-content .about-footer button{
  border: none;
  background-color: var(--light-blue);
  color: white;
  border-radius: 4px;
  padding: 10px 20px 10px 20px;
  margin-left: 20px;
}

.about-content .about-footer a img{
  color: var(--title-color);
  height: 35px;
  margin-left: 10px;
  background-color: #ffffff;
  border-radius: 50%;
  padding: 4px;
    transition: 0.2s;

}

.about-content .about-footer a img:hover{
  background-color: rgb(227, 235, 255);
}


@media (min-width:900px) and (max-width:1200px){
  .about .about-container .about-content{
    display: grid;
    grid-template-columns: 1fr 1fr;
    /* text-align: center; */
    align-items: center;
    justify-content: center;
    gap: 10px;
    z-index: 1;
    position: relative;
  }

    .about .about-container .about-content .about-right h2{
      text-align: center;
      /* margin-right: 50%; */
      align-items: center;
      justify-content: center;
    
    }

    .about .about-container .about-content .about-left img{
      width: 100%;
    }

    .about .about-bubles-right img{
      z-index: -1;
      width: 150px;
    }
}

@media (max-width:382px){
  .about .about-container .text-title h1 {
      font-size: 40px;

    }
}

@media (max-width:900px){
    .about .about-container .about-content{
    display: grid;
    grid-template-columns: repeat(1,1fr);
    text-align: center;
    align-items: center;
    justify-content: center;
    gap: 10px;
    z-index: 1;
    position: relative;
  }

    .about .about-container .about-content .about-right h2{
      text-align: center;
        left: 48%;
        position: absolute;
  transform: translate(-50%, -50%);
      align-items: center;
      justify-content: center;
      /* margin-bottom: 20px; */
      
    
    }

        .about .about-container .about-content .about-right p{
          margin-top: 40px;
        }

      .about .about-container .about-content .about-left img{
      width: 100%;
    }

      .about .about-bubles-right img{
      z-index: -1;
      width: 120px;
      margin-top: 120px;
      margin-right: -20px;
    }

    .about-content .about-footer{
      text-align: center;
      align-items: center;
      justify-content: center;
      /* width: 100%;     */
      
    }

    .about-content .about-footer button{
      padding: 6px 10px;
    }

}

@media (max-width:453px){
    .about-footer button{
      display: none;
    }

      .about-footer a img{
        margin-left: 4px !important;

      }
}

/* About End */
