/************************************************************************************
HOJA DE ESTILOS PARA SITIOS WEB
Autor: Fernando J. Cuevas - Abril 2024
*************************************************************************************/
@charset "utf-8";
/************************************************************************************
MEDIA QUERIES - Adaptacion a dispositivos y resoluciones
*************************************************************************************/

@media screen and (max-width: 480px) {

.int-col-2 { width: 95.333%; margin: 0.4em; }
.principal h1 { padding: 3.4rem 0 1rem 1.2rem; font-size: 2.2em; }

.modal-content { width: 90%; height: 85%; } 
.modal-corto { width: 85%; height: auto; }
.imgpago img { width: 100%; height: auto; }

.marcas h3 { font-size: 1.5em; }
.carousel-track img { height: 30px; margin: 0 15px; }

.fixed-nav-menu, .fixed-encab-menu { height: 48px; }
.lateral_nav { display: table; }
.logo { margin: 8px 0 0 15px; }
.logo img { height: 30px; }

.fixed-nav-menu, .fixed-encab-menu { height: 50px; }
.menu_nav, .menu_nav ul { display:none; visibility: hidden; }

.sec_inicio  { background-position: 65% center; height: 100vh; }

.cards-section { width: 98.66%; justify-content: center; gap: 1rem;  }
.card { width: 84.666%; padding: 90px 8px 22px;  }

.card h3 { margin: 5px 0; font-size: 18px; line-height: 1.1; }
.card p { font-size: 14px; height: 50px; }

.text_slider { width: 80%;}
.text_slider h2 { font-size: 3.2em; line-height: 1em; }
.text_slider p { font-size: 1.4em; line-height: 1.2em; }

.col-2 { width: 93.333%; margin: 0.7em 0.7em 1.4em 0.7em; display: block;  }
.col-2:nth-child(even) { margin-left: 1.2em; }
.col-2:nth-child(odd) { margin-left: 1.2em; }
.col-2 p { font-size: 1.1em; }
.col-1 { width: 93.666%; }

.verde-oscuro p { font-size: 1.1em; }
.staff-imagen img { width: 100px; }

.sec_contactos { padding-bottom: 20%; }
#col_map { width: 98%; margin: 0 auto; }


}


/* Teléfonos normales (portrait/landscape) */
@media (min-width: 481px) and (max-width: 680px) {

.int-col-2 { width: 95.333%; margin: 0.6em; }
.principal h1 { padding: 3.4rem 0 1rem 1.2rem; font-size: 2.2em; }

.modal-content { width: 90%; height: 85%; } 
.modal-corto { width: 85%; height: auto; }
.imgpago img { width: 100%; height: auto; }

.marcas h3 { font-size: 1.5em; }
.carousel-track img { height: 30px; margin: 0 15px; }

.fixed-nav-menu, .fixed-encab-menu { height: 48px; }
.lateral_nav { display: table; }
.logo { margin: 8px 0 0 15px; }
.logo img { height: 30px; }
.menu_nav, .menu_nav ul { display:none; visibility: hidden; }

.cards-section { width: 98.66%; justify-content: center; gap: 1rem;  }
.card { width: 43.666%; padding: 90px 8px 22px; }

.card h3 { margin: 7px 0; font-size: 15px; line-height: 1.2; }
.card p { font-size: 12px; height: 45px; }

.sec_inicio  { background-position: 65% center; height: 100vh; }

.text_slider { width: 90%;}
.text_slider h2 { font-size: 3.4em; line-height: 1.1em; }
.text_slider p { font-size: 1.6em; line-height: 1.2em; }

.col-2 { width: 93.333%; margin: 0.7em 0.7em 1.4em 0.7em; display: block; }
.col-2:nth-child(even) { margin-left: 1.1em; }
.col-2:nth-child(odd) { margin-left: 1.1em; }
.col-2 p { font-size: 1.1em; }
.col-1 { width: 93.333%; }

.verde-oscuro h3 { line-height: 1.1; }
.verde-oscuro p { font-size: 1.1em; }
.staff-imagen img { width: 100px; }

.sec_contactos { padding-bottom: 20%; }
#col_map { width: 98%; margin: 0 auto; }

}


/* PC antiguas  */
@media (min-width: 681px) and (max-width: 767px) {

.text_slider { width: 80%;}
.text_slider h2 { font-size: 3.4em; line-height: 1.1em; }
.text_slider p { font-size: 1.6em; line-height: 1.2em; }

.menu_nav { margin: 0 15px 0 auto; }
.menu_nav ul li a { display: block; padding: 20px 10px;  }
.logo { margin: 12px 0 0 15px; }

.int-col-2 { width: 97.333%; margin: 0.4em; }
.modal-content { width: 90%; height: 85%; } 
.modal-corto { width: 75%; height: auto; }
.imgpago img { width: 100%; height: auto; }
.marcas h3 { font-size: 1.6em; }
.carousel-track img { height: 40px; margin: 0 15px; }

.principal h1 { padding: 3.4rem 0 1rem 1.2rem; font-size: 2.3em; }
.cards-section { width: 98.66%; justify-content: center; gap: 1rem;  }
.card { width: 43.666%;  }
.card h3  { font-size: 20px; }


.card p { height: 50px; }

.col-2 { width: 45.666%; margin: 0.7em 0.5em 1.2em 0.5em; display: inline-block; }
.col-2:nth-child(even) { margin-left: 1.1em; }
.col-2 p { font-size: 1.2em; }
.col-1 { width: 93.666%; }

.verde-oscuro h3 { line-height: 1.1; }
.verde-oscuro p { font-size: 1.2em; }
.staff-imagen img { width: 100px; }

.sec_contactos { padding-bottom: 20%; }
#col_map { width: 98%; margin: 0 auto; }

}


/* Tabletas pequeñas  */
@media (min-width: 768px) and (max-width: 800px) {

.text_slider { width: 80%;}
.text_slider h2 { font-size: 3.4em; line-height: 1.1em; }
.text_slider p { font-size: 1.6em; line-height: 1.2em;}
.menu_nav { margin: 0 15px 0 auto; }
.menu_nav ul li a { display: block; padding: 20px 15px;  }
.logo { margin: 12px 0 0 15px; }

.int-col-2 { width: 46.666%; margin: 0.4em; }
.modal-content { width: 90%; height: 85%; } 
.modal-corto { width: 70%; height: auto; }
.imgpago img { width: 100%; height: auto; }

.principal h1 { padding: 3.4rem 0 1rem 1.2rem; font-size: 2.4em; }
.marcas h3 { font-size: 1.6em; }
.carousel-track img { height: 40px; margin: 0 15px; }

.cards-section { width: 98.66%; justify-content: center; gap: 1rem;  }
.card { width: 22.666%; padding: 50px 8px 22px; }

.card h3 { margin: 7px 0; font-size: 15px; line-height: 1.2; }
.card p { font-size: 12px; height: 70px; }

.col-2 { width: 46.666%; margin: 1em 0.7em 1.8em 0.7em; display: inline-block; }
.col-2:nth-child(even) { margin-left: 1em; }
.col-2 p { font-size: 1.2em; }
.col-1 { width: 96%; }
.col-1 { width: 93.333%; }

.verde-oscuro h3 { line-height: 1.1; }
.verde-oscuro p { font-size: 1.2em; }
.staff-imagen img { width: 110px; }

.sec_contactos { padding-bottom: 20%; }
#col_map { width: 95%; margin: 0 auto; }

}


/* Tabletas  */
@media (min-width: 801px) and (max-width: 1023px) {

.text_slider { width: 90%;}
.int-col-2 { width: 47.333%; margin: 0.4em; }
.modal-content { width: 90%; height: 85%; } 
.modal-corto { width: 500px; height: auto; }
.imgpago img { width: 100%; height: auto; }


.marcas h3 { font-size: 1.6em; }
.carousel-track img { height: 40px; margin: 0 15px; }
.col-2 { width: 46.666%; margin: 1em 0.7em 1.8em 0.7em; display: inline-block; }
.col-2:nth-child(even) { margin-left: 1em; }
.col-2 p { font-size: 1.2em; }
.col-1 { width: 96%; }

.verde-oscuro p { font-size: 1.2em; }

.cards-section { width: 98.66%; justify-content: center; gap: 1rem;  }
.card { width: 22.666%; padding: 50px 8px 22px; }
.card h3 { margin: 7px 0; font-size: 16px; line-height: 1.2; }
.card p { font-size: 13px; height: 70px; }

.sec_contactos { padding-bottom: 15%; }

}


/* Laptops / escritorio (laptops/desktops) */
@media (min-width: 1024px) and (max-width: 1139px) {

.text_slider { width: 90%;}
.int-col-2 { width: 47.333%; margin: 0.4em; }
.modal-content { width: 90%; height: 85%; } 
.modal-corto { width: 540px; height: auto; }
.imgpago img { width: 100%; height: auto; }

.cards-section { width: 99%; gap: 1rem }
.col-2:nth-child(even) { margin-left: 1.8em; }
.col-2 { width: 45.666%; }
.card { width: 23%; }

}

@media (min-width: 1140px) and (max-width: 1279px) {

.text_slider { width: 80%;}
.cards-section { width: 99%; gap: 1rem }
.col-2 { width: 45.666%; }
.card { width: 23%;  }

}


/* ------ hasta  1440 pixeles ------ */
@media screen and (min-width: 1280px) and (max-width: 1440px) {


}