:root{--color-primary:#fff;--color-secondary:#181818}html{font-size:calc(100vw / 1920 * 10)}body{color:var(--color-primary);background-color:var(--color-secondary)}h1{font-size:8rem}p,span{font-size:3.2rem}img{width:100%;height:100%;object-fit:cover;display:block}.thumbnail{position:relative;width:100%;height:100vh;overflow:hidden}.thumbnail-heading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;color:var(--color-primary);width:max-content}.thumbnail-list{display:flex;justify-content:center;align-items:flex-end;position:relative;gap:12px;height:inherit;padding:3.2rem;counter-reset:item;z-index:20}.thumbnail-item{cursor:pointer;transition:border .8s ease-in-out,opacity .8s ease-in-out}.thumbnail-item::before{display:block;padding-bottom:.8rem;counter-increment:item;content:"[0" counter(item) "]";font-size:1.4rem;color:var(--color-primary);transition:color .8s ease-in-out}.thumbnail-image{position:relative;width:12rem;height:16rem;border-radius:1.6rem;overflow:hidden}.thumbnail-image.active{border:1px solid var(--color-primary);transition:all .8s ease-in-out}.thumbnail-image img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.thumbnail-bg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:5;overflow:hidden}.bg-media{position:absolute;object-position:top;z-index:10}.bg-media-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:20;overflow:hidden;color:var(--color-primary)}.bg-media-text span{display:block}