.videoCard{background-color:var(--color-white);box-shadow:0 4px 4px #00000040}.videoCardCover{position:relative}.videoCardImage img{aspect-ratio:16/9;width:100%;object-fit:cover;object-position:center}.videoCardMask{position:absolute;top:50%;left:50%;z-index:2;width:100%;height:100%;display:flex;--un-translate-x:-50%;--un-translate-y:-50%;transform:translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));align-items:center;justify-content:center;--un-bg-opacity:.3;background-color:rgba(0,0,0,var(--un-bg-opacity))}.videoCardMask .fa-Icons{opacity:0;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-duration:.5s;transition-timing-function:cubic-bezier(0,0,.2,1);--width: 3.75rem;--height: 2.6875rem}@media (min-width: 1024px){.videoCardMask .fa-Icons{--width: 5rem !important;--height: 3.6113rem !important}}.videoCardContent{display:flex;flex-direction:column;gap:1.25rem;background-color:var(--color-white);padding:1.25rem 1.25rem 1.5625rem}.videoCardTop{display:flex;align-items:center;justify-content:space-between}.videoCardTop .videoCardViews{display:block}@media (min-width: 768px){.videoCardTop .videoCardViews{display:none}}.videoCardTop .videoCardDate{display:none}@media (min-width: 768px){.videoCardTop .videoCardDate{display:block}}.videoCardTitle{font-size:var(--fontSize-sm);line-height:1.4;color:var(--color-dark)}@media (min-width: 768px){.videoCardTitle{font-size:1.25rem}}.videoCardDate{font-size:var(--fontSize-xs);line-height:1.4;color:var(--color-primary)}@media (min-width: 768px){.videoCardDate{font-size:.9375rem}}.videoCardBottom{display:flex;align-items:center;justify-content:space-between}.videoCardBottom .videoCardViews{display:none}@media (min-width: 768px){.videoCardBottom .videoCardViews{display:block}}.videoCardBottom .videoCardDate{display:block}@media (min-width: 768px){.videoCardBottom .videoCardDate{display:none}}.videoCardViews{font-size:var(--fontSize-xs);line-height:1.4;color:var(--color-gray-6)}@media (min-width: 768px){.videoCardViews{font-size:var(--fontSize-base);line-height:1.4}}.videoCardUser{display:flex;align-items:center;gap:.5rem}.videoCardAvator{width:1.875rem;height:1.875rem;overflow:hidden;border-radius:9999px}.videoCardAuthor{font-size:var(--fontSize-xs);line-height:1.4;color:var(--color-gray-6)}@media (min-width: 768px){.videoCardAuthor{font-size:var(--fontSize-base);line-height:1.4}}#VideoBanner #VideoBannerSwiperContainer{--swiper-navigation-size: 2.5rem;--swiper-navigation-color: var(--color-dark);--swiper-navigation-sides-offset: -.625rem;position:relative}@media (min-width: 640px){#VideoBanner #VideoBannerSwiperContainer{--swiper-navigation-sides-offset:calc((100vw - 100% - 1.25rem)/-2)}}@media (min-width: 1536px){#VideoBanner #VideoBannerSwiperContainer{--swiper-navigation-sides-offset:calc(((100vw - 100% - 1.25rem)/2 - 4.375rem)*-1)}}#VideoBanner #VideoBannerSwiperContainer .swiper-button-next,#VideoBanner #VideoBannerSwiperContainer .swiper-button-prev{background-size:contain;background-position:center;background-repeat:no-repeat;width:var(--swiper-navigation-size);height:var(--swiper-navigation-size)}#VideoBanner #VideoBannerSwiperContainer .swiper-button-next:after,#VideoBanner #VideoBannerSwiperContainer .swiper-button-prev:after{content:""}#VideoBanner #VideoBannerSwiperContainer .swiper-button-next{background-image:var(--icon-arrow-right)}#VideoBanner #VideoBannerSwiperContainer .swiper-button-prev{background-image:var(--icon-arrow-left)}#VideoBanner #VideoBannerSwiperContainer .swiper-buttons{display:flex}@media (min-width: 768px){#VideoBanner #VideoBannerSwiperContainer .swiper-buttons{display:none}}#VideoBanner #VideoBannerSwiper{padding-bottom:.625rem}#VideoBanner #VideoBannerSwiper .swiper-slide{width:calc(100vw - 5rem)}@media (min-width: 640px){#VideoBanner #VideoBannerSwiper .swiper-slide{width:100%}}#VideoBanner #VideoBannerSwiper .swiper-slide.swiper-slide-active .videoCardMask .fa-Icons{opacity:1!important}@media (max-width: 639.9px){#VideoBanner #VideoBannerSwiper .swiper-slide:not(.swiper-slide-active){pointer-events:none;opacity:0;transition-property:opacity;transition-duration:.15s;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1)}}@media (min-width: 640px){#VideoBanner #VideoBannerSwiper .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev):not(.swiper-slide-next){pointer-events:none;opacity:0;transition-property:opacity;transition-duration:.15s;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1)}}.VideoList{display:flex;flex-direction:column;align-items:center;gap:1.5625rem}@media (min-width: 768px){.VideoList{gap:3.75rem}}@media (min-width: 1024px){.VideoList{gap:4.125rem}}.VideoList>div:first-child{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));width:calc(100vw - 5rem);gap:1.5625rem}@media (min-width: 640px){.VideoList>div:first-child{width:100%}}@media (min-width: 768px){.VideoList>div:first-child{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:3.75rem;column-gap:2.5rem}}@media (min-width: 1536px){.VideoList>div:first-child{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:5.375rem;column-gap:3.75rem}}
