.skill {
  border: var(--light-bg-color) 1px solid;
  border-radius: 15px;
  padding: 1rem 1.5rem 1.5rem;
  text-align: center;
 
}

.skill__icon {
   /* fill: var(--main-color);  */
  background-color: rgb(249, 206, 236);
  height: 60px;
  margin-bottom: 2rem;
  width: 60px;
  text-align: center;
  padding: 8%; 
 /* font-size: 1rem;    */
  
}


@media screen and (min-width: 0) {
  .skill {
    width: calc(50% - 1rem);
  }
}

@media screen and (min-width: 768px) {
  .skill {
    width: calc(33.33% - 1rem);
  }
}

@media screen and (min-width: 1024px) {
  .skill {
    width: calc(13.66% - 1rem);
  }
}