@import url("https://widgets.reservamos.mx/search/5.16.0/search.css");


/* normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

/* ====================
	* CONFIGURACION *
==================== */

*,
*::after,
*::before {
	box-sizing: border-box;
}


* {
  margin: 0;
  padding: 0;
}


@import url('https://fonts.googleapis.com/css?family=Lato&display=swap:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');

body{
  font-family: Lato, sans-serif;
    font-size: 100%;
  min-height: 100vh; /* Asegura que el body tenga al menos la altura de la ventana */
    overflow-x: hidden; /* Evita el desplazamiento horizontal */
}




/* Variables */
:root {
    --fondo: #f2f2f2;
    --ancho-contenedor: 90%;
    --primary-color: #FFF;
    --secondary-color: #C51F20;
}








img {
  max-width: 100%;
  height: auto; /* Mantiene la relación de aspecto natural */
  display: block;
}

video, iframe {
  max-width: 100%;
  display: block;
  aspect-ratio: 16 / 9; /* Solo aplica 16:9 a videos e iframes */
}




@font-face {
  font-family: 'CustomFont';
  src: url('custom-font.woff2') format('woff2');
  font-display: swap; /* Cambia rápidamente a la fuente de respaldo si la fuente personalizada tarda */
}


/* ====================
	* CONTENEDORES *
==================== */
.contenedor {
	max-width: 90%;
	width: var(--ancho-contenedor);
	margin: 20px auto;
	overflow: hidden;
	min-height: 100vh; /* Asegura que el body tenga al menos la altura de la ventana */
}

.contenedor-ancho {
	width: 100%;
	padding: 0;
	margin: 10px auto;
}

/* ====================
	* GRID *
==================== */
.grid {
	display: grid;
	gap: 20px;
	margin-bottom: 20px;
}

/* Tamaño Grande - Computadoras y TV */
.col-1 { grid-template-columns: repeat(1, 1fr); }
.col-2 { grid-template-columns: repeat(2, 1fr); }
.col-3 { grid-template-columns: repeat(3, 1fr); }
.col-4 { grid-template-columns: repeat(4, 1fr); }
.col-5 { grid-template-columns: repeat(5, 1fr); }
.col-6 { grid-template-columns: repeat(6, 1fr); }
.col-7 { grid-template-columns: repeat(7, 1fr); }
.col-8 { grid-template-columns: repeat(8, 1fr); }
.col-9 { grid-template-columns: repeat(9, 1fr); }
.col-10 { grid-template-columns: repeat(10, 1fr); }
.col-11 { grid-template-columns: repeat(11, 1fr); }
.col-12 { grid-template-columns: repeat(12, 1fr); }

.span-1 { grid-column: span 1; }
.span-2 { grid-column: span 2; }
.span-3 { grid-column: span 3; }
.span-4 { grid-column: span 4; }
.span-5 { grid-column: span 5; }
.span-6 { grid-column: span 6; }
.span-7 { grid-column: span 7; }
.span-8 { grid-column: span 8; }
.span-9 { grid-column: span 9; }
.span-10 { grid-column: span 10; }
.span-11 { grid-column: span 11; }
.span-12 { grid-column: span 12; }

/* Tamaño Mediano - Tablets */
@media screen and (max-width: 992px) {
	.med-col-1 { grid-template-columns: repeat(1, 1fr); }
	.med-col-2 { grid-template-columns: repeat(2, 1fr); }
	.med-col-3 { grid-template-columns: repeat(3, 1fr); }
	.med-col-4 { grid-template-columns: repeat(4, 1fr); }
	.med-col-5 { grid-template-columns: repeat(5, 1fr); }
	.med-col-6 { grid-template-columns: repeat(6, 1fr); }
	.med-col-7 { grid-template-columns: repeat(7, 1fr); }
	.med-col-8 { grid-template-columns: repeat(8, 1fr); }
	.med-col-9 { grid-template-columns: repeat(9, 1fr); }
	.med-col-10 { grid-template-columns: repeat(10, 1fr); }
	.med-col-11 { grid-template-columns: repeat(11, 1fr); }
	.med-col-12 { grid-template-columns: repeat(12, 1fr); }

	.med-span-1 { grid-column: span 1; }
	.med-span-2 { grid-column: span 2; }
	.med-span-3 { grid-column: span 3; }
	.med-span-4 { grid-column: span 4; }
	.med-span-5 { grid-column: span 5; }
	.med-span-6 { grid-column: span 6; }
	.med-span-7 { grid-column: span 7; }
	.med-span-8 { grid-column: span 8; }
	.med-span-9 { grid-column: span 9; }
	.med-span-10 { grid-column: span 10; }
	.med-span-11 { grid-column: span 11; }
	.med-span-12 { grid-column: span 12; }
}

/* Tamaño Pequeño - Celulares */
@media screen and (max-width: 576px) {
	.peq-col-1 { grid-template-columns: repeat(1, 1fr); }
	.peq-col-2 { grid-template-columns: repeat(2, 1fr); }
	.peq-col-3 { grid-template-columns: repeat(3, 1fr); }
	.peq-col-4 { grid-template-columns: repeat(4, 1fr); }
	.peq-col-5 { grid-template-columns: repeat(5, 1fr); }
	.peq-col-6 { grid-template-columns: repeat(6, 1fr); }
	.peq-col-7 { grid-template-columns: repeat(7, 1fr); }
	.peq-col-8 { grid-template-columns: repeat(8, 1fr); }
	.peq-col-9 { grid-template-columns: repeat(9, 1fr); }
	.peq-col-10 { grid-template-columns: repeat(10, 1fr); }
	.peq-col-11 { grid-template-columns: repeat(11, 1fr); }
	.peq-col-12 { grid-template-columns: repeat(12, 1fr); }
}


/* ====================
	* TERMINA GRID *
==================== */








/* ====================
	* ESTILOS GENERALES *
==================== */


p {
	line-height: 27px;
    text-align: justify;
}



.color-texto1{
    color: #ccc;
}

.color-texto2{
    color: #001363;
}

.color-texto3{
    color: #7BA7AE;
}

.color-texto3{
    color: #FFFFFF;
}

.bg-color{
    background-color: var(--secondary-color);
    padding: 10px;
    color: #fff;
}

.bold{
    font-weight: 700;
}

.semibold{
    font-weight: 500;
}

.center{
    text-align: center;s
}

.justify{
    text-align: justify;
}


/* ENLACES */
a {
  cursor: pointer;
  text-decoration: none;
  transition: background-color .16s ease-in;
}


.link{
    cursor: pointer;
}


.oculto{
    display: none;
}


/* ====================
	* FUENTES *
==================== */
h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
}



.titulo-1 {
	font-weight: 700;
	font-size: 24px;
}

.titulo-2 {
	font-weight: 700;
	font-size: 22px;
}

.titulo-3 {
	font-weight: 700;
    font-size: 18px;
    padding: 10px 0;
}

.titulo-4 {
	font-weight: 700;
	font-size: 16px;
}

.center{
    text-align: center;
}

.justify{
    text-align: justify;
}

.left{
    text-align: left;
}

.right{
    text-align: right;
}

p.parrafo-espacio{
    padding: 10px;
}


space{
    display: block;
    height: 20px;
    padding: 10px 0;
}



/* ****************************************************
                        ESTRUCTURA DE CONTENEDORES
******************************************************/


.contenedor-general{
    width: 100%;
	padding: 0;
	margin: 0 auto;
     min-height: 100vh; /* Asegura que el body tenga al menos la altura de la ventana */
}


header{
    background-color: var(--primary-color);
    display: block;
    min-height: 122px;
    margin: 0 auto;
    position: fixed;
    width: 100%;
    z-index: 1000;
    height: auto;
}


section.distintivo{
    background-color: #fff;
    position: absolute;
}


section.contenedor-contenidos{
    position: relative;
    top: 186px;
     min-height: 100vh; /* Asegura que el body tenga al menos la altura de la ventana */
}


article.banner-principal{
    background-color: #fff;
    height: auto;
    width: 100%;
}

article.banners-individuales{
    background-color: var(--primary-color);
    height: auto;
    width: 100%;
    min-height: 300px;
}

article.banners-promociones{
    min-height: 300px;
    height: auto;
    width: 100%;
}




article.carrusel-blog{
    background-color: #ffffff;
    min-height: 300px;
    height: auto;
    width: 100%;

}




footer{
    background-color: #fff;
    display: block;
    position: relative;
    top: 5px;
    width: 100%;
}







/* ****************************************************
                        COMPONENTES WEB
******************************************************/
.header-menu{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    padding: 10px 20px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    position: relative;
    width: 100%;
}


.logo{
    max-width: 200px;
}

.logo img {
    max-width: 75%;
    height: auto;
    aspect-ratio: auto;
}

nav {
    flex-grow: 1;
}

.menu {
    display: flex;
    align-items: center;
    list-style-type: none;
    margin: 0;
    padding: 0;
    flex-grow: 1;
    justify-content: space-between;
    flex-wrap: wrap;
}

.menu li {
    position: relative;
    flex: 1 1 auto;
    text-align: left;
    list-style: none;
}

.menu a {
    text-decoration: none;
    padding: 10px;
    display: flex;
    color: #333;
    white-space: nowrap;
    transition: background-color 0.3s;
    text-align: center;
}

    .icon-menu {
    height: 10px;
    aspect-ratio: auto;
    vertical-align: middle;
    align-self: center;
}

.menu a:hover {
    background-color: #f0f0f0;
}

.sub-menu,
.dropdown-content, .dropdown-content2 {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    width: max-content;
    min-width: 150px;  /* Ancho mínimo para mejor usabilidad */
}


.sub-menu li{
    width: 100%;
}

.dropdown-content2 {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    background-color: #fff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.8);
    z-index: 1000;
    width: max-content;
    min-width: 150px;  /* Ancho mínimo para mejor usabilidad */
}

.dropdown-content2 li{
    text-align: right;
    width: 100%;
}

.menu li:hover .sub-menu,
.menu li:hover .dropdown-content,
.menu li:hover .dropdown-content2,
.has-submenu:focus + .sub-menu,
.has-submenu:focus + .dropdown-content
.has-submenu:focus + .dropdown-content2{
    display: block;
    justify-items: left;
}

.hamburger {
    display: none;
    flex-direction: column;
    cursor: pointer;
}

.hamburger span {
    height: 3px;
    width: 25px;
    background-color: #333;
    margin: 3px 0;
}

@media (max-width: 768px) {
    
    .header-menu {
    display: inline-block;
    }
    
    .logo{
        float: left;
    }
    
    .menu {
        display: none;
        flex-direction: column;
        width: 100%;
        position: absolute;
        top: 60px;
        left: 0;
        background-color: #fff;
        z-index: 1000;
    }
    
    
    
    .menu li {
        width: 100%;
    }

    .menu.show {
        display: flex;
    }
    
    
    #login-icon {
    justify-content: center;
}

    .hamburger {
        display: flex;
        float: right;
    }

    .menu a {
        font-size: 4vw; /* Aumentar tamaño de fuente en móviles */
        padding: 10px 0; /* Ajustar padding para mejor espacio en móviles */
        text-align: center; /* Alinear a la izquierda en móviles */
                justify-content: center;
    }
    


    .dropdown-content, .dropdown-content2 {
        left: auto; /* Ajustar posición para el menú "Más" */
        right: 0;   /* Mostrar a la derecha para no desbordarse */
    }

    /* Asegurarse que el submenú no salga de la pantalla */
    .dropdown-content, .dropdown-content2 {
        max-width: calc(100% - 20px); /* Para que no se desborde del lado derecho */
        min-width: 150px;  /* Ancho mínimo para mejor usabilidad */
    }

    .sub-menu,
    .dropdown-content, .dropdown-content2 {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        background-color: #fff;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        z-index: 1000;
        width: max-content; /* Cambiar a un ancho automático */
        min-width: 100%;  /* Ancho mínimo para mejor usabilidad */
    }
}


















.modalDialog {
	position: fixed;
	font-family: Arial, Helvetica, sans-serif;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 99999;
	opacity:0;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
	pointer-events: none;
}
.modalDialog:target {
	opacity:1;
	pointer-events: auto;
}
.modalDialog > div {
	width: 400px;
	position: relative;
	margin: 10% auto;
	padding: 5px 20px 13px 20px;
	border-radius: 10px;
	background: #fff;
	background: -moz-linear-gradient(#fff, #999);
	background: -webkit-linear-gradient(#fff, #999);
	background: -o-linear-gradient(#fff, #999);
  -webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;
}
/* Botón de cierre */
.close {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 24px;
    color: #333;
    cursor: pointer;
    background: none;
    border: none;
    outline: none;
    padding: 0;
    z-index: 1001; /* Asegúrate de que esté por encima del contenido */
}





.close:hover { background: #00d9ff; }
















/* Ícono de Login */

#login-icon{
        display: flex;
    align-items: center;
}

#login-icon a {
    font-size: 12px;
    font-weight: 700;
	border: 2px solid #ccc;
    border-radius: 12px;
    height: 50px;
    place-items: center;
}



/* Modal Base */
.ModalTravelPs {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
}


/* Contenido del Modal */
.modal-content {
    padding: 20px;
    max-width: 465px;
    width: 90%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    position: relative;
    margin: 10% auto;
    border-radius: 10px;
    background: #fff;
    background: -moz-linear-gradient(#fff, #999);
    background: -webkit-linear-gradient(#fff, #999);
    background: -o-linear-gradient(#fff, #999);
    -webkit-transition: opacity 400ms ease-in;
    -moz-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
}

/* Encabezado del Modal */
.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.modal-logo {
        height: auto;
    aspect-ratio: auto;
    width: 100px;
}


.icono-travel{
        width: 25px;
    height: auto;
    aspect-ratio: auto;
}

.close {
    font-size: 24px;
    color: #333;
}

/* Títulos */
h2 {
    margin-top: 0;
    font-size: 1.5em;
    color: #333;
}

/* Formularios */
form {
    display: flex;
    flex-direction: column;
    align-items: center;
}

label {
    font-size: 1em;
    margin-bottom: 5px;
    color: #555;
}

input[type="email"], input[type="password"] {
    width: calc(100% - 22px); /* Ajusta el tamaño del input para que tenga margen */
    padding: 10px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 1em;
    box-sizing: border-box; /* Para incluir el padding en el width */
}

button {
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    background-color: #01ae42;
    color: white;
    font-size: 1em;
    cursor: pointer;
    transition: background-color 0.3s;
    margin: 0 auto;
}

button:hover {
    background-color: #0056b3;
}

/* Mensaje */
.message {
    font-size: 1em;
    margin-top: 20px;
    color: red; /* Color predeterminado para mensajes de error */
}

/* Modal de Perfil */
#modalTravelPassLogueado .modal-content {
    text-align: center;
}

#user-name, #user-balance {
    margin: 10px 0;
    font-size: 1.2em;
    color: #333;
}

#logout-link {
    display: inline-block;
    margin-top: 20px;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    background-color: #09915A;
    color: white;
    text-decoration: none;
    font-size: 1em;
    cursor: pointer;
    transition: background-color 0.3s;
}

.btn-cuenta {
    display: inline-block !important;
    margin-top: 20px !important;
    padding: 10px 20px !important;
    border: none !important;
    border-radius: 4px !important;
    background-color: #09915A !important;
    color: white !important;
    text-decoration: none !important;
    font-size: 1em !important;
    cursor: pointer !important;
    transition: background-color 0.3s !important;
}

#logout-link:hover {
    background-color: #c82333;
}



.doters-basic {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUwIiBoZWlnaHQ9IjE1MCIgdmlld0JveD0iMCAwIDI1IDI1IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIGZpbGwtcnVsZT0ibm9uemVybyIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTEyLjUgMjVDMTkuNDA0IDI1IDI1IDE5LjQwNCAyNSAxMi41UzE5LjQwNCAwIDEyLjUgMCAwIDUuNTk2IDAgMTIuNSA1LjU5NiAyNSAxMi41IDI1WiIgZmlsbD0iIzAwQUU0MiIvPjxwYXRoIGQ9Ik0xMi41IDE1LjYyNWEzLjEyNSAzLjEyNSAwIDEgMCA2LjI1IDBIMTIuNVoiIGZpbGw9IiNGRkYiLz48L2c+PC9zdmc+);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: 15px;
    min-width: 15px;
    width: 15px;
}












.modal-header-travel {
    color: #fff;
    padding: 8px;
    width: 100%;
}




.form-control {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}



.btn-travel1{
    background-color: #003a5f !important;
    color: #fff !important;
    border-radius: 50px;
    font-size: 15px;
    margin: 0 auto;
    padding: 8px;
}


.btn-travel2{
    background-color: #003a5f !important;
    color: #fff !important;
    border-radius: 50px;
    font-size: 15px;
    margin: 0 auto;
    padding: 8px;
}

















.modalDoters-container {
    text-align: center;
    align-content: center;
    flex: 1;
}

.modalHeader{
    display: flex;
    align-items: center;
    margin: 0 auto;
    width: 100%;
    background: #003b41;
    padding: 10px;
    border-radius: 12px 12px 0 0;
}

.modalHeader img{
    width: 100px;
    height: auto;
    aspect-ratio: auto;
}



.modalDoters-modal {
    display: none; 
    position: fixed; 
    z-index: 1; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgba(0, 0, 0, 0.7); 
}


.modalContenido{
    padding: 10px;
    text-align: center;
}

hr{
    margin: 10px 0;
}

.modalDoters-modal-content {
    background-color: #fff;
    margin: 15% auto; 
    padding: 0px;
    border: 1px solid #888;
    width: 80%; 
    max-width: 465px; 
    position: relative;
    border-radius: 12px;
}

.modalDoters-close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
    position: absolute;
    right: 0;
    padding: 0 10px;
}

.modalDoters-close:hover,
.modalDoters-close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}



.modalDoters-welcome-message {
    cursor: pointer; /* Cambiar a cursor pointer para el mensaje de bienvenida */
    font-size: 12px;
}


button:hover {
    background-color: #003b41;
}



    /* Estilos básicos del carrusel */
    .carousel-container {
      position: relative;
      width: 100%;
      max-width: 800px;
      margin: 0 auto;
      overflow: hidden;
    }

    .carousel-track {
      display: flex;
      transition: transform 0.5s ease-in-out;
    }

    .carousel-slide {
      min-width: 100%;
    }

    .carousel-slide img {
      width: 100%;
      height: auto;
      display: block;
    }

    /* Botones de navegación */
    .carousel-button {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      background-color: rgba(0, 0, 0, 0.5);
      color: white;
      border: none;
      padding: 10px;
      cursor: pointer;
    }

    .carousel-button.prev {
      left: 10px;
    }

    .carousel-button.next {
      right: 10px;
    }







.bar-formas-pago{
    margin: 0 auto;
    position: relative;
    display: block;
    align-items: center;
    height: auto;
    vertical-align: middle;
    margin-top: 20px;
}


.bar-formas-pago h3{
    font-size: 14px;
	text-align: center;
}

.bar-formas-pago .fpago-desktop{
display: block;
}

.promocion-mobile{
display:none;
}

.bar-formas-pago .fpago-mobile{
display: none;
}

.botones-inferior-mobile{
display: none;
}


.fpago-desktop img{
    width: 100%;
}




.marcas .grid {
        align-items: center;
    padding: 10px;
    display: grid;
    justify-items: center;
	}
	
	
	.marcas .grid img {
        padding: 10px;
    width: 150px;
}

























.card{
    text-align: center;
        box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    -webkit-box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    -moz-box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    width: 90%;
    margin: 0 auto;
    border-radius: 18px;
    text-align: center;
    padding: 5px;
    min-height: 550px;
    height: auto;
}

.card img{
    width: 100%;
}


 
    .img1-card{
        width: 90%;
    }
    
    .img2-card{
        width: 90%;
    }


.seccion-contenido{
    margin: 0;
    padding: 10px;
}


.contenido-card{
    align-items: center;
    height: 116px;
    margin-top: 10px;

}

.card-servicios{
    background: #073c5c;
    text-align: center;
        box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    -webkit-box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    -moz-box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    width: 90%;
    margin: 0 auto;
    border-radius: 18px;
    text-align: center;
    padding: 5px;
    height: 245px;
}



.card-servicios2{
    background: #7ba4ab;
    text-align: center;
        box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    -webkit-box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    -moz-box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    width: 90%;
    margin: 0 auto;
    border-radius: 18px;
    text-align: center;
    padding: 5px;
    height: 245px;
}




img.img-servicios-doters{
    width: 50%;
}







.btn-doters {
    background: #31fbad;
    padding: 10px;
    text-align: center;
    font-size: 20px;
    border-radius: 12px;
    color: #000;
    font-weight: 700;
    cursor: pointer;
}

.card-body {
    flex: 1 1 auto;
    padding: 1rem 1rem;
}


.promo-card{
    text-align: center;
    box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    -webkit-box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    -moz-box-shadow: 3px 1px 9px -1px rgba(0,0,0,0.7);
    width: 90%;
    margin: 0 auto;
    border-radius: 18px;
    text-align: center;
    padding: 5px;
    min-height: 550px;
    height: auto;
}





/* styles.css */

my-card-section {
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 20px;
}

my-card {
    border-radius: 8px;
    padding: 20px;
    margin: 0;
    width: 33%;
    text-align: center;
    line-height: 70px;
}

my-card a img {
        width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 10px;
    aspect-ratio: auto;
}


 /* Estilos CSS para el feed de noticias */
        .post {
            margin-bottom: 20px;
        }
        .post h2 {
            font-size: 18px;
            margin-bottom: 5px;
        }
        .post p {
            font-size: 14px;
            margin-bottom: 10px;
        }
        .post a {
            text-decoration: none;
            color: #007bff;
        }
        .post img {
            max-width: 100%;
            height: auto;
            margin-bottom: 10px;
        }
































footer{
    background-color: var(--secondary-color);
    padding: 8px;
}


footer h3{
    color: #fff;
    text-align: center;
    font-size: 16px;
}

footer .redes-sociales {
    margin: 0 auto;
    position: relative;
    text-align: center;
    width: 50%;
    display: flex;
    justify-content: center;
}

footer a{
    border-radius: 8px;
    font-size: 20px;
    width: 40px;
}

footer a img{
    margin: 0 auto;
    width: 40px;
    height: 40px;
    aspect-ratio: auto;
}

.phone-lada {
    background: transparent !important;
    font-size: 28px;
    color: #fff;
    text-align: center;
    margin: 0 auto;
    width: 100%;
    position: relative;
    display: block;
}


.encuesta{
text-align: center;
	padding: 10px 0;
}


.encuesta span{
color: #39addf;
font-weight: 700;
}

.encuesta span img{
	vertical-align: middle;
width: 35px;
}


.menu-footer{
    padding: 10px;
}

ul.nav-footer{
    display: flex;
    justify-content: center;
}

ul.nav-footer li{
    display: flex;
    padding: 0 10px;
    color: #fff;
}


a.link-footer{
    color: #fff;
    font-size: 12px;
    width: auto;
    padding: 0;
}



footer .footer-final p{
    color: #fff;
    text-align: center;
    font-size: 12px;
}




.float-wa{
        position:fixed;
        width:60px;
        height:60px;
        bottom:40px;
        right:40px;
        background-color:#25d366;
        color:#FFF;
        border-radius:50px;
        text-align:center;
        z-index:100;
    padding: 10px;
    }






.float-evalua{
        position:fixed;
        width:auto;
        height:auto;
        bottom:50px;
        left:10px;
        background-color:#0F5E67;
        color:#FFF;
        border-radius:18px;
        text-align:center;
        z-index:100;
    padding: 4px;
    font-size: 12px;
    align-items: center;
    justify-content: center;
    display: flex;
    border: 1.5px solid #003A5D;
    }

img.img-evalua{
    padding: 5px;
    width: 30px;
}































@media screen and (min-width: 1441px) {

my-card a img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 10px;
    aspect-ratio: auto;
}

}









@media screen and (max-width: 426px) {
    
    
    header {
    position: relative;
        min-height: 550px;
        height: auto;
}
    
    
    section.contenedor-contenidos {
    position: relative;
    top: 0;
}
    
    
    .banner-principal, .banners-individuales, .banners-promociones, .carrusel-blog{
        display: none;
    }
    
    .promocion-mobile{
        display: flex;
		padding: 20px;
    }
    
    .texto-promocion{
        text-align: center;
        font-size: 16px;
                align-content: center;
    }

    .img-logo-buen-fin{
        margin: 0 auto;
        width: 200px;
    }

 
    
    .bar-formas-pago .fpago-desktop{
display: none;
}

.bar-formas-pago .fpago-mobile{
display: block;
        min-height: 170px;
        height: auto;
        width: 100%;
        margin: 0 auto;
}
    
    .fpago-mobile picture{
        display: block;
        margin: 20px 0;
    }
    
    .fpago-mobile picture img{
        margin: 0 auto;
        height: auto;
        width: 90%;
        aspect-ratio: auto;
    }
	
	
	.botones-inferior-mobile{
        display: block;
        min-height: 60px;
        height: auto;
        width: 100%;
        
}
    
    
    .botones-inferior-mobile picture img{
        height: auto;
        width: 70%;
        margin: 0 auto;
        aspect-ratio: auto;
    }
    
    
    ul.nav-footer {
    display: grid;
}
}
    
    
    
    
    	.evalua{
	display: none;
	}
    
    
    footer{
        height: auto;
    }
    
footer h4 {
        font-size: 20px;
    }
     
    footer .redes-sociales {
        padding: 15px;
    }
    
    footer a {
    width: 55px;
}
    
    
    ul.nav-footer {
    justify-content: center;
    justify-items: center;
}
    
    ul.nav-footer li {
        line-height: 1.7;
    font-size: 1rem;
    padding: 3px;
    }
	
	
	
	


    .content-imagenes{
        width: 100%;
    }
    .contenedor-images{
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 40vh;
        border-radius: 20px !important;
    }
    .contenedor-images figure {
        margin: 10px;
        padding: 0;
        position: relative;
        height: auto;
        width: 100%;
        overflow: hidden;
        border-radius: 20px;
        box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.5);
        cursor: pointer;
    }
    .contenedor-images figure img{
        width: 100%;
        height: 100%;
        transition: all 0.4s ease;
    }
    .contenedor-images figure .capa{
        position: absolute;
        top: 0px;
        width: 100%;
        height: 100%;
        opacity: 0.4;
        background: rgba(11, 103, 123, 0.6);
        transition: all 0.5s ease;
        translate: (2px, -69px);
        opacity: 0;
        visibility: hidden;
        text-align: center;
    }
    .contenedor-images figure:hover > .capa{
        opacity: 0.8;
        visibility: visible;
    }
    .contenedor-images figure:hover > .capa h3{
        margin-top: 130px;
        margin-bottom: 15px;
        font-size: 2rem !important;
    }
    .contenedor-images figure .capa h3{
        color: #fff;
        font-weight: 400;
        margin-bottom: 200px;
        transition: all 0.5s ease;
        margin-top: 30px;
    }