nav{background-color:#1a2533;display:flex;justify-content:space-between!important;align-items:center;height:10vh;width:100%;margin-right:0}nav .left-section{display:flex;align-items:center}nav .logo-container{width:5rem}nav .logo{max-width:100%;max-height:100%;width:100%;height:auto}nav .title{text-align:center;color:#cacaca;font-size:4vw;text-decoration:none}nav .right-section{display:flex;align-items:center}nav .burger-menu,nav .cross-menu{display:block;cursor:pointer;font-size:3vw;border:none;background:none;color:#cacaca;transition:transform .3s ease}nav ul{list-style-type:none;display:none;flex-direction:column;position:absolute;top:10vh;right:0;width:6rem!important;box-shadow:0 0 10px #00000080;opacity:0;transition:opacity .3s ease}nav li{margin:0 10px;text-align:center}nav li a,nav li button{text-decoration:none;color:#fff;font-weight:700;font-size:1.2rem}nav li a:hover,nav li button:hover{color:#cacaca}nav li .logout-button{padding:12px;background-color:#1a2533;color:red;cursor:pointer;font-size:18px;border:none;border-radius:5px;margin-top:20px;transition:background-color .3s}nav li .logout-button:hover{background-color:#090c11}nav ul.show-menu{display:flex;flex-direction:column;justify-content:space-around;align-items:center}nav .show-menu{display:flex;flex-direction:column;position:absolute;border-radius:5px 0 5px 5px;background-color:#1a2533;box-shadow:0 0 10px #00000080;z-index:1;opacity:1;height:60%;margin:0;padding:0;width:10rem!important}nav .burger-menu.open{transform:rotate(45deg)}nav .cross-menu.open{display:block;transform:rotate(45deg)}nav ul.show-menu{opacity:1}nav .burger-menu.open+ul.show-menu{opacity:1}@media screen and (max-width: 768px){nav .burger-menu{display:block}nav .cross-menu{display:none}nav ul{display:none;flex-direction:column;position:absolute;top:10vh;right:0;width:6rem!important;box-shadow:0 0 10px #00000080;opacity:0;transition:opacity .3s ease}nav .show-menu ul{display:flex}nav ul.show-menu{opacity:1}nav .burger-menu.open+ul.show-menu{opacity:1}}.home h1{display:flex;align-items:center;justify-content:center;color:#fff;background-color:#2c3e50;font-size:1.8rem;padding:1rem;margin:6rem 0;width:100%}.videos-home{background-color:#cacaca;display:flex;flex-direction:column}.videos-card-home{background-color:#4d5d75;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;border:1px solid;border-radius:5px;margin:1rem;max-width:100%;box-shadow:0 12px 24px #1a2533}.videos-card-home img{border-radius:5px;margin-bottom:.5rem}.videos-card-home div{background-color:#2c3e50;display:flex;flex-direction:column;align-items:center;border:1px solid;border-radius:5px;padding:1rem;margin:.5rem;width:100%}.videos-card-home div p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.videos-card-home .active,.videos-card-home .inactive{width:20%;height:15rem}@media screen and (max-width: 961px){.videos-card-home .active:nth-of-type(1),.videos-card-home .inactive:nth-of-type(1){display:none}}@media screen and (max-width: 450px){.videos-card-home .active:nth-of-type(3),.videos-card-home .inactive:nth-of-type(3){display:none}}.carousel{background:#1a2533;height:100%;color:#cacaca;padding:.5rem 1rem;cursor:pointer;border-radius:5px;transition:background-color .3s ease,color .3s ease}.carousel:hover{background:#cacaca;color:#1a2533}.carousel.prev:before{content:"\\2190";margin-right:.5rem}.carousel.next:before{content:"\\2192";margin-left:.5rem}.partners-ctn{display:flex;flex-direction:column;align-items:center;justify-content:center;flex-wrap:wrap;background-color:#cacaca;padding:auto}.partners-ctn .section3-home{background-color:#2c3e50;display:flex;justify-content:space-between;border-radius:5px 5px 0 0;width:100%;margin:5rem 0 0}.partners-ctn .section3-home .article-ctn{display:flex;width:100%}.partners-ctn .section3-home .article-ctn article{background-color:#1a2533;border:1px solid;border-radius:5px;height:auto;margin:.5rem;width:100%}.partners-ctn .section3-home .article-ctn article h2{text-align:center}.partners-ctn .section3-home .article-ctn article div{text-align:center;padding:1rem}.partners-ctn .section3-home .article-ctn article div img{max-width:100%;height:.5%;border-radius:5px}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;background-color:#cacaca;overflow-x:hidden;width:100%}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}h1{color:#cacaca;font-size:1.5rem;margin:1rem}h2,h3,label,p{color:#fff}.container-dashboard{display:flex;padding:20px;justify-content:center;box-sizing:border-box;height:100vh;overflow:hidden}.container-dashboard h1{text-align:center;margin-bottom:20px}.container-dashboard .container-add-video,.container-dashboard .container-add-playlist{background-color:#2c3e50;border-radius:5px;padding:20px;width:45%;margin:20px;box-shadow:0 12px 24px #1a2533;height:80vh}.add-video-form{display:flex;flex-direction:column;align-items:center;justify-content:center}.add-video-form ul{list-style:none;padding:0;display:flex;flex-direction:column;align-items:center}.add-video-form ul li{margin:.2rem;width:100%;background-color:#4d5d75;border-radius:5px}.add-video-form ul li label{display:flex;flex-direction:column;justify-content:center;width:80%;margin:auto}.add-video-form ul li label span{font-size:14px;color:#555;margin-bottom:5px}.add-video-form ul li input,.add-video-form ul li select{width:100%;padding:10px;box-sizing:border-box;margin-bottom:8px;font-size:16px;border:1px solid #ccc;border-radius:5px}.add-video-form ul li input[type=checkbox]{margin-top:5px}.add-video-form ul li button{width:100%;max-width:100%;background-color:#3498db;border:1px solid white;color:#fff;padding:15px;cursor:pointer;font-size:18px;border-radius:5px;transition:background-color .3s ease}.add-video-form ul li button:hover{background-color:#2980b9}.add-playlist-form{display:flex;flex-direction:column;align-items:center;padding:2rem}.add-playlist-form ul{list-style:none;display:flex;flex-direction:column;align-items:center}.add-playlist-form ul li{margin:1rem;width:80%}.add-playlist-form ul li label{display:flex;flex-direction:column;justify-content:center;width:100%}.add-playlist-form ul li label span{font-size:14px;margin-bottom:5px}.add-playlist-form ul li input,.add-playlist-form ul li select{width:100%;padding:10px;box-sizing:border-box;margin-bottom:8px;font-size:16px;border:1px solid #ccc;border-radius:5px}.add-playlist-form ul li input[type=checkbox]{margin-top:5px}.add-playlist-form ul li button{width:100%;max-width:100%;background-color:#3498db;color:#fff;padding:15px;cursor:pointer;font-size:18px;border-radius:5px;transition:background-color .3s ease}.add-playlist-form ul li button:hover{background-color:#2980b9}.video-preview{margin-top:20px}.video-preview .videos-card{background-color:#4d5d75;border-radius:5px;padding:15px;display:flex;flex-direction:column;align-items:center}.video-preview .videos-card h3{margin-bottom:10px}.video-preview .videos-card a{text-decoration:none;color:#3498db}.video-preview .videos-card a img,.video-preview .videos-card p{margin-top:10px}.videos{display:flex;flex-direction:column;align-items:center;padding:20px;min-height:100vh;box-sizing:border-box;overflow-y:auto}.videos h1{text-align:center;margin-bottom:20px;color:#000}.videos .videos-card{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;align-items:stretch}.videos .videos-card div{background-color:#4d5d75;border-radius:5px;padding:20px;display:flex;flex-direction:column;align-items:center}.videos .videos-card div h3{margin-bottom:10px}.videos .videos-card div a{text-decoration:none;color:#3498db}.videos .videos-card div a img{margin-top:10px}.videos .videos-card div p{margin-top:10px;flex-grow:1}.videos .videos-card div button{background-color:#e74c3c;color:#fff;border:none;border-radius:5px;padding:8px;cursor:pointer;transition:background-color .3s ease}.videos .videos-card div button:hover{background-color:#c0392b}.playlist-container{display:flex;flex-direction:column;align-items:center;padding:20px;min-height:100vh;box-sizing:border-box;overflow-y:auto}.container-add-playlist{background-color:#2c3e50;border-radius:5px;padding:20px;max-width:800px;margin:20px auto;box-shadow:0 12px 24px #1a2533}.container-add-playlist h2{text-align:center}.container-add-playlist form{text-align:center;margin-top:20px}.container-add-playlist form ul{list-style:none;padding:0;display:flex;flex-direction:column;align-items:center}.container-add-playlist form ul li{margin-bottom:15px;width:80%}.container-add-playlist form ul li label{display:flex;flex-direction:column;width:100%}.container-add-playlist form ul li input{width:100%;padding:10px;box-sizing:border-box;margin-bottom:8px;font-size:16px;border:1px solid #ccc;border-radius:5px}.container-add-playlist form ul li input[type=submit]{width:100%;max-width:100%;background-color:#3498db;color:#fff;padding:15px;cursor:pointer;font-size:18px;border-radius:5px;transition:background-color .3s ease}.container-add-playlist form ul li input[type=submit]:hover{background-color:#2980b9}.container-add-playlist ul{list-style:none;padding:0}.container-add-playlist ul li{background-color:#4d5d75;border-radius:5px;padding:15px;display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.container-add-playlist ul li button{background-color:#dc3545;color:#fff;border:none;padding:8px;cursor:pointer;border-radius:4px}.container-add-playlist ul li button:hover{background-color:#c82333}.playlist-list-container{background-color:#2c3e50;padding:15px;border-radius:5px}.playlist-list-container h2{text-align:center}.playlist-list-container ul{list-style:none;padding:15px}.playlist-list-container ul li{background-color:#4d5d75;border-radius:5px;padding:15px;display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;color:#fff}.playlist-list-container ul li button{background-color:#dc3545;color:#fff;border:none;padding:8px;cursor:pointer;border-radius:5px}.playlist-list-container ul li button:hover{background-color:#c82333}table{width:100%;border-collapse:collapse;margin-top:20px;overflow:hidden}table th,table td{border:1px solid #ddd;padding:15px;text-align:center;background-color:#4d5d75;border-radius:5px}table th{background-color:#2c3e50;color:#fff}table td button{background-color:#dc3545;color:#fff;border:none;padding:8px;cursor:pointer;border-radius:5px}table td button:hover{background-color:#c82333}.List-users{margin:20px;padding:20px;border:1px solid #ccc;border-radius:8px;background-color:#2c3e50}.List-users h2{font-size:24px;text-align:center;margin-top:auto}.List-users .filter-users{display:flex;justify-content:center;align-items:center;width:99%;padding:8px;margin-bottom:15px;border:1px solid #ccc;border-radius:5px;text-align:center}.List-users .title-users{display:grid;grid-template-columns:repeat(9,1fr);font-weight:700;background-color:#4d5d75;padding:10px;border-radius:5px;margin-bottom:15px}.List-users .title-users h3{text-align:center}.List-users .body-users{display:grid;grid-template-columns:repeat(9,1fr);border-top:1px solid #ccc;padding:10px}.List-users .body-users p{text-align:center}.List-users .body-users button{background-color:#dc3545;color:#fff;border:none;padding:8px;cursor:pointer;border-radius:5px}.List-users .body-users button:hover{background-color:#c82333}.Playlists h2{text-align:center;margin-bottom:20px}.Playlists .filter-dropdown label{display:flex;flex-direction:column;justify-content:center;align-items:center;color:#000;margin-bottom:10px}.Playlists .filter-dropdown select{padding:8px;font-size:16px;border:1px solid #ccc;border-radius:5px;background-color:#4d5d75;cursor:pointer;width:100%;max-width:400px;text-align:center;display:block;margin:0 auto}.Playlists .videos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;list-style:none;padding:0}.Playlists .videos-grid .video-item{background-color:#4d5d75;border-radius:5px;padding:15px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center}.Playlists .videos-grid .video-item img{margin-top:10px;margin-bottom:10px}.popup-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center}.popup{background:white;padding:20px;border-radius:8px;box-shadow:0 0 10px #0000004d;text-align:center}.popup p{margin-bottom:20px;color:#000}.popup button{padding:10px 20px;background-color:#3498db;color:#fff;border:none;border-radius:4px;cursor:pointer}.auth-form{display:flex;flex-direction:column;align-items:center;background-color:#2c3e50;max-width:400px;margin:8rem auto!important;padding:30px;border-radius:5px;box-shadow:0 12px 24px #1a2533}.auth-form h2{text-align:center;margin-bottom:20px}.auth-form .form-container{display:flex;flex-direction:column}.auth-form .form-container label{margin-bottom:10px;font-size:16px;display:flex;flex-direction:column}.auth-form .form-container label input{padding:10px;font-size:16px}.auth-form .form-container button{padding:12px;background-color:#1a2533;color:#fff;cursor:pointer;font-size:18px;border:none;border-radius:4px;margin-top:20px;transition:background-color .3s}.auth-form .form-container button:hover{background-color:#090c11}.auth-form .form-container .error-message{border:1px solid red;margin-top:5px;padding:5px;border-radius:4px;color:red}.auth-form .signup-link,.auth-form .forgot-password-link{color:#07c;text-decoration:none}.page-container{display:flex;flex-direction:column}.page-container .auth-form{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;margin-top:30px!important}.page-container .auth-form h2{text-align:center}.page-container .auth-form .form-container{display:flex;flex-direction:column;align-items:center}.page-container .auth-form .form-container label{font-size:16px;display:flex;flex-direction:column}.page-container .auth-form .form-container label input{width:20rem;padding:10px;font-size:16px;border-radius:5px}.page-container .auth-form .form-container label input.error-input{border-color:red}.page-container .auth-form .form-container button{padding:12px;background-color:#1a2533;color:#fff;cursor:pointer;font-size:18px;border:none;border-radius:4px;margin-top:20px;transition:background-color .3s}.page-container .auth-form .form-container button:hover{background-color:#090c11}.page-container .auth-form .form-container .error-message{border:1px solid red;margin-top:5px;padding:5px;border-radius:4px;color:red}.page-container .login-link{color:#07c;text-decoration:none}.big-setting-container{background-color:#cacaca;width:100vw}.settings-container{display:flex;flex-direction:column;background-color:#2c3e50;max-width:800px;margin:4rem auto!important;padding:30px;border-radius:5px;box-shadow:0 12px 24px #1a2533}.settings-container h2{text-align:center;margin-bottom:20px}.settings-container .settings-list-container{display:flex;flex-direction:column}.settings-container .settings-list-container label{margin-bottom:10px;font-size:16px;display:flex;flex-direction:column;text-align:center}.settings-container .settings-list-container label input{padding:10px;font-size:16px}.settings-container .settings-list-container button{padding:12px;background-color:#1a2533;color:#fff;cursor:pointer;font-size:18px;border:none;border-radius:4px;margin-top:20px;transition:background-color .3s}.settings-container .settings-list-container button:hover{background-color:#090c11}.settings-container .settings-list-container .delete-button{background-color:#dc3545;margin-top:10px}.settings-container .settings-list-container .delete-button:hover{background-color:#c82333!important}.settings-container .error-input,.settings-container .error-message{border:1px solid red;margin-top:5px;padding:5px;border-radius:4px;color:red}.settings-container .success-message{margin-top:10px;color:#0f0}.back-to-top-button{display:flex;justify-content:center;position:fixed;top:20px;right:20px;background-color:#0000008c;color:#fff;font-size:2rem;border:none;border-radius:50%;padding:15px;cursor:pointer;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}.back-to-top-button:hover{background-color:#39393aa9}.back-to-top-button.visible{opacity:1;visibility:visible}