@charset "utf-8";

body, body * { margin: 0px; padding: 0px; box-sizing: border-box; -webkit-font-smoothing: antialiased; }

body { font-family: source-sans-pro, sans-serif; }

a { text-decoration: none; color: inherit; }

ul, ol { list-style: none; }

header { color: rgb(22, 56, 96); border-bottom: 4px solid rgb(22, 56, 96); }

.headerInner { max-width: 1280px; margin: 0px auto; padding: 0px 12px; }

.headerTop { display: grid; align-items: center; grid-template-columns: 20% 1fr 20%; height: 40px; font-size: 12px; }

.headerTop a { display: flex; align-items: center; font-weight: 600; gap: 4px; }

.headerTopCenter { display: flex; align-items: center; justify-self: center; gap: 16px; }

.headerTopRight { display: flex; align-items: center; gap: 16px; justify-self: flex-end; }

.headerMid { display: flex; justify-content: center; }

.headerLogo { display: flex; align-items: center; height: 101px; gap: 6px; }

.headerLogo img { height: 51px; }

.headerBot { display: flex; font-weight: 700; font-size: 14px; justify-content: center; align-items: center; height: 28px; padding-bottom: 8px; gap: 32px; }

.headerBot { display: flex; align-items: center; white-space: nowrap; overflow-x: scroll; scrollbar-width: none; }

.headerBot a { display: flex; align-items: center; gap: 4px; }

.headerBot img { width: 12px; rotate: 90deg; }

main { padding: 32px; width: 1000px; margin: 0px auto; }

article { width: 616px; color: rgb(22, 56, 96); }

.breadcrumbs { display: flex; align-items: center; gap: 4px; margin-bottom: 24px; }

.breadcrumbs a { color: rgb(114, 114, 114); font-size: 14px; display: flex; }

.breadcrumbs img { width: 12px; }

h1 { font-family: noto-serif, sans-serif; font-size: 20px; line-height: 1.35; margin-bottom: 16px; }

.authorInfo { flex-direction: column; display: flex; font-size: 16px; color: rgb(114, 114, 114); gap: 6px; margin-bottom: 16px; }

.articleMeta { display: flex; gap: 20px; align-items: center; margin-bottom: 24px; }

.copyArticle { padding: 8px 12px; background: rgb(242, 242, 242); font-size: 14px; font-weight: 600; display: flex; align-items: center; border-radius: 80px; }

.textContent { border-bottom: 1px solid rgb(236, 236, 236); padding-bottom: 24px; }

.textContent img, .textContent video { width: 100%; margin-bottom: 16px; }

article p { font-size: 18px; margin-bottom: 16px; line-height: 1.5; font-family: noto-serif, sans-serif; }

article h2 { font-size: 20px; line-height: 1.4; margin-bottom: 16px; font-family: noto-serif, sans-serif; }

article h2 a, article p a, article li a, h1 a { font-weight: 700; text-decoration: underline; }

footer { background: rgb(22, 56, 96); color: rgb(255, 255, 255); padding-top: 20px; padding-bottom: 72px; }

.footerInner { max-width: 1280px; margin: 0px auto; padding: 0px 12px; }

.footerMain { display: grid; grid-template-columns: repeat(4, 1fr); padding-bottom: 24px; border-bottom: 1px solid rgb(71, 100, 134); margin-bottom: 16px; }

.footerUtils { color: rgb(255, 255, 255); border-right: 1px solid rgb(71, 100, 134); }

.footerUtils h3 { font-size: 16px; margin-bottom: 8px; }

.footerUtils ul { padding-left: 4px; }

.footerUtils li { display: flex; align-items: center; padding: 6px 0px; gap: 10px; }

.footerUtils a { font-size: 12px; font-weight: 700; line-height: 0.8; }

.footerPaper { display: flex; padding-left: 32px; gap: 16px; }

.paperInfo { color: rgb(255, 255, 255); display: flex; flex-direction: column; }

.paperInfo h3 { font-size: 16px; margin-bottom: 8px; }

.paperInfo span { font-size: 12px; margin-bottom: 6px; }

.paperButton { border: 1px solid rgb(255, 255, 255); border-radius: 4px; font-size: 12px; text-transform: uppercase; padding: 8px 16px; }

.footerAbon { font-size: 12px; padding: 0px 32px; border-right: 1px solid rgb(71, 100, 134); }

.footerAbon h3 { font-size: 16px; }

.footerAbon a { font-weight: 700; display: flex; align-items: center; gap: 4px; }

.footerAbon img { width: 16px; }

.footerAbon p { margin: 6px 0px; }

.footerApps { padding-left: 32px; display: flex; flex-direction: column; font-size: 12px; gap: 24px; }

.footerApps__app b { white-space: nowrap; }

.footerApps h3 { font-size: 16px; }

.footerApps__app, .footerNews, .footerSocial { display: flex; flex-direction: column; gap: 8px; }

.footerApps__app a, .footerNews a { display: flex; align-items: center; gap: 8px; }

.footerSocial__links { display: flex; gap: 12px; }

.footerLinks { display: flex; flex-wrap: wrap; white-space: nowrap; color: rgb(255, 255, 255); font-size: 12px; gap: 16px 32px; font-weight: 700; justify-content: center; }

.botNav { position: fixed; bottom: 0px; height: 55px; width: 100%; background: rgb(255, 255, 255); z-index: 10000; color: rgb(22, 56, 96); }

.navProgress { background: rgb(255, 255, 255); z-index: 10000; width: 100%; height: 4px; }

.navProgressBar { background: rgb(22, 56, 96); height: 100%; width: 0px; }

.navContent { border-top: 1px solid rgb(204, 204, 204); display: flex; justify-content: center; align-items: center; height: 100%; }

.navContent > * { padding: 0px 24px; display: flex; align-items: center; height: 100%; }

.navContent > :not(:last-child) { border-right: 1px solid rgb(204, 204, 204); }

.navSubscribe img { height: 24px; }

.navContent > span { font-size: 14px; font-weight: 700; font-family: noto-serif, sans-serif; }

.navSocial { gap: 32px; }

.navComments { gap: 4px; font-size: 12px; font-weight: 700; }

.navSubscribe { gap: 32px; }

.navSubButton { background-color: rgb(236, 182, 47); border-radius: 4px; color: rgb(22, 56, 96); padding: 9px 12px; font-size: 12px; font-weight: 700; }

.largeHide { display: none; }

.largeShow { display: flex; }

.navComments span { display: flex; align-items: center; gap: 4px; }

@media screen and (max-width: 1200px) {
  .headerLogo img { height: 44px; }
}

@media screen and (max-width: 1024px) {
  .headerMid { display: none; }
  .largeHide { display: flex; }
  .largeShow { display: none; }
  .headerTopCenter { display: none; }
  .headerLogo { justify-self: center; height: 60px; }
  .headerLogo img { height: 28px; }
  .headerBot { margin-top: 24px; font-size: 16px; }
  .headerInner { padding: 0px 24px; }
  header { border-bottom-width: 2px; }
  article { width: 100%; }
  main { width: 768px; }
  .footerApps { padding-left: 16px; }
  .footerAbon { padding: 0px 16px; }
  .footerPaper { padding-left: 16px; }
  .navContent { padding: 0px 26px; display: grid; grid-template-columns: repeat(4, 1fr); }
  .navContent > * { justify-self: center; border: none !important; }
  .navSubButton { width: max-content; line-height: 1; height: max-content; }
}

@media screen and (max-width: 768px) {
  .mobHide { display: none; }
  .headerBot { margin-top: 12px; }
  main { width: 100%; padding: 16px; }
  .articleMeta { overflow: hidden; }
  .headerInner { padding: 0px 16px; }
  .footerMain { grid-template-columns: 1fr; }
  .footerMain > :not(:last-child) { padding: 24px 0px; border-bottom: 1px solid rgb(71, 100, 134); border-right: none; border-left: none; }
  .footerUtils ul { columns: 2; }
  .footerUtils ul li { width: 50%; }
  .footerUtils a { line-height: 1; }
}