/*********************
******** TEXT ********
**********************/

.font-weight-normal {
    font-weight: normal !important;
}

.font-bold {
    font-weight: bold !important;
}

.font-italic {
    font-style: italic !important;
}

.text-red {
    color: var(--red) !important;
}

.text-ubk-blue {
    color: var(--ubk-blue) !important;
}

.text-white {
    color: white !important;
}

.text-center {
    text-align: center !important;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-justify {
    text-align: justify !important;
}

.pre-line, .allow-line-breaks {
    white-space: pre-line;
}

.no-wrap {
    white-space: nowrap;
}

.allow-word-breaks {
    word-break: break-word;
}

/***********************
****** FONT SIZES ******
***********************/

.font-size-050 {
    font-size: 0.5rem !important;
}

.font-size-075 {
    font-size: 0.75rem !important;
}

.font-size-080 {
    font-size: 0.8rem !important;
}

.font-size-090 {
    font-size: 0.9rem !important;
}

.font-size-100 {
    font-size: 1rem !important;
}

.font-size-1125 {
    font-size: 1.125rem !important;
}

.font-size-125 {
    font-size: 1.25rem !important;
}

.font-size-150 {
    font-size: 1.5rem !important;
}

.font-size-200 {
    font-size: 2rem !important;
}

.font-size-250 {
    font-size: 2.5rem !important;
}

.font-size-300 {
    font-size: 3rem !important;
}

/***********************
***** FONT FAMILIES ****
************************/

.font-family-century-gothic {
    font-family: CenturyGothic, sans-serif;
}

/*******************
***** ALIGNING *****
*******************/

.vertical-align {
    display: flex;
    align-items: center;
}

.horizontal-align {
    display: flex;
    justify-content: center;
}

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

.align-start {
    align-content: flex-start;
    display: flex;
}

.justify-center {
    justify-content: center;
}

.align-self-center {
    align-self: center;
}

/*******************
***** HEADINGS *****
*******************/

.h1 {
    color: var(--ubk-blue);
    font-weight: bold;
    text-transform: uppercase;
    font-size: 1.5rem;
}

.h2 {
    color: var(--ubk-blue);
    font-weight: bold;
    font-size: 1.5rem;
}

.h3 {
    font-weight: bold;
    text-transform: uppercase;
}

.h4 {
    font-weight: bold;
}

.h5 {
    color: var(--ubk-blue);
}

/*****************
***** MARGIN *****
******************/

.margin-left-auto, .margin-hor-auto {
    margin-left: auto !important;
}

.margin-right-auto, .margin-hor-auto {
    margin-right: auto !important;
}

.margin-top-0, .margin-ver-0, .margin-0 {
    margin-top: 0rem !important;
}

.margin-bottom-0, .margin-ver-0, .margin-0 {
    margin-bottom: 0rem !important;
}

.margin-left-0, .margin-hor-0, .margin-0 {
    margin-left: 0rem !important;
}

.margin-right-0, .margin-hor-0, .margin-0 {
    margin-right: 0rem !important;
}

.margin-top-01, .margin-ver-01, .margin-01 {
    margin-top: 0.1rem !important;
}

.margin-bottom-01, .margin-ver-01, .margin-01 {
    margin-bottom: 0.1rem !important;
}

.margin-left-01, .margin-hor-01, .margin-01 {
    margin-left: 0.1rem !important;
}

.margin-right-01, .margin-hor-01, .margin-01 {
    margin-right: 0.1rem !important;
}

.margin-top-03, .margin-ver-03, .margin-03 {
    margin-top: 0.3rem !important;
}

.margin-bottom-03, .margin-ver-03, .margin-03 {
    margin-bottom: 0.3rem !important;
}

.margin-left-auto {
    margin-left: auto;
}

.margin-left-v-very-small {
    margin-left: 0.1rem;
}

.margin-right-10px {
    margin-right: 10px;
}

.margin-right-v-very-small {
    margin-right: 0.1rem;
}

.margin-left-03, .margin-hor-03, .margin-03 {
    margin-left: 0.3rem !important;
}

.margin-right-03, .margin-hor-03, .margin-03 {
    margin-right: 0.3rem !important;
}

.margin-top-05, .margin-ver-05, .margin-05 {
    margin-top: 0.5rem !important;
}

.margin-bottom-05, .margin-ver-05, .margin-05 {
    margin-bottom: 0.5rem !important;
}

.margin-left-05, .margin-hor-05, .margin-05 {
    margin-left: 0.5rem !important;
}

.margin-right-05, .margin-hor-05, .margin-05 {
    margin-right: 0.5rem !important;
}

.margin-top-1, .margin-ver-1, .margin-1 {
    margin-top: 1rem !important;
}

.margin-bottom-1, .margin-ver-1, .margin-1 {
    margin-bottom: 1rem !important;
}

.margin-left-1, .margin-hor-1, .margin-1 {
    margin-left: 1rem !important;
}

.margin-right-1, .margin-hor-1, .margin-1 {
    margin-right: 1rem !important;
}

.margin-top-15, .margin-ver-15, .margin-15 {
    margin-top: 1.5rem !important;
}

.margin-bottom-15, .margin-ver-15, .margin-15 {
    margin-bottom: 1.5rem !important;
}

.margin-left-15, .margin-hor-15, .margin-15 {
    margin-left: 1.5rem !important;
}

.margin-right-15, .margin-hor-15, .margin-15 {
    margin-right: 1.5rem !important;
}

.margin-top-2, .margin-ver-2, .margin-2 {
    margin-top: 2rem !important;
}

.margin-bottom-2, .margin-ver-2, .margin-2 {
    margin-bottom: 2rem !important;
}

.margin-left-2, .margin-hor-2, .margin-2 {
    margin-left: 2rem !important;
}

.margin-right-2, .margin-hor-2, .margin-2 {
    margin-right: 2rem !important;
}

.margin-top-3, .margin-ver-3, .margin-3 {
    margin-top: 3rem !important;
}

.margin-bottom-3, .margin-ver-3, .margin-3 {
    margin-bottom: 3rem !important;
}

.margin-left-3, .margin-hor-3, .margin-3 {
    margin-left: 3rem !important;
}

.margin-right-3, .margin-hor-3, .margin-3 {
    margin-right: 3rem !important;
}

.margin {
    margin: 0.5rem;
}

.margin-top {
    margin-top: 0.5rem;
}

.margin-bottom {
    margin-bottom: 0.5rem;
}

.margin-left {
    margin-left: 0.5rem;
}

.margin-right {
    margin-right: 0.5rem;
}

/**************************
***** NEGATIVE MARGIN *****
***************************/

.margin-top-n05, .margin-ver-n05, .margin-n05 {
    margin-top: -0.5rem !important;
}

.margin-bottom-n05, .margin-ver-n05, .margin-n05 {
    margin-bottom: -0.5rem !important;
}

.margin-left-n05, .margin-hor-n05, .margin-n05 {
    margin-left: -0.5rem !important;
}

.margin-right-n05, .margin-hor-n05, .margin-n05 {
    margin-right: -0.5rem !important;
}

.margin-top-n1, .margin-ver-n1, .margin-n1 {
    margin-top: -1rem !important;
}

.margin-bottom-n1, .margin-ver-n1, .margin-n1 {
    margin-bottom: -1rem !important;
}

.margin-left-n1, .margin-hor-n1, .margin-n1 {
    margin-left: -1rem !important;
}

.margin-right-n1, .margin-hor-n1, .margin-n1 {
    margin-right: -1rem !important;
}

/*****************
***** PADDING ****
******************/

.padding-title {
    padding-top: 30px;
    padding-left: 30px;
}

.padding-top-0, .padding-ver-0, .padding-0 {
    padding-top: 0rem !important;
}

.padding-bottom-0, .padding-ver-0, .padding-0 {
    padding-bottom: 0rem !important;
}

.padding-left-0, .padding-hor-0, .padding-0 {
    padding-left: 0rem !important;
}

.padding-right-0, .padding-hor-0, .padding-0 {
    padding-right: 0rem !important;
}

.padding-top-01, .padding-ver-01, .padding-01 {
    padding-top: 0.1rem !important;
}

.padding-bottom-01, .padding-ver-01, .padding-01 {
    padding-bottom: 0.1rem !important;
}

.padding-left-01, .padding-hor-01, .padding-01 {
    padding-left: 0.1rem !important;
}

.padding-right-01, .padding-hor-01, .padding-01 {
    padding-right: 0.1rem !important;
}

.padding-top-03, .padding-ver-03, .padding-03 {
    padding-top: 0.3rem !important;
}

.padding-bottom-03, .padding-ver-03, .padding-03 {
    padding-bottom: 0.3rem !important;
}

.padding-left-03, .padding-hor-03, .padding-03 {
    padding-left: 0.3rem !important;
}

.padding-right-03, .padding-hor-03, .padding-03 {
    padding-right: 0.3rem !important;
}

.padding-top-05, .padding-ver-05, .padding-05 {
    padding-top: 0.5rem !important;
}

.padding-bottom-05, .padding-ver-05, .padding-05 {
    padding-bottom: 0.5rem !important;
}

.padding-left-05, .padding-hor-05, .padding-05 {
    padding-left: 0.5rem !important;
}

.padding-right-05, .padding-hor-05, .padding-05 {
    padding-right: 0.5rem !important;
}

.padding-top-1, .padding-ver-1, .padding-1 {
    padding-top: 1rem !important;
}

.padding-bottom-1, .padding-ver-1, .padding-1 {
    padding-bottom: 1rem !important;
}

.padding-left-1, .padding-hor-1, .padding-1 {
    padding-left: 1rem !important;
}

.padding-right-1, .padding-hor-1, .padding-1 {
    padding-right: 1rem !important;
}

.padding-top-15, .padding-ver-15, .padding-15 {
    padding-top: 1.5rem !important;
}

.padding-bottom-15, .padding-ver-15, .padding-15 {
    padding-bottom: 1.5rem !important;
}

.padding-left-15, .padding-hor-15, .padding-15 {
    padding-left: 1.5rem !important;
}

.padding-right-15, .padding-hor-15, .padding-15 {
    padding-right: 1.5rem !important;
}

.padding-top-2, .padding-ver-2, .padding-2 {
    padding-top: 2rem !important;
}

.padding-bottom-2, .padding-ver-2, .padding-2 {
    padding-bottom: 2rem !important;
}

.padding-left-2, .padding-hor-2, .padding-2 {
    padding-left: 2rem !important;
}

.padding-right-2, .padding-hor-2, .padding-2 {
    padding-right: 2rem !important;
}

.padding-top-25, .padding-ver-25, .padding-25 {
    padding-top: 2.5rem !important;
}

.padding-bottom-25, .padding-ver-25, .padding-25 {
    padding-bottom: 2.5rem !important;
}

.padding-left-25, .padding-hor-25, .padding-25 {
    padding-left: 2.5rem !important;
}

.padding-right-25, .padding-hor-25, .padding-25 {
    padding-right: 2.5rem !important;
}

.padding-top-3, .padding-ver-3, .padding-3 {
    padding-top: 3rem !important;
}

.padding-bottom-3, .padding-ver-3, .padding-3 {
    padding-bottom: 3rem !important;
}

.padding-left-3, .padding-hor-3, .padding-3 {
    padding-left: 3rem !important;
}

.padding-right-3, .padding-hor-3, .padding-3 {
    padding-right: 3rem !important;
}

.padding {
    padding: 0.5rem;
}

.padding-top {
    padding-top: 0.5rem;
}

.padding-bottom {
    padding-bottom: 0.5rem;
}

.padding-left {
    padding-left: 0.5rem;
}

.padding-right {
    padding-right: 0.5rem;
}

.padding-horizontal {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.padding-vertical {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/*******************
***** CSS GRID *****
*******************/

.list-circle {
    list-style-type: circle;
}

.display-contents {
    display: contents;
}

.grid-first-col, .grid-next-row {
    grid-column: 1 / span 1;
}

.grid-first-col-span-2 {
    grid-column: 1 / span 2;
}

.grid-second-col {
    grid-column: 2 / span 1;
}

.grid-third-col {
    grid-column: 3 / span 1;
}

.grid-fourth-col {
    grid-column: 4 / span 1;
}

.grid-fifth-col {
    grid-column: 5 / span 1;
}

.grid-sixth-col {
    grid-column: 6 / span 1;
}

.grid-seventh-col {
    grid-column: 7 / span 1;
}

.grid-eighth-col {
    grid-column: 8 / span 1;
}

.grid-ninth-col {
    grid-column 9 / span 1;
}

.grid-tenth-col {
    grid-column 10 / span 1;
}

.grid-last-col {
    grid-column-end: -1;
}

.grid-all-row {
    grid-column: 1 / -1;
}

.grid-item-justify-center {
    justify-self: center;
}

.grid-item-align-center {
    align-self: center;
}

.centered-grid-item {
    justify-self: center;
    align-self: center;
}

/*******************
***** CSS FLEX *****
*******************/

.flex {
    display: flex;
}

.flex-u-1 {flex: 1;}
.flex-u-2 {flex: 2;}
.flex-u-3 {flex: 3;}
.flex-u-4 {flex: 4;}
.flex-u-5 {flex: 5;}
.flex-u-6 {flex: 6;}
.flex-u-7 {flex: 7;}

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

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

.flex-row-wrap {
    flex-flow: row wrap;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-nowrap {
    flex-wrap: nowrap;
}

.flex-align-start {
    align-items: flex-start;
}

.flex-align-center {
    align-items: center;
}

.flex-align-end {
    align-items: flex-end;
}

.flex-align-baseline {
    align-items: baseline;
}

.flex-justify-center {
    justify-content: center;
}

.flex-justify-start {
    justify-content: flex-start;
}

.flex-justify-end {
    justify-content: flex-end;
}

.flex-justify-space-between {
    justify-content: space-between;
}

.flex-justify-space-around {
    justify-content: space-around;
}

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

/*********************
***** CSS BORDER *****
*********************/

.border-none {
    border: none;
}

.border-1px-ubk-blue {
    border: solid 1px var(--ubk-blue);
}

.border-2px-ubk-blue {
    border: solid 2px var(--ubk-blue);
}

.border-5px-ubk-blue {
    border: solid 5px var(--ubk-blue);
}

.border-bottom-1px-light-gray {
    border-bottom: solid 1px var(--light-gray);
}

.border-1px-gray {
    border: solid 1px var(--gray);
}

.border-2px-gray {
    border: solid 2px var(--gray);
}

.border-top-1px-gray {
    border-top: solid 1px var(--gray);
}

.border-bottom-1px-gray {
    border-bottom: solid 1px var(--gray);
}

.border-bottom-2px-gray {
    border-bottom: solid 2px var(--gray);
}

.border-bottom-1px-white {
    border-bottom: solid 1px var(--white);
}

.border-bottom-2px-white {
    border-bottom: solid 2px var(--white);
}

.border-top-4px-ubk-blue {
    border-top: solid 4px var(--ubk-blue);
}

.border-bottom-2px-ubk-blue {
    border-bottom: solid 2px var(--ubk-blue);
}

.border-right-5px-ubk-blue {
    border-right: solid 5px var(--ubk-blue);
}

.border-bottom-dotted-2px-ubk-blue {
    border-bottom: dotted 2px var(--ubk-blue);
}

.border-bottom-dotted-4px-ubk-blue {
    border-bottom: dotted 4px var(--ubk-blue);
}

.border-2px-red {
    border: solid 2px var(--red);
}

.border-radius-1em-half {
    border-radius: .5rem;
}

.border-radius-1em {
    border-radius: 1rem;
}

/*****************
***** INPUTS *****
*****************/

.default-appearance-none {
    border:none;
    background-image:none;
    background-color:transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.default-appearance-none:focus {
    outline: none;
}

.input-text-border-bottom {
    padding-bottom: .2rem;
    padding-top: .2rem;
    border: none;
    border-bottom: solid 2px var(--gray);
    background: transparent;
}

.input-textarea-border {
    padding: 0.5rem;
    border: solid 2px var(--gray);
}

.input-select {
    border: none;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(/assets/icons/new-design/desplegable.svg) no-repeat right content-box;
    background-size: 1rem 1rem;
    padding-right: 1rem;
}

.input-select-border-bottom {
    padding-bottom: .2rem;
    padding-top: .2rem;
    border: none;
    border-bottom: solid 2px var(--gray);

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent url(/assets/icons/new-design/desplegable.svg) no-repeat right content-box;
    background-size: 1rem 1rem;
    padding-right: 1rem;
}

.input-textarea-border:focus {
    outline: none;
    border: solid 2px var(--ubk-blue);
}

.input-text-border-bottom:focus,
.input-select-border-bottom:focus {
    outline: none;
    border-bottom: solid 2px var(--ubk-blue);
}

.input-text::placeholder,
.input-select-border-bottom::placeholder,
.input-textarea::placeholder {
    color: var(--gray);
}

.input-select-border-bottom::-webkit-calendar-picker-indicator {
    background: none;
}

.custom-select-dropdown-menu-content {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    border-bottom-right-radius: .3rem;
    border-bottom-left-radius: .3rem;
    overflow-y: auto;
    max-height: 16rem;
    padding: .3rem;
    font-size: .9rem;
}

.custom-select-dropdown-menu-content.gray {
    background: #868686;
    color: var(--white);
}

.custom-select-dropdown-menu-content.blue {
    background: var(--ubk-blue);
    color: var(--white);
}

.custom-select-dropdown-menu-content.gray > .option,
.custom-select-dropdown-menu-content.blue > .option {
    border-radius: .3rem;
    padding: .3rem;
    cursor: pointer;
}

.custom-select-dropdown-menu-content.gray > .option:hover {
    background: var(--ubk-blue);
}

.custom-select-dropdown-menu-content.blue > .option:hover {
    background: #868686;
}

.custom-select-dropdown-menu-content.blue > .option.group-last,
.custom-select-dropdown-menu-content.gray > .option.group-last {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-bottom: solid 2px var(--white);
}

.radio-btn-bigger {
    transform: scale(2);
}


/*********************
***** BACKGROUND *****
*********************/

.background-transparent {
    background: transparent;
}

.background-white {
    background: var(--white);
}

.background-v-light-gray {
    background: var(--v-light-gray);
}

.background-semi-transparent-light-gray {
    background: var(--semi-transparent-light-gray);
}

.background-light-gray {
    background: var(--light-gray);
}

.background-60-ubk-blue {
    background: #2f4ea199;
}

.background-85-ubk-blue {
    background: #2f4ea1d9;
}

.background-ubk-blue {
    background: var(--ubk-blue);
}

/********************
 ***** OPACITY ******
 *******************/

.opacity-0 {
    opacity: 0;
}

.opacity-20 {
    opacity: 0.2;
}

.opacity-25 {
    opacity: 0.25;
}

.opacity-50 {
    opacity: 0.5;
}

.opacity-75 {
    opacity: 0.75;
}

/********************
 ***** CORNERS ******
 *******************/

.rounded-sm {
    border-radius: .2rem !important;
}

.rounded {
    border-radius: .25rem !important;
}

.rounded-lg {
    border-radius: .3rem !important;
}

.rounded-xl {
    border-radius: .5rem !important;
}

.rounded-xxl {
    border-radius: 1rem !important;
}

.rounded-3xl {
    border-radius: 1.5rem !important;
}

/****************************
 ***** WIDTHS & HEIGHTS *****
 ****************************/

.min-height-0 {
    min-height: 0;
}

.height-100 {
    height: 100%;
}

.min-width-0 {
    min-width: 0;
}

.min-width-10 {
    min-width: 10%;
}

.min-width-20 {
    min-width: 20%;
}

.min-width-30 {
    min-width: 30%;
}

.width-10 {
    width: 10%;
}

.width-15 {
    width: 15%;
}

.width-20 {
    width: 20%;
}

.width-30 {
    width: 30%;
}

.width-40 {
    width: 40%;
}

.width-50 {
    width: 50%;
}

.width-60 {
    width: 60%;
}

.width-70 {
    width: 70%;
}

.width-80 {
    width: 80%;
}

.width-90 {
    width: 90%;
}

.width-100 {
    width: 100%;
}

.max-width-70 {
    max-width: 70%;
}

.max-width-80 {
    max-width: 80%;
}

.max-width-90 {
    max-width: 90%;
}

.max-width-100 {
    max-width: 100%;
}

.width-fit-content {
    width: fit-content;
}

.width-min-content {
    width: min-content;
}

.width-fill-available {
    width: -webkit-fill-available;
    width: -moz-available
}

/****************
***** OTHER *****
****************/

.clickable {
    cursor: pointer;
    pointer-events: auto;
}

.not-clickable {
    pointer-events: none;
}

.unselectable {
    cursor: default;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

.hidden {
    display: none;
}

.disabled {
    pointer-events: none;
    opacity: .3;
}

.not-editable-read-only{
    pointer-events: none;
    opacity: .8;
}

.grayscale {
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
}

.text-ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    white-space: nowrap;
}

.pos-absolute {
    position: absolute;
}

.pos-relative {
    position: relative;
}

.pos-sticky {
    position: sticky;
}

.top-0 {
    top: 0;
}

.overflow-auto {
    overflow: auto;
}

.overflow-y, .vertical-scroll {
    overflow-y: auto;
}

.overflow-hidden {
    overflow: hidden;
}

.multiline {
    height: auto;
    white-space: pre-line;
}

.reverse-Y-axis {
    transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
}

.reverse-X-axis {
    transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
}

.resize-none {
    resize: none;
}

/****************
***** POPUP *****
****************/

.main-popup-scrim {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 998;
}

.main-popup-container {
    position: absolute;
    background: var(--white);
}

.main-popup-container.popup-auto-height {
    top: 50%;
    transform: translateY(-50%);
    max-height: 95vh;
}

.main-popup-container.popup-auto-height.v-large,
.popup-body-vh-v-large {
    max-height: 90vh;
}

.main-popup-container.popup-auto-height.large,
.popup-body-vh-large {
    max-height: 80vh;
}

.main-popup-container.popup-auto-height.medium,
.popup-body-vh-medium {
    max-height: 70vh;
}

.main-popup-container.popup-auto-height.small,
.popup-body-vh-small {
    max-height: 60vh;
}

.main-popup-container.popup-width-full-screen {
    left: 5%;
    right: 5%;
}

.main-popup-container.popup-width-wider {
    left: 10%;
    right: 10%;
}

.main-popup-container.popup-width-v-wide {
    left: 15%;
    right: 15%;
}

.main-popup-container.popup-width-wide {
    left: 20%;
    right: 20%;
}

.main-popup-container.popup-width-medium {
    left: 25%;
    right: 25%;
}

.main-popup-container.popup-width-thin {
    left: 30%;
    right: 30%;
}

.main-popup-container.full-screen {
    left: 1%;
    right: 1%;
    top: 50%;
    max-height: 90vh;
    transform: translateY(-50%);
    height: 95%;
}

.popup-close-btn-container {
    align-self: stretch;

    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-end;
}

.popup-close-btn-container > .popup-close-btn {
    position: static;
}

.popup-vertical-scroll {
    overflow-y: auto;
}

.popup-close-btn-margin {
    margin: 22px;
    padding: .8em
}
  /*************************
 ***** MANAGER PANEL *****
*************************/

.manager-panel__users-list {
  padding: 5em;
  text-align: center;
  font-size: x-large;
  color: var(--ubk-blue);
  width: 33%;
  display: inline-block;
}
.manager-panel__users-list table {
  margin: 0.auto;
  padding: 0.5em;
  border: 4px solid #2f4ea19c;
  border-radius: 25px;
}
.manager-panel__users-list tr {
  font-size: larger;
  font-weight: bolder;

}
.pad1em {
    padding: 1em !important;
}
.manager-panel__users-hours-table {
    width: 66%;
    padding: 7em 1em 1em 1em;
}
.manager-panel__users-hours-table tr {
  font-size: larger;
  font-weight: bolder;

}
.uth-box {
  padding: 0.4em;
  color: var(--ubk-blue);
  border: 4px solid #2f4ea19c;
}
.sum-hours {
    text-align: center;
}

.manager-panel__hours-selector {
  /*! display: block; */
  width: 100%;
  padding: 1em;

}

#hours-prof-filter {
    padding: 0.5em;
    font-size: larger;
}
.manager-panel__container {
  display: inline-flex;
}

.image-size-medium {width: 2.5em; height: 2.5em;}

.image-size-1em {width: 1em; height: 1em;}


  /*************************
 ***** BARRA DESPLAZAMIENTO *****
*************************/
.overflow-x {
    overflow-x: auto;
}

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

  /*************************
 ***** TAMANIOS *****
*************************/

.min_width_7 {
   min-width: 7rem;
}