* {
    box-sizing:border-box;
    margin:0;
}

@font-face {
    font-family: 'Nunito';
    src: url('./../assets/fonts/Nunito-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body {
    font-family:Nunito;
    min-height:100vh;
    
}

.header {
    color:white;
    background-color:#313131;
    height:60px;
    width:100%;
    position:fixed;
    top:0;
    left:0;
    display:flex;
    justify-content:space-around;
    align-items:center;
    padding:10px;
}

.header__link {
    color:white;
    background-color:rgb(255, 66, 66);
    border-radius:15px;
    padding:8px 11px;
    text-align:center;
}

.user {
    font-size:1.2rem;
}


.user__bold {
    font-weight:bolder;
}

ul {
    list-style:none;
    padding:0;
}

a {
    color:inherit;
    text-decoration:none;
}

.subtitle {
    text-align:center;
}

/* CONTAINER */

.container {
    margin:0 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    max-width:900px;
    width:100%;
    margin-top:60px;
    padding: 60px 10px;
    display:flex;
    flex-wrap:wrap;
    gap:50px;
    justify-content:center;
}

.form {
    max-width:500px;
    width:100%;
    flex:1 1 300px;
    display:flex;
    flex-direction:column;
    gap:20px;
    border:1px solid grey;
    border-radius:10px;
    padding:30px;
    align-items:center;
}

.form div {
    width:100%;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    text-align:end;
}

.form div label {
    font-size:1.2rem;
}

.form div input, .form div select {
    width:100%;
    color:#313131;
    background-color:#d2d2d2;
    border-radius:15px;
    padding:15px;
    border: 1px solid rgba(0,0,0,0);
}

.form button {
    font-size:1.2rem;
    max-width:300px;
    padding:5px 10px;
    background-color:white;
    border:1px solid rgba(0,0,0,0);
    border-radius:10px;
    transition: all 0.2s;
}

.form button:hover {
    border-color: rgb(45, 45, 45);
}

.indicador__usuario {
    text-align:center;
    background-color: #d2d2d2;
    border-radius:15px;
    padding:13px;
}


/* TABLAS CONSULTA */

.resultados {
    max-width:500px;
    flex:1 1 200px;
    display:flex;
    flex-wrap:wrap;
    gap:50px;
}

.resultados__tabla {
    width:100%;
}

.resultados__tabla, th, td {
    text-align:start;
    border-collapse:collapse;
}

.resultados__tabla th, .resultados__tabla td {
    padding:10px;
    border-bottom:1px solid black;
}

.resultados__reps {
    text-align:center;
}