@media screen and (max-width:992px) {
  .main__block {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2,1fr)
  }
}
@media screen and (max-width:768px) {
  .main__block {
    -ms-grid-columns: (1fr)[1];
    grid-template-columns: repeat(1,1fr)
  }
  .main {
    padding-top: 20px;
    padding-bottom: 40px
  }
  .header {
    padding: 15px 0
  }
  h1 {
    font-size: 25px
  }
  .main__inner {
    margin-top: 30px
  }
  footer {
    padding: 15px 0
  }
  footer p {
    font-size: 12px
  }
  .header__logo {
    font-size: 20px
  }
}
@media screen and (max-width:576px) {
  h1 {
    font-size: 20px
  }
  .main__block {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2,1fr);
    grid-gap: 5px
  }
  .main__inner {
    display: block;
    margin-top: 15px
  }
  .header__button {
    width: 80px;
    height: 30px;
    font-size: 14px
  }
  .main__filter {
    max-width: 100%
  }
  .filter__inner {
    display: none;
    position: absolute;
    background: rgba(246,250,253,.95);
    width: 100%
  }
  .main__block .item {
    padding: 10px
  }
  .main__block .item__top {
    padding-bottom: 10px;
    margin-bottom: 10px
  }
  .main__block .item__top img {
    width: 40px;
    height: 40px
  }
  .main__block .item__name {
    font-size: 18px
  }
  .main__block .item__location {
    font-size: 14px
  }
  .main__block .item__bottom span {
    margin-left: 5px
  }
  .main__block .item__bottom a {
    font-size: 13px
  }
}
@media screen and (max-width:480px) {
  .main__block {
    -ms-grid-columns: (1fr)[1];
    grid-template-columns: repeat(1,1fr);
    grid-gap: 5px
  }
}