.customRadio {
    position: relative;
    top: 3px;
}

.customRadioAlign {
    position: relative;
    top: 5px;
    margin-right: 5px;
}

.wideInput {
    width: 100%;
}

.blueBackgroundTitle {
    color: white;
    background-color: rgb(0, 100, 139);
}

.noPadding {
    padding: 0;
}

.centerAlign {
    text-align: center;
}

.centerAlign tbody tr td a {
    text-decoration: none;
}

.customBtn {
    border: 0;
}

.customAlign tbody tr td:nth-child(2),
.customAlign tbody tr td:first-child {
    text-align: left;
}

.customAlign thead tr th,
.customAlign tbody tr td {
    vertical-align: middle;
    text-align: center;
}

.customAlign thead tr th {
    border: 1px solid orange;
}

.customAlign thead tr th,
.customAlign tbody tr td {
    border-left: 1px solid orange;
    border-right: 1px solid orange;
}

.customAlign tbody tr td a {
    color: orange;
}

.customAlign tbody tr td a:hover {
    text-decoration: underline;
    color: lightskyblue;
}

.customAlign tbody + tbody {
    border-top: 0;
}

html,
body {
    background: linear-gradient(90deg, rgba(241, 229, 234, 1) 0%, rgba(196, 223, 228, 0.944397742006959) 100%);
}

.mt-6 {
    margin-top: 6%;
}

.mt-9 {
    margin-top: 9%;
}

.top5 {
    position: relative;
    top: 25%;
}

#arrowDown {
    position: fixed;
    left: 30px;
    color: black;
    /* z-index: 999; */
}

#arrowDown:hover {
    text-decoration: none;
    color: gray;
}

#arrowUp {
    /* position: relative; */
    /* left: 10px; */
    color: black;
}

#arrowUp:hover {
    text-decoration: none;
    color: gray;
}

#myInput {
    position: fixed;
    right: 30px;
}

/* Flex container images with overflow and proper breakpoints/fully responsive */

.custom.card {
    height: 400px;
}

.custom.card-top {
    flex: 1 0 60%;
    max-height: 60%;
    text-align: center;
}

.custom.card-img-top {
    width: 100%;
    height: 100%;
    object-position: 50% top;
    object-fit: cover;

    /* display: block;
    border: none !important;
    padding: 0rem 0 !important; */
}

.custom.card-body {
    flex: 1 0 40%;
    max-height: calc(40% - 2rem);
    overflow: auto;
}

.grayBackG {
    background: rgb(200, 199, 199);
}

.whiteBackG {
    background: rgb(240, 240, 240);
}

.verify {
    padding: 0;
}

.custom-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: .25rem;
}

.custom.card-header {
    background-color: rgba(0, 0, 0, .03);
    border-bottom: 1px solid rgba(0, 0, 0, .125);
}

.noMargin {
    margin: 0;
}

.choices option {
    width: 50px;
}

.logoNavbar {
    height: 30px;
    width: 50px;
}

.vr {
    border-left: 1px solid #ccc; /* Cambiar el color a gris claro */
    height: 20px; /* Ajustar la altura */
    margin: 10px 10px; /* Centrar verticalmente y añadir espacio horizontal */
}

/* styles.css */

.form-header {
    background-color: #37474f; /* Azul grisáceo oscuro */
    color: #ffffff; /* Color del texto blanco */
    padding: 10px 15px; /* Espaciado interno */
    border-radius: 5px 5px 0 0; /* Esquinas redondeadas en la parte superior */
    margin-bottom: 20px; /* Espaciado inferior */
    font-weight: bold; /* Texto en negrita */
}

/* Asegúrate de que el borde del contenedor del formulario no se superponga a la cabecera */
.form-container {
    border: 1px solid #ccc; /* Borde gris claro */
    border-radius: 5px; /* Esquinas redondeadas */
    overflow: hidden; /* Para que las esquinas redondeadas se apliquen correctamente */
}
.btn-outline-teal {
    color: teal;
    background-color: transparent;
    border-color: teal;
}

.btn-outline-teal:hover {
    color: white;
    background-color: teal;
    border-color: teal;
}

.thead-grey {
    background-color: #d3d3d3;
}