/*=================================================================================
                             1024
  ================================================================================*/
@media (max-width: 1024px) {
  .col-4::after {
    background-position: top center;
  }

  .col-2 {
    width: 150px;
  }
}

/*=================================================================================
                                 991
      ================================================================================*/

@media (max-width: 991px) {
}

/*=================================================================================
                                 767
      ================================================================================*/

@media (max-width: 767px) {
  .col-2 {
    width: calc(50% - 20px);
  }
  .changeRow {
    flex-direction: column;
  }
  .col-8,
  .col-4 {
    width: 100%;
  }
  .marginTop {
    margin-top: 10px;
  }
  .windStaus,
  .Humidity,
  .airPressure,
  .visibility {
    margin: 30px auto;
    font-size: 38px;
    font-weight: bold;
  }
}
@media (max-width: 530px) {
  .col-6 {
    width: calc(100% - 20px);
  }
}

/*=================================================================================
                                 330
      ================================================================================*/
@media (max-width: 350px) {
  .col-2 {
    width: calc(100% - 20px);
  }
}