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}html,body{background-color:#e3dcf3}.App{margin-top:50px;width:100vw}.Home{width:95%;margin:auto;display:flex;padding-top:60px;flex-direction:column;align-items:center;justify-content:center;transition:all .5s ease-in-out}.Home.with-playlist{justify-content:flex-start;padding:0 0 35px}html,body,#root{min-height:100vh!important;position:absolute;top:0;left:0}.About,.Faq,.Home{margin-top:70px;padding-bottom:40px}.Admin{min-height:100vh;width:100vw;display:flex;flex-direction:row;align-items:center;justify-content:center}.login-card{width:40%;min-width:300px;background-color:#e8e8e8;box-shadow:2px 2px 2px -1px #3e3769;padding:10px}.login-card>form{display:flex;flex-direction:column;align-items:center;justify-content:center}.login-card>form>input{margin:5px;width:80%;height:30px;border-radius:5px;border:1px solid darkslateblue;font-size:15px}.login-card>form>button{margin:5px;padding-bottom:33px;height:30px;border-radius:5px;border:1px solid darkslateblue}.error{color:red;font-family:Segoe UI,sans-serif;font-size:12px;margin:0}h1,h2,h3{font-family:Segoe UI,sans-serif;text-align:center;color:#483d8b}p{text-align:center;color:#483d8b;font-size:20px;font-family:Segoe UI,sans-serif;opacity:60%;white-space:pre-wrap}#root>footer{position:absolute;bottom:0;left:0}a{color:#483d8b;text-decoration:none;font-weight:700}.timer{height:80px;width:100%;align-items:center;justify-content:center;display:flex;flex-wrap:wrap}.field{height:80px;width:30%;max-width:170px;font-size:50px;text-align:center}.field:first-of-type{border-radius:40px 0 0 40px}.field:last-of-type{border-radius:0 40px 40px 0}.button-create{width:100%;align-items:center;justify-content:center;display:flex;flex-wrap:wrap}button{height:50px;width:200px;border-radius:50px;background-color:#483d8b;color:#fff;font-size:25px;font-family:Roboto,sans-serif;font-weight:700;cursor:pointer}button:hover{background-color:#9370db}.track-info{margin:10px;display:flex;background-color:#d3d3d3;min-height:100px;width:100%;max-width:800px;align-items:center;padding-left:10px;box-shadow:2px 2px 2px -1px #3e3769}label{width:100%;height:100%;display:flex;font-family:Roboto,sans-serif}.track-name{font-weight:700;font-size:20px;color:#483d8b}.artist-name,.track-length{opacity:70%}.labels{width:100%;margin-left:10px}img{width:80px;height:80px}.icono-play{width:30px;height:30px;right:0;margin-left:auto;margin-right:25px;cursor:pointer;color:#483d8b}.playlist-container{width:100%;display:block;align-items:center;justify-items:center}.playlist-info-container{display:flex;align-items:center}.playlist-info{opacity:100%;text-align:left;margin-left:10px;font-weight:700}.playlist{display:block;align-items:center;justify-items:center;width:100%}.button{background-color:#483d8b;color:#fff;font-family:Roboto,sans-serif;font-size:30px;box-shadow:2px 2px 2px 2px #3e3769;cursor:pointer;margin:2px;padding:1px 5px;width:80px;text-align:center;font-weight:400!important}.button:hover{background-color:#9370db}.save{font-size:1.5em;background-color:#daa520;width:60px;height:30px;margin-left:10px}.save:hover{background-color:gold}.navigation-bar{height:50px;width:100vw;margin:0;padding:0;align-items:center;justify-content:center;background-color:#483d8b;display:flex;position:fixed;top:0;z-index:1000}.logo-container{width:100%;display:flex;align-items:center;justify-content:left;margin-left:8%}.tstimer-logo{height:40px}.buttons{align-items:right;display:flex;margin-right:5%}.nav{text-decoration:none}.bm-burger-button{position:absolute;width:36px;height:30px;right:36px;top:10px}.bm-burger-bars{background:#373a47}.bm-cross-button{height:24px;width:24px;display:none}.bm-cross{background:#bdc3c7}.bm-menu{font-size:1.15em}.bm-morph-shape{fill:#333}.bm-item-list{position:absolute;color:#b8b7ad;padding:.8em;display:block;right:0;top:50px;background-color:#483d8bb3;width:150px}.bm-item-list a{text-decoration:none;margin-bottom:10px;color:#fff}.bm-overlay{display:none}.bm-menu,.bm-item-list,.bm-menu-wrap{height:fit-content!important;position:fixed!important}footer{width:100%;height:30px;padding:0;margin:0}footer>a,footer>p{font-size:15px!important;opacity:.5;text-decoration:none;margin:0;padding:0}.About p{width:80%;margin:auto;text-align:justify}.technologies{display:grid;grid-template-columns:auto auto auto;grid-template-rows:auto}@media (max-width:768px){.technologies{display:flex;flex-direction:column}}.tech{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.tech-icon{font-size:80px}.question-container{width:80%;position:relative;left:10%;background-color:#e8e8e8;box-shadow:2px 2px 2px 2px #9370db;margin-bottom:20px}.question{background-color:#483d8b;display:flex;align-items:center;justify-content:space-between;padding-right:20px}.question h2{color:#fff;flex-grow:1;text-align:left}.question-text,.answer-text{margin-left:20px}.answer-text{text-align:left;padding-bottom:20px}.fa-question-circle{font-size:30px;color:#fff;position:relative;right:0;margin-left:auto}.question:hover{cursor:pointer}.crud-icons{justify-self:end;margin-right:5px;margin-bottom:10px;font-size:20px;color:#483d8b99}.crud-icons>i:hover{color:#483d8b;cursor:pointer}.editor-btn{width:25px;height:25px;font-size:15px;border-radius:2px;align-items:center;justify-items:center;background-color:#e8e8e8;color:#483d8b;border:1px solid rgba(72,61,139,.6)}.edit-editor{border:1px solid darkslateblue;padding:10px;border-radius:5px;background-color:#f9f9f9;margin-bottom:10px}.edit-editor .ProseMirror{min-height:100px}.edit-editor .ProseMirror-focused{outline:none}.edit-editor .ProseMirror>p>a:hover{cursor:pointer}.edit-editor .ProseMirror strong{font-weight:700}.edit-editor .ProseMirror em{font-style:italic}.question-editor .ProseMirror>p{display:block;font-size:1.5em;margin-block-start:.1em;margin-block-end:.1em;margin-inline-start:0px;margin-inline-end:0px;font-weight:700;unicode-bidi:isolate;color:#483d8b99;opacity:1;margin-left:20px;font-family:Segoe UI,sans-serif;flex-grow:1;text-align:left}.question-editor{border:1px solid darkslateblue;border-radius:5px;background-color:#f9f9f9;margin-top:10px;margin-bottom:10px}.question-editor .ProseMirror-focused{outline:none}@media (max-width: 768px){.question-editor{width:230px}}@media (min-width: 769px){.question-editor{min-width:400px}}.dashboard-container{display:flex;flex-direction:column}.panel{background-color:#fff;width:20%;min-width:240px;height:100vh;position:fixed}.toggle-button{display:none;position:fixed;bottom:20px;right:20px;z-index:1000;background-color:var(--primary);color:var(--container);border:none;border-radius:50%;width:50px;height:50px;display:flex;justify-content:center;align-items:center;box-shadow:0 4px 8px #0003;cursor:pointer;transition:background-color .3s ease;font-size:30px}.toggle-button:hover{background-color:var(--primary-hover)}.panel{width:250px;transition:transform .3s ease-in-out}.panel.closed{transform:translate(-100%)}.panel.open{transform:translate(0)}.panel-title{display:flex;align-items:center;padding-top:10px;padding-left:10px}img{width:80px;padding-right:6px}.panel-btn{margin:15px;padding:10px;border-radius:10px;width:90%;border:0;cursor:pointer;background-color:#fff;display:flex;align-items:center;height:45px;color:#483d8b}.panel-btn.selected{opacity:1;background-color:#483d8b;color:#fff}.icon-btn{font-size:22px;margin-right:8px}.text-btn{font-size:15px;opacity:1}.article-content{padding:40px;flex:1;margin-left:20%}.card-create{width:30%;height:192px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;align-self:center;padding-bottom:10px;gap:6px;border-radius:6px}.shadow{border-radius:10px;box-shadow:0 4px 4px #97979740}.text-btn{font-size:15px;color:var(--text-primary)}.dashboard-container{width:100vw;display:flex;flex-direction:row}.header-container{background-color:#fff;padding:10px;display:flex;border-radius:10px;text-align:center}.section{background-color:#fff;height:100%;padding:10px;display:flex;flex-wrap:wrap;border-radius:10px;margin-bottom:20px;justify-content:space-between;align-items:center}.section>h1{width:150px}.row{display:flex;flex-wrap:wrap}.password{display:block}.form-button{border-radius:0;font-size:20px;width:80px;height:40px;align-self:end}.delete>div{display:block;align-items:center;justify-items:center}.delete>p{color:red}.users-button{border-radius:0;font-size:19px;max-width:50%;height:40px;align-self:end}.delete-btn{background-color:red;opacity:.5}.delete-btn:hover{background-color:red;opacity:1}.card{background-color:#fff;border-radius:10px;box-shadow:1px 1px 1px 1px #d5d5d580;width:fit-content}.users{margin-bottom:20px}.stats-numbers{display:flex;flex-direction:row;width:300px;height:150px;justify-content:center;align-items:center;margin-top:20px}.card-number{font-size:40px;margin:0}.card-icon-container{background-color:#e3dcf3;border-radius:100%;width:80px;height:80px}.card-icon{font-size:60px;color:#483d8b;position:relative;top:10px;left:9px}.labels{width:auto;color:#483d8b;display:flex;flex-direction:column;align-items:center;flex:1;padding:10px}.card-descriptor{display:block;width:50px}.statistics-first-row{margin-top:20px;width:100%;display:flex;flex-wrap:wrap;justify-content:space-between}.second-row{margin-top:20px;display:flex;flex-wrap:wrap;gap:50px}.form-group{display:flex;align-items:start;font-size:30px;flex-wrap:wrap}.form-group>input{margin:5px;height:30px;border-radius:5px;border:1px solid darkslateblue;font-size:15px}.error-field{font-size:12px;color:red;height:0;margin-block-start:0;margin-left:40px;position:absolute}.error-add{font-size:12px;color:red;height:0;margin-block-start:0;max-width:150px}.login-card>form>input{margin-bottom:20px}.error-field .error-login{position:relative!important;top:-20px}.users-map{margin-top:20px;display:flex;flex-wrap:wrap;justify-content:space-evenly}@media (max-width: 768px){.toggle-button{display:flex}.panel{position:fixed;top:0;left:0;height:100%;z-index:999}.article-content{margin-left:0}.section,.row{align-items:center;justify-content:center}.users-button{font-size:18px}.error-add{height:auto;margin-left:40px;text-align:start}}@media (min-width: 769px){.panel{transform:translate(0)}.toggle-button{display:none}}.dropdown{position:relative;display:inline-block}.dropdown-button{width:200px;background-color:#fff;padding:10px 20px;font-size:16px;border:none;cursor:pointer;border-radius:10px;text-align:left;display:flex;align-items:center;justify-content:space-between;box-shadow:1px 1px 1px 1px #d5d5d580}.dropdown-button .title{font-weight:700;color:#483d8b}.dropdown-button .selected-option{display:block;font-size:14px;margin-top:4px;color:#483d8b;opacity:.7}.dropdown-button .icon{margin-right:8px;color:#483d8b}.dropdown-button .arrow{margin-left:auto;color:#483d8b}.dropdown-content{display:none;position:absolute;background-color:#fff;min-width:150px;box-shadow:0 8px 16px #0003;z-index:1;border-radius:4px}.dropdown-content a{color:#483d8b;padding:12px 16px;text-decoration:none;display:block}.dropdown-content a:hover{background-color:#e3dcf3}.dropdown:hover .dropdown-content{display:block}.dropdown:hover .dropdown-button{background-color:#fff}.icon-container{width:30px;height:30px}.icon-dropdown{position:relative;font-size:25px;color:#483d8b}.labels-dropdown{margin-left:10px;padding-right:10px;color:#483d8b}.modal{display:block;position:fixed;z-index:1;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:#0006}.modal-content{background-color:#fefefe;margin:10% auto;padding:20px;border:1px solid #888;min-width:300px;width:30%;box-shadow:0 4px 8px #0003;animation-name:animateTop;animation-duration:.4s}@keyframes animateTop{0%{top:-300px;opacity:0}to{top:0;opacity:1}}.close{color:#aaa;float:right;font-size:28px;font-weight:700}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.modal-content button{border-radius:0;padding:10px 20px;margin:10px 0;border:none;cursor:pointer;width:100%;font-size:18px}.modal-content button:hover{opacity:.8}
