
.category-icon-good
{
  border: 2px solid #ff5959; 
}

/* -------------------------end slider---------------------------------- */

/* mobile */
@media only screen and (max-width: 600px) 
{
  .category-item
  {    
    padding: 2px;
    padding-top: 10px;
  }

  .category-icon
  {
    font-size: 3em;
    border-radius: 15px; 
    padding: 15px;
    padding-top: 20px;
    min-width: 86px;
    min-height: 85px;
    border: 2px solid gray;    
  }
  .category-img
  {
    border-radius: 15px; 
    padding: 15px;
    max-width: 85px;
  }

  .category-icon-service
  { 
    border: 2px solid #37d0ef; 
  }

  .category-icon-system
  {
    border: 2px solid #ffb63b; 
  }

  .service-icon
  {
    font-size: 1.4em;
    float: left;
    /* line-height: 1.5 !important; */
    padding: 8px;
  }

  .category-name
  {
    min-height: 40px;
    text-align: center;
    padding: 0px;
    display: flex;
    justify-content: center;
    /* align-items: center; */
    /* font-size: 1.1em; */
    margin-bottom: 0px;
    margin-top: 5px;
  }
} 

/* normal desktop */
@media (min-width: 601px ) 
{
  .category-item
  {    
    padding: 2px;
    padding-top: 10px;
  }

  .category-icon
  {
    font-size: 4em;
    border-radius: 15px; 
    border: 2px solid gray; 
    padding: 20px;
    min-width: 112px;
    width: 112px;
    height: 112px
  }

  .category-img
  {
    border-radius: 15px; 
    padding: 20px;
    max-width: 112px;
    height: 112px;
  }

  .category-icon-service
  {
    border: 2px solid #37d0ef; 
  }

  .category-icon-system
  {
    border: 2px solid #ffb63b; 
  }

  .service-icon
  {
    font-size: 2em;
    float: left;
    padding: 8px;
  }
  .category-name
  {
    min-height: 44px;
    text-align: center;
    padding: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* font-size: 1.1em; */
    margin-bottom: 0px;
    margin-top: 0px;
  }
}

/* Full HD desktop */
@media only screen and (min-width: 1900px) 
{
  .category-item
  {  
    text-align: center;
  }
  
  .category-icon
  {
    font-size: 4em;
    border-radius: 25px; 
    padding-top: 26px;
    padding-bottom: 20px;
  }

  .category-img
  {
    border-radius: 25px; 
    /* height: auto; */
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .category-icon-service
  {
    border: 2px solid #37d0ef; 
  }

  .category-icon-system
  {
    border: 2px solid #ffb63b; 
  }

  .service-icon
  {
    font-size: 2em;
    float: left;
    padding: 7px;
  }
  
  .category-name
  {
    min-height: 45px;
    text-align: center;
    padding: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 40px;
    margin-top: 0px;
  }
} 
