@charset "utf-8";

@import url(fonts.css);

:root { --white: #ffffff; --main-color: #026b9c; --bg-color: #383f4e; --link-color: #007fff; --title-color: #2a303b; --text-color: #383f4e; --text-color-add: #717b8e; --label-color: #717b8e; --label-color-add: #a2a9ae; --box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.25); --text-size: 1.7rem; --title-size: 2.6rem; --title-size-article: 2.2rem; --common-padding: 0 64px; --common-font-family: 'The Antiqua B'; }

* { box-sizing: border-box; margin: 0px; padding: 0px; }

html { scroll-behavior: smooth; height: 100%; color: var(--bg-color); }

body { height: 100%; font-size: 16px; font-family: var(--common-font-family); }

h1 { font-size: var(--title-size); font-weight: 500; line-height: 2rem; padding: 0px; margin: 0px; font-family: var(--common-font-family); }

h2, h3 { color: var(--title-color); padding: 0px; margin: 0px; font-family: var(--common-font-family); }

p { font-size: var(--text-size); font-family: var(--common-font-family); }

a { color: var(--link-color); }

img { height: auto; }

figcaption { display: inline-block; padding: 0px; margin: 0px; width: 100%; background-color: transparent; }

article { font-size: var(--text-size); line-height: 24px; }

.un-header__topics { align-items: center; color: var(--label-color); display: flex; font-size: 1.6rem; font-weight: 500; list-style: none; margin-bottom: 1.6rem; text-transform: uppercase; white-space: nowrap; font-family: MarrSansCondensed, sans-serif; }

.un-header__topic { align-items: center; display: flex; line-height: 1.6rem; }

.un-header__topic:first-child::after { align-self: center; color: rgb(189, 193, 200); content: "•"; padding: 0px 0.8rem; }

@media (min-width: 1024px) {
  .un-header__heading { max-width: 85%; }
}

.un-header__title { color: var(--title-color); font-size: var(--title-size); font-weight: 600; line-height: 1.25; font-family: inherit; }

@media (min-width: 576px) {
  .un-header__title { font-size: 2.8rem; line-height: 1.14; font-weight: 600; }
}

@media (min-width: 768px) {
  .un-header__title { font-size: 3.4rem; font-weight: 500; line-height: 1.11; }
}

@media (min-width: 1024px) {
  .un-header__title { font-size: 3.8rem; font-weight: 500; }
}

.un-header__excerpt { color: var(--title-color); font-size: 1.8rem; line-height: 1.34; font-weight: 500; letter-spacing: 0.03rem; margin-bottom: 0px; margin-top: 0.8rem; font-family: MarrSansCondensed; }

@media (min-width: 576px) {
  .un-header__excerpt { font-size: 1.8rem; line-height: 1.41; }
}

@media (min-width: 768px) {
  .un-header__excerpt { font-size: 2rem; line-height: 1.33; }
}

@media (min-width: 1024px) {
  .un-header__excerpt { font-size: 2.2rem; line-height: 1.44; }
}

.un-header__author { color: var(--label-color); font-size: 1.4rem; letter-spacing: 0.02rem; line-height: 1.42; margin-top: 1.6rem; }

@media (min-width: 576px) {
  .un-header__author { letter-spacing: 0.019rem; }
}

@media (min-width: 768px) {
  .un-header__author { letter-spacing: 0.02rem; }
}

@media (min-width: 1024px) {
  .un-header__author { max-width: 85%; }
}

.un-header__info { display: flex; align-items: center; flex-flow: wrap; }

.un-header__date { color: var(--label-color); font-size: 1.4rem; letter-spacing: 0.314px; font-family: MarrSans; }

.un-header__reading-time { color: var(--label-color); display: inline-flex; float: none; margin-top: 0px; font-size: 1.4rem; letter-spacing: 0.314px; line-height: 1.42; align-items: center; }

.un-header__reading-time::before { color: rgb(213, 216, 220); content: "•"; display: inline-block; line-height: 1; padding-right: 0.4rem; }

.un-header__icon-time { letter-spacing: 0.314px; height: 2.4rem; margin-right: 0.8rem; width: 1.2rem; background-position: 50% center; background-repeat: no-repeat; background-size: contain; display: inline-block; flex-shrink: 0; }

.un-header__info-time { font-family: MarrSans; font-size: 1.4rem; }

.un-header__actions { clear: both; gap: 1.2rem; justify-content: flex-start; margin-top: 1.2rem; padding-top: 1.2rem; position: relative; height: 3.2rem; align-items: center; z-index: 4; display: flex; list-style: none; }

.un-header__favorites { letter-spacing: 0.314px; font-size: 1.4rem; position: relative; color: var(--title-color); }

.un-header__favorites-wrapper { background-color: rgb(255, 255, 255); border: 0.1rem solid rgb(213, 216, 220); gap: 0.8rem; padding: 0px 1rem; width: auto; cursor: pointer; align-items: center; border-radius: 25rem; display: flex; height: 3.2rem; justify-content: center; font-size: 1.4rem; }

.un-header__favorites-icon { height: 1.56rem; width: 1.1rem; background-position: 50% center; background-repeat: no-repeat; background-size: contain; display: inline-block; }

.un-header__favorites-description { letter-spacing: 0.314px; font-size: 1.4rem; }

.un-header__share-button, .un-header__sshare-button { background-size: auto; display: flex; height: 3.2rem; width: 3.2rem; align-items: center; background-color: transparent; border-radius: 25rem; justify-content: center; }

.un-header__share-icon { background-size: auto; display: flex; align-items: center; justify-content: center; padding: 1px 4px; }

.un-header__image { }

.un-header__image img { width: 100%; height: auto; }

#un-content { column-gap: 6.4rem; display: grid; grid-template-columns: 1fr 31.6rem; grid-template-rows: auto auto auto; padding-bottom: 4rem; padding-top: 3.2rem; background-color: var(--white); }

@media (max-width: 576px) {
  #un-content { margin: 0px 1.6rem; grid-template-columns: 1fr; column-gap: 0px; }
}

@media (min-width: 576px) {
  #un-content { margin: 0px 3.2rem; }
}

@media (min-width: 576px) and (max-width: 768px) {
  #un-content { grid-template-columns: 1fr; column-gap: 0px; }
}

@media (min-width: 768px) {
  #un-content { margin: 0px auto; max-width: 66.4rem; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  #un-content { grid-template-columns: 1fr; column-gap: 0px; }
}

@media (min-width: 1024px) {
  #un-content { margin: 0px auto; max-width: 100rem; padding: 3.2rem; }
}

#un-header { padding-bottom: 2rem; position: relative; }

@media (min-width: 1024px) {
  #un-header { grid-area: 1 / 1 / auto / span 2; padding-bottom: 2.4rem; }
}

#un-header::after { background-color: rgb(213, 216, 220); bottom: 0px; content: " "; display: block; height: 0.1rem; position: absolute; width: 4rem; }

.check { box-shadow: var(--box-shadow); max-width: 100%; font-family: "Open Sans"; font-size: 1.4rem; }

@media (max-width: 500px) {
  .check { font-size: 1.3rem; }
}

.check__wrapper { padding: 0.5rem; }

.check__iban { margin-bottom: 1rem; display: block; font-weight: 500; }

.check__top-grid { display: flex; justify-content: space-between; align-items: flex-start; }

.check__top-col-1 { display: flex; flex-direction: column; justify-content: space-between; gap: 4rem; }

.check__top-col-1-row { display: flex; flex-direction: column; }

.check__top-col-title { color: var(--main-color); margin-bottom: 8px; margin-top: 8px; }

.check__top-col-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

.check__bot { border-bottom: 3px solid rgb(0, 0, 0); }

.check__bot-grid { display: grid; grid-template-columns: 1fr 5fr 1fr 1fr 1fr; }

.check__bot-grid-col { display: flex; flex-direction: column; border-right: 1px solid rgb(0, 0, 0); }

.check__bot-grid-col-title { font-weight: 500; background-color: rgba(128, 128, 128, 0.39); border-right: 1px solid rgb(0, 0, 0); border-bottom: 3px solid rgb(0, 0, 0); padding-left: 2px; }

.check__thanks { text-align: right; display: block; margin: 0.5rem 2rem; }

.un-article { }

.un-article__image { margin: 2.4rem auto 0px; }

.un-article__image img { width: 100%; }

.un-article-image__caption { color: var(--label-color); font-size: 1.4rem; line-height: 1.42; font-family: MarrSans; }

.un-article__paragraph, .un-article__callout, .un-steps__paragraph { margin: 2rem 0px; }

.un-article__headline3 { color: var(--title-color); font-size: 2.2rem; font-weight: 600; line-height: 1.18; margin-top: 2.4rem; }

@media (min-width: 1024px) {
  .un-article__headline3 { line-height: 1.2; }
}

.un-article__callout { border-left: solid 3px var(--main-color); padding-left: 8px; font-style: italic; }

.un-article__blockquote { position: relative; font-size: 16px; margin: 16px 16px 4rem; border: 2px solid var(--main-color); border-radius: 20px; padding: 25px; }

.un-article__blockquote::after { content: ""; position: absolute; border-top-color: ; border-top-style: ; border-top-width: ; border-right-color: ; border-right-style: ; border-right-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-radius: 0px 50px 0px 0px; width: 40px; height: 40px; bottom: -40px; left: 50px; border-bottom: none; border-left: none; z-index: 2; box-sizing: border-box; }

.un-article__blockquote::before { content: ""; position: absolute; width: 80px; border: 6px solid rgb(255, 255, 255); bottom: -3px; left: 50px; z-index: 1; }

.un-article__blockquote cite { position: absolute; bottom: -30px; left: 110px; font-size: 13px; font-weight: bold; color: var(--main-color); }

.un-steps { font-family: var(--common-font-family); }

.un-steps__title { text-align: center; border: 1px solid var(--main-color); text-transform: uppercase; padding: 5px; font-weight: 700; font-family: var(--common-font-family); color: var(--text-color); margin: 1rem 0px; }

.un-steps__text { border-left: 4px solid var(--main-color); padding: 0.385rem; }

.un-steps__important { font-style: italic; border-left: 8px solid var(--main-color); padding-left: 1rem; }

.un-steps__img-chel { margin: 0px auto; display: block; }

.un-steps__image { width: 100%; margin: 2.4rem auto 0px; }

.un-steps-image__img { box-shadow: var(--box-shadow); }

.un-steps__image img { width: 100%; }

.un-steps-image__description { color: var(--label-color); font-size: 1.4rem; line-height: 1.42; font-family: MarrSans; }

.un-instruction ol { counter-reset: myCounter 0; }

.un-instruction li { list-style: none; line-height: 1.7rem; margin: 0px 0px 8px; font-size: var(--text-size); }

.un-instruction li::before { counter-increment: myCounter 1; content: counter(myCounter); display: block; border: 3px var(--main-color) solid; width: min-content; padding: 4px 8px; border-radius: 52%; color: var(--main-color); font-weight: 700; margin: auto 1rem auto 0px; font-family: "D-DIN Condensed"; font-size: 2rem; }

.un-instruction li:first-child::before { padding: 4px 9px; }

.un-instruction span { margin: auto 0px; }

.un-instruction { font-family: var(--common-font-family); }

.un-instruction__title { font-size: 2.2rem; font-family: var(--common-font-family); text-align: center; color: var(--text-color); margin: 0px 0px 2rem; }

.un-instruction__list { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; }

.un-instruction p { text-align: center; display: block; max-width: 60%; margin: 0px auto; box-shadow: var(--box-shadow); padding: 1rem; line-height: 24px; }

.un-instruction__item { font-weight: normal; background-color: rgb(245, 246, 248); padding: 8px; border-left: 2px solid var(--main-color); border-right: 2px solid var(--main-color); border-radius: 6px; width: 100%; display: flex; border-bottom: 1px solid rgb(213, 216, 220); }

.un-instruction__button { background-color: rgb(0, 127, 255); display: block; text-align: center; color: var(--white); padding: 15px; margin: 0px auto; width: 80%; border-radius: 6px; animation: 4s linear 0s infinite normal none running blink; font-family: var(--common-font-family); }

.un-instruction__button:hover { color: var(--white); background-color: var(--text-color); }

@keyframes blink { 
  0%, 50% { box-shadow: rgb(0, 0, 0) 0px 0px 10px; }
  25%, 75% { box-shadow: none; }
  100% { box-shadow: rgb(0, 0, 0) 0px 0px 10px; }
  0% { opacity: 0.8; }
  50% { opacity: 1; }
  100% { opacity: 0.8; }
}

.un-comment { margin-top: 2rem; margin-bottom: 4rem; }

.un-comment__like-row { display: flex; justify-content: space-around; align-items: center; padding: 1rem; }

.un-comment__like-row i { font-size: 1.2rem; color: rgb(126, 126, 126); }

.un-comment__like-row-block { display: flex; align-items: center; gap: 0.4rem; }

.un-comment__actual { text-align: right; margin-right: 1rem; margin-top: 1rem; color: rgb(126, 126, 126); }

.un-comment__content { display: flex; flex-direction: column; }

.un-comment__block { margin: 0.5rem 1rem; display: flex; justify-content: flex-start; border-bottom: 1px solid rgba(0, 0, 0, 0.204); padding-bottom: 0.5rem; }

.un-comment__block-avatar { margin-right: 1rem; }

.un-comment__block-avatar img { border-radius: 50%; min-width: 50px; }

.un-comment__block-info-comment span { background-color: rgb(245, 246, 248); display: block; padding: 1rem; border-radius: 10px; }

.un-comment__block-info-comment-name { font-weight: 700; color: var(--title-color); }

.un-comment__block-info-line { display: flex; flex-direction: column; font-size: 0.9rem; }

.un-comment__block-answer { display: flex; margin-top: 1.5rem; }

.un-comment__date { color: rgba(0, 0, 0, 0.44); }

.un-comment__like-top { border-top: 1px solid rgb(126, 126, 126); border-bottom: 1px solid rgb(126, 126, 126); max-width: 96%; width: 100%; margin: 0px auto; }

.un-comment__like { display: flex; justify-content: flex-start; color: var(--main-color); font-size: 1.3rem; margin: 0.5rem 0px 0.3rem; }

.un-comment__like-item { list-style: none; margin-right: 1rem; }

.un-comment__more { display: block; margin: 0px auto; color: var(--main-color); text-align: center; }

.hidden { overflow: hidden; height: 0px; position: relative; z-index: 0; opacity: 0; transition: 0.3s; }

@media (max-width: 992px) {
  #subheader-category { display: none; }
  .un-comment__like-item, .un-comment__date { margin-right: 0.6rem; }
}

#un-additional { display: block; }

@media (min-width: 1024px) {
  #un-additional { grid-area: 2 / 2 / 3; margin-bottom: 4rem; padding-top: 2.4rem; }
}

.un-additional__wrapper { background-color: rgb(245, 246, 248); border-top: 4px solid rgb(42, 48, 59); padding: 0px 20px 20px; }

.un-additional__title { font-family: MarrSansCondensed; font-size: 28px; line-height: 1.4; font-weight: 700; margin: 28px 0px 0px; color: rgb(42, 48, 59); }

.un-additional__list { margin: 0px; padding: 0px; background-color: rgb(246, 247, 249); list-style: none; }

.un-additional__item { display: flex; padding: 24px 0px; text-decoration: none; color: rgb(42, 48, 59); font-family: "The Antiqua B"; cursor: pointer; }

.un-additional__item:not(:last-child) { border-bottom: 1px solid rgb(213, 216, 220); }

.un-additional__item-number { margin-top: -3px; font-weight: 600; line-height: normal; color: rgb(42, 48, 59); font-size: 32px; }

.un-additional__item-info { color: rgb(42, 48, 59); font-size: 18px; line-height: 1.3; letter-spacing: -0.02px; font-weight: 400; padding-left: 16px; }

.un-additional__item:hover { text-decoration: underline; }

.footer-logo { max-width: 150px; width: 100%; height: auto; }

#Header { pointer-events: none; }

.Header__nav-container { pointer-events: none; }

.un-header__actions { pointer-events: none; }

#un-additional { pointer-events: none; }

.footer__bottom { border-top: none; padding-top: 0px; justify-content: center; gap: 20px; }

@media (max-width: 1023px) {
  .footer__bottom { display: flex; flex-direction: column; justify-content: center; align-items: center; }
  #un-additional { display: none; }
}

@media (max-width: 480px) {
  .footer { padding: 2rem 1.6rem; }
}