$animation-speed: .3s; $animation-function: ease-out; $backdrop-color: rgba(0,0,0,.5); @keyframes modal-video{from {opacity: 0;} to {opacity: 1;}}@keyframes modal-video-inner{0%{transform:translateY(100px)}to{transform:translate(0)}}.modal-video{position:fixed;top:0;left:0;width:100%;height:100%;background-color:$backdrop-color;z-index:1000000;cursor:pointer;opacity:1;animation-timing-function:$animation-function;animation-duration:$animation-speed;animation-name:modal-video;-webkit-transition:opacity $animation-speed $animation-function;-moz-transition:opacity $animation-speed $animation-function;-ms-transition:opacity $animation-speed $animation-function;-o-transition:opacity $animation-speed $animation-function;transition:opacity $animation-speed $animation-function}.modal-video-effect-exit{opacity:0;& .modal-video-movie-wrap{-webkit-transform:translate(0,100px);-moz-transform:translate(0,100px);-ms-transform:translate(0,100px);-o-transform:translate(0,100px);transform:translateY(100px)}}.modal-video-body{max-width:960px;width:100%;height:100%;margin:0 auto;padding:0 10px;display:flex;justify-content:center;box-sizing:border-box}.modal-video-inner{display:flex;justify-content:center;align-items:center;width:100%;height:100%;@media (orientation: landscape){padding:10px 60px;box-sizing:border-box}}.modal-video-movie-wrap{width:100%;height:0;position:relative;padding-bottom:56.25%;background-color:#333;animation-timing-function:$animation-function;animation-duration:$animation-speed;animation-name:modal-video-inner;-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-ms-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0);-webkit-transition:-webkit-transform $animation-speed $animation-function;-moz-transition:-moz-transform $animation-speed $animation-function;-ms-transition:-ms-transform $animation-speed $animation-function;-o-transition:-o-transform $animation-speed $animation-function;transition:transform $animation-speed $animation-function;& iframe{position:absolute;top:0;left:0;width:100%;height:100%}}.modal-video-close-btn{position:absolute;z-index:2;top:-45px;right:0px;display:inline-block;width:35px;height:35px;overflow:hidden;border:none;background:transparent;@media (orientation: landscape){top:0;right:-45px}&:before{transform:rotate(45deg)}&:after{transform:rotate(-45deg)}&:before,&:after{content:"";position:absolute;height:2px;width:100%;top:50%;left:0;background:#fff;border-radius:5px;margin-top:-6px}}:root{--white: #f7f7f7;--main-bg-clr: hsl(0, 0%, 15%);--secondary-bg-clr: hsl(0, 0%, 25%);--accent-clr: #00938b;--accent-clr: #208c65;--text-gray-200: rgb(229 231 235);--text-gray-300: rgb(209 213 219);--text-gray-400: rgb(156 163 175);--text-gray-500: rgb(107 114 128);--border-radius-sm: 6px;--border-radius-md: 10px;--border-radius-lg: 15px;--border-radius-full: 100px;--divider-clr: rgba(0, 0, 0, .3);--font-normal: 1rem;--font-sm: .9375rem;--font-xs: .875rem;--font-xxs: .8125rem;--font-12: .75rem}body{font-family:Lato,sans-serif;background-color:var(--main-bg-clr)!important}*{padding:0;margin:0;box-sizing:border-box}a{text-decoration:none}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar .MuiDrawer-paper{background-color:var(--secondary-bg-clr)!important;color:var(--white)}.sidebar .MuiDrawer-docked{-ms-overflow-style:none;scrollbar-width:none}.sidebar ::-webkit-scrollbar{display:none}.dashboard ::-webkit-scrollbar{width:8px;display:none}.dashboard{overflow-x:hidden}.modal-video{background-color:#0000004d}.modal-video-movie-wrap{display:flex;justify-content:center;width:fit-content;background-color:transparent}.modal-video-movie-wrap iframe{width:430px;height:400px}.library-search-input{padding:1em 1.5em;outline:none;background-color:var(--text-gray-300);color:#333;font-size:1.2rem;border:none;border-radius:100px;width:100%;font-weight:700}.swiper{width:100%;height:100%}.home .swiper-button-prev:after,.home .swiper-button-next:after{display:none;pointer-events:none;cursor:default}.home .arrow-container{display:flex;gap:1em;margin-bottom:8px}.home .slide-arrow{cursor:pointer;width:32px;height:32px;border:1px solid var(--text-gray-300);border-radius:50%;display:flex;justify-content:center;align-items:center;opacity:.7}.home-slider-container:hover .slide-arrow{display:flex}.home .slide-arrow:hover{opacity:.55}.home .slide-arrow.swiper-button-disabled{display:none}.home .slide-icons{font-size:20px;color:var(--text-gray-300)}@media screen and (min-width: 768px){.home .slide-arrow{width:35px;height:35px}.home .slide-icons{font-size:30px}}@media screen and (max-width: 970px){.layout-container{max-width:90.5vw!important}}@media screen and (max-width: 599px){.layout-container{max-width:99vw!important}}.home-hero .mySwiper2{height:450px;width:100%;border-radius:var(--border-radius-sm);position:relative}.home-hero .mySwiper{height:80px;width:100%;right:0;box-sizing:border-box;padding:10px 20px}@media (min-width: 768px){.home-hero .mySwiper{width:40%;right:2em;padding:10px 0}}.home-hero .mySwiper .swiper-slide{width:25%;height:100%;opacity:.4}.home-hero .mySwiper .swiper-slide-thumb-active{opacity:1}.home-hero .swiper-slide img{display:block;width:100%;height:100%;object-fit:cover}.home-hero .swiper-lazy-preloader{border-color:var(--accent-clr)!important}