@charset "utf-8";

.container { }

.main__img { width: 100%; max-width: 100%; object-fit: contain; }

.main__title { font-family: Georgia, Droid-serif, serif; font-weight: 700; text-align: center; margin-top: 4rem; font-size: 3rem; margin-right: auto; margin-left: auto; }

.main__article { font-family: serif; font-size: 1.8rem; font-weight: 500; margin-top: 1rem; }

.main__by { display: flex; flex-direction: column; align-items: center; gap: 1rem; margin-top: 1.2rem; margin-bottom: 1rem; font-family: serif; font-weight: 500; }

.main__by div { color: rgb(134, 142, 150); }

.main__by div span { color: rgb(0, 0, 0); font-size: 1.1rem; }

.info { font-family: serif; }

.info .container p { font-size: 1.8rem; margin-bottom: 1rem; }

.info .container p i { }

.info__socials { display: flex; }

.info__article { font-size: 1.7rem; font-weight: 700; margin: 1rem 0px; }

.info__img { margin: 0px auto; display: block; width: 100%; }

.info__socials-block { padding: 0.3rem 0.8rem; color: rgb(255, 255, 255); }

.info__socials-block:nth-child(1) { background-color: rgb(24, 119, 242); border-radius: 5px 0px 0px 5px; }

.info__socials-block:nth-child(2) { background-color: rgb(85, 172, 238); }

.info__socials-block:nth-child(3) { background-color: rgb(134, 142, 150); border-radius: 0px 5px 5px 0px; }

.info__by { display: flex; flex-direction: column; font-family: serif; font-size: 1.2rem; line-height: 20px; }

.info__text { font-size: 1.8rem; margin-bottom: 1rem; margin-top: 0.5rem; }

.info__text span { }

.info__title { font-weight: 700; }

.info__important { font-size: 1.8rem; border-left: 5px solid rgb(24, 119, 242); padding-left: 10px; margin-bottom: 1rem; }

.info__list { list-style: disc; font-size: 1.8rem; font-weight: 700; display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1.8rem !important; }

.steps { font-family: serif; font-size: 1.8rem; }

.steps__text { margin: 1rem 0px; }

.steps__text span { color: rgb(0, 0, 0); font-weight: 700; font-family: serif; }

.steps__important { border-left: 5px solid rgb(33, 150, 183); padding-left: 10px; margin-top: 0.5rem; }

.steps__title { font-family: serif; margin-top: 3rem; font-weight: 700; }

.steps__res { color: rgb(24, 119, 242) !important; }

.benefits { margin-top: 3rem; }

.benefits__title { font-family: serif; margin-bottom: 1rem; font-weight: 700; }

.benefits__list { font-family: serif; display: flex; flex-direction: column; gap: 1rem; font-size: 1.8rem; list-style: decimal; }

.benefits__item span { display: block; font-weight: 700; color: rgb(24, 119, 242); font-family: serif; font-size: 1.5rem; }

.benefits__item::marker { color: rgb(24, 119, 242); font-family: serif; }

.reg { margin-top: 3rem; font-family: serif; }

.reg__item { font-size: 1.8rem; padding-left: 10px; }

.button-link { display: block; width: 100%; text-align: center; font-weight: bold; text-transform: uppercase; background-color: rgb(33, 150, 183); padding: 1rem; border-radius: 4px; transition: 0.3s; color: rgb(255, 255, 255) !important; }

.reg__list { display: flex; flex-direction: column; gap: 1rem; }

.reg__title { font-weight: 700; }

.reg__list-container { display: flex; align-items: flex-start; gap: 0.3rem; }

.reg__list-container img { flex-shrink: 0; }

.button-link:hover { color: rgb(255, 255, 255); transform: translateY(5px); }

.recommend { font-family: serif; }

.recommend__row { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1fr; gap: 1rem; }

.recommend__row a { color: rgb(68, 68, 68); }

.recommend__block { display: flex; flex-direction: column; }

.recommend__block span { font-size: 1.2rem; font-weight: 700; }

.recommend__img { max-width: 100%; }

@media (max-width: 1400px) {
  .container { }
}

@media (max-width: 1100px) {
  .container { }
  .header__nav { display: none; }
}

@media (max-width: 980px) {
  .news__row { flex-direction: column; justify-content: center; align-items: center; }
  .news__block span { display: block; }
}

@media (max-width: 768px) {
  .container { }
  .main__title { font-size: 3rem; }
  .main__socials { display: none; }
  .block-info input { width: 300px !important; }
  .recommend__row { grid-template-columns: 1fr; grid-template-rows: 1fr 1fr 1fr; }
}

@media (max-width: 500px) {
  .main__title { font-size: 2rem; }
  .main__article { font-size: 1.5rem; }
  .img-screen { width: 200px; }
}

.label { color: rgb(134, 142, 150); }