* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Roboto Condensed', sans-serif;
}

html {
    font-size: 1vw;
}

a {
    text-decoration: none;
}

.fecha {
    border-radius: .5rem;
    outline: none;
    padding: .2rem;
    font-size: 1rem;
}

.texto {
    border-radius: .5rem;
    outline: none;
    padding: .5rem;
    font-size: 1rem;
}

.seleccion {
    border-radius: .5rem;
    padding: .5rem;
    font-size: 1rem;
}

.boton {
    border-radius: .5rem;
    padding: .5rem 1rem;
    cursor: pointer;
    font-size: 1rem;
    background: #eeeeee;
    border: .15rem solid #000000;
    color: #000000;
    box-shadow: 0 0 .5rem #000000;
    transition: all .5s;
}

.boton:hover {
    box-shadow: 0 0 .5rem #999999;
    color: #999999;
}

.boton_select {
    border-radius: .5rem;
    padding: .5rem 1rem;
    cursor: pointer;
    font-size: 1rem;
    background: #444444;
    color: #ffffff;
    box-shadow: 0 0 .5rem #000000;
    transition: all .5s;
}

.boton_eliminar {
    border-radius: .5rem;
    padding: .5rem 1rem;
    cursor: pointer;
    font-size: 1rem;
    background: #771111;
    color: #ffffff;
    border: .15rem solid #000000;
    box-shadow: 0 0 .5rem #000000;
    transition: all .5s;
}

.boton_eliminar:hover {
    box-shadow: 0 0 .5rem #999999;
    background: #973636;
    color: #999999;
}

.boton_validar {
    border-radius: .5rem;
    padding: .5rem 1rem;
    cursor: pointer;
    font-size: 1rem;
    background: #009900;
    color: #000000;
    border: .15rem solid #000000;
    box-shadow: 0 0 .5rem #000000;
    transition: all .5s;
}

.boton_validar:hover {
    box-shadow: 0 0 .5rem #999999;
    background: #2d852d;
    color: #ffffff;
}

.boton_invalidar {
    border-radius: .5rem;
    padding: .5rem 1rem;
    cursor: pointer;
    font-size: 1rem;
    background: #d6c800;
    border: .15rem solid #000000;
    box-shadow: 0 0 .5rem #000000;
    transition: all .5s;
}

.boton_invalidar:hover {
    box-shadow: 0 0 .5rem #999999;
    background: #f0e767;
    color: #000000;
}

.boton_print {
    border-radius: .5rem;
    padding: .5rem 1rem;
    cursor: pointer;
    font-size: 1rem;
    background: #99748e;
    border: .15rem solid #000000;
    color: #ffffff;
    box-shadow: 0 0 .5rem #000000;
    transition: all .5s;
}

.boton_print:hover {
    box-shadow: 0 0 .5rem #999999;
    background: #9b8996;
    color: #000000;
}

.container {
    width: 90%;
    margin: 2rem auto;
}

/* Rules for sizing the icon. */

.material-icons-two-tone.md-18 {
    font-size: 1rem;
}

.material-icons-two-tone.md-20 {
    font-size: 1.5rem;
}

.material-icons-two-tone.md-24 {
    font-size: 2rem;
}

/* HEADER DESKTOP */

.desk_header {
    margin: 1rem auto;
    width: 90%;
    display: flex;
    justify-content: center;
    font-size: 1.5rem;
}

.desk_header-left {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.desk_header-nuevahora {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #000000;
    transition: all .5s;
}

.desk_header-nuevahora:hover {
    color: #999999;
}

.desk_header-nuevacomp {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #000000;
    transition: all .5s;
}

.desk_header-nuevacomp:hover {
    color: #999999;
}

.desk_header-calendar {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #000000;
    transition: all .5s;
}

.desk_header-calendar:hover {
    color: #999999;
}

.desk_header-middle {
    box-shadow: 0 0 1rem #000055;
    border-radius: 50%;
    padding: 1rem 2rem;
    transition: all .5s;
}

.desk_header-middle:hover {
    box-shadow: 0 0 1rem #00005555;
}

.desk_header-middle img {
    height: 4rem;
}

.desk_header-right {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.desk_header-totales {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #000000;
    transition: all .5s;
}

.desk_header-totales:hover {
    color: #999999;
}

.desk_header-nuevouser {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #000000;
    transition: all .5s;
}

.desk_header-nuevouser:hover {
    color: #999999;
}

.desk_header-trabajador {
    font-size: 1rem;
    color: #555555;
}

.desk_header-user {
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: all .5s;
    color: #000000;
}

.desk_header-user:hover {
    color: #999999;
}

/* HEADER MOVIL */

.mov_header {
    display: none;
    position: fixed;
    top: 0;
    width: 100%;
    height: 14rem;
    background: radial-gradient(#ffffff, #071697);
    border-radius: 45%;
    box-shadow: 0 0 2rem #000000;
}

.mov_header h1 {
    text-align: center;
    font-size: 5rem;
    text-shadow: 0 0 .5rem #ffffff;
}

.mov_header img {
    height: 10rem;
}

/* CALENDARIO */

.calendario_trabajadores {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.calendario_trabajadores button {
    margin: 1rem;
}

.calendario {
    width: 100%;
    margin: 2rem auto;
}

.calendario h1 {
    text-align: center;
}

.calendario ul {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    list-style: none;
    margin: 3rem auto 1rem;
    padding: 0 1rem;
}

.calendario ul li {
    margin: auto;
}

.calendario ol {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    list-style: none;
    margin: 0 auto 3rem;
    width: 98%;
}

.calendario ol li {
    border: .1rem solid #000000;
    margin: .1rem auto;
    border-radius: .3rem;
    min-height: 7rem;
    width: 98%;
    box-shadow: 0 0 1rem #000000;
    transition: all .5s;
}

.calendario ol li:hover {
    box-shadow: 0 0 1rem #999999;
    width: 97%;
    height: 6.8;
}

.calendario_link {
    background: transparent;
    border: none;
    min-height: 7rem;
    width: 100%;
    padding: .3rem;
    display: flex;
    flex-direction: column;
    transition: all .3s;
    font-size: 1rem;
    cursor: pointer;
    color: #000000;
}

.calendario_link:hover {
    height: 6.8;
    color: #999999;
    transition: all .5s;
}

.calendario_nombrelink {
    font-size: .7rem;
}

.calendario_horas {
    text-decoration: none;
    color: #000000;
    border-radius: .5rem;
    padding: .2rem .5rem;
    margin-top: .3rem;
    transition: all .5s;
}

.calendario_horas-tipo1 {
    background: #f3eb80;
}

.calendario_horas-tipo2 {
    background: #fc8787;
}

.calendario_horas-tipo3 {
    background: #7880e7;
}

.calendario_horas-anteriores {
    background: #666666;
}

.calendario_horas:hover {
    color: #000000;
}

.calendario_horas-tipo1:hover {
    background: #bbb23355;
}

.calendario_horas-tipo2:hover {
    background: #bb333355;
}

.calendario_horas-tipo3:hover {
    background: #333cbb55;
}

.calendario_horas-anteriores:hover {
    background: #66666655;
}

.calendario_horas-validada {
    border: .1rem solid #000000;
}

.calendario_compensar {
    text-decoration: none;
    background: #33aa33;
    color: #ffffff;
    border-radius: .5rem;
    padding: .2rem .5rem;
    margin-top: .3rem;
    transition: all .5s;
}

.calendario_compensar:hover {
    background: #33aa3355;
    color: #000000;
}

.meses {
    display: flex;
    justify-content: space-evenly;
}

.calendario_totales {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.total_mes {
    width: 20rem;
    border: .1rem solid #000000;
    border-radius: 1rem;
    padding: .5rem;
    box-shadow: 0 0 1rem #000000;
    margin-bottom: 2rem;
}

.total_mes caption {
    margin-bottom: 1rem;
}

.total_mes h3 {
    text-align: center;
}

.print_container {
    width: 90%;
    margin: auto;
    display: none;
}

.print_calendario {
    min-width: 25%;
    margin: auto;
    border: .2rem solid black;
    border-collapse: collapse;
}

.print_calendario td, th {
    padding: .5rem 1rem;
    border: .1rem solid black;
    text-align: center;
}

.print_horas-1 {
    background: #f3eb80;
    color: #000000;
}

.print_horas-2 {
    background: #fc8787;
    color: #000000;
}

.print_horas-3 {
    background: #7880e7;
    color: #000000;
}

.print_comp {
    background: #8df18d;
    color: #000000;
}

.print_total {
    width: 100%;
}

.print_total-header {
    width: 100%;
    text-align: center;
}

.print_total-body {
    border-bottom: .1rem solid #000000;
}

.print_total-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: .2rem solid #000000;
}

.print_total-diariodia {
    text-align: center;
    width: 10rem;
}

.print_total-menutrabajador {
    width: 100%;
    display: grid;
    grid-template-columns: 4fr 1fr;
    text-align: center;
    border-left: .2rem solid #000000;
}

.print_total-menutrabajador h3 {
    grid-column: 1 / 3;
    border-bottom: .1rem solid #000000;
    padding: .2rem .3rem;
}

.print_total-menutrabajador-evento {
    border-right: .1rem solid #000000;
}

.print_total-menutrabajador h4 {
    padding: .2rem .3rem;
}

.print_total-diario {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 2rem;
    border-style: solid;
    border-color: #000000;
    border-width: .1rem .2rem;
}

.print_total-diariotrabajador {
    width: 100%;
    height: 2rem;
    display: grid;
    grid-template-columns: 4fr 1fr;
    text-align: center;
    align-content: center;
    border-style: solid;
    border-color: #000000;
    border-width: 0 0 0 .2rem;
}

.print_total-diariotrabajador p {
    height: 1.8rem;
    line-height: 1.8rem;
}

.print_total-diariotrabajador-evento {
    border-style: solid;
    border-color: #000000;
    border-width: 0 .1rem 0 0;
}

.print_total-totales {
    margin: 2rem auto;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.print_total-totales-empty {
    width: 11rem;
}

.print_total-totales-trabajador {
    width: 100%;
    display: grid;
    grid-template-columns: 4fr 1fr;
    justify-items: center;
}

.print_total-mes {
    width: 20rem;
    border: .1rem solid #000000;
    border-radius: 1rem;
    padding: .5rem;
    box-shadow: 0 0 1rem #000000;
    margin: 3rem auto 0;
}

.print_total-mes caption {
    margin-bottom: 1rem;
}

.print_total-mes h3 {
    text-align: center;
}

/* LOGIN */

.login {
    width: 15rem;
    border: .1rem solid black;
    border-radius: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 5rem auto;
    padding: 2rem;
    box-shadow: 0 0 1rem #000000;
}

.login i {
    font-size: 10rem;
}

.login input {
    margin-top: 1rem;
    padding: .5rem;
    text-align: center;
    font-size: 1rem;
    border-radius: .5rem;
    outline: none;
}

.login button {
    margin-top: 2rem;
    padding: .5rem 1rem;
    font-size: 1rem;
    border-radius: .5rem;
}

/* NUEVA HORA */

.nueva_hora {
    width: 50%;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr .5fr 1fr .5fr 1fr 1fr;
    box-shadow: 0 0 1rem #000000;
    border-radius: 1rem;
    padding: 1rem;
}

.nueva_hora-encargado {
    grid-template-rows: 1fr .5fr 1fr .5fr 1fr .5fr 1fr 1fr;
}

.nueva_hora-encargado-usuario {
    grid-column: 1 / 3;
}

.nueva_hora-titulo {
    grid-column: 1 / 3;
}

.nueva_hora * {
    text-align: center;
    margin: 1rem;
}

.nueva_hora button {
    margin: auto;
    grid-column: 1 / 3;
    width: 50%;
}

.nueva_hora-option {
    display: flex;
    justify-content: space-evenly;
    margin: 2rem;
}

/* EDITAR HORA */

.edit_hora {
    width: 50%;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr .5fr 1fr .5fr 1fr 1fr;
    box-shadow: 0 0 1rem #000000;
    border-radius: 1rem;
    padding: 1rem;
}

.edit_hora-titulo {
    grid-column: 1 / 3;
}

.edit_hora * {
    text-align: center;
    margin: 1rem;
}

.edit_hora button {
    margin: auto;
    grid-column: 1 / 3;
    width: 50%;
}

.edit_hora-option {
    display: flex;
    justify-content: space-evenly;
    margin: 2rem;
}

/* NUEVA COMPENSACION */

.nueva_comp {
    width: 50%;
    margin: 0 auto 4rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr .5fr 1fr 1fr;
    box-shadow: 0 0 1rem #000000;
    border-radius: 1rem;
    padding: 1rem;
}

.nueva_comp-encargado {
    grid-template-rows: 1fr .5fr 1fr .5fr 1fr 1fr;
}

.nueva_comp-encargado-usuario {
    grid-column: 1 / 3;
}

.nueva_comp * {
    text-align: center;
    margin: 1rem;
}

.nueva_comp-titulo {
    grid-column: 1 / 3;
}

.nueva_comp button {
    margin: auto;
    grid-column: 1 / 3;
    width: 50%;
}

.nueva_comp-option {
    display: flex;
    justify-content: space-evenly;
    margin: 2rem;
}

/* EDITAR COMPENSACION */

.edit_comp {
    width: 50%;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr .5fr 1fr 1fr;
    box-shadow: 0 0 1rem #000000;
    border-radius: 1rem;
    padding: 1rem;
}

.edit_comp * {
    text-align: center;
    margin: 1rem;
}

.edit_comp-titulo {
    grid-column: 1 / 3;
}

.edit_comp button {
    margin: auto;
    grid-column: 1 / 3;
    width: 50%;
}

.edit_comp-option {
    display: flex;
    justify-content: space-evenly;
    margin: 2rem;
}

/* USUARIOS */

.usuario_salir-trabajador {
    width: 100%;
    margin: auto;
}

.usuario_empresa {
    display: flex;
    flex-direction: column;
}

.usuario_empresa a {
    color: #000000;
}

.usuario_sede {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: flex-start;
}

.usuario_sede2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 1rem;
    box-shadow: 0 0 1rem #000000;
    padding: 1rem;
    margin: 1rem;
}

.usuario_dpto {
    display: flex;
    flex-direction: row;
}

.usuario_departamento {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 1rem;
}

.usuario_departamento h3 {
    margin-bottom: 1rem;
}

.usuario_usuario {
    display: flex;
    flex-direction: column;
}

.usuario_usuario a {
    border: .1rem solid #000000;
    border-radius: .5rem;
    color: #000000;
    padding: .2rem .5rem;
    margin: .1rem;
    box-shadow: 0 0 .05rem #000000;
    transition: all .5s;
}

.usuario_usuario a:hover {
    box-shadow: 0 0 .05rem #999999;
    color: #999999;
}

.usuario_encargado {
    background: #cccccc;
}

.nuevo {
    background: linear-gradient(to bottom, #ffffff, #337733);
}

/* NUEVO USUARIO */

.nuevo_usuario {
    width: 50%;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr .5fr 1fr .5fr 1fr .5fr 1fr .5fr 1fr 1fr;
    box-shadow: 0 0 1rem #000000;
    border-radius: 1rem;
    padding: 1rem;
}

.nuevo_usuario-titulo {
    grid-column: 1 / 3;
}

.nuevo_usuario * {
    text-align: center;
    margin: 1rem;
}

.nuevo_usuario-encargado {
    margin: auto;
}

.nuevo_usuario button {
    margin: auto;
    grid-column: 1 / 3;
    width: 50%;
}

.nuevo_usuario-option {
    display: flex;
    justify-content: space-evenly;
    margin: 2rem;
}

/* EDIT USUARIO */

.edit_usuario {
    width: 50%;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr .5fr 1fr .5fr 1fr .5fr 1fr 1fr;
    box-shadow: 0 0 1rem #000000;
    border-radius: 1rem;
    padding: 1rem;
}

.edit_usuario-titulo {
    grid-column: 1 / 3;
}

.edit_usuario * {
    text-align: center;
    margin: 1rem;
}

.edit_usuario button {
    margin: auto;
    grid-column: 1 / 3;
    width: 50%;
}

.edit_usuario-option {
    display: flex;
    justify-content: space-evenly;
    margin: 2rem;
}

/* NUEVO DPTO */

.nuevo_dpto {
    width: 50%;
    margin: 0 auto 4rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr .5fr 1fr 1fr;
    box-shadow: 0 0 1rem #000000;
    border-radius: 1rem;
    padding: 1rem;
}

.nuevo_dpto * {
    text-align: center;
    margin: 1rem;
}

.nuevo_dpto-titulo {
    grid-column: 1 / 3;
}

.nuevo_dpto button {
    margin: auto;
    grid-column: 1 / 3;
    width: 50%;
}

.nuevo_dpto-option {
    display: flex;
    justify-content: space-evenly;
    margin: 2rem;
}

/* NUEVA SEDE */

.nueva_sede {
    width: 50%;
    margin: 0 auto 4rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr .5fr 1fr 1fr;
    box-shadow: 0 0 1rem #000000;
    border-radius: 1rem;
    padding: 1rem;
}

.nueva_sede * {
    text-align: center;
    margin: 1rem;
}

.nueva_sede-titulo {
    grid-column: 1 / 3;
}

.nueva_sede button {
    margin: auto;
    grid-column: 1 / 3;
    width: 50%;
}

.nueva_sede-option {
    display: flex;
    justify-content: space-evenly;
    margin: 2rem;
}

/* NUEVA EMPRESA */

.nueva_empresa {
    width: 50%;
    margin: 0 auto 4rem;
    display: grid;
    grid-template-rows: 1fr .5fr 1fr 1fr;
    box-shadow: 0 0 1rem #000000;
    border-radius: 1rem;
    padding: 1rem;
}

.nueva_empresa * {
    text-align: center;
    margin: 1rem;
}

.nueva_empresa button {
    margin: auto;
    width: 50%;
}

.nueva_empresa-option {
    display: flex;
    justify-content: space-evenly;
    margin: 2rem;
}

.usuarios_nueva-empresa {
    color: #000000;
}

/* TOTALES */

.totales {
    width: 50%;
    border: .1rem solid #000000;
    border-radius: 1rem;
    padding: .5rem;
    box-shadow: 0 0 1rem #000000;
    margin: 2rem auto 2rem;
    font-size: 1.5rem;
}

.totales caption {
    margin-bottom: 1rem;
}

.totales th {
    border: none;
}

.totales h3 {
    text-align: center;
}

.totales_desde span {
    font-size: 1rem;
}

.totales_comp-rest {
    display: flex;
    flex-wrap: wrap;
}

.tabla_compensar {
    border: .1rem solid #000000;
    border-radius: 1rem;
    padding: .5rem;
    box-shadow: 0 0 1rem #000000;
    margin: 2rem auto 2rem;
    font-size: 1.5rem;
}

.tabla_compensar caption {
    margin-bottom: 1rem;
}

.tabla_compensar th {
    border: none;
}

.tabla_compensar h3 {
    text-align: center;
}

.tabla_otracomp {
    border: .1rem solid #000000;
    border-radius: 1rem;
    padding: .5rem;
    box-shadow: 0 0 1rem #000000;
    margin: 2rem auto 2rem;
    font-size: 1.5rem;
}

.tabla_otracomp caption {
    margin-bottom: 1rem;
}

.tabla_otracomp th {
    border: none;
}

.tabla_otracomp h3 {
    text-align: center;
}

.tabla_otracomp p {
    text-align: center;
    padding: 0 1rem;
}

.tabla_restante {
    border: .1rem solid #000000;
    border-radius: 1rem;
    padding: .5rem;
    box-shadow: 0 0 1rem #000000;
    margin: 2rem auto 2rem;
    font-size: 1.5rem;
}

.tabla_restante caption {
    margin-bottom: 1rem;
}

.tabla_restante th {
    border: none;
}

.tabla_restante h3 {
    text-align: center;
}

.totales__year {
    margin: 3rem 0;
}

.totales__month {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: flex-start;
}

.total_year {
    width: 20rem;
    border: .1rem solid #000000;
    border-radius: 1rem;
    padding: .5rem;
    box-shadow: 0 0 1rem #000000;
    margin: 0 auto 2rem;
    background: #aaaadd;
}

.total_year caption {
    margin-bottom: 1rem;
}

.total_year h3 {
    text-align: center;
}

/* FOOTER */

.mov__footer {
    display: none;
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 14rem;
    background: linear-gradient(to bottom, #ffffff, #071697);
}

.mov__footer-bar {
    height: 14rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
    list-style-type: none;
}

.mov__footer-hora {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 2.5rem;
    text-decoration: none;
    color: #ffffff;
}

.mov__footer-hora p {
    text-shadow: 0 0 .2rem #000000, 0 0 .2rem #000000, 0 0 .2rem #000000;
}

.mov__footer-comp {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 2.5rem;
    text-decoration: none;
    color: #ffffff;
}

.mov__footer-comp p {
    text-shadow: 0 0 .2rem #000000, 0 0 .2rem #000000, 0 0 .2rem #000000;
}

.mov__footer-calendario {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 2.5rem;
    text-decoration: none;
    color: #ffffff;
}

.mov__footer-calendario p {
    text-shadow: 0 0 .2rem #000000, 0 0 .2rem #000000, 0 0 .2rem #000000;
}

.mov__footer-totales {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 2.5rem;
    text-decoration: none;
    color: #ffffff;
}

.mov__footer-totales p {
    text-shadow: 0 0 .2rem #000000, 0 0 .2rem #000000, 0 0 .2rem #000000;
}

.mov__footer-usuarios {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 2.5rem;
    text-decoration: none;
    color: #ffffff;
}

.mov__footer-usuarios p {
    text-shadow: 0 0 .2rem #000000, 0 0 .2rem #000000, 0 0 .2rem #000000;
}

.mov__footer-trabajadores {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 2.5rem;
    text-decoration: none;
    color: #ffffff;
}

.mov__footer-trabajadores p {
    text-shadow: 0 0 .2rem #000000, 0 0 .2rem #000000, 0 0 .2rem #000000;
}

.mov__footer-usuario {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 2.5rem;
    text-decoration: none;
    color: #ffffff;
}

.mov__footer-usuario p {
    text-shadow: 0 0 .2rem #000000, 0 0 .2rem #000000, 0 0 .2rem #000000;
}

@media screen and (max-width: 780px) {
    .login {
        width: 70%;
    }

    .login i {
        font-size: 50rem;
    }

    .login input {
        font-size: 3rem;
    }

    .login button {
        font-size: 3rem;
    }

    .nueva_hora {
        width: 100%;
        font-size: 3rem;
    }

    .edit_usuario {
        width: 100%;
        font-size: 3rem;
    }

    .nueva_comp {
        width: 100%;
        font-size: 3rem;
    }

    .edit_hora {
        width: 100%;
        font-size: 3rem;
    }

    .edit_comp {
        width: 100%;
        font-size: 3rem;
    }

    .fecha {
        font-size: 3rem;
    }

    .seleccion {
        font-size: 3rem;
    }

    .texto {
        font-size: 3rem;
    }

    .boton {
        font-size: 3rem;
    }

    .boton_select {
        font-size: 3rem;
    }

    .boton_eliminar {
        font-size: 3rem;
    }

    .boton_validar {
        font-size: 3rem;
    }

    .boton_invalidar {
        font-size: 3rem;
    }

    .material-icons-two-tone.md-24 {
        font-size: 8rem;
    }

    .desk_header {
        font-size: 2rem;
    }

    .desk_header-middle {
        display: none;
    }

    .mov__footer {
        display: block;
    }

    .desk_header {
        display: none;
    }

    .mov_header {
        display: flex;
        justify-content: space-evenly;
        align-items: center;
    }

    .container {
        margin: 16rem auto 0;
    }

    .boton_print {
        display: none;
    }

    .totales {
        width: 90%;
        border: .1rem solid #000000;
        border-radius: 1rem;
        padding: .5rem;
        box-shadow: 0 0 1rem #000000;
        margin: 2rem auto 2rem;
        font-size: 2.5rem;
    }

    .totales_desde span {
        font-size: 2rem;
    }

    .tabla_compensar {
        font-size: 2rem;
    }

    .tabla_restante {
        font-size: 2rem;
    }

    .total_year {
        width: 75%;
        border: .1rem solid #000000;
        border-radius: 1rem;
        padding: .5rem;
        box-shadow: 0 0 1rem #000000;
        margin: 0 auto 2rem;
        background: #aaaadd;
        font-size: 2rem;
    }

    .total_mes {
        width: 45%;
        border: .1rem solid #000000;
        border-radius: 1rem;
        padding: .5rem;
        box-shadow: 0 0 1rem #000000;
        margin-bottom: 2rem;
        font-size: 2rem;
    }

    .calendario h1 {
        font-size: 5rem;
    }

    .usuario_sede2 {
        font-size: 3rem;
    }
}

@media print {
    body * {
        visibility: hidden;
    }

    html {
        font-size: 9px;
    }

    .print_container {
        display: block;
        position: absolute;
        width: 90%;
        top: 0;
        margin: auto;
    }

    .calendario_horas {
        font-size: 1.5rem;
    }

    .print_total-diariotrabajador {
        font-size: 1.5rem;
    }

    .print_calendario, .print_calendario * {
        visibility: visible;
    }

    .print_calendario {
        min-width: 30%;
    }

    .print_total, .print_total * {
        visibility: visible;
    }

    .print_total-mes, .print_total-mes * {
        visibility: visible;
    }

    .print_total-mes, .total_mes {
        box-shadow: none;
    }
}