@import url(https://fonts.googleapis.com/css2?family=Lato:wght@100;200;300;400;700;900&family=Poppins:wght@200;300;400;500;600;700&display=swap);body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}body{font-family:lato,sans-serif;background-color:#1b1f26;color:#fff;font-family:Lato,sans-serif}*{margin:0;padding:0}h1{font-family:poppins,sans-serif}a{text-decoration:none;cursor:pointer}a:hover{transform:scale(1.03)}a:active,a:hover{transition:all .1s ease-in-out}a:active{transform:scale(.93)}button{outline:none;background:transparent;border:none;cursor:pointer}button:active{transition:all .3s ease-in-out;transform:scale(.93)}svg{cursor:pointer}.App{min-height:100vh;min-height:calc(var(--vh, 1vh)*100);height:100%}@media (min-width:1101px){.App{max-height:100vh}}.App__media{display:flex;justify-content:space-between;align-items:flex-end}.App__card-list,.App__header{align-self:start}.Card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:5vh;padding-bottom:calc(var(--vh, 1vh)*5);cursor:pointer;width:50vw;text-align:center;height:24vh;display:inline-block;transition:all .3s ease}@media (min-width:1101px){.Card{padding:0;width:10.5vw;height:35vh}}.Card:active{transform:scale(.9)}.Card:hover{transform:scale(1.03)}.Card img{height:17vh;width:31vw;transition:all .3s ease;border-radius:20px;margin-bottom:.5rem}.Card img:active{transform:scale(.9)}@media (min-width:1101px){.Card img{height:22vh;width:10.5vw;margin-bottom:1.5vh}}.Card p{font-family:Poppins,sans-serif;font-weight:200;letter-spacing:5px;font-size:3.3vw;padding:0 5vw}@media (min-width:1101px){.Card p{font-weight:300;padding:0;font-size:2vh;letter-spacing:4px}}.Card span{font-weight:100;letter-spacing:2px;color:hsla(0,0%,100%,.8);font-size:3vw}@media (min-width:1101px){.Card span{font-weight:300;padding-top:.2rem;font-size:1.6vh}}.CardList{display:flex;flex-direction:row;align-items:center;justify-content:center;flex-wrap:wrap;padding-top:5vh;padding-top:calc(var(--vh, 1vh)*5);position:relative;height:70vh;height:calc(var(--vh, 1vh)*70);align-items:flex-start}@media (min-width:1101px){.CardList{flex-wrap:nowrap;padding:0;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;align-items:flex-start;position:static;width:71vw;justify-content:space-between}}.CardList h1{display:none}@media (min-width:1101px){.CardList h1{position:absolute;display:block;font-weight:200;letter-spacing:5px;top:10vw;left:14.5vw;font-size:1.8vw;transform:rotate(270deg)}}.CardList .CardList__change{display:flex;width:100%;justify-content:space-around}@media (min-width:1101px){.CardList .CardList__change{flex-direction:column;height:22vh;width:3vw;align-items:flex-end;position:relative}}.CardList .CardList__change svg{width:5vh;width:calc(var(--vh, 1vh)*5);height:4vh;height:calc(var(--vh, 1vh)*4)}@media (min-width:1101px){.CardList .CardList__change svg{height:4.5vh;width:2vw}}.CardList .CardList__change button{transition:all .3s ease-in-out}.CardList .CardList__change button:active{transform:scale(.8)}.CardList2{flex-wrap:wrap;width:90%;color:#fff;align-items:flex-start}.MobileNav{position:fixed;bottom:0;left:0;right:0;height:7.4vh;height:calc(var(--vh, 1vh)*7.4);min-width:85%;padding:0 30px;z-index:10;background-color:#222831}@media (min-width:1101px){.MobileNav{display:none}}.MobileNav .wrapper{height:100%;display:flex;flex-direction:row;align-items:center;justify-content:space-between}.MobileNav .wrapper a svg{height:3vh;height:calc(var(--vh, 1vh)*3)}.MobileNav .wrapper a svg path{fill:hsla(0,0%,100%,.3)}.MobileNav .wrapper a:first-child svg{height:3.5vh;height:calc(var(--vh, 1vh)*3.5)}.MobileNav .wrapper .active svg path{fill:#e5a267}.MobileHeader{background-color:#222831;height:7.4vh;height:calc(var(--vh, 1vh)*7.4);position:relative;z-index:9;display:flex;flex-direction:row;align-items:center;justify-content:center}.MobileHeader .MobileHeader__logout{position:absolute;right:0;padding-right:30px;transition:all .3s ease-in-out}.MobileHeader .MobileHeader__logout:active{transform:scale(.8)}.SideBar{justify-content:space-between;min-height:100vh;height:100%;background-color:#222831;width:15vw}.SideBar,.SideBar__profile{display:flex;flex-direction:column;align-items:center}.SideBar__profile{margin-top:3vh;justify-content:center}.SideBar__profile img{height:10vh;border-radius:50%;-webkit-filter:drop-shadow(0 2px 1px #1b1f26);filter:drop-shadow(0 2px 1px #1b1f26);margin-bottom:1.5vh}.SideBar__profile-info{text-align:center}.SideBar__profile-info h1{font-size:1rem;font-family:Poppins,sans-serif;font-weight:300;letter-spacing:5px}.SideBar__profile-info p{font-weight:300;color:hsla(0,0%,100%,.4);font-size:.8vw;letter-spacing:2px}.SideBar__main{cursor:pointer;height:50vh;width:8vw}.SideBar__main-child{display:flex;align-items:center;text-align:start;margin-bottom:3vh}.SideBar__main-child svg{width:2.5vw;margin-right:1vw}.SideBar__main-child a{position:relative;color:#fff;font-size:2.4vh;font-weight:300;letter-spacing:2px}.SideBar__main-child a:after{content:"";position:absolute;bottom:-2px;left:0;right:0;width:100%;height:1px;transform:scaleX(0);background-image:linear-gradient(#ffce9f,#e5a267);transition:transform .3s}.SideBar__main-child a:hover:after{transform:scaleX(1)}.SideBar__main-child a:hover{transform:scale(1)}.SideBar__others{text-align:center;margin-top:4vh}.SideBar__others h1{font-weight:lighter;font-size:2.5vh;margin-bottom:4vh}.SideBar__author{margin-bottom:4vh}.SideBar__author svg{width:9vw}.SideBar__highlight{padding-bottom:.2vh;color:#e5a267;border-bottom:2px solid #e5a267;border-radius:1px}.container{padding:0 30px 30px}@media (min-width:1101px){.Layout{display:flex;grid-template-columns:15vw 85vw}}@media (min-width:1101px){.Layout__children{padding:2.5vh 5vw 2.5vh 9vw;display:grid;grid-template-rows:10vh 37vh 48vh}}.PlayListItem{overflow:hidden;cursor:pointer;display:grid;background-color:#222831;grid-template-columns:.9fr 2.1fr .5fr 1fr;align-items:center;text-transform:capitalize;height:3rem;width:100%;box-shadow:3px 4px 10px -8px #000;border-radius:5px}@media (min-width:1101px){.PlayListItem{grid-template-columns:1fr 2fr 2fr 1fr 1fr;width:38vw;height:6.5vh}}.PlayListItem button{background:transparent;border:none;outline:none;cursor:pointer}.PlayListItem p{font-weight:300;letter-spacing:3px;color:#fff;font-size:.8rem}@media (min-width:1101px){.PlayListItem p{font-size:1.6vh}}.PlayListItem+.PlayListItem{margin-top:1rem}@media (min-width:1101px){.PlayListItem+.PlayListItem{margin-top:2vh}}.PlayListItem__first{justify-self:center;display:flex}.PlayListItem__first img{height:32px;border-radius:100%}@media (min-width:1101px){.PlayListItem__first img{height:4.8vh}}.PlayListItem__second{display:flex;justify-content:space-between;padding-right:1vw}.PlayListItem__second2{justify-self:center;padding-right:2vw}.PlayListItem__third{justify-self:center}.background{background-image:linear-gradient(#faca9c,#eaab73)}.background p{font-weight:400;color:#222831}.background .PlayListItem__third{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.background .PlayListItem__third svg rect{fill:#222831}.PlayList{margin-top:5vh;display:flex;flex-direction:column;justify-content:flex-start;background-color:#1b1f26;margin-bottom:10vh}@media (min-width:1101px){.PlayList{height:100%;justify-content:flex-start;margin:0;align-items:center}}.PlayList h1{font-family:Lato,sans-serif;letter-spacing:5px;font-weight:300;text-align:center;display:none;font-size:4vh}@media (min-width:1101px){.PlayList h1{display:block;margin-bottom:1.8vh;position:relative;top:-1vh}}.PlayList__text{display:flex;position:relative;justify-content:center;flex-direction:column;align-items:center;height:60vh;width:100%}@media (min-width:1101px){.PlayList__text{height:30vh;width:39vw;margin-top:2vh}}.PlayList__text svg{height:50vh;height:calc(var(--vh, 1vh)*50);width:80vw}@media (min-width:1101px){.PlayList__text svg{height:30vh;width:30vw}}@-webkit-keyframes rotating{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes rotating{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.rotating{-webkit-animation:rotating 8s linear infinite;animation:rotating 8s linear infinite}.display-none{visibility:hidden}.Player{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}@media (min-width:1101px){.Player{min-width:19vw;width:19vw;background-image:linear-gradient(#ffce9f,#e5a267);border-radius:20px;height:48vh;box-shadow:3px 4px 10px -8px #000}}.Player img{border-radius:20px;margin-bottom:1rem;height:70vw;margin-top:3vh}@media (min-width:1101px){.Player img{height:20vh;margin-top:0;margin-bottom:2vh;border-radius:100%;box-shadow:3px 4px 10px -8px #000}}.Player .Player__video{position:relative;top:-1vh;top:calc(var(--vh, 1vh)*-1)}.Player .Player__title{font-family:Poppins,sans-serif;font-size:1.4rem;font-weight:200;letter-spacing:5px;padding-bottom:.4rem}@media (min-width:1101px){.Player .Player__title{color:#1b1f26;font-weight:400;font-size:2.2vh;padding:0 1rem}}.Player .Player__subtitle{font-size:1rem;font-weight:200;letter-spacing:5px}@media (min-width:1101px){.Player .Player__subtitle{color:#1b1f26;font-size:18px;font-size:1.9vh;font-weight:300;letter-spacing:3px;margin-bottom:.5vh;padding:0 1rem}}.Player .Player__controls{width:90%;display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding-top:3.5vh}@media (min-width:1101px){.Player .Player__controls{width:70%}.Player .Player__controls svg,.Player .Player__controls svg rect{height:5vh}}.Player .Player__controls-click svg{width:70%;height:6vh}@media (min-width:1101px){.Player .Player__controls-click svg{height:5vh}}.Player .Player__elapsed{padding-top:3.5vh;width:90%}@media (min-width:1101px){.Player .Player__elapsed{width:75%;padding-top:1.5vh}}.Player__controls-volume svg:active{transition:all .5s ease-in;transform:scale(.8)}.Player__controls2{display:flex;flex-direction:column;position:absolute;top:13vh;right:5.2vw}.Player__controls2 .Player__controls-click,.Player__controls2 .Player__controls-volume{margin-bottom:8vh}@media (min-width:1101px){.Player__controls2 svg{width:3vw;height:3.5vw}.Player__controls2 svg rect{height:5vh}}.VideoPlayer{height:50vh}[type=range]{-webkit-appearance:none;margin:6px 0;width:100%;border-radius:10px}[type=range]:focus{outline:0}@media (min-width:1101px){[type=range]:focus::-webkit-slider-runnable-track{background:#f1c7a2}}[type=range]:focus::-ms-fill-lower{background:#a4a5a8}@media (min-width:1101px){[type=range]:focus::-ms-fill-lower{background:#f1c7a2}}[type=range]:focus::-ms-fill-upper{background:#b1b2b4}[type=range]::-webkit-slider-runnable-track{cursor:pointer;height:5px;-webkit-transition:all .2s ease;transition:all .2s ease;width:100%;box-shadow:0 0 0 #222,0 0 0 #2f2f2f;background:#a4a5a8;border:0 solid #000;border-radius:5px}@media (min-width:1101px){[type=range]::-webkit-slider-runnable-track{background:#f1c7a2}}[type=range]::-webkit-slider-thumb{box-shadow:0 0 0 #111,0 0 0 #1e1e1e;background:#fff;border:0 solid #fff;border-radius:12px;cursor:pointer;height:12px;width:12px;-webkit-appearance:none;margin-top:-3.5px}[type=range]::-moz-range-track{cursor:pointer;height:5px;-moz-transition:all .2s ease;transition:all .2s ease;width:100%;box-shadow:0 0 0 #222,0 0 0 #2f2f2f;background:#a4a5a8;border:0 solid #000;border-radius:5px}@media (min-width:1101px){[type=range]::-moz-range-track{background:#f1c7a2}}[type=range]::-moz-range-thumb{box-shadow:0 0 0 #111,0 0 0 #1e1e1e;background:#fff;border:0 solid #fff;border-radius:12px;cursor:pointer;height:12px;width:12px}[type=range]::-ms-track{cursor:pointer;height:5px;-ms-transition:all .2s ease;transition:all .2s ease;width:100%;background:transparent;border-color:transparent;border-width:6px 0;color:transparent}[type=range]::-ms-fill-lower{background:#97989c}[type=range]::-ms-fill-lower,[type=range]::-ms-fill-upper{box-shadow:0 0 0 #222,0 0 0 #2f2f2f;border:0 solid #000;border-radius:10px}[type=range]::-ms-fill-upper{background:#a4a5a8}[type=range]::-ms-thumb{box-shadow:0 0 0 #111,0 0 0 #1e1e1e;background:#fff;border:0 solid #fff;border-radius:12px;cursor:pointer;height:12px;width:12px;margin-top:0}.Player__elapsed2{width:91.5%}.Player__elapsed2 [type=range]{-webkit-appearance:none;margin:6px 0;width:100%;border-radius:10px}.Player__elapsed2 [type=range]:focus{outline:0}@media (min-width:1101px){.Player__elapsed2 [type=range]:focus::-webkit-slider-runnable-track{background:#fff}}.Player__elapsed2 [type=range]:focus::-ms-fill-lower{background:#a4a5a8}@media (min-width:1101px){.Player__elapsed2 [type=range]:focus::-ms-fill-lower{background:#fff}}.Player__elapsed2 [type=range]:focus::-ms-fill-upper{background:#b1b2b4}.Player__elapsed2 [type=range]::-webkit-slider-runnable-track{cursor:pointer;height:5px;-webkit-transition:all .2s ease;transition:all .2s ease;width:100%;box-shadow:0 0 0 #222,0 0 0 #2f2f2f;background:#a4a5a8;border:0 solid #000;border-radius:5px}@media (min-width:1101px){.Player__elapsed2 [type=range]::-webkit-slider-runnable-track{background:#fff}}.PlayBox{height:6vh;height:calc(var(--vh, 1vh)*6);display:grid;position:fixed;width:100vw;bottom:7.4vh;bottom:calc(var(--vh, 1vh)*7.4);background-color:rgba(34,40,49,.4);grid-template-columns:1fr 3fr 1fr;align-items:center;justify-content:center}@media (min-width:1101px){.PlayBox{display:none}}.PlayBox img{justify-self:center;height:30px;border-radius:100%}.PlayBox .PlayBox__name{justify-self:center;align-self:center;color:#fff;font-size:.9rem;letter-spacing:2px;width:100%;text-align:center}.PlayBox .PlayBox__name span{background:linear-gradient(#ffce9f,#e5a267);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.PlayBox .PlayBox__buttons{justify-self:center}.PlayBox .PlayBox__buttons svg{height:3.5vh;height:calc(var(--vh, 1vh)*3.5)}.PlayBox .PlayBox__buttons svg path{fill:hsla(0,0%,100%,.3)}.PlayBox__player{display:none;position:absolute;z-index:1;top:7.4vh;top:calc(var(--vh, 1vh)*7.4);right:0;left:0;height:79.2vh}.PlayBox__player,.PlayBox__playlist{background-color:#1b1f26}.SearchBar{display:flex}.SearchBar input{width:100%;height:3rem;text-align:center;letter-spacing:4px;font-family:Poppins;font-size:1.2rem;font-weight:100;background-color:hsla(0,0%,100%,.08);border:none;color:#fff;padding:0 10vw;display:flex;align-items:center}@media (min-width:1101px){.SearchBar input{border-radius:5px;padding:0 1.5vw;height:4vh;width:20vw;text-align:start;font-size:2.1vh;letter-spacing:4px}}.SearchBar input::-webkit-input-placeholder{text-align:center;color:#fff;font-size:1.2rem;font-weight:100;opacity:.4}.SearchBar input:-ms-input-placeholder{text-align:center;color:#fff;font-size:1.2rem;font-weight:100;opacity:.4}.SearchBar input::-ms-input-placeholder{text-align:center;color:#fff;font-size:1.2rem;font-weight:100;opacity:.4}.SearchBar input::placeholder{text-align:center;color:#fff;font-size:1.2rem;font-weight:100;opacity:.4}@media (min-width:1101px){.SearchBar input::-webkit-input-placeholder{text-align:start;font-size:2.1vh}.SearchBar input:-ms-input-placeholder{text-align:start;font-size:2.1vh}.SearchBar input::-ms-input-placeholder{text-align:start;font-size:2.1vh}.SearchBar input::placeholder{text-align:start;font-size:2.1vh}}.SearchBar input:focus::-webkit-input-placeholder{color:transparent}.SearchBar input:focus:-ms-input-placeholder{color:transparent}.SearchBar input:focus::-ms-input-placeholder{color:transparent}.SearchBar input:focus::placeholder{color:transparent}.SearchBar__load{padding:20px 0;position:absolute;bottom:13vh;bottom:10vh;bottom:calc(var(--vh, 1vh)*10);width:100vw;display:flex;justify-content:center}.SearchBar__image{display:none}@media (min-width:1101px){.SearchBar__image{position:absolute;top:3.4vh;left:24.5vw}.SearchBar__image svg{height:2.5vh}}.MyModal h1{font-weight:300;text-align:center;padding:3rem}.MyModal__button{position:fixed;bottom:3vh;left:50%;transform:translate(-50%,-50%);height:5vh;align-items:center}.MyModal__button,.MyModal__main{display:flex;justify-content:center}.MyModal__main{align-items:flex-start;margin-top:5vh}.DesktopHeader{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.DesktopHeader button{background-color:hsla(0,0%,100%,.2);color:hsla(0,0%,100%,.8);border-radius:5px;padding:.6vh .6vw;font-family:Poppins,sans-serif}.LoginPage{display:flex;height:100vh;height:calc(var(--vh, 1vh)*100);max-height:100vh;max-height:calc(var(--vh, 1vh)*100);width:100vw;overflow:hidden;position:relative;background-color:#1b1f26}.LoginPage .LoginPage__content{display:flex;flex-direction:column;justify-content:center;align-items:center;width:70vw;text-align:center;padding-bottom:5vh}@media (max-width:1099px){.LoginPage .LoginPage__content{width:100vw}}.LoginPage .LoginPage__content .first-circles{position:absolute}@media (min-width:1101px){.LoginPage .LoginPage__content .first-circles{left:0;top:1.5vh}}@media (max-width:1099px){.LoginPage .LoginPage__content .first-circles{top:0;right:0}}.LoginPage .LoginPage__content .second-circles{position:absolute;left:0;bottom:0}@media (max-width:1099px){.LoginPage .LoginPage__content .second-circles svg ellipse{height:92px}}.LoginPage .LoginPage__content .LoginPage__content-title svg{height:25vh;width:35vw}@media (max-width:1099px){.LoginPage .LoginPage__content .LoginPage__content-title svg{height:10vh;width:70vw;margin-bottom:2vh}}.LoginPage .LoginPage__content .LoginPage__content-subtitle{font-size:4.5vh;width:60%;font-family:Poppins,sans-serif;letter-spacing:3px;font-weight:300;margin-bottom:5vh;padding:0 1rem}@media (max-width:1099px){.LoginPage .LoginPage__content .LoginPage__content-subtitle{width:80%;font-size:2.5vh;margin-bottom:4vh;font-weight:400}}.LoginPage .LoginPage__content .LoginPage__content-button{display:flex;align-items:center;justify-content:center;opacity:0;font-size:4vh;font-family:Poppins,sans-serif;line-height:144.5%;margin-bottom:10vh;cursor:pointer;transition:all .4s ease}@media (max-width:1099px){.LoginPage .LoginPage__content .LoginPage__content-button{font-weight:300;font-size:3vh;top:-7vh}}.LoginPage .LoginPage__content .LoginPage__content-button:active{transform:scale(.9)}.LoginPage .LoginPage__content .LoginPage__content-button:hover{transform:scale(1.05)}.LoginPage .LoginPage__content .LoginPage__content-button svg{height:4vh;width:2vw;margin-left:1px}@media (max-width:1099px){.LoginPage .LoginPage__content .LoginPage__content-button svg{width:25px;height:3.5vh;left:0;margin-left:5px}}.LoginPage .LoginPage__content .LoginPage__image{display:none}@media (min-width:1101px){.LoginPage .LoginPage__content .LoginPage__image{display:block}}.LoginPage .LoginPage__content .LoginPage__image .LoginPage_bg svg{height:100vh;width:89vh;position:absolute;top:0;right:0;path-width:89vh;path-width:34.8rem}.LoginPage .LoginPage__content .LoginPage__image img{height:100vh;position:absolute;right:6vw;top:0}@media (min-width:1101px){.VideosPage{display:grid;grid-template-rows:8vh 50vh 42vh;width:71vw}}@media (min-width:1101px){.VideoPage__playlist{display:flex;justify-content:center;width:92%;margin-top:4vh}}.SearchPage__empty{display:flex;width:100vw;justify-content:center;padding-top:5vh;padding-top:calc(var(--vh, 1vh)*5)}.SearchPage__empty svg{width:80vw;height:50vh;height:calc(var(--vh, 1vh)*50)}.Loader{height:100vh;width:100vw;background-color:#1b1f26;position:absolute;z-index:20;display:flex;overflow:hidden;justify-content:center}.Loader .overlay{margin-top:10vh;display:flex;flex-direction:column}.Loader .overlay .overlay__text{opacity:1;position:relative;z-index:30;display:none}.Loader .overlay .overlay__text svg{height:40vh;width:65vw}@media (min-width:1101px){.Loader .overlay .overlay__text svg{margin-top:5vh;height:20vh;width:27vw}}.Loader .overlay .overlay__text svg path{height:20vh;width:20vw}.Loader .overlay__animation{width:100vw;height:95vh;position:absolute;top:4vh;left:0}@media (min-width:1101px){.Loader .overlay__animation{top:10vh}}.Loader .overlay__animation svg{height:20vh;width:100vw}@media (min-width:1101px){.Loader .overlay__animation svg{height:20vh;width:100vw}}.Loader .overlay__animation svg path{height:30vh;width:50vw}@media (min-width:1101px){.Loader .overlay__animation svg path{height:30vh;width:50vw}}
/*# sourceMappingURL=main.425f7bd2.chunk.css.map */