@charset "UTF-8";

/* --------------------------------------------------
TABLET AND MOBILE SCREENS
--------------------------------------------------*/
@media (max-width: 991px) {

  
  #service .service-box-item {
    margin: 0 auto;
  }

  #service .btn-common4 i {
    right: 40px;
  }
  #service div.service-box-item:hover i {
    right: 50px;
  }
  #service .service-get-a-free-consultation-now-btn {
    width: 380px;
    margin: 37px auto;
  }
  #service .service-get-a-free-consultation-now-btn {
    height: 0px;
    width: 330px;
    margin: 37px auto;
  }
  #service .btn-common2 {
    font-size: 1rem;
    padding: 0px 38px;
    line-height: 50px;
    height: 50px;
  }

  #service .service-box-item img {
    height: 42px;
    width: auto;
  }
  #service .service-box-item {
    width: 330px;
    height: 220px;
}
  #service .service-desc{
    width: 330px;
  }
  #service .btn-common4 {
    padding: 0px 54px;
    line-height: 24px;
  }
  #service .service-box-item h4 {
    font-size: 1.9rem;
  }
  #service .see-more-detail a {
    width: 264px;
  }
  

}

@media (max-width: 768px) {

  #service .container-1100{
    padding: 10px;
  }
  
  #service .service-box-item {
    width: 450px;
    height: 300px;
    margin: 10px;
  }
  #service .service-desc {
    width: 100%;
    text-align: center;
    padding: 0 15px 15px 15px;
    margin: 0;
}
  #service .outsourcing-bg{
    background-size: cover;
  }
  #service .outsourcing-bg:hover{
    background-size: cover;
  }

  #service .products-bg{
    background-size: cover;
  }
  #service .products-bg:hover{
    background-size: cover;
  }

  #service .row {
    justify-content: center;
  }
  #service .service-box-item img {
    height: 77px;
  }
  #service .service-box-item h4 {
    font-size: 3rem;
}
#service .see-more-detail a {
  font-size: 1.2rem;
  width: 275px;
  line-height: 70px;
}

}

@media (max-width: 576px) {
  

  



}
/*===============================================================
500px
===============================================================*/
@media (max-width: 500px) {
 
}
/*===============================================================
450px
===============================================================*/
@media (max-width: 450px){
  #service .service-box-item {
    width: 350px;
    height: 233px;
  }
  #service .service-desc{
    width: 350px;
  }
  #service .service-box-item img {
    height: 55px;
  }
  #service .service-box-item h4 {
    font-size: 2.5rem;
  }
  #service .see-more-detail a {
    font-size: 1rem;
    width: 243px;
    line-height: 22px;
}
}
/*===============================================================
376px
===============================================================*/
@media (max-width: 376px){
  
}
