.carousel{height:100vh;width:100vw;overflow:hidden;position:relative}.carousel .list .item{width:100%;height:100%;position:absolute;inset:0 0 0 0}.carousel .list .item img{width:100%;height:100%;object-fit:cover}.carousel .list .item .content{position:absolute;top:20%;width:1140px;max-width:80%;left:50%;transform:translateX(-50%);padding-right:30%;box-sizing:border-box;color:#fff;text-shadow:0 5px 10px #0004}.carousel .list .item .author{font-weight:700;letter-spacing:10px;font-size:2em}.carousel .list .item .title{margin-bottom:10px;color:#fff;font-size:4em;text-transform:uppercase;line-height:65px}.carousel .list .item .title,.carousel .list .item .topic{font-weight:700}.carousel .list .item .topic{color:#f1683a;font-size:3em}.carousel .list .item .buttons{display:grid;grid-template-columns:repeat(2,140px);grid-template-rows:40px;gap:5px;margin-top:20px}.carousel .list .item .buttons button{border:none;background-color:#eee;letter-spacing:3px;font-family:Poppins;font-weight:500}.carousel .list .item .buttons button:nth-child(2){background-color:#fff0;border:1px solid #fff;color:#eee}.carousel .thumbnail{position:absolute;bottom:50px;left:50%;width:max-content;z-index:100;display:flex;gap:15px}.carousel .thumbnail .item{width:140px;height:200px;flex-shrink:0;position:relative;border-radius:20px;box-shadow:rgb(0 0 0 / .35) 0 5px 15px}.carousel .thumbnail .item:after{content:'';width:100%;height:100%;position:absolute;left:0;bottom:0;background-image:linear-gradient(to top,#080808f2 10%,transparent);border-radius:19px}.carousel .thumbnail .item img{width:100%;height:100%;object-fit:cover;border-radius:20px}.carousel .thumbnail .item .content{color:#fff;position:absolute;bottom:10px;left:10px;right:10px;z-index:1}.carousel .thumbnail .item .content .title{font-weight:600;font-size:15px;line-height:20px}.carousel .thumbnail .item .content .description{font-weight:300}.carousel .action{position:absolute;top:80%;left:5%;z-index:100;width:40%;max-width:700px;display:flex;align-items:center;justify-content:space-between}.carousel .arrows button{border-radius:50%;border:none;color:#fff;font-weight:700;font-size:18px;transition:.5s;margin:0}.carousel .arrows button:hover{background-color:#fff;color:#000}.carousel .arrows svg.button-icon{height:auto;left:50%;max-height:100%;max-width:100%;padding:20%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .3s;width:100%;fill:#fff}.carousel .arrows button:hover svg.button-icon{fill:#333}.carousel .progress{width:calc(100% - 100px);display:flex;align-items:center;justify-content:space-between}.carousel .progress-sub-container{z-index:1;display:flex;align-items:center;bottom:20px;left:220px;width:calc(100% - 100px);;height:36px}.carousel .progress-sub-background{width:100%;height:3px;background-color:#fff3;border-radius:25px}.carousel .progress-sub-foreground{height:3px;border-radius:25px;background-color:rgb(255 255 255 / .81);transition:width 1.5s}.carousel .slide-numbers{font-size:36px;font-weight:700;color:transparent!important;-webkit-text-stroke:1px #fff}.carousel .list .item:nth-child(1){z-index:1}.carousel .list .item:nth-child(1) .content .author,.carousel .list .item:nth-child(1) .content .title,.carousel .list .item:nth-child(1) .content .topic,.carousel .list .item:nth-child(1) .content .des,.carousel .list .item:nth-child(1) .content .buttons{transform:translateY(50px);filter:blur(20px);opacity:0;animation:showContent .5s 1s linear 1 forwards}@keyframes showContent{to{transform:translateY(0);filter:blur(0);opacity:1}}.carousel .list .item:nth-child(1) .content .title{animation-delay:1.2s!important}.carousel .list .item:nth-child(1) .content .topic{animation-delay:1.4s!important}.carousel .list .item:nth-child(1) .content .des{animation-delay:1.6s!important}.carousel .list .item:nth-child(1) .content .buttons{animation-delay:1.8s!important}.carousel.next .list .item:nth-child(1) img{width:150px;height:220px;position:absolute;bottom:50px;left:50%;border-radius:30px;animation:showImage .5s linear 1 forwards}@keyframes showImage{to{bottom:0;left:0;width:100%;height:100%;border-radius:0}}.carousel.next .thumbnail .item:nth-last-child(1){overflow:hidden;animation:showThumbnail .5s linear 1 forwards}.carousel.prev .list .item img{z-index:100}@keyframes showThumbnail{from{width:0;opacity:0}}.carousel.next .thumbnail{animation:effectNext .5s linear 1 forwards}@keyframes effectNext{from{transform:translateX(140px)}}.carousel .time{position:absolute;z-index:20;width:0%;height:3px;background-color:#f1683a;left:0;top:0}.carousel.next .time,.carousel.prev .time{animation:runningTime 3s linear 1 forwards}@keyframes runningTime{from{width:100%}to{width:0}}.carousel.prev .list .item:nth-child(2){z-index:2}.carousel.prev .list .item:nth-child(2) img{animation:outFrame 0.5s linear 1 forwards;position:absolute;bottom:0;left:0}@keyframes outFrame{to{width:140px;height:200px;bottom:50px;left:50%;border-radius:20px}}.carousel.prev .thumbnail .item:nth-child(1){overflow:hidden;opacity:0;animation:showThumbnail .5s linear 1 forwards}.carousel.next .arrows button,.carousel.prev .arrows button{pointer-events:none}.carousel.prev .list .item:nth-child(2) .content .author,.carousel.prev .list .item:nth-child(2) .content .title,.carousel.prev .list .item:nth-child(2) .content .topic,.carousel.prev .list .item:nth-child(2) .content .des,.carousel.prev .list .item:nth-child(2) .content .buttons{animation:contentOut 1.5s linear 1 forwards!important}@keyframes contentOut{to{transform:translateY(-140px);filter:blur(20px);opacity:0}}@media screen and (max-width:678px){.carousel .list .item .title{line-height:35px}.carousel .action{width:100%;bottom:260px;top:unset}.carousel .progress-sub-container{width:calc(100% - 140px)}.carousel .slide-numbers{position:absolute;right:40px;font-size:32px}.carousel .thumbnail{left:5%}.carousel .list .item .content{padding-right:0;top:25px}.carousel .list .item .content .title{font-size:30px}}