.video-shelf{width:100%;height:auto;background:color-mix(in srgb, rgb(57, 109, 189), black 40%);padding:40px 0;margin:30px auto 60px auto}.video-shelf .scroll-container{display:flex;align-items:center;position:relative;width:100%;overflow:hidden;margin-bottom:50px;border-bottom:1px solid #222;padding-bottom:50px}.video-shelf .scroll-container:last-child{border-bottom:none;padding-bottom:0;margin-bottom:0}@media only screen and (max-width: 865px){.video-shelf .scroll-container{margin-bottom:25px;padding-bottom:20px}}.video-shelf .scroll-container .scroll-row{display:flex;gap:30px;overflow-x:auto;scroll-behavior:smooth;width:100%;padding:0 5%;box-sizing:border-box;scrollbar-width:none;padding-top:3px}@media only screen and (max-width: 865px){.video-shelf .scroll-container .scroll-row{gap:20px}}.video-shelf .scroll-container .scroll-row::-webkit-scrollbar{display:none}.video-shelf .scroll-container .scroll-btn{position:absolute;top:40%;transform:translateY(-50%);background-color:hsla(0,0%,100%,.85);color:#c00;border:none;border-radius:50%;width:40px;height:40px;cursor:pointer;z-index:1;box-shadow:inset 0 0 .5px 1px hsla(0,0%,100%,.1),0 0 0 1px hsla(230,13%,9%,.075),0 .3px .4px hsla(230,13%,9%,.02),0 .9px 1.5px hsla(230,13%,9%,.045),0 3.5px 6px hsla(230,13%,9%,.09)}@media only screen and (max-width: 865px){.video-shelf .scroll-container .scroll-btn{top:35%;width:30px;height:30px}}.video-shelf .scroll-container .scroll-btn svg{width:19px;height:20px;margin-top:3px;fill:#c00;-webkit-transform:translate(0px, 0px)}@media only screen and (max-width: 865px){.video-shelf .scroll-container .scroll-btn svg{width:14px;height:15px}}.video-shelf .scroll-container .left-btn{left:20px}.video-shelf .scroll-container .right-btn{right:20px}.video-shelf .scroll-container div.asset{max-width:350px}@media only screen and (max-width: 865px){.video-shelf .scroll-container div.asset{max-width:250px}}@media only screen and (max-width: 576px){.video-shelf .scroll-container div.asset{max-width:175px}}.video-shelf .scroll-container div.asset .img-wrapper{position:relative;transition:opacity .1s ease-in;opacity:1}.video-shelf .scroll-container div.asset .img-wrapper:hover span.duration{bottom:8px;right:8px;transition:all .3s ease}.video-shelf .scroll-container div.asset .img-wrapper.hidden{opacity:0;transition:none}.video-shelf .scroll-container div.asset .img-wrapper span.duration{position:absolute;bottom:10px;right:10px;background-color:hsla(0,0%,100%,.9);color:#000;padding:3px 7px;border-radius:30px;font-size:.9em;font-weight:900;font-family:"Roboto",sans-serif;transition:all .3s ease}@media only screen and (max-width: 865px){.video-shelf .scroll-container div.asset .img-wrapper span.duration{font-size:.7em}}.video-shelf .scroll-container div.asset .img-wrapper video,.video-shelf .scroll-container div.asset .img-wrapper img{width:350px;aspect-ratio:16/9;object-fit:cover;border-radius:5px;box-shadow:inset 0 0 .5px 1px hsla(0,0%,100%,.1),0 0 0 1px hsla(230,13%,9%,.075),0 .3px .4px hsla(230,13%,9%,.02),0 .9px 1.5px hsla(230,13%,9%,.045),0 3.5px 6px hsla(230,13%,9%,.09);transition:all .3s ease}.video-shelf .scroll-container div.asset .img-wrapper video:hover,.video-shelf .scroll-container div.asset .img-wrapper img:hover{transform:scale(1.01) translate3d(0, 0, 0) perspective(1px);transition:all .3s ease}@media only screen and (max-width: 865px){.video-shelf .scroll-container div.asset .img-wrapper video,.video-shelf .scroll-container div.asset .img-wrapper img{width:250px}}@media only screen and (max-width: 576px){.video-shelf .scroll-container div.asset .img-wrapper video,.video-shelf .scroll-container div.asset .img-wrapper img{width:175px}}.video-shelf .scroll-container div.asset a{height:100%;display:flex;flex-direction:column;justify-content:flex-start}.video-shelf .scroll-container div.asset h3{font-family:"Roboto",sans-serif;font-weight:500;font-size:1.1rem;line-height:1.4rem;margin-top:5px;color:#fff}@media only screen and (max-width: 865px){.video-shelf .scroll-container div.asset h3{font-size:.9rem;line-height:1.1rem}}
