*,
:after,
:before {
 box-sizing:border-box
}
:root {
 --color-text:#fff;
 --color-bg:#000;
 --color-link:#f1f1f1;
 --color-link-hover:#c00;
 --color-bg-slide:#171719;
 font-size:13px
}
.slide__content .mos-img img{
 display: none !important;
}
body {
 width:100%;
 height:100vh;
 margin:0;
 overflow:hidden
}
mains {
 color:var(--color-text);
 background-color:var(--color-bg);
 -webkit-font-smoothing:antialiased;
 -moz-osx-font-smoothing:grayscale;
 width:100%;
 height:100vh;
 margin:0;
 font-family:obviously,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;
 position: fixed; 
left: 0;
top: 0;
 overflow:hidden
}
.js .loading:before,
.js .loading:after {
 content:"";
 z-index:1000;
 position:fixed
}
.js .loading:before {
 width:100%;
 height:100%;
 background:var(--color-bg);
 top:0;
 left:0
}
.js .loading:after {
 width:60px;
 height:60px;
 opacity:.4;
 background:var(--color-link);
 border-radius:50%;
 margin:-30px 0 0 -30px;
 animation:loaderAnim .7s linear infinite alternate forwards;
 top:50%;
 left:50%
}
@keyframes loaderAnim {
 to {
  opacity:1;
  transform:scale(.5)
 }
}
.news-spr_tagline {
    font-size: 14px;
    margin-bottom: 10px;
    font-weight: 300;
    line-height: 22px;
    text-transform:capitalize;
    transition: all 500ms ease;
}
.news-spr_tagline a {
    color: white;
}
mains .icon-btn {
 display:inline-block;
 border:none;
 padding:0;
 line-height:40px;
 background-color:#ffffff;
 color: #333;
 text-align:center;
 transition:all ease .4s
}
mains .icon-btn.style4 {
 background-color:#444;
 color: #fff
}

mains .icon-btn:hover {
 border-color:rgba(0,0,0,0);
 box-shadow:none;
 background-color:var(--color-link-hover);
 color:#fff
}
a {
 color:var(--color-link);
 cursor:pointer;
 outline:none;
 text-decoration:none
}
a:hover {
 color:var(--color-link-hover);
 outline:none
}
a:focus {
 background:#d3d3d3;
 outline:none
}
a:focus:not(:focus-visible) {
 background:0 0
}
a:focus-visible {
 background:0 0;
 outline:2px solid red
}
.unbutton {
 font:inherit;
 cursor:pointer;
 color:var(--color-link);
 background:0 0;
 border:0;
 margin:0;
 padding:0
}
.unbutton:focus {
 outline:none
}
.frame {
 width:100%;
 height:100vh;
 z-index:100;
 pointer-events:none;
 grid-gap:1rem;
 grid-template:"back sponsor""title title""info info""nav nav"1fr/auto auto;
 padding:2.5rem;
 display:grid;
 position:fixed
}
.frame a {
 pointer-events:auto
}
.frame__title {
 grid-area:title;
 place-self:end;
 align-items:start;
 display:flex
}
.frame__title-main {
 margin:0 0 0 1rem;
 font-size:1rem;
 font-weight:400
}
.frame__title-back {
 align-items:flex-end;
 margin-bottom:.15rem;
 display:flex;
 position:relative
}
.frame__title-back span {
 font-size:1.25rem;
 line-height:1;
 transform:rotate(-45deg)
}
.frame__title-back svg {
 fill:currentColor
}
.frame__info {
 grid-area:info;
 margin-bottom: -20px;
 align-self:end
}
.frame__nav {
 grid-gap:.5rem;
 grid-area:nav;
 grid-auto-flow:row;
 align-content:end;
 place-items:start;
 display:grid;
 background: #00000094;
  padding: 20px;
  max-width: 500px;
}
.frame__nav-button {
 pointer-events:auto;
 transition:color .3s;
 position:relative;
 font-size: 24px;
 font-family: Philosopher;
}
.frame__nav-button:not(.frame__nav-button--current):hover {
 color:var(--color-link-hover)
}
.frame__nav-button--current {
 color:var(--color-text)
}
.frame__nav-button:before {
 content:"";
 width:2.5rem;
 height:1px;
 transform-origin:100%;
 background-color:currentColor;
 transition:transform .8s ease-in-out;
 position:absolute;
 top:50%;
 right:calc(100% + 4px);
 transform:scaleX(0)
}
.frame__nav-button--current:before {
 transform:scaleX(1)
}
.frame__back {
 opacity:0;
 pointer-events:none;
 position: fixed;
 right: 20px;
 bottom: 20px
}
.frame__back--show {
 opacity:1;
 pointer-events:auto
}
.slides {
 width:100%;
 height:100vh;
 grid-template-rows:100%;
 grid-template-columns:100%;
 place-items:center;
 display:grid;
 overflow:hidden
}
.slide {
 width:100%;
 height:104%;
 pointer-events:none;
 opacity:0;
 will-change:transform;
 grid-area:1/1/-1/-1;
 position:relative;
 overflow:hidden
}
.slide--current {
 pointer-events:auto;
 opacity:1
}
.slide__inner {
 width:100%;
 height:100%;
 will-change:transform;
 grid-template-rows:100%;
 grid-template-columns:100%;
 display:grid;
 position:relative;
 overflow:hidden
}
.slide__img {
 cursor:pointer;
 z-index:1;
 grid-area:1/1/-1/-1;
 position:relative;
 overflow:hidden
}
.slide__img-inner {
 width:100%;
 height:100%;
 will-change:transform;
 background-position:50%;
 background-repeat:no-repeat;
 background-size:cover
}
.slide__content {
 background:var(--color-bg-slide);
 grid-column-gap:2rem;
 grid-template:"img title""img text""img."/1fr 1fr;
 grid-area:1/1/-1/-1;
 place-content:center;
 padding:1rem;
 display:grid
}
.slide__content-img {
 min-height:350px;
 height:auto;
 will-change:transform;
 background-position:50%;
 background-size:cover;
 grid-area:img
}
.slide__content h2 {
 text-transform:none;
 grid-area:title;
 margin:0 0 1rem;
 font-size:max(3.5rem,min(2vw,3rem));
 font-weight:200;
 line-height:1;
 font-family: Philosopher;
}
.slide__content p {
 max-width:260px;
 color:#ffffff80;
 grid-area:text;
 margin:0;
 line-height:1.5
}
.cursor {
 pointer-events:none;
 position:absolute;
 top:0;
 left:0
}
@media screen and (min-width:53em) {
 .frame {
  grid-template:"back.sponsor""nav info title"/auto auto auto;
  align-content:space-between
 }
 .frame__info {
  justify-self:center
 }
 .slide__content {
  grid-column-gap:2rem;
  grid-template:"img title""img text""img."/350px 450px;
 }
}
.splitting .word,
.splitting .char {
 display:inline-block
}
.splitting .char {
 position:relative
}
.splitting .char:before,
.splitting .char:after {
 content:attr(data-char);
 visibility:hidden;
 -webkit-user-select:none;
 user-select:none;
 transition:inherit;
 position:absolute;
 top:0;
 left:0
}
.splitting {
 --word-center:calc((var(--word-total) - 1)/2);
 --char-center:calc((var(--char-total) - 1)/2);
 --line-center:calc((var(--line-total) - 1)/2)
}
.splitting .word {
 --word-percent:calc(var(--word-index)/var(--word-total));
 --line-percent:calc(var(--line-index)/var(--line-total))
}
.splitting .char {
 --char-percent:calc(var(--char-index)/var(--char-total));
 --char-offset:calc(var(--char-index) - var(--char-center));
 --distance:calc( (var(--char-offset)*var(--char-offset))/var(--char-center));
 --distance-sine:calc(var(--char-offset)/var(--char-center));
 --distance-percent:calc((var(--distance)/var(--char-center)))
}
.splitting.cells img {
 width:100%;
 display:block
}
@supports ( display: grid ) {
 .splitting.cells {
  visibility:hidden;
  background-size:cover;
  position:relative;
  overflow:hidden
 }
 .splitting .cell-grid {
  background:inherit;
  width:100%;
  height:100%;
  grid-template:repeat( var(--row-total),1fr )/repeat( var(--col-total),1fr );
  display:grid;
  position:absolute;
  top:0;
  left:0
 }
 .splitting .cell {
  background:inherit;
  position:relative;
  overflow:hidden
 }
 .splitting .cell-inner {
  background:inherit;
  visibility:visible;
  width:calc(100%*var(--col-total));
  height:calc(100%*var(--row-total));
  left:calc(-100%*var(--col-index));
  top:calc(-100%*var(--row-index));
  position:absolute
 }
 .splitting .cell {
  --center-x:calc((var(--col-total) - 1)/2);
  --center-y:calc((var(--row-total) - 1)/2);
  --offset-x:calc(var(--col-index) - var(--center-x));
  --offset-y:calc(var(--row-index) - var(--center-y));
  --distance-x:calc( (var(--offset-x)*var(--offset-x))/var(--center-x));
  --distance-y:calc( (var(--offset-y)*var(--offset-y))/var(--center-y))
 }
}