:root{--layout-border: 3px solid rgb(88, 88, 88);--border-radius: 5px;--font-size: 18px;--font-size-titles: 25px;--principal-color: rgb(72, 126, 165);--ligth-color: rgb(177, 210, 234);--bg-screen: rgb(33, 33, 33) }*{box-sizing:border-box;margin:0;padding:0}html{height:100%;max-width:100vw}body{background-color:var(--bg-screen);color:#fff;display:flex;flex-direction:column;min-height:100vh;padding:10px;width:100%;font-family:Merriweather,serif}header{align-items:center;background-position:center;border-radius:var(--border-radius);border:var(--layout-border);display:flex;flex-direction:column;height:100px;justify-content:center;padding:100px;text-align:center;width:100%}header h1{color:var(--principal-color);font-size:70px}.subtitle{font-weight:200;font-size:var(--font-size-titles);margin:20px}.navBar{width:100%}.navBar ul{width:100%;display:flex;justify-content:center;list-style:none}.navBar li{margin-left:20px}.navBar-link{color:#fff;text-decoration:none;font-size:var(--font-size)}.navBar-link:hover{color:var(--principal-color)}main{align-items:center;border-radius:var(--border-radius);border:var(--layout-border);display:flex;flex-direction:column;flex:1;height:100%;justify-content:center;margin-top:5px}.instructions{list-style:inside;margin-top:5px;padding:10px}.instructions li{color:var(--ligth-color);letter-spacing:1px;margin:2px}.dropzone{align-items:center;border-radius:3px;border:5px double white;cursor:pointer;display:flex;flex-direction:column;height:250px;justify-content:center;padding:10px;width:35%}.dropzone p{color:var(--principal-color);font-size:var(--font-size)}.without-files{color:var(--principal-color);display:flex;font-size:var(--font-size-titles);justify-content:center;width:100%}.main-Files{justify-content:start;align-items:start;padding:10px}.allFiles{width:100%}.ulFiles{width:100%;display:grid;padding:10px;gap:10px;grid-template-columns:repeat(4,1fr)}.li-file{border:1px solid;border-color:var(--layout-border);padding:30px 6px;border-radius:3px;list-style:none;display:flex;flex-direction:column}.li-file p{text-align:center}.li-file input{width:50%;margin:auto;padding:5px;border-radius:3px;outline:none;border:none;text-align:center;font-size:14px}footer{font-size:12px;text-align:center;margin:5px}.li-file form,#container form{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:12px;width:100%}#container form{margin-top:20px}#container form input[data-js=password]{width:35%;padding:8px 12px;border-radius:var(--border-radius);border:2px solid var(--principal-color);background-color:var(--bg-screen);color:#fff;font-size:var(--font-size);text-align:center;outline:none;font-family:Merriweather,serif}#container form input[data-js=password]:focus{border-color:var(--ligth-color)}.passIntroductions{list-style:none;display:flex;flex-direction:column;align-items:center;gap:4px}.passIntroductions li{color:var(--ligth-color);font-size:12px;letter-spacing:.5px}[data-js=btn-submit]{background-color:var(--principal-color);border-radius:var(--border-radius);border:none;color:#fff;cursor:pointer;font-family:Merriweather,serif;font-size:14px;padding:8px 20px;transition:background-color .2s}[data-js=btn-submit]:hover:not(:disabled){background-color:var(--ligth-color);color:var(--bg-screen)}[data-js=btn-submit]:disabled{opacity:.4;cursor:not-allowed}@keyframes slideIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}