/*------------------------------------------------------------------
[Master Stylesheet]


--------------------------------------------------------------------

[Table of contents]

1. General style
    1.1 Typography
    1.2 Specials Classes
2. Header
    2.1 Menu
    2.2 Burger Button
    2.3 Collapse Navigation
3. Pages Style
4. Home Slider
    4.1 Slider Navigation Buttons
    4.2 Slider Inner Info
  4.3 Pagination
5. Albums
6. Gallery
7. Blog
8. About
9. Contact
10. Footer
11. Responsive Rules

--------------------------------------------------------------------
# Font: 'Yantramanav';
--------------------------------------------------------------------
# Colors: #151515, #df1f29, #555555
------------------------------------------------------------------*/

/**
 * 1. General style
 */
 
/*Text font*/
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
/*Social icons font*/
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
::selection {
    background: #555;   
    color: #fff;
}
::-moz-selection {
    background: #555;    
    color: #fff;
}
body {
    background: #151515;
    padding: 0;
    margin: 0 auto;
    min-height: 100vh;
    font-family: 'Lato', sans-serif;
    color: #151515;
    /* overscroll-behavior: none; */
    /* touch-action: none; */
}
h1, h2, h3, p, a {
    font-family: 'Lato', sans-serif;
}
article,
aside,
details,
figcaption,
footer,
header,
hgroup,
nav,
section {
    display: block;
}
a {
    color: #fff;
    text-decoration: none;
}
blockquote {
    padding: 10px 20px;
    color: #151515;
    font-size: 1.4em;
    font-style: italic;
    font-weight: 300;
    margin: 0 auto 30px;
}
ul {
    list-style-type: none;
    list-style: none;
    padding-left: 0 !important;
    -webkit-padding-start: initial !important;
    -moz-padding-start: initial;
}
menu,
ol,
ul {
    padding: 0 !important;
}
button {
    background: transparent;
    border: none;
}
button:focus {
    outline: none;
}
input,
textarea {
    font-family: 'Gill Sans', sans-serif;
}
textarea {
    padding: 14px;
}
input:focus,
textarea:focus {
    outline: none !important;
    border: 1px solid #df1f29;
    box-shadow: none;
}
input[type="submit"] {
    position: absolute;
    display: inline-block;
    left: 0;
    top: 0;
    opacity: 0;
    z-index: 3;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    cursor: pointer;
}
input[type="submit"]:focus {
    outline: none;
}
img {
    width: 100%;
}

/* 1.1 Typography */

h1,
h2,
h4,
h5,
h6 {
    color: #4EBDCF;
    margin-top: 0;
    text-transform: uppercase;
}
h1 {
    font-size: calc(80px + 1vw);
}
h2 {
    font-size: calc(36px + 16 * (100vw - 992px) / 1508);
}
h3 {
    font-size: calc(28px + 16 * (100vw - 992px) / 1508);
    margin-bottom: 20px;
}
h4 {
    font-size: calc(24px + 16 * (100vw - 992px) / 1508);
    font-weight: 300;
}
h5 {
    font-size: 20px;
    font-weight: 400;
}
h6 {
    font-size: 18px;
    font-weight: 400;
    margin-bottom: calc(10px + 10 * (100vw - 992px) / 1508);
}
p {
    font-size: calc(18px + 2 * (100vw - 992px) / 1508);
    line-height: 1.8;
    font-weight: 300;
}

/* 1.2 Specials Classes */

.c-white {
    color: #fff !important;
}
.navbar-white {
    color: #fff;
    background-color: transparent !important;
}
.center-block {
    display: flex;
    justify-content: center;
}
.align-left {
    text-align: left;
}
.align-right {
    text-align: right;
}
.align-center {
    text-align: center;
    display: block;
}
.socials li {
    display: inline-block;
}
.share-links a {
    font-size: 19px;
    padding: .5em;
}
[class*="socicon-"] {
  display: inline-block;
  color: inherit;
  margin: 0;
  transition: opacity .3s ease;
}
#contact [class*="socicon-"] {
  padding-right: .7em;
}
[class*="socicon-"]:hover {
  opacity: .4;
}
/* 1.3 Button */

.ms-button {
  color: #4EBDCF;
  display: inline-block;
  position: relative;
  padding: .5em 1em;
  margin-bottom: 0;
  font-weight: 400 !important;
  font-size: 14px;
  letter-spacing: .15em;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  text-decoration: none;
  border: solid 1px;
  transition: color .4s ease;
}
.ms-button:after {
    position: absolute;
    display: block;
    content: attr(data-title);
    padding: 7px 0;
    font-size: 14px;
    left: 0;
    top: 0;
    width: 0%;
    background: white;
    color: black;
    text-indent: 1rem;
    transition: all .3s ease;
    overflow: hidden;
    border: none;
    bottom: 0;
}
.ms-button:hover {
  color: #df1f29;
}
.ms-button:active::after,
.ms-button:focus::after,
.ms-button:hover::after {
    width: 100%;
    padding-right: 25px;
}

.ms-btn--slider {
  text-transform: uppercase;
  text-decoration: none;
  position: relative;
  display: flex;
  align-items: center;
  width: 11em;
  font-weight: 600;
  letter-spacing: .15em;
}
.ms-btn--slider::before{
    content: '';
    height: .1rem;
    width: 2rem;
    margin-right: .7rem;
    background: #4EBDCF;
    transition: width .3s ease;
}
.ms-btn--slider:hover::before {
  width: 3rem;
}

/**
 * 2. Header
 */

.ms-header {
    position: fixed;
    width: 100%;
    background-color: #fff;
    z-index: 3;
}
/* 2.1 Menu */

.ms-logo {
    position: relative;
    z-index: 7;
    height: 50px;
}
.logo-dark,
.logo-light {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity .3s ease .4s;
}
.ms-logo.index-logo img {
    width: auto;
    height: 140%;      /* Ajusta la altura según necesites */
    margin-left: -10px;
    margin-top: -720px; /* Puedes modificar este valor para subir o bajar el logo */
    position: absolute;
}
/* 🔹 Estilos generales del logo en el index */
.ms-logo.index-logo img {
    width: auto;
    height: 140%;      /* Mantiene el tamaño adecuado */
    margin-left: -10px;
    position: absolute;
}

/* 🔹 Ajustes RESPONSIVE para MÓVIL */
@media (max-width: 768px) {
    .ms-logo.index-logo img {
        height: 100% !important; /* Reduce el tamaño del logo en móviles */
        margin-top: -830px !important; /* Elimina el margen negativo */
        left: 10px !important; /* Asegura que el logo se quede alineado */
        position: absolute;
        max-width: 120px; /* Limita el tamaño del logo para que no sea enorme */
    }
}
.ms-logo img {
    width: auto;
    height: 140%;
    margin-left: -10px;
    position: relative;
}
.logo-dark.current,
.logo-light.current {
    opacity: 1;
}
.logo-dark.active,
.logo-light.active {
    opacity: 1;
}
.ms-nav {
    padding: 1em 2em;
    color: inherit;
}

/* 2.2 Burger button */

.hamburger {
    margin-right: 0;
    margin-left: auto;
    overflow: visible;
    cursor: pointer;
    z-index: 7;
    border: 0;
    transition-timing-function: linear;
    transition-duration: .3s ease;
    transition-property: opacity, -webkit-filter;
    transition-property: opacity, filter;
    transition-property: opacity, filter, -webkit-filter;
}
.navbar-white .hamburger-label {
    color: black;
}
.hamburger-label {
    display: block;
    font-family: 'Lato', 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 16px;
    width: 100%;
    height: auto;
    position: relative;
    top: 0;
    left: -4em;
    padding-right: 4em;
    text-transform: uppercase;
    line-height: 1.5em;
    transition: color .3s ease .4s;
    color: #151515;
}
.hamburger.is-active .hamburger-label {
    color: #fff !important;
    transition: color .1s ease;
}
.hamburger-box {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 20px;
    vertical-align: middle;
}
.hamburger-inner {
    display: block;
    top: 0;
}
.navbar-white .hamburger-inner,
.navbar-white .hamburger-inner:after,
.navbar-white .hamburger-inner:before {
    background-color: black; /* Establecer el fondo transparente para las tres líneas */
}

.navbar-white .hamburger-inner:before {
    background-color: #4EBDCF; /* Establecer el fondo azul solo para la línea central */
}
.hamburger-inner:after,
.hamburger-inner:before {
    display: block;
    content: '';
}
.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {
    position: absolute;
    width: 30px;
    height: 3px;
    transition: all .3s ease .5s;
}

/* Establece el color blanco para las líneas superior e inferior */
.hamburger-inner, .hamburger-inner:before, .hamburger-inner:after {
    background-color: #090909;
}

/* Establece el color azul para la línea del medio */
.hamburger-inner:before {
    background-color: #4EBDCF;
}

.hamburger-inner:before {
    top: 8px;
    left: -8px;
}
.hamburger-inner:after {
    top: 16px;
    width: 26px;
}
.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner:after {
    background-color: #fff;
    transition-delay: .1s;
}
.hamburger.is-active .hamburger-inner {
    -webkit-transform: translate3d(0, 8px, 0) rotate(45deg);
    transform: translate3d(0, 8px, 0) rotate(45deg);
}
.hamburger.is-active .hamburger-inner:before {
    opacity: 0;
    transition: opacity .3s ease 0s
}
.hamburger.is-active .hamburger-inner:after {
    width: 30px;
    -webkit-transform: translate3d(0, -16px, 0) rotate(-90deg);
    transform: translate3d(0, -16px, 0) rotate(-90deg);
}

/* 2.3 Collapse navigation */

.ms-nav {
    display: flex;
    align-items: center;
}
.height-full-viewport {
    position: fixed;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow-y: auto;
    left: 0;
    top: 0;
    width: 100%;
    height: 0%;
    background-color: #151515;
    z-index: 5;
    overflow: hidden;
    transition: height .8s cubic-bezier(0.3, 1, 0.3, 1) .1s;
}
.ms-navbar {
    z-index: 6;
    margin: 0 auto;
    display: block;
    width: auto;
    height: auto;
    top: 0;
    left: 0;
}
.ms-nav.is-visible .height-full-viewport {
    height: 100vh;
    transition: height 1s ease;
}
.nav-item {
    cursor: pointer;
    padding: .75em;
    opacity: 0;
    width: 240px;
    margin-left: 3em;
    transition: opacity .3s ease;
}
.ms-navbar a {
    display: block;
}
.ms-navbar .ms-btn {
    display: inline-block;
    text-transform: uppercase;
    line-height: 1;
    padding: 0 0.25em;
    position: relative;
}
.ms-navbar .ms-btn {
    font-size: 1.75em;
    letter-spacing: .02em;
    color: #fff;
    font-weight: 700 !important;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.ms-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    height: .1rem;
    top: 50%;
    width: 0;
    transition: width .3s ease;
}
.nav-item__label {
    position: relative;
    display: block;
    margin: 0.5em 0 0 0;
    margin-top: 0.25em;
    padding: 0.5em;
    color: #555;
    transition: color .3s ease;
    text-decoration: none;
}
.nav-item:hover .nav-item__label {
    color: #9a9a9a;
}
.is-visible .nav-item {
    opacity: 1;
    transition: opacity 2s cubic-bezier(0.16, 1.08, 0.38, 0.98) .3s;
}
.nav-item .ms-btn {
    transition: all .3s ease;
}
.nav-item:active .ms-btn,
.nav-item:focus .ms-btn,
.nav-item:hover .ms-btn {
    color: #4EBDCF;
    opacity: 1;
    padding-left: 2.4rem;
}
.nav-item:active .ms-btn::before,
.nav-item:focus .ms-btn::before,
.nav-item:hover .ms-btn::before {
    width: 2rem;
}

/**
 * 3. Pages Style
 */

.ms-preloader {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 8;
    top: 0;
    left: 0;
    opacity: 1;
    visibility: visible;
    background-color: #151515;
}
.ms-main-container {
    position: relative;
    width: 100%;
    min-height: 100vh;
    opacity: 0;
    background-color: #fff;
}
.ms-container {
    width: 100%;
    height: 100%;
    position: relative;
    padding-top: 6em;
}
.ms-section__block {
    background-color: #fff;
    padding: 20px;
    border-radius: 18px;
    box-shadow: 10px 0 10px rgba(78, 189, 223, 0.5), -10px 0 10px rgba(78, 189, 223, 0.5);
    margin: 10px;
}
.ms-section__block12 {
    background-color: black;
    padding: 20px;
    border-radius: 18px;
    box-shadow: 10px 0 10px rgba(78, 189, 223, 0.5), -10px 0 10px rgba(78, 189, 223, 0.5);
    margin: 10px;
    color: #ffffff;
}
.ms-section__block121 {
    background-color: black;
    padding: 20px;
    border-radius: 18px;
    box-shadow: 10px 0 10px rgba(78, 189, 223, 0.5), -10px 0 10px rgba(78, 189, 223, 0.5);
    margin: 110px 6px 1px; /* Ajusta el margen superior según tus necesidades */
    color: #ffffff;
}
.ms-section__block123 {
    background-color: black;
    padding: 20px;
    border-radius: 18px;
    box-shadow: 10px 0 10px rgba(78, 189, 223, 0.5), -10px 0 10px rgba(78, 189, 223, 0.5);
    margin: 10px;
    color: #ffffff;
}
@media (max-width: 767px) {
    .ms-section__block121 {
        background-color: black;
        padding: 6px;
        border-radius: 18px;
        box-shadow: 10px 0 10px rgba(78, 189, 223, 0.5), -10px 0 10px rgba(78, 189, 223, 0.5);
        margin: 130px 10px 1px;
        color: #ffffff;
        /* Agrega otros estilos específicos para pantallas pequeñas si es necesario */
    }
}

.map-container iframe {
    width: 100%;
    height: 200px;
    border: 0;
}
.map-container24 iframe {
    width: 100%;
    height: 300px;
    border: 0;
    position: relative;
    right: 0;
    bottom: -323px;
}
@media (max-width: 767px) {
    .ms-section__block12 {
        padding: 10px; /* Ajusta el relleno según sea necesario para pantallas pequeñas */
    }

    .map-container {
        width: 100%; /* Ajusta el ancho del mapa al 100% del contenedor */
        height: 40%; /* Ajusta la altura del mapa al 60% del contenedor */
    }
}
.ms-page-title span {
    text-transform: uppercase;
    letter-spacing: .15em;
    color: #df1f29;
}
.page-header {
    text-transform: uppercase;
    position: relative;
    margin: 15px auto; /* Se usa "auto" en el margen horizontal */
    width: fit-content; /* Otra opción: establecer el ancho al tamaño del contenido */
}
.page-desc {
    width: 50vh;
    font-size: 1.5em;
    line-height: 1.5;
    color: #151515;
    letter-spacing: .05em;
    text-align: center; /* Alinea el texto al centro */
    margin: 20px auto; /* Centra horizontalmente con márgenes automáticos */
}

/**
 * 4. Home Slider
 */

.home-slider {
    padding-top: 0 !important;
}
.swiper-container {
    overflow: hidden; /* Oculta cualquier desbordamiento para evitar mezcla de slides */
    height: 100vh; /* Establece la altura inicial al 100% del viewport height */
}
.swiper-slide {
    overflow: hidden;
}
.overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 1;
    background: -moz-linear-gradient(top, black 0, transparent 50%, transparent 63%, rgba(0, 0, 0, 1) 100%);
    background: -webkit-linear-gradient(top, black 0, transparent 50%, transparent 63%, rgba(0, 0, 0, 1) 100%);
    background: linear-gradient(to bottom, black 0, transparent 50%, transparent 63%, rgba(0, 0, 0, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#c9000000', GradientType=0);
    transition: all .65s ease;
}
.swiper-slide-duplicate-active .overlay,
.swiper-slide-active .overlay {
    opacity: .4;
}
.slide-inner {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #000;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}
.slide-inner--image {
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: .2;
    transform: scale(1.07);
    -webkit-transition: opacity .6s ease-in-out, transform 2s ease .7s;
    -moz-transition: opacity .6s ease-in-out, transform 2s ease .7s;
    transition: opacity .6s ease-in-out, transform 2s ease .7s;
}
.swiper-slide-duplicate-active .slide-inner--image,
.swiper-slide-active .slide-inner--image {
    opacity: 1;
    transform: scale(1);
}

/* 4.1 Slider navigation buttons */

.swiper-button-prev,
.swiper-button-next {
    text-transform: uppercase;
    color: #fff;
    letter-spacing: .2em;
    line-height: 2em;
    font-size: 12px;
    width: auto;
    height: 24px;
    background-image: none !important;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.swiper-button-prev {
    padding-left: 6em;
    left: 0;
    -webkit-transition: padding-left .3s ease;
    -moz-transition: padding-left .3s ease;
    transition: padding-left .3s ease;
}
.swiper-button-next {
    padding-right: 6em;
    right: 0;
    -webkit-transition: padding-right .3s ease;
    -moz-transition: padding-right .3s ease;
    transition: padding-right .3s ease;
}
.swiper-button-prev::after {
    content: "";
    width: 4em;
    height: 1px;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: calc(50% - 1px);
    -webkit-transition: width .3s ease;
    -moz-transition: width .3s ease;
    transition: width .3s ease;
}
.swiper-button-next::after {
    content: "";
    width: 4em;
    height: 1px;
    background-color: #fff;
    position: absolute;
    right: 0;
    top: calc(50% - 1px);
    -webkit-transition: width .3s ease;
    -moz-transition: width .3s ease;
    transition: width .3s ease;
}
.swiper-button-prev:hover {
    padding-left: 9px;
}
.swiper-button-prev:hover::after {
    width: 75px;
}
.swiper-button-next:hover {
    padding-right: 90px;
}
.swiper-button-next:hover::after {
    width: 75px;
}

/* 4.2 Slider inner info */

.slide-inner--info {
    position: absolute;
    width: auto;
    min-height: 50px;
    bottom: 3em;
    padding-left: 3em;
    color: #fff;
    z-index: 1;
    opacity: 0;
    transition: opacity 1s ease;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.swiper-slide-active .slide-inner--info {
    opacity: 1;
    transition: opacity 1s ease 1s;
}
/* Estilo para la primera línea del h1 (color blanco) */
.slide-inner--info h1::first-line {
    color: #fff; /* Color blanco */
}

/* Estilo para la segunda línea del h1 (color azul) */
.slide-inner--info h1 {
    text-transform: uppercase; /* Convertir el texto a mayúsculas */
    font-weight: 900; /* Peso de la fuente */
    line-height: 1em; /* Altura de línea */
    color: #4EBDCF; /* Color azul */
    margin: 10px 0; /* Margen superior e inferior */
}
.slide--info__link {
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
    border-bottom: solid 2px;
}
.swiper-slide--bottom {
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 0;
    right: 0;
    height: 90px;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
}

/* 4.3 Pagination */

.expanded-timeline {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: right;
        -ms-flex-pack: right;
            justify-content: right;
    z-index: 3;
    bottom: 2.8em;
    right: 3em;
    width: 40vh;
}
.swiper-pagination,
.swiper-pagination-progressbar,
.swiper-pagination-progressbar-fill {
    display: none !important;
    height: 0 !important;
    background: none !important;
}
.swiper-pagination-progressbar-fill {
    background: #fff !important;
}
.expanded-timeline__counter span {
    text-align: center;
    margin-left: 1.8em;
    margin-right: 100%;
    padding: .4em 0;
    color: #fff;
    display: block;
}
.scroll-message {
    position: absolute;
    right: 0;
    color: #fff;
    opacity: .5;
    font-size: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
    letter-spacing: .15em;
}
.scroll-svg {
    width: 24px;
    margin: 0 auto 1.2em;
    display: block;
}

/**
 * 5. Albums
 */

.filtr-container {
    transition: height .5s ease-out;
    overflow: hidden;
}
.filtr-btn {
    display: inline-block;
    margin-bottom: 2.4em;
}
.filtr-btn li {
    cursor: pointer;
    display: inline-block;
    opacity: .5;
    margin-bottom: 15px;
    transition: opacity .3s ease;
}
.filtr-btn h6 {
    margin-bottom: 0;
    padding-right: 1.2em;
}
.filtr-btn li.active {
    opacity: 1;
}
.filtr-btn li:hover {
    opacity: 1 !important;
}
.album-item {
    padding-bottom: 1.8em;
}
.album-item a {
    padding-top: 60%;
    display: flex;
    overflow: hidden;
    position: relative;
    z-index: 9;
}
.album-item__img {
    position: absolute;
    width: 100.5%;
    height: 100%;
    top: 0;
    left: 0;
    background-position: 50% 50%;
    background: no-repeat;
    background-position: center;
    background-size: cover;
    transform: scale(1);
    transition: transform .3s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.album-item__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100.5%;
    height: 100%;
    z-index: 2;
    overflow: hidden;
}
.album-item__cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .7);
    z-index: 1;
    overflow: hidden;
    opacity: 0;
    transition: opacity .3s ease;
}
.album-item__overlay h5 {
    position: relative;
    color: #fff;
    margin: 0;
    max-width: 100%;
    padding: 1em;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
    transform: scale(1.5);
    opacity: 0;
    transition: all .3s ease;
}
.album-item:hover .album-item__img {
    transform: scale(1.1);
}
.album-item:hover .album-item__cover,
.album-item:hover .album-item__overlay h5 {
    opacity: 1;
    transform: translateZ(0);
}

/**
 * 6. Gallery
 */


/**
 * 7. Blog
 */

.ms-right-sidebar {
    display: inline-block;
}
.ms-right-sidebar h5 {
    margin-bottom: 15px;
}
.ms-right-sidebar a {
    display: block;
    border-top: solid 1px rgba(103, 103, 103, .3);
    padding: 15px 0;
}
.ms-right-sidebar a:hover .post-item__title,
.ms-right-sidebar a:hover .post-item__title {
    color: #df1f29;
}
.ms-right-sidebar .post-item__title {
    margin-bottom: 0;
    transition: color .3s ease;
}
.ms-right-sidebar .post-item__date {
    margin-top: .3em;
}
#ms-blog-post img {
    margin-bottom: 30px;
}
.post-item {
    margin-bottom: 3em;
    padding-right: 3em;
}
.post-item:nth-child(2n) {
    padding-right: 15px;
    padding-left: 3em;
}
.post-item__img {
    position: relative;
    overflow: hidden;
}
.album-item__overlay::before,
.post-item__img::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 1;
    background-color: rgb(240, 240, 240);
    transition: opacity 2s cubic-bezier(0.16, 1.08, 0.38, 0.98) 1.2s;
}
.loaded .album-item__overlay::before,
.loaded .post-item__img::before {
    opacity: 0;
}
.post-item__img img {
    width: 100%;
    height: auto;
    max-height: 35em;
    padding: 0;
    display: block;
}
.post-item__img::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    background: rgba(231, 55, 39, 0);
    background: -moz-radial-gradient(center, ellipse cover, rgba(231, 55, 39, 0) 0%, rgba(0, 0, 0, 1) 100%);
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(231, 55, 39, 0)), color-stop(100%, rgba(0, 0, 0, 1)));
    background: -webkit-radial-gradient(center, ellipse cover, rgba(231, 55, 39, 0) 0%, rgba(0, 0, 0, 1) 100%);
    background: -o-radial-gradient(center, ellipse cover, rgba(231, 55, 39, 0) 0%, rgba(0, 0, 0, 1) 100%);
    background: -ms-radial-gradient(center, ellipse cover, rgba(231, 55, 39, 0) 0%, rgba(0, 0, 0, 1) 100%);
    background: radial-gradient(ellipse at center, rgba(231, 55, 39, 0) 0%, rgba(0, 0, 0, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#e73727', endColorstr='#000000', GradientType=1);
    transition: opacity .3s ease;
}
.post-item__info {
    position: relative;
    margin: 2.5em 0 0 2.5em;
}
.post-item__title {
    width: 100%;
    max-width: 400px;
    margin-left: 0;
    margin-right: auto;
    margin-bottom: 20px;
}
.post-item__date {
    margin-left: 0;
    margin-right: auto;
    color: rgba(0, 0, 0, 0.7);
    font-size: 14px;
}
.post-item__link {
    position: absolute;
    width: auto;
    bottom: 0;
    right: 0;
    padding-right: 3em;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: .12em;
    -webkit-transition: padding-right .3s ease;
    -moz-transition: padding-right .3s ease;
    transition: padding-right .3s ease;
}
.post-item__link::after {
    content: '';
    width: 2em;
    height: 1px;
    position: absolute;
    top: calc(50% - 1px);
    right: 0;
    background: red;
    -webkit-transition: width .3s ease;
    -moz-transition: width .3s ease;
    transition: width .3s ease;
}
.post-item:hover .post-item__img::after {
    opacity: .7;
}
.post-item:hover .post-item__link::after {
    width: 3em;
}
.post-item:hover .post-item__link {
    padding-right: 4em;
}
.ms-pagination {
    padding: 0;
    display: flex;
    justify-content: center;
}
.page-item {
    height: auto;
    position: relative;
    display: inline-block;
    margin: 0 .5em;
    border-right: none !important;
}
.page-item:last-child {
    border-right: solid 1px rgba(0, 0, 0, .1);
}
.page-link {
    padding: 1em;
    display: block;
    line-height: 1em;
}

/**
 * 8. About
 */

.about__info {
    justify-content: center;
    display: flex;
    flex-direction: column;
}
.about__info h4 {
    margin: 1em 0;
}
#about .row {
    margin-bottom: 9em;
}

/**
 * 9. Contact
 */

.form-group {
    position: relative;
    margin: 0;
    transition: border-color .3s ease;
}
.form-control {
    position: relative;
    display: block;
    width: 100%;
    padding: 0 1em;
    height: 34px;
    font-size: calc(16px + 2 * (100vw - 992px) / 1508);
    color: #151515;
    font-weight: 300;
    margin-bottom: 2em;
    background-image: none;
    border: 1px solid #555;
}
#message {
    min-height: 15px;
    max-height: 150px;
    max-width: 100%;
    min-width: 100%;
    padding: 10px 14px;
}
label.error {
    position: absolute;
    bottom: 1.2em;
    font-size: 12px;
    color: #df1f29;
}

/**
 * 10. Footer
 */

 *
 {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
     font-family: 'Gill Sans', sans-serif;
 }
 body
 {
     display: flex;
     justify-content: flex-end;
     align-items: flex-end;
     min-height: 100vh;
     background: #333;
 }
 footer
 {
     position: relative;
     width: 100%;
     background: black;
     min-height: 100px;
     padding: 20px 50px;
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: column;
 }
 footer .social_icon,
 footer .menu
 {
     position: relative;
     display: flex;
     justify-content: center;
     align-items: center;
     margin: 1px 0;
     flex-wrap: wrap;
 }
 footer .social_icon li
 footer .menu li
 {
     list-style-type: none;
 }
 footer .social_icon li a
 {
     font-size: 2em;
     color: #4EBDCF;
     margin: 0 10px;
     display: inline-block;
     transition: 0.5s;
 }
 footer .social_icon li a:hover
 {
     transform: translate(-10px);
 
 }
 footer .menu li a
 {
     font-size: 1.2em;
     color: #4EBDCF;
     margin: 0 10px;
     display: inline-block;
     transition: 0.5s;
     text-decoration: none;
     opacity: 0.75;
 }
 footer .menu li a:hover
 {
     opacity: 1;
 }
 footer p
 {
     color: #4EBDCF;
     text-align: center;
     margin-top: 15px;
     margin-bottom: 10px;
     font-size: 1.1em;
 }
 footer .wave
 {
     position: absolute;
     top: -100px;
     left: 0;
     width: 100%;
     height: 100px;
     background-image: url(../images/ico/wave.png);
     background-size: 1000px 100px;
 }
 footer .wave#wave1
 {
     z-index: 1000;
     opacity: 1;
     bottom: 0;
     animation: animatedWave 4s linear infinite
 }
 footer .wave#wave2
 {
     z-index: 999;
     opacity: 0.5;
     bottom: 10px;
     animation: animatedWave_02 4s linear infinite
 }
 
 
 footer .wave#wave3
 {
     z-index: 1000;
     opacity: 0.2;
     bottom: 15px;
     animation: animatedWave 3s linear infinite
 }
 footer .wave#wave4
 {
     z-index: 999;
     opacity: 0.7;
     bottom: 20px;
     animation: animatedWave_02 3s linear infinite
 }
 @keyframes animatedWave
 {
     0%
     {
         background-position-x: 1000px;
     }
     100%
     {
         background-position-x: 0px;
     }
 }
 @keyframes animatedWave_02
 {
     0%
     {
         background-position-x: 0%;
     }
     100%
     {
         background-position-x: 1000px;
     }
 }

/**
 * 11. Responsive Rules
 */

@media only screen and (max-width: 905px) {
    h1 {
        font-size: calc(38px + 1vw);
    }
    h6 {
        font-size: 16px;
    }
    blockquote {
        margin: 0 auto 15px;
        font-size: 1em;
    }
    .expanded-timeline {
        width: 50vh;
    }
    .ms-nav {
        padding-top: 1.4em;
    }
    .ms-navbar .ms-btn {
        font-size: 1.4em;
    }
    .ms-navbar {
        position: relative;
        width: 100%;
        min-height: 100%;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        overflow-y: auto;
    }
    .nav-item {
        display: inline-block;
        width: auto;
        margin-left: 0;
    }
    .nav-item__label {
        display: none;
    }
    .ms-nav {
        padding-left: 15px;
        padding-right: 15px;
        padding-bottom: 1.4em;
    }
    .overlay {
        background: -moz-linear-gradient(top, black 0, transparent 35%, transparent 45%, rgba(0, 0, 0, 0.9) 100%);
        background: -webkit-linear-gradient(top, black 0, transparent 35%, transparent 45%, rgba(0, 0, 0, 0.9) 100%);
        background: linear-gradient(to bottom, black 0, transparent 35%, transparent 45%, rgba(0, 0, 0, 0.9) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#c9000000', GradientType=0);
    }
    .swiper-button-prev,
    .swiper-button-next {
        top: 50vh;
    }
    .swiper-button-prev {
        padding-left: 3em;
    }
    .swiper-button-next {
        padding-right: 3em;
    }
    .swiper-button-prev::after,
    .swiper-button-next::after {
        width: 2em;
    }
    .swiper-button-prev:hover {
        padding-left: 3em;
    }
    .swiper-button-prev:hover::after {
        width: 2em;
    }
    .swiper-button-next:hover {
        padding-right: 3em;
    }
    .swiper-button-next:hover::after {
        width: 2em;
    }
    .expanded-timeline {
        display: none;
    }
    .slide-inner--info {
        width: 100%;
        text-align: center;
        min-height: 50px;
        bottom: 13vh;
        padding-left: 0;
        color: #fff;
        z-index: 1;
        opacity: 0;
        transition: opacity 1s ease;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    .ms-btn--slider {
        margin: 15px auto;
        display: inline-block;
        letter-spacing: .15em;
        background: #fff;
        color: #4EBDCF;
        padding: .5em 0;
    }
    .ms-btn--slider::before {
        content: '';
        display: none;
        width: 0;
    }
    .ms-container {
        padding-top: 6em;
        padding-bottom: 3em;
    }
    .ms-container.home-slider {
        padding-bottom: 0 !important;
    }
    .ms-section__block {
        width: auto;
        margin: 9px 15px 3em;
    }
    .page-desc {
        width: 100%;
        font-size: 1.2em;
        line-height: 1.5;
        color: #151515;
        letter-spacing: .05em;
    }
    .post-item,
    .post-item:nth-child(2n) {
        padding-right: 15px;
        padding-left: 15px;
    }
    #contact > div {
        margin-bottom: 1px;
    }
    #contact > div > iframe {
        width: 300px !important;
        height: 200px !important;
    }
    .ms-footer .copyright {
        margin-left: auto;
    }
    .ms-footer .socials {
        display: none;
    }
}

.footerma {
    background-color: #333;
    padding: 20px 0;
    text-align: center;
}

.social-icons {
    list-style: none;
    padding: 0;
}

.social-icons li {
    display: inline-block;
    margin: 0 10px;
}

.social-icons a img {
    width: 40px;
    height: 40px;
    border: 2px solid #4EBDCF;
    border-radius: 50%;
    transition: transform 0.2s;
}

.social-icons a img:hover {
    transform: scale(1.2);
}

.home {
    position: relative;
    height: 100vh;
    width: 100%;
    background-size: cover; /* Cambiar 'cover' a 'contain' para evitar el zoom */
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden; /* Asegura que el fondo oscuro no se desborde del contenedor */
}

.home:before {
    content: "";
    position: absolute;
    top: 0;
    left: 15%;
    width: 100%;
    height: 100%;
    background: linear-gradient(to left, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0)); /* Degradado desde negro a transparente hacia la izquierda */
}

.home1 {
    background: url('../images/ico/2.jpg') no-repeat center center;
}

.home2 {
    background: url('../images/ico/4.jpg') no-repeat center center;
}

.home3 {
    background: url('../images/ico/1.jpg') no-repeat center center;
}
.home4 {
    background: url('../images/ico/3.jpg') no-repeat center center;
}
/* Versión móvil */
@media(max-width: 768px) {
    .home1 {
        background-image: url('../images/ico/1-min.jpg');
    }

    .home2 {
        background-image: url('../images/ico/3-min.jpg');
    }

    .home3 {
        background-image: url('../images/ico/2-min.jpg');
    }
    .home4 {
        background-image: url('../images/ico/4-min.jpg');
    }

    .home {
        background-size: cover;
        background-position: top center;
    }
}


.home .tittle-block {
    position: absolute;
    top: 40%;
    width: 100%;
    transform: translateY(-50%);
}

.home .tittle-block .logo {
    text-align: center;
}

.home .tittle-block h1 {
    color: #4EBDCF;
    font-size: 72px;
}

.home .tittle-block h2 {
    text-transform: none;
    font-weight: 400;
    color: #e6e6e6;
    font-size: 36px;
}

.home .scroll-down {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
}

@media(max-width: 768px) {
    .home .tittle-block {
        top: 30%;
        text-align: center;
    }

    .home .tittle-block h1 {
        font-size: 43px;
    }

    .home .tittle-block h2 {
        font-size: 24px;
    }
}
.home .tittle-block {
    position: absolute;
    top: 70%;
    left: 40%;
    transform: translate(-50%, -50%);
    text-align: right;
}

.home .tittle-block h1 {
    margin-top: 0; /* Ajusta el valor según sea necesario */
}

.home .tittle-block h2 {
    margin-top: 5px; /* Ajusta el valor según sea necesario */
    margin-left: 18px; /* Ajusta el valor para mover a la derecha */
}
.overlaypopup {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    transition: opacity 500ms;
    visibility: hidden;
    opacity: 0;
}
.overlaypopup:target {
    visibility: visible;
    opacity: 1;
}
.popup {
    margin: 70px auto;
    padding: 20px;
    background: #fff;
    border-radius: 5px;
    width: 30%;
    position: relative;
    transition: all 5s ease-in-out;
}
.popup h2 {
    margin-top: 0;
    color: #333;
    font-family: Tahoma, Arial, sans-serif;
}
.popup .close {
    position: absolute;
    top: 20px;
    right: 30px;
    transition: all 200ms;
    font-size: 30px;
    font-weight: bold;
    text-decoration: none;
    color: #333;
}
.popup .close:hover {
    color: #06D85F;
}
.popup .content {
    max-height: 30%;
    overflow: auto;
}
.custom-page-title {
    text-transform: uppercase;
    position: relative;
    margin: 15px auto;
    width: fit-content;
    font-size: 24px; /* Tamaño de fuente ajustable según tus preferencias */
    font-weight: bold; /* Puedes ajustar el peso de la fuente según tus preferencias */
    color: #4EBDCF; /* Color del texto ajustable */
    font-family: 'Lato', sans-serif; /* Tipo de letra Lato */
    padding-bottom: 5px; /* Espacio opcional en la parte inferior del título */
    border-bottom: 2px solid black; /* Línea de separación opcional */
    text-align: center;
}
/* Estilos del Pop-up */
#popupslider-container {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

#popupslider-content {
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    max-width: 600px;
    text-align: center;
}
  @media (min-width: 768px) {
    .map-container23 {
      min-width: 1000px; /* Ajusta según sea necesario */
      min-height: 900px; /* Ajusta según sea necesario */
    }
  }
  .map-container23 {
    width: 100%;
    height: 0;
    padding-bottom: 75%; /* Ajusta según sea necesario */
    position: relative;
  }
  
  .map-container23 iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: auto;
  }
  .tittle-block123 {
    position: relative;
}

.divisor12 {
    position: absolute;
    bottom: 85px;
    left: 70%;
    width: 30%; /* Ajusta según sea necesario */
    height: 4px;
    background: linear-gradient(to right, white 40%, white 40%, white 60%, #4EBDCF 60%);
    margin: 10px 0; /* Espacio vertical entre las líneas, ajusta según sea necesario */
}
.divisor123 {
    position: absolute;
    bottom: 85px;
    left: 76%;
    width: 26%; /* Ajusta según sea necesario */
    height: 4px;
    background: linear-gradient(to right, white 40%, white 40%, white 60%, #4EBDCF 60%);
    margin: 10px 0; /* Espacio vertical entre las líneas, ajusta según sea necesario */
}
.divisor124 {
    position: absolute;
    bottom: 85px;
    left: 65%;
    width: 35%; /* Ajusta según sea necesario */
    height: 4px;
    background: linear-gradient(to right, white 40%, white 40%, white 60%, #4EBDCF 60%);
    margin: 10px 0; /* Espacio vertical entre las líneas, ajusta según sea necesario */
}
.divisor125 {
    position: absolute;
    bottom: 85px;
    left: 70%;
    width: 30%; /* Ajusta según sea necesario */
    height: 4px;
    background: linear-gradient(to right, white 40%, white 40%, white 60%, #4EBDCF 60%);
    margin: 10px 0; /* Espacio vertical entre las líneas, ajusta según sea necesario */
}
@media screen and (max-width: 820px) {
    .divisor12 {
        bottom: 53px; /* Ajusta según sea necesario para dispositivos móviles */
        left: 64%;
        transform: translateX(-50%); /* Centrar en dispositivos móviles */
        width: 70%; /* Ajusta según sea necesario para dispositivos móviles */
    }
}
/* Estilos para dispositivos móviles */
@media screen and (max-width: 820px) {
    .divisor123 {
        bottom: 54px; /* Ajusta según sea necesario para dispositivos móviles */
        left: 71%;
        transform: translateX(-50%); /* Centrar en dispositivos móviles */
        width: 56%; /* Ajusta según sea necesario para dispositivos móviles */
    }
}
/* Estilos para dispositivos móviles */
@media screen and (max-width: 820px) {
    .divisor124 {
        bottom: 54px; /* Ajusta según sea necesario para dispositivos móviles */
        left: 59%;
        transform: translateX(-50%); /* Centrar en dispositivos móviles */
        width: 80%; /* Ajusta según sea necesario para dispositivos móviles */
    }
}
/* Estilo para dispositivos móviles */
@media only screen and (max-width: 767px) {
    .divisor125 {
        bottom: 50px; /* Ajusta la posición vertical según tus necesidades en dispositivos móviles */
        left: 28%; /* Centra el divisor horizontalmente en dispositivos móviles */
        width: 72%; /* Ajusta el ancho del divisor en dispositivos móviles según tus necesidades */
        margin: 10px 0;
    }
}
/* Estilos adicionales según tus preferencias */
#crmWebToEntityForm {
    position: relative;
    max-width: 80%;
    width: 400px;
    margin: -40px 900px -40px auto; /* Ajusta los valores según tus necesidades */
    text-align: center;
    background-color: white;
    color: black;
    padding: 13px;
    border: 4px solid #4EBDCF;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
}
/* Estilos adicionales según tus preferencias para versión móvil */
@media only screen and (min-width: 300px) and (max-width: 1440px) {
    
    #crmWebToEntityForm {
        width: 80%; /* Ajusta el ancho del formulario en dispositivos móviles según tus necesidades */
        margin: 10px auto; /* Centra el formulario horizontalmente y ajusta el margen superior en dispositivos móviles */
        padding: 10px; /* Ajusta el relleno del formulario en dispositivos móviles según tus necesidades */
        overflow-y: auto; /* Permite el desplazamiento vertical en dispositivos móviles */
        max-height: 67vh; /* Establece la altura máxima del formulario en dispositivos móviles */
    }

    /* ... (otros estilos) ... */
}

    .text-container12 {
        text-align: center;
        position: absolute;
        top: 20%; /* Ajusta la posición vertical según tus necesidades */
        left: 50%; /* Centra horizontalmente el contenedor de texto en dispositivos móviles */
        transform: translateX(-50%); /* Centra horizontalmente el contenedor de texto en dispositivos móviles */
        color: #4EBDCF;
        font-size: 18px; /* Ajusta el tamaño de la fuente para dispositivos móviles */
    }

    /* Estilo para el h1 en dispositivos móviles */
    .text-container12 h1 {
        font-size: 30px; /* Ajusta el tamaño de la fuente para dispositivos móviles */
        margin-bottom: 10px; /* Ajusta el margen inferior según sea necesario */
    }

    /* Estilo para el h3 en dispositivos móviles */
    .text-container12 h3 {
        font-size: 16px; /* Ajusta el tamaño de la fuente para dispositivos móviles */
        margin-bottom: 20px; /* Ajusta el margen inferior según sea necesario */
    }


    .zcwf_col_lab {
        width: 100%; /* Hace que las etiquetas ocupen todo el ancho en dispositivos móviles */
        text-align: center;
        padding-right: 0; /* Elimina el relleno derecho en dispositivos móviles */
    }

    .zcwf_col_fld {
        width: 100%; /* Hace que los campos de entrada ocupen todo el ancho en dispositivos móviles */
        text-align: center;
    }

    .zcwf_button {
        padding: 10px 20px; /* Ajusta el relleno del botón para dispositivos móviles */
        font-size: 14px; /* Ajusta el tamaño de la fuente del botón para dispositivos móviles */
    }
    /* Estilos para dispositivos móviles */
@media (max-width: 768px) {
    .zcwf_col_lab {
        width: 100%; /* Cambia el ancho al 100% en dispositivos móviles */
        text-align: left; /* Cambia el texto a la izquierda en dispositivos móviles */
        padding-right: 0; /* Elimina el espaciado derecho en dispositivos móviles */
    }
}

.ms-section__block-form {
    background-color: #fff;
    padding: 20px;
    border-radius: 18px;
    box-shadow: 10px 0 10px rgba(78, 189, 223, 0.5), -10px 0 10px rgba(78, 189, 223, 0.5);
    margin: 10px;
}

#crmWebToEntityForm input {
    width: calc(120% - 16px); /* Ajusta el ancho de los campos según tus necesidades */
    padding: 8px;
    box-sizing: border-box;
}

.zcwf_row {
    margin-bottom: 5px;
    margin-left: -8%; /* Ajusta el margen izquierdo según tus necesidades */
    /* O puedes usar margin-right para ajustar el margen derecho */
}
.zcwf_row1 {
    margin-bottom: 5px;
    margin-left: 0%; /* Ajusta el margen izquierdo según tus necesidades */
    /* O puedes usar margin-right para ajustar el margen derecho */
}

.zcwf_col_lab {
    display: inline-block;
    width: 40%;
    text-align: right;
    padding-right: 34px;
}

.zcwf_col_fld {
    display: inline-block;
    width: 60%;
}

.form-control {
    width: calc(100% - 16px); /* Ajusta el ancho de los campos según tus necesidades */
    padding: 8px;
    box-sizing: border-box;
    border: 1px solid black;
    border-radius: 4px;
    margin-top: 6px;
    margin-bottom: 16px;
}

.zcwf_button {
    display: inline-block;
    padding: 10px 11px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border: none;
    border-radius: 4px;
    background-color: #4EBDCF;
    color: white;
    margin-left: 10%; /* Ajusta el margen izquierdo según tus necesidades */
    /* O puedes usar margin-right para ajustar el margen derecho */
}
/* Estilos para dispositivos móviles */
@media only screen and (min-width: 300px) and (max-width: 1440px) {
    .zcwf_button {
        font-size: 14px;
        padding: 8px 10px;
        position: absolute; /* o 'relative' según sea necesario */
        top: 520px; /* Ajusta la distancia desde la parte superior */
        left: 80px; /* Ajusta la distancia desde la izquierda */
        width: auto;
    }
}
.zcwf_button1 {
    display: inline-block;
    padding: 10px 11px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border: none;
    border-radius: 4px;
    background-color: #4EBDCF;
    color: white;
    margin-left: 10%; /* Ajusta el margen izquierdo según tus necesidades */
    /* O puedes usar margin-right para ajustar el margen derecho */
}

.zcwf_button:hover {
    background-color: #45a6c0;
}

a {
    color: #4EBDCF;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}
.text-container13 {
    text-align: center;
    position: absolute;
    top: 20%;
    left: 48%;
    color: #4EBDCF;
    font-size: 24px;
    margin-left: 3.5%;
    /* Agrega más estilos según sea necesario */
}

.text-container12 h1 {
    font-size: 60px;
    margin-bottom: 10px;
}

.text-container12 h3 {
    font-size: 40px;
    margin-bottom: 20px;
}

/* Estilo para dispositivos móviles */
@media only screen and (max-width: 1300px) {
    .text-container13 {
        margin-top: -185px;
        margin-left: -81px;
    }

    .text-container13 h1 {
        font-size: 20px;
        margin-left: 15px;
    }

    .text-container13 h3 {
        font-size: 13px;
        margin-bottom: 15px;
        margin-left: 15px;
    }
}
#crmWebToEntityForm input[type='reset'] {
    /* Agrega los estilos que desees para el botón de restablecer */
    color: white;
    background-color: #4EBDCF;
    /* Ajusta el padding y el margin según sea necesario */
    padding: 5px 10px; /* Ajusta los valores de padding según sea necesario */
    margin: 0; /* Sin margen vertical para evitar líneas blancas */
    /* Otros estilos según sea necesario */
}
/* Estilos generales para dispositivos móviles */
@media only screen and (max-width: 767px) {
    .swiper-slide.slide-with-margin {
        position: relative !important;
        height: auto !important;
    }

    .ms-section__block121 {
        position: relative;
    }

    footer {
        position: relative;
        margin-top: 200px; /* Ajusta el margen superior según sea necesario */
    }

    .map-container {
        width: 100%; /* Ajusta el ancho del mapa al 100% */
    }
    
    /* Agrega más estilos según sea necesario para otros elementos en dispositivos móviles */
}
.ms-section__blockcontactanos {
    background-color: black;
    padding: 20px;
    border-radius: 18px;
    box-shadow: 10px 0 10px rgba(78, 189, 223, 0.5), -10px 0 10px rgba(78, 189, 223, 0.5);
    margin: 10px;
    height: 650px; /* Ajusta esta altura según tus necesidades */
}
@media (max-width: 1420px) {
    .ms-section__block {
        padding: 10px;
        margin: 5px;
        height: auto; /* o puedes ajustar a una altura específica si es necesario */
        box-shadow: 5px 0 5px rgba(78, 189, 223, 0.3), -5px 0 5px rgba(78, 189, 223, 0.3);
        border-radius: 10px;
    }
}
.ms-section__blockcontactanos #crmWebToEntityForm {
    /* Tus estilos personalizados van aquí */
    /* Ejemplo: */
    margin-left: 528px; /* Ajustar más a la izquierda */
    padding: 15px; /* Agregar algo de relleno */
    margin-top: 0px;
    /* Otros estilos que necesites */
}
@media only screen and (max-width: 1040px) {
    .ms-section__blockcontactanos #crmWebToEntityForm {
        margin-left: 40px; /* Ajustar a la izquierda para pantallas móviles */
        padding: 10px; /* Relleno reducido para pantallas más pequeñas */
        margin-top: 0px;
        /* Puedes agregar o ajustar más estilos según sea necesario */
    }
}
@media (max-width: 1040px) { /* Ajusta el ancho según el tamaño deseado para la versión móvil */
    .telefono {
      display: inline;
      margin-right: 10px; /* Ajusta el espacio entre los números según sea necesario */
      font-size: 12px; /* Tamaño de fuente más pequeño para dispositivos móviles */
    }
  }
@media (max-width: 768px) { /* Ajusta el ancho según el tamaño deseado para la versión móvil */
    .direccion {
      font-size: 12px; /* Ajusta el tamaño de la fuente según sea necesario */
    }
  }
 @media (max-width: 768px) { /* Media query para la versión móvil */
    .correo {
      font-size: 12px; /* Tamaño de fuente más pequeño para dispositivos móviles */
      position: relative;
      top: -20px; /* Ajusta este valor para subir el título */
    }
  }
/* Tamaño de fuente normal para los h6 */
h6 {
    font-size: 16px; /* Ajusta el tamaño de fuente según sea necesario */
  }
 @media (max-width: 1084px) {
    /* Tamaño de fuente reducido para Dirección en dispositivos móviles */
    .col-md-6:nth-of-type(1) h6 {
      font-size: 13px; /* Tamaño de fuente reducido para Dirección en móvil */
    }
    /* Tamaño de fuente reducido para Teléfono en dispositivos móviles */
    .col-md-6:nth-of-type(2) h6 {
      font-size: 13px; /* Tamaño de fuente reducido para Teléfono en móvil */
    }
    /* Tamaño de fuente reducido para Correo en dispositivos móviles */
    .col-md-6:nth-of-type(3) h6 {
      font-size: 13px; /* Tamaño de fuente reducido para Correo en móvil */
      position: relative;
      top: -15px; /* Ajusta este valor para subir el título */
    }
  }
/* Solo en la página de inicio (index.html) */
.home .ms-header.navbar-white {
    background-color: #fff; /* Fondo blanco en el header */
  }
  .home .hamburger-label {
    color: #fff; /* Texto “Menú” en blanco */
  }