/*Clases que permiten ajustar la altura máxima de un control o contenedor y generan un scroll vertical */
.responsive-vertical-10 {
    max-height: 10vh !important;
    overflow: auto !important;
}

.responsive-vertical-15 {
    max-height: 15vh !important;
    overflow: auto !important;
}

.responsive-vertical-20 {
    max-height: 20vh !important;
    overflow: auto !important;
}

.responsive-vertical-25 {
    max-height: 25vh !important;
    overflow: auto !important;
}

.responsive-vertical-30 {
    max-height: 30vh !important;
    overflow: auto !important;
}

.responsive-vertical-35 {
    max-height: 35vh !important;
    overflow: auto !important;
}

.responsive-vertical-40 {
    max-height: 40vh !important;
    overflow: auto !important;
}

.responsive-vertical-45 {
    max-height: 45vh !important;
    overflow: auto !important;
}

.responsive-vertical-50 {
    max-height: 50vh !important;
    overflow: auto !important;
}

.responsive-vertical-55 {
    max-height: 55vh !important;
    overflow: auto !important;
}

.responsive-vertical-60 {
    max-height: 60vh !important;
    overflow: auto !important;
}

.responsive-vertical-65 {
    max-height: 65vh !important;
    overflow: auto !important;
}

.responsive-vertical-70 {
    max-height: 70vh !important;
    overflow: auto !important;
}

.responsive-vertical-75 {
    max-height: 75vh !important;
    overflow: auto !important;
}

.responsive-vertical-80 {
    max-height: 80vh !important;
    overflow: auto !important;
}

.responsive-vertical-85 {
    max-height: 85vh !important;
    overflow: auto !important;
}

.responsive-vertical-90 {
    max-height: 90vh !important;
    overflow: auto !important;
}

.responsive-vertical-95 {
    max-height: 95vh !important;
    overflow: auto !important;
}

.min-vertical-10 {
    min-height: 10vh !important;
}

.min-vertical-15 {
    min-height: 15vh !important;
}

.min-vertical-20 {
    min-height: 20vh !important;
}

.min-vertical-25 {
    min-height: 25vh !important;
}

.min-vertical-30 {
    min-height: 30vh !important;
}

.min-vertical-35 {
    min-height: 35vh !important;
}

.min-vertical-40 {
    min-height: 40vh !important;
}

.min-vertical-45 {
    min-height: 45vh !important;
}

.min-vertical-50 {
    min-height: 50vh !important;
}

.min-vertical-55 {
    min-height: 55vh !important;
}

.min-vertical-60 {
    min-height: 60vh !important;
}

.min-vertical-65 {
    min-height: 65vh !important;
}

.min-vertical-70 {
    min-height: 70vh !important;
}

.min-vertical-75 {
    min-height: 75vh !important;
}

.min-vertical-80 {
    min-height: 80vh !important;
}

.min-vertical-85 {
    min-height: 85vh !important;
}

.min-vertical-90 {
    min-height: 90vh !important;
}

.min-vertical-95 {
    min-height: 95vh !important;
}


/* Antes de empezar a editar una propiedad de una clase en css */
/* ! por favor, NO APLICAR la regla '!important' de un atributo de las clases sobre otra */
/* Fuente: https://css-tricks.com/when-using-important-is-the-right-choice/ */


/* Clases que definen la altura relativa a la pantalla ('viewport height') sobre un elemento  */

.h-screen-2 {
    height: 2vh;
}

.h-screen-4 {
    height: 4vh;
}

.h-screen-6 {
    height: 6vh;
}

.h-screen-8 {
    height: 8vh;
}

.h-screen-10 {
    height: 10vh;
}

.h-screen-12 {
    height: 12vh;
}

.h-screen-14 {
    height: 14vh;
}

.h-screen-16 {
    height: 16vh;
}

.h-screen-18 {
    height: 18vh;
}

.h-screen-20 {
    height: 20vh;
}

.h-screen-22 {
    height: 22vh;
}

.h-screen-24 {
    height: 24vh;
}

.h-screen-26 {
    height: 26vh;
}

.h-screen-28 {
    height: 28vh;
}

.h-screen-30 {
    height: 30vh;
}

.h-screen-32 {
    height: 32vh;
}

.h-screen-34 {
    height: 34vh;
}

.h-screen-36 {
    height: 36vh;
}

.h-screen-38 {
    height: 38vh;
}

.h-screen-40 {
    height: 40vh;
}

.h-screen-42 {
    height: 42vh;
}

.h-screen-44 {
    height: 44vh;
}

.h-screen-46 {
    height: 46vh;
}

.h-screen-48 {
    height: 48vh;
}

.h-screen-50 {
    height: 50vh;
}

.h-screen-52 {
    height: 52vh;
}

.h-screen-54 {
    height: 54vh;
}

.h-screen-56 {
    height: 56vh;
}

.h-screen-58 {
    height: 58vh;
}

.h-screen-60 {
    height: 60vh;
}

.h-screen-62 {
    height: 62vh;
}

.h-screen-64 {
    height: 64vh;
}

.h-screen-66 {
    height: 66vh;
}

.h-screen-68 {
    height: 68vh;
}

.h-screen-70 {
    height: 70vh;
}

.h-screen-72 {
    height: 72vh;
}

.h-screen-74 {
    height: 74vh;
}

.h-screen-76 {
    height: 76vh;
}

.h-screen-78 {
    height: 78vh;
}

.h-screen-80 {
    height: 80vh;
}

.h-screen-82 {
    height: 82vh;
}

.h-screen-84 {
    height: 84vh;
}

.h-screen-86 {
    height: 86vh;
}

.h-screen-88 {
    height: 88vh;
}

.h-screen-90 {
    height: 90vh;
}

.h-screen-92 {
    height: 92vh;
}

.h-screen-94 {
    height: 94vh;
}

.h-screen-96 {
    height: 96vh;
}

.h-screen-98 {
    height: 98vh;
}

.h-screen,
.h-screen-100,
.h-screen-full {
    height: 100vh;
}


/* Clases que definen el 'overflow' (recorte del contenido) sobre un elemento  */

.overflow-auto {
    overflow: auto;
}

.overflow-hidden {
    overflow: hidden;
}

.overflow-scroll {
    overflow: scroll;
}

.overflow-visible {
    overflow: visible;
}


/* Clases que definen el 'overflow' (recorte del contenido) en el eje horizontal sobre un elemento  */

.overflow-x-auto {
    overflow-x: auto;
}

.overflow-x-hidden {
    overflow-x: hidden;
}

.overflow-x-scroll {
    overflow-x: scroll;
}

.overflow-x-visible {
    overflow-x: visible;
}


/* Clases que definen el 'overflow' (recorte del contenido) en el eje vertical sobre un elemento  */

.overflow-y-auto {
    overflow-y: auto;
}

.overflow-y-hidden {
    overflow-y: hidden;
}

.overflow-y-scroll {
    overflow-y: scroll;
}

.overflow-y-visible {
    overflow-y: visible;
}