@media only screen and (min-width: 200px) {
  .webpage_banner {
    width: 100%;
    height: 275px;
    position: relative;
  }
  .webpage_banner img {
    filter: brightness(0.4);
    object-fit: cover;
    width: 100%;
    height: 100%;
  }
  .webpage_descr {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    height: 120px;
  }
  .webpage_descr h1 {
    font-size: 30px;
    color: #02cd6b;
    height: 42px;
    overflow: hidden;
  }
  .webpage_descr p {
    font-size: 18px;
  }
  .webpage_descr p,
  .webpage_descr span {
    color: #ace5c9;
  }
  .webpage_descr a {
    color: #16619e;
  }
  .webpage_descr span {
    margin: 0 5px;
  }
}
@media only screen and (min-width: 360px) {
  .webpage_banner {
    height: 345px;
  }
  .webpage_descr {
    height: 135px;
  }
  .webpage_descr h1 {
    font-size: 32px;
  }
  .webpage_descr p {
    font-size: 20px;
  }
}
@media only screen and (min-width: 400px) {
  .webpage_banner {
    height: 365px;
  }
}
@media only screen and (min-width: 600px) {
  .webpage_banner {
    height: 445px;
  }
  .webpage_descr {
    height: 165px;
  }
}
@media only screen and (min-width: 768px) {
  .webpage_descr h1 {
    font-size: 35px;
  }
  .webpage_descr p {
    font-size: 23px;
  }
}
@media only screen and (min-width: 1024px) {
  @media only screen and (height: 600px) {
    .webpage_banner {
      height: 310px;
    }
    .webpage_descr {
      height: 121px;
    }
    .webpage_descr h1 {
      font-size: 30px;
    }
    .webpage_descr p {
      font-size: 20px;
    }
  }
}
@media only screen and (min-width: 1280px) {
  .webpage_banner {
    height: 330px;
  }
  .webpage_descr {
    height: 135px;
  }
}
