
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Evita el desplazamiento horizontal */
}

.contenedorGeneral {
    display: grid; /*   display: flex;*/
/*    flex-wrap: wrap;*/
  /*   padding-top: 1.5vh; Ajuste relativo del padding superior */
   /* padding-bottom: 0.05vh;  Ajuste relativo del padding inferior */
    width: 100%; /* Ancho del 95% del contenedor padre */
    max-width: 1230px;
    min-height: 700px;
    margin: 0px auto; /* Centrar el contenedor horizontalmente */
    color: transparent !important;
    border: 0.05px solid !important;/*    border: 0.05px solid #999966 !important;*/
    box-sizing: border-box; /* Asegura que el padding no afecte al ancho total */
    background-size: cover;
    background-size: contain;
    margin-top: 0;
   /* line-height: 100px;*/
     padding: 0px 3px;
     
    

    justify-content: center;
    align-items: center;
    color: inherit;
    }
    


.imagenFondo {
  background-image: url("/img/repara.jpg");
  background-size: cover; /* Ajusta la imagen para cubrir todo el contenedor */
  background-repeat: no-repeat; /* Evita que la imagen se repita */
  background-position: center; /* Centra la imagen horizontal y verticalmente */
  background-blend-mode: overlay;
  border: 0.3px solid #999966;
  /*box-shadow: 5px 0px 5px 0px black;*/
  box-shadow: 8px 0px 10px rgba(0, 0, 0, 0.4), -8px 0px 10px rgba(0, 0, 0, 0.4); /* Sombra más oscura */
  width: 100%;
  height: auto;
  display: block;
  position: relative; /* Añadido para posicionar el texto */
}

.imagenFondo1 {
/*    position: relative;*/
    background-image: url("/img/lava3.jpeg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;  /*center top;/ center bottom;/  Inicia la imagen desde la parte superior */
    background-attachment: fixed;
    background-blend-mode: overlay;
    width: 100%;
    height: 90vh;
/*    margin: 0;
    padding: 0;*/
/*    background-color: rgba(0,0,0,0.3);*/
}



.imagenFondoAlsika {
/*    position: relative;*/
    background-image: url("/img/lava3.jpeg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;  /*center top;/ center bottom;/  Inicia la imagen desde la parte superior */
    background-attachment: fixed;
    background-blend-mode: overlay;
    width: 100%;
    height: 60vh;
     overflow: hidden; /* Evita que algo sobresalga */
/*    margin: 0;
    padding: 0;*/
/*    background-color: rgba(0,0,0,0.3);*/


}

/* Div de contenido dentro de la imagen */
.imagenFondoAlsika .contenidoFondo {
    position: absolute;
    top: 50%;           /* Centrado vertical aproximado */
    left: 50%;          /* Centrado horizontal */
    transform: translate(-50%, -50%);
    color: white;
    text-align: center;
    padding: 1rem;
    width: 90%;         /* Ajusta el ancho dentro del contenedor */
    max-height: 90%;    /* Para no exceder la altura del contenedor */
    overflow: auto;     /* Scroll interno si el contenido es muy grande */
    background-color: rgba(0,0,0,0.4); /* Opcional: un overlay para destacar el texto */
    border-radius: 0.5rem;
}


.imagenFondoIndex{
    background-image: url("/img/lg.jpg");
        background-size: cover;
/*    background-size: contain;  Ajusta la imagen al contenido */
    background-repeat: no-repeat;
    background-position: center bottom; /* Posiciona la imagen en el centro y en la parte inferior */
/*    background-color: rgba(255, 255, 255, 0.5);  Color blanco con 50% de opacidad */
/*    border: 1.5px solid #999966;*/
/*    box-shadow: 5px 0px 5px 0px black;*/
    background-attachment: fixed; /* Fija la imagen de fondo */
   /* height: 120vh;  Altura del 100% de la ventana visible */
/*    display: flex;
    flex-wrap: wrap;*/
    width: 99%; /* Ancho del 100% del padre */
     /*max-width: 4730px; Ancho máximo para el diseño */
    max-width: 1230px; /*  Ancho máximo para el diseño */
    margin: 0 auto; /* Centrar el contenedor horizontalmente */
  
}


.imagenFondoTaller {
  position: relative;
  overflow: hidden;
  /*   height: 100vh;   para que ocupe toda la ventana visible */
}

.imagenFondoTaller::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("/img/Repair.jpg");
  background-size: cover;
  background-position: center;
  z-index: -1; /* Se queda atrás */
}

.imagenFondoService {
  position: relative;
  overflow: hidden;
  /*   height: 100vh;   para que ocupe toda la ventana visible */
}

.imagenFondoService::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("/img/lg.jpg");
  background-size: cover;
  background-position: center;
  z-index: -1; /* Se queda atrás */
}

.containerService{
    display: flex;
    flex-wrap: wrap;
      padding-top: 45vh; 
    /*padding-top: 0vh;  Ajuste relativo del padding superior */
    padding-bottom: 0; /* 2vh;  Ajuste relativo del padding inferior */
    width: 100%; /* Ancho del 95% del contenedor padre */
    max-width: 1230px; /* Ancho máximo para el diseño */
    margin: 0 5px; /* Centrar el contenedor horizontalmente */
/*    color: #91b9d0;*/
    box-sizing: border-box; /* Asegura que el padding no afecte al ancho total */
    background-size: cover;
    background-size: contain;
}

.imagenFondoCont{
    background-image: url("/img/lg.jpg");
    background-repeat: no-repeat;
    background-position: center bottom; /* Posiciona la imagen en el centro y en la parte inferior */
/*    background-color: rgba(255, 255, 255, 0.5);  Color blanco con 50% de opacidad */
    background-attachment: fixed; /* Fija la imagen de fondo */
    width: 100%; /* Ancho del 100% del padre */
    margin: 0 auto; /* Centrar el contenedor horizontalmente */

}

.containerCont {
    height: 205vh;  
    padding: 10px; 
    line-height: 1px;
    display: flex;
}

.servicioTecnicoCont {
    top: 55%; /* Ajusta según tu diseño */
    left: 35%;
    transform: translate(-50%, -50%);
    color: rgba(351, 243, 4);
    font-size: 7em;
    position: absolute;
    z-index: 0;
    text-align: center;
    background-position: center 100%;
    text-shadow: 6px 6px 0 #000, -4px -4px 0 beige;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
}
.icon2servicioTecnicoCont {
    position: absolute;
    top: 50%; /* Ajusta según tu diseño */
    left: -19%;
    transform: translate(-50%, -50%);
    z-index: 1; /* Asegura que esté delante del texto */
}
.solicitarService {
    padding: -0px; /* Reducido el tamaño del margen interno */
    display: flex;
    transform: translate(0, -50%);
    line-height: 1; /* Ajustado para eliminar interlineados */
    text-align: center;
    font-size: 4vh; /* font-size: 2.5vh;*/
  /*   text-shadow: 1.2px 1.1px 0 #000, -0.4px -0.4px 0 beige; #222f5b;  #91b9d0;  */
    font-weight: bold;
    position: flex;
    text-align: center;
    padding: 0 10px;
    color: #3b5988;  /*rgb(255, 255, 255);*/
    text-shadow: 1px 1px 0 #333, 1px 1px 0 #333, 1px 1px 0 #333, 1px 1px 0 #333;
}

.container {
    display: flex;
    flex-wrap: wrap;
   /*  padding-top: 1vh;   Ajuste relativo del padding superior */
   /*   padding-bottom: 0.05vh;Ajuste relativo del padding inferior        COMENTE ESTO PARA QUE NO SOBRE  */
    width: 100%; /* Ancho del 95% del contenedor padre */
    max-width: 100%;
    margin: 0; /* Centrar el contenedor horizontalmente */
/*    color: #91b9d0;*/
    box-sizing: border-box; /* Asegura que el padding no afecte al ancho total */
    background-size: cover;
    background-size: contain;
    padding: 0px 0px;
    gap: 10px;   /*Ajusta según sea necesario */
    grid-template-columns: 1fr 1fr;
   
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.15),
                4px 0px 10px rgba(0, 0, 0, 0.4), 
                -4px 0px 10px rgba(0, 0, 0, 0.4);
   /* border: 0.3px solid #999966;*/
}
/* Aplica solo al formulario de filtros dentro de .container-xxl COOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOPPPPPPPPRRRRRRRRRRRRAAAAAAAAAAAAAAAARRRRRRRRRR*/
.container-xxl .filtros label,
.container-xxl .filtros select,
.container-xxl .filtros input {
  width: 100% !important;      /* Que ocupen todo el ancho disponible */
  max-width: 100% !important;  /* Evita desbordes */
  margin-top: 1rem;            /* Espaciado uniforme */
  box-sizing: border-box;      /* Asegura que padding y border no rompan el ancho */
  
 
}

.containerIndex {
    display: flex;
    flex-wrap: wrap;
 /*   padding-top: 1.5vh;  Ajuste relativo del padding superior */
    padding-bottom: 0.05vh; /* Ajuste relativo del padding inferior */
    width: 100%; /* Ancho del 95% del contenedor padre */
/*    max-width: 1230px;*/
    margin: 0 auto; /* Centrar el contenedor horizontalmente */
/*    color: #91b9d0;*/
    box-sizing: border-box; /* Asegura que el padding no afecte al ancho total */
    background-size: cover;
    background-size: contain;
    padding: 0px 3px;
    gap: 10px; /* Ajusta según sea necesario */
    grid-template-columns: 1fr 1fr;
}
 .repuestos-container {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1rem;
    font-weight: 500;
  }

  .repuesto-item {
    display: flex;
    align-items: center;
/*    background-color: #f3f3f3;*/
    padding: 0.3rem 0.6rem;
    border-radius: 5px;
    font-size: 0.95rem;
  }

  .repuesto-item::before {
    content: '🛠️️';
    margin-right: 0.5rem;
  }
  
.containerTaller {
    display: flex;
    flex-wrap: wrap;
    padding-top: 45vh;  /* 50vh; Ajuste relativo del padding superior */
    padding-bottom: 0; /*0.001vh; Ajuste relativo del padding inferior */
    width: 100%; /* Ancho del 95% del contenedor padre */
    max-width: 1230px;
    margin: 0 auto; /* Centrar el contenedor horizontalmente */
/*    color: #91b9d0;*/
    box-sizing: border-box; /* Asegura que el padding no afecte al ancho total */
    background-size: cover;
    background-size: contain;
}

.contenedorGeneral {
    display: grid; /*   display: flex;*/
/*    flex-wrap: wrap;*/
  /*   padding-top: 1.5vh; Ajuste relativo del padding superior */
   /* padding-bottom: 0.05vh;  Ajuste relativo del padding inferior */
    width: 100%; /* Ancho del 95% del contenedor padre */
    max-width: 1230px;
    min-height: 700px;
    margin: 0px auto; /* Centrar el contenedor horizontalmente */
    color: transparent !important;
    border: 0.05px solid !important;/*    border: 0.05px solid #999966 !important;*/
    box-sizing: border-box; /* Asegura que el padding no afecte al ancho total */
    background-size: cover;
    background-size: contain;
    margin-top: 0;
   /* line-height: 100px;*/
     padding: 0px 3px;
     
    
   /* border: 0.3px solid #999966;*/
 /*     box-shadow: 8px 0px 6px rgba(0, 0, 0, 0.4), -8px 0px 6px rgba(0, 0, 0, 0.4); Sombra más oscura */
    /* Sombra */
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.15),
                4px 0px 10px rgba(0, 0, 0, 0.4), 
                -4px 0px 10px rgba(0, 0, 0, 0.4);
    
    justify-content: center;
    align-items: center;
    color: inherit;
    }
    


.containerContacto {
     display: flex;
    flex-wrap: wrap;
    padding-top: 0vh;  /*  Ajuste relativo del padding superior */
    margin: 0 auto; /* Centrar el contenedor horizontalmente */
    flex-wrap: wrap;       /* Permite que las columnas se adapten en pantallas pequeñas */
   /* padding-top: 6vh;  Ajuste relativo del padding superior */
    padding-bottom: 0.1vh; /* Ajuste relativo del padding inferior */
    width: 100%; /* Ancho del 95% del contenedor padre */
    max-width: 1230px;
/*    min-height: 700px;*/
/*    color: #91b9d0;*/
    box-sizing: border-box; /* Asegura que el padding no afecte al ancho total */
    margin-top: 0;
}
/*.containerContacto .home-step__title {
    margin-t: -100px;   igual que el inline que tenías 
    text-align: center;      o start/end según pantalla 
    color: #021d49;
}*/
/* Título Soporte-Alsika dentro del contenedor de contacto */
.containerContacto .home-step__title h2 {
    color: #021d49;
    white-space: nowrap;
    text-align: center;
    margin-top: 0; /* Ajusta según necesites */
    margin-top: -8rem;
}


/*  Ajustar títulos y subtítulos si es necesario 
    .containerContacto .col-md-6.p-4.text-body-emphasis h2,
    .containerContacto .col-md-6.p-4.text-body-emphasis h6 {
        margin-top: 0rem;       Evita que se monten sobre otros elementos 
        font-size: 1.2rem;      Ajusta tamaño de texto para móviles 
        
    }*/
/* Columna izquierda: formulario */
.containerContacto .col-md-6.col-12.mb-4 .cardCont {
    width: 550px;       /* Ancho fijo en escritorio */
    max-width: 100%;    /* No exceder el ancho de la columna en pantallas pequeñas */
    margin: 0 auto;     /* Centrar horizontalmente */
    box-sizing: border-box;
    margin-top: -50px;
}

/* Inputs y select: ancho completo dentro del formulario */
.containerContacto .col-md-6.col-12.mb-4 .cardCont input,
.containerContacto .col-md-6.col-12.mb-4 .cardCont select,
.containerContacto .col-md-6.col-12.mb-4 .cardCont textarea {
    width: 100%;        /* Ocupa todo el ancho del formulario */
    box-sizing: border-box;
}

/* Botón enviar */
.containerContacto .col-md-6.col-12.mb-4 .cardCont .footer .button {
    display: inline-block;
    padding: 0.5rem 1.5rem;
    background-color: #3f9db8;
    color: #fff;
    border: none;
    cursor: pointer;
}
/*
 Columna izquierda: formulario 
.containerContacto .col-form {
    flex: 1 1 50%;          Ocupa 50% del contenedor, se adapta 
    padding: 1rem;
    box-sizing: border-box;
}*/

/* Columna derecha: imagen y texto */
.containerContacto .col-imagen {
    flex: 1 1 50%;         /* Ocupa 50% del contenedor */
    padding: 1rem;
    text-align: center;
    box-sizing: border-box;
}

.containerContacto .col-md-6.p-4.text-body-emphasis img {
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    
}

.containerConsulta {
    display: flex;
    flex-wrap: wrap;
   /* padding-top: 20vh;  Ajuste relativo del padding superior */
   /* padding-bottom: 1.05vh;  Ajuste relativo del padding inferior */
 /*    width: 100%; Ancho del 95% del contenedor padre */
/*    max-width: 1230px;*/
    margin: 0 auto; /* Centrar el contenedor horizontalmente */
/*    color: #91b9d0;*/
    box-sizing: border-box; /* Asegura que el padding no afecte al ancho total */
    background-size: cover;
    background-size: contain;
    padding: 0px 3px;
    width: 90%; 
    margin-top: -70px; 
    margin-left: 50px;
}




.containerblog {
    display: flex;
    flex-wrap: wrap;
    padding-top: -16vh; /* Ajuste relativo del padding superior */
    padding-bottom: 0.1vh; /* Ajuste relativo del padding inferior */
    width: 99.5%; /* Ancho del 95% del contenedor padre */
    max-width: 1230px; /* Ancho máximo para el diseño */
    margin: 0 auto; /* Centrar el contenedor horizontalmente */
/*    color: #91b9d0;*/
    box-sizing: border-box; /* Asegura que el padding no afecte al ancho total */
    
}

.containerHeader {
    
   height: 47vh;   /*  height: 55vh; height: 290px;   */
   /* max-height: 140%;  max-height: 500px; */
    box-shadow: 100px 100px 300px 2px black;     /*   100px 100px 255px 50px black;  VER QUE ONDA MODIFICAR LOS DOS PRIMEROS */
/*    border: 5.5px solid transparent;                */
    padding: 10px; 
    line-height: 1px;
    padding-top: 0px;
    padding-bottom: 0px;                                 
    
}
/*---------------NABVAR ----------------------*/

.nav-item1 {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-right: 2em;
}

.nav-item1 .nav-link {
    position: relative;
    text-decoration: none;
}

.nav-item1 .nav-link::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 3px;
    background-color: rgb(187, 187, 187);
    /* Color del subrayado */
    transition: width 0.3s ease-in-out;
    flex-direction: row;
}

.nav-item1 .nav-link:hover::after {
    width: 100%;
}

.noscroll {
    overflow: hidden;
}
/*-------------------nabvar-------------------------------------*/
.navbar1 {
    flex-direction: row;
}

.nav-item1 {
    position: relative; /* Necesario para posicionar el submenú */
}

.submenu {
    display: none;
    position: absolute;
    top: 100%; /* Alinea el submenú justo debajo del menú principal */
    left: 0;
    background-color: #fff;
    list-style-type: none;
    padding: 0;
    margin: 0;
    border: 1px solid #ccc;
    width: 180px; /* Ajusta el ancho del submenú si es necesario */
    z-index: 1; /* Asegura que el submenú esté encima de otros elementos */
}

.nav-item1:hover .submenu {
    display: block; /* Muestra el submenú cuando se pasa el cursor */
}

.submenu li a {
    padding: 8px 16px;
    text-decoration: none;
    display: block;
    color: #333;
}

.submenu li a:hover {
    background-color: #f1f1f1; /* Color de fondo cuando se pasa el cursor por encima */
}
/*---------------------------------------------------------------------------------*/

/* Publisher Create */
.bg-venta {
    background: rgb(33,37,41);
    background: linear-gradient(180deg, rgba(33,37,41,1) 56%, rgba(59,66,73,1) 100%); 
}

/*Parte de abajo*/
.contenedor {
    display: flex;
    flex-wrap: wrap; /* Permitir el ajuste automático de elementos en varias filas */
    justify-content: space-between; /* Distribuir uniformemente los elementos */
    overflow: hidden; /* Evitar el desbordamiento horizontal */
    gap: 2px; /* Ajusta según sea necesario */
   /*  flex: 100; O usa un ancho fijo si prefieres */
   grid-template-columns: 1fr 1fr;
   flex-direction: row;
}

.home-step {
    margin: 0 auto; /* Centra en el contenedor */
    max-width: 1200px; /* Ajusta según sea necesario */
    position: relative; /* Necesario para el posicionamiento absoluto de los íconos */
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: center;
     width: 22%; /* Ajusta el ancho de los elementos para que quepan en una fila */
     box-sizing: border-box;
     padding: 2px;
                 
}

.home-steps {
    top: -5px;   /*    top: -50px;       SE MODICO PARA ICONOS MARQUETINADOS*/
    display: flex;
    flex-direction: column;
    font-family: nunito-sans,sans-serif;
    justify-content: center;
/*    padding-top: 3rem;           he comentado por espacios*/
    color: inherit; /* Asegura que herede el color */
     flex-wrap: wrap; /* Permite que los elementos se ajusten en varias filas */
     gap: 0; /* Espacio entre los elementos */
     justify-content: space-around; /* Espacio equitativo entre los elementos */
     flex-direction: column;
}


.home-steps__section {
    align-items: left;
    display: flex;
    margin-bottom: 0;
    color: inherit; /* Asegura que herede el color */
    justify-content: space-between; /* Esto coloca los elementos al inicio y al final del contenedor */
    flex-wrap: wrap; /* Esto permite que los elementos se ajusten automáticamente en varias filas si el ancho del contenedor es insuficiente */
}

.horizontal-layout {
    display: flex; /* Utiliza Flexbox para el diseño */
    flex-wrap: wrap; /* Permitir el ajuste automático de elementos en varias filas */
    justify-content: space-between; /* Distribuir uniformemente los elementos */
    align-items: center; /* Alinear los elementos verticalmente en el centro */
    flex-direction: row; /* Asegura que estén en fila */
}

.horizontal-layout-social {
    display: flex;
    flex-direction: row; /* Asegura que estén en fila */
    align-items: center;
    gap: 10px; /* Espacio entre los iconos */
    list-style: none;
    padding: 0;
    margin: 0;
}
/*.home-steps.horizontal-layout {
    border: 3.5px dashed #46b3d1;    Línea punteada 
    border-radius: 16px;
    background-color: #f9f9f9; 
    padding: 10px 20px;  achico arriba y abajo 
    height: 130px;   altura fija 
}*/

.home-steps.horizontal-layout {  /*********************AGREGADO PARA ICONOS MARQUETINEROS*********************/
    border: 3.5px dashed #46b3d1;   /* Línea punteada */
    border-radius: 16px;
    background-color: #f9f9f9;      /* Fondo claro para resaltar */
    
  /*  margin-top: 0px;  */  
    display: inline-flex;  /* se ajusta al contenido */
    align-items: center;   /* centra verticalmente los iconos */
    width: fit-content;    /* hace que el ancho se adapte al contenido */
     padding: 45px -10px -30px -10px; 
    /* ↑ arriba | → derecha | ↓ abajo | ← izquierda */
    
    
    
    
    flex-direction: row;             /* Iconos en fila */
    justify-content: center;         /* Centrado horizontal de los iconos */
    flex-wrap: wrap;                 /* Permitir que los iconos bajen a la siguiente fila si hace falta */
    width: fit-content;              /* El contenedor se ajusta al contenido */
    margin: 30px auto;               /* Centrado horizontal y un margen arriba/abajo */
    padding: 30px 20px;              /* Espaciado proporcional arriba/abajo y a los lados */
    
    
    padding: 20px 20px;  /* Reduce el padding arriba/abajo y a los lados */
    margin: 20px auto;   /* Centrado horizontal con menos margen arriba/abajo */
}

.home-step__title {  
    background-color: transparent; /* Hacer el fondo transparente */
    border: none;  /* Quitar el borde */
    color:  #021d49;/* royalblue; #0d6efd; #3d33cc; #e4405f; #021d49; #414848;  Color del texto   #021d49; */
    font-family: canada-type-gibson, sans-serif; /* Asegurarte de usar la fuente deseada */
    font-size: 13px;  /* Tamaño del texto */
    font-weight: 600;  /* Grosor del texto */
    line-height: 32px; /* Altura de línea */
    cursor: pointer;  /* Cambiar el cursor al pasar por encima */
    padding: 10px 20px;  /*Añadir algo de espacio alrededor del texto */
    text-align: left;  /* Alinear el texto a la izquierda */
    white-space: nowrap; /* Evitar que el texto se rompa en varias líneas */
     position: relative;
     display: flex; /* Cambiado a flex para mejor manejo del contenido */
     flex-wrap: wrap; /* Permite que el contenido se ajuste en varias líneas */
     background-size: cover;
     justify-content: center;
     box-sizing: border-box; /* Incluye padding y border en el tamaño total */
}


.home-step__title:hover {
    color: #414848; /* #99999888; Cambiar el color al pasar el cursor */ /* royalblue; #0d6efd; #3d33cc; #e4405f; #021d49; #414848;  Color del texto   #021d49; */
}

.home-step__text {
    flex-direction: row;
    margin-left: 24px;
    color: #021d49;  /*inherit;  Asegura que herede el color */
    flex-grow: 1; /* Asegura que el texto ocupe el espacio disponible */
}
.home-step__titlePrinc {  
    background-color: transparent; /* Hacer el fondo transparente */
    border: none; /* Quitar el borde */
    color:  #3b5988;  /* #021d49;Color del texto */
    font-family: canada-type-gibson, sans-serif; /* Asegurarte de usar la fuente deseada */
     font-size: 16px;  /* Tamaño del texto */
    font-weight: 600;  /* Grosor del texto */
    line-height: 32px; /* Altura de línea */
    cursor: pointer;  /* Cambiar el cursor al pasar por encima */
    padding: 10px 20px;  /*Añadir algo de espacio alrededor del texto */
    text-align: left;  /*Centrar el texto */
    align-content: center;
    margin-top: 10px;
    
    text-shadow: 1.2px 1.1px 0 #000, -0.4px -0.4px 0 beige;  /*#222f5b;  #91b9d0;  */
    font-weight: bold;
    flex-wrap: wrap;
    overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */
    word-wrap: break-word; /* Permite que las palabras largas se dividan */
    text-align: initial;
}

.parte_baja {
    bs-gutter-x: 1rem;
    bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: auto;
    margin-right: auto;
    margin-left: auto;
}

.home-step__description {
    color: transparent; /* Hace que el texto no sea visible */
}

.contenedor .home-step {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    width: calc(25% - 32px); /* Ajusta el ancho de cada elemento para que haya 4 elementos por fila */
}

.share-buttons {
    display: none; /* Oculta los botones de compartir por defecto */
    position: absolute;
    top: -19px; /* Coloca los botones de compartir encima del botón principal */
                                     right: 10px;     /* Los coloca pegados a la derecha */
    left: 75px;  /* 5%;      10px 15px; */
    transform: translateX(-50%);
    width: auto;
    padding: 13.2px;
    background-color: #9999666; /* Color de fondo para los botones de compartir */
    border-radius: 5px;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1); /* Sombra para resaltar los botones */
   
}

.home-step:hover .share-buttons {
    display: flex; /* Muestra los botones de compartir al pasar el mouse sobre .home-step */
                        justify-content: flex-end; /* Alinea los botones a la derecha dentro del contenedor */
}

.home-step:hover .home-step__icon {
    opacity: 0.7; /* Reduce la opacidad de la imagen al pasar el mouse */
      box-sizing: border-box;
}

.list-unstyled {
    display: flex;
    justify-content: flex-end;
    color: #021d49;
    margin: 0;
    padding: 0;
}

.list-unstyled li {
    list-style-type: none;
    margin-left: 10px; /* Ajusta el espaciado entre los elementos de la lista */
}

.d-flex {
    display: flex;
    align-items: center; /* Asegura la alineación vertical de los íconos */
}

.ms-auto {
    margin-left: auto;
}

.ms-3 {
    margin-left: 1rem; /* Ajusta según lo necesites */
}

a svg {
    vertical-align: middle; /* Asegura que los íconos se alineen en el medio */
}


/*FIN parte de horizontal-layout */


    .home-step__titlePrinc {   /*Titulos páginas */
/*        top: -18px;*/
        background-color: transparent; /* Hacer el fondo transparente */
        border: whitesmoke;  /* Quitar el borde */
        color: #021d49;  /*Color del texto */
        font-family: canada-type-gibson, sans-serif; /* Asegurarte de usar la fuente deseada */
       /*   font-size: 16px; Tamaño del texto */
        font-size: 55px;
        font-weight: 600;  /* Grosor del texto */
        line-height: 32px; /* Altura de línea */
        cursor: pointer;  /* Cambiar el cursor al pasar por encima */
        padding: 10px 20px;  /*Añadir algo de espacio alrededor del texto */
        text-align: left;  /*Centrar el texto */
        text-align: center; /* Centrar el texto horizontalmente */
        position: relative; /* Asegurar que la propiedad 'top' funcione */
    }

.home-steps_Princ {
/*    top: -30px;*/
    top: -18px;
    display: flex;
    flex-direction: column;
    font-family: nunito-sans,sans-serif;
    justify-content: center;
    padding-top: 3rem;
    color: inherit; /* Asegura que herede el color */
    position: relative; /* Asegurar que la propiedad 'top' funcione */
}


 .shine {
            position: relative;
            display: inline-block;
            font-size: 30px;
            color: #021d49;  /*#000; */
            background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
            background-size: 200%;
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            animation: shine 6s linear infinite;
            margin-top: 175px;
            text-align: center;
            top: -10px;
        }

        @keyframes shine {
            0% {
                background-position: 200%;
            }
            100% {
                background-position: -200%;
            }
        }
        .shinedos {
            position: relative;
            display: inline-block;
            font-size: 30px;
            color: #021d49;  /*#000; */
            background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
            background-size: 200%;
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            animation: shine 4s linear infinite;
            text-align: center;
            margin-top: 140px;
            top: 50%;
        }

        @keyframes shinedos {
            0% {
                background-position: 200%;
            }
            100% {
                background-position: -200%;
            }
        }
        
.servicioTecnico {
    top: 60.5%;    /*Ajusta según tu diseño */
    left: 35%;  /* left: -19%; */
    transform: translate(-50%, -50%);
    color: rgba(351, 243, 4);
    font-size: 6.5em;
    position: absolute; /* position: absolute;*/
/*    position: fixed ;*/
    z-index: 0;
    text-align: center;
    background-position: center 100%;
    text-shadow: 6px 6px 0 #000, -4px -4px 0 beige;
/*    display: flex;*/
    flex-direction: column; /* flex-direction: column; row;*/
    justify-content: center;
    align-items: baseline;
 /*    flex: 1;
    text-align: center;*/
}

.Icon2servicioTecnico {
    position: absolute;  /* position: absolute;*/
    top: 35%; /*Ajusta según tu diseño */
    left: -17%;  /*    left: -19%; */
    transform: translate(-50%, -50%);
    z-index: 1;  /* Asegura que esté delante del texto */
    flex-direction: column; /* flex-direction: column; row;*/
    align-items: baseline;
    justify-content: center;
}

.textoSuperpuesto {   
/*    background-color: #99998866;*/
    color: #3b5988;    /* beige; #91b9d0;*/
    position: absolute;
    top: 73%;
/*    right: 50%;*/
    left: 8.5%;
    padding: -0px; /* Reducido el tamaño del margen interno */
    display: flex;
    transform: translate(0, -50%);
    line-height: 1; /* Ajustado para eliminar interlineados */
    text-align: center;
    font-size: 3.5vh; /* font-size: 2.5vh;*/
    text-shadow: 1.2px 1.1px 0 #000, -0.4px -0.4px 0 beige;  /*#222f5b;  #91b9d0;  */
    font-weight: bold;
    flex-wrap: wrap;
    overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */
    word-wrap: break-word; /* Permite que las palabras largas se dividan */
    text-align: initial;
    
}



.textoSuperpuestoDer {
    background-color: #99998866;
    color: black;           /*  rgba(351,243,4); */
    position: absolute;
    top: 45%;
    right: 7%;
    transform: translate(0, -50%);
    width: 280px;
    height: 210px;
    text-align: center;
    font-size: 2.8vh;
    text-shadow: 1px 1px 0 #000, -1px -1px 0 beige;
    font-weight: bold;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;    
}

/*.textoSuperpuestoDer1 {
    top: 11%;
    right: 14.5%;
    width: 350px;
    height: 210px;
    display: flex;
    justify-content: center;
    align-items: center;
}*/


  .textoSuperpuestoDer1 {
    background-color: #99998866;
    color: black;           /*  rgba(351,243,4); */
    position: absolute;
     top: 11%; /*    top: 42%; */
    right: 14.5%;
    transform: translate(0, -50%);
    width: 350px;
    height: 210px;
    text-align: center;
    font-size: 3.2vh;
    text-shadow: 1px 1px 0 #000, -1px -1px 0 beige;
    font-weight: bold;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;    
}


.telefono {
    display: flex; /* Para activar el flexbox */
    align-items: center; /* Centra los elementos verticalmente */
}

.telefono img {
    margin-right: 10px; /* Añade un margen derecho entre la imagen y el texto */
}

.telefono a {
    color: rgba(351, 243, 4); /* Color del número de teléfono */
    text-shadow: 1px 1px 0 #000, -0px -0px 3 black; /* Sombra del texto */
}

.telefono a:hover,
.telefono a:active {
    color: rgba(351, 243, 4); /* Cambio de color al pasar el mouse o al hacer clic */
    text-shadow: 1px 1px 0 #000, -0px -0px 0 black; /* Cambio de sombra */
}



.ventaRep { /*ABAJO*/
/*  top: 102.5%;*/
  right: 16%;
  font-size: 1.8em;
  position: absolute;
/* color:  beige;  #008bff; #007bff #3b5988; #91b9d0; #91b9d0;  ; #999966; #6699CC; #81b5d6; #3b5988;*/
  /* text-shadow: 2px 2px 0 #000, -1px -1px 0  beige /* #3b5988;*/
  text-shadow: 1px 1px 0 #000, -1px -1px 0 #dfe9ec;           /*#91b9d0; 1px 1px 0 #000, -0.3px -0.5px 0 #3f9db8;#3b5988; #91b9d0;    #3f9db8;*/
  color: #3f9db8;  /*#3b5988;  #d4dedf;  rgba(351, 243, 4);*/
  border-top: 1px solid #999966;             /* #fff;*/
/*  box-shadow: inset 0 1px 0 rgba(0,0,0,0.15);
  -moz-box-shadow: inset 0 1px 0 rgba(0,0,0,0.15);
  -webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.15);*/
}

.ventaRepPrin { /*ARRIBA */
/*  top: 113%;*/
  right: -8.5%;
  font-size: 1.5em;
/*  padding: 15px 32px;*/
 position: absolute;
 color:  #3b5988;   /* #d4dedf;  appworkspace;#d4dedf; #d4dedf;beige;  #3b5988;#3b5988 #91b9d0;  ; #999966; #6699CC; #99998866*/
 z-index: 0;
 text-shadow: 1px 1px 0 #000, -1px -1px 0 #999977;/* #999966; #3b5988;#91b9d0;*/
  -moz-box-shadow: inset 0 1px 0 rgba(0,0,0,0.15);
  
}

.icono-ventaRep {
  background-image: url('/llamar.png');
  background-size: contain; /* Ajusta el tamaño del icono */
  background-repeat: no-repeat; /* Evita la repetición del icono */
  padding-left: 20px; /* Espacio a la izquierda del icono para separarlo del texto */
  /* Otras propiedades de estilo que desees */
}

 .social{
  top:170%;
/*  background-color: #99998866;*/
  position: absolute;
  transform: translate(0, -50%);
 
/*  align-content: left;*/
  position: absolute; /*  position: fixed; relative*/
/*  float:left;*/
  right:13.5%;
/*  height:205px;*/
   margin-top:155px; /*altura con relacion a la pagina WHASSAP*/
/*     line-height: 0;*/
  }
  


/*  .socialResto {
    top: 11%;
    right: 14.7%;
    margin-top: 155px;
}*/

 .socialResto{
   top: 11%;
/*  background-color: #99998866;*/
  transform: translate(0, -50%);
/*  align-content: left;*/
  position: absolute;   /*position: fixed; relative*/
/*  float:left;*/
  right:14.7%;
/* left: 10%;*/
/*  height:205px;*/
   margin-top:155px; /*altura con relacion a la pagina WHASSAP*/
/*     line-height: 0;*/
  }


.row::after {
  content: "";
  clear: both;
  display: table;
}

[class*="col-"] {
  float: left;
  padding: 10px 5px;
}


.img {
   width: 100%;
    z-index: -100; 
}

.compartirSocial{
 /* top: 400px;*/
/*  align-content: space-between ;*/
  margin-left: 280px;
  position: relative; /*  position: fixed; relative absolute*/
  float:left;
  color: #021d49; 
  margin-top:155px; /*altura con relacion a la pagina WHASSAP*/
/*     line-height: 0;*/
  cursor: pointer;
  color: beige;
/*    position: fixed;*/
  right: 20px;
   /*  top: 62%; Ajusta la posición vertical del segundo botón */
   
/*   justify-content: flex-end;*/
    margin-top: -0px;
  }
  
  .compartirSocialDos{
 /* top: 400px;*/
/*  align-content: space-between ;*/
  margin-left: 280px;
  position: relative; /*  position: fixed; relative absolute*/
  float:left;
  color: #021d49; 
  margin-top:135px; /*altura con relacion a la pagina WHASSAP*/
/*     line-height: 0;*/
  cursor: pointer;
  color: beige;
/*    position: fixed;*/
  right: 20px;
   /*  top: 62%; Ajusta la posición vertical del segundo botón */
   
/*   justify-content: flex-end;*/
    
  }

.boton{
	background: silver;
	color: #004976;                        /*color:#000;      #004976;    rgba(0,73,118,0.96)  */
	font-weight: bolder;
	border-bottom: thin solid Silver;
	border-left: thin solid Silver;
	border-right: thin solid Silver;
	border-top: thin solid Silver;
}


.hideText {
  display: none;
}

.showText {
  display: block;
}

.readMore_btn1 {
    background-color: #91b9d0;
    border: 1.5px solid #009933;
    border-radius: 5px;
    color: #009933;
    font-size: 0.8em;
    padding: 5px 10px;
    box-shadow: 0px 0px 5px 0px black;
    display: inline-block; 
    cursor: pointer;
    position: fixed;
    right: 2px;
    top: 55%;
       text-decoration: none; 
}
.readMore_btn1:hover {
    box-shadow: none;
    background-color: #99998866;
    color: black;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 2.05s;
}

.readMore_btn2 {
    background-color: #009933;
    border: 1.5px solid #009933;
    border-radius: 5px;
    color: #009933;
    font-size: 0.8em;
    padding: 5px 10px;
    box-shadow: 0px 0px 5px 0px black;
    cursor: pointer;
    position: fixed;
    right: 2px;
    top: 62.5%; /* Ajusta la posición vertical del segundo botón */
}
.readMore_btn2:hover {
    box-shadow: none;
    background-color: #99998866;
    color: black;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 2.05s;
}


.readMore_btn3 {
    background-color: #99998866;
    border-radius: 5px;
    font-size: 0.8em;
    padding: 5px 10px;
    box-shadow: 0px 0px 5px 0px black;
    display: inline-block; 
    cursor: pointer;
    color: black;
/*    position: fixed;*/
    right: 2px;
/*    top: 55%;*/
       text-decoration: none; 
}
.readMore_btn3:hover {
    box-shadow: none;
     background-color: #91b9d0;
/*background-color: #99998866;*/
    color: white;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 2.05s;
}
.readMore_btn4 {
    background-color: #91b9d0;
    border: 1.5px solid #009933;
    border-radius: 5px;
    color: #009933;
    font-size: 0.8em;
    padding: 5px 10px;
    box-shadow: 0px 0px 5px 0px black;
    display: inline-block; 
    cursor: pointer;
    position: fixed;
    right: 2px;
    top: 55%;
       text-decoration: none; 
}
.readMore_btn4:hover {
    box-shadow: none;
    background-color: #99998866;
    color: black;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 2.05s;
}

.readMore_btn5 {
    background-color: #009933;
    border: 1.5px solid #009933;
    border-radius: 5px;
    color: #009933;
    font-size: 0.8em;
    padding: 5px 10px;
    box-shadow: 0px 0px 5px 0px black;
    cursor: pointer;
    position: fixed;
    right: 2px;
    top: 62.5%; /* Ajusta la posición vertical del segundo botón */
}
.readMore_btn5:hover {
    box-shadow: none;
    background-color: #99998866;
    color: black;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 2.05s;
}
.readMore_btn6 {
    background-color: #91b9d0;
    border: 1.5px solid #009933;
    border-radius: 5px;
    color: #009933;
    font-size: 0.8em;
    padding: 5px 10px;
    box-shadow: 0px 0px 5px 0px black;
    display: inline-block; 
    cursor: pointer;
    position: fixed;
    right: 2px;
    top: 55%;
       text-decoration: none; 
}
.readMore_btn6:hover {
    box-shadow: none;
    background-color: #99998866;
    color: black;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 2.05s;
}

.readMore_btn7 {
    background-color: #009933;
    border: 1.5px solid #009933;
    border-radius: 5px;
    color: #009933;
    font-size: 0.8em;
    padding: 5px 10px;
    box-shadow: 0px 0px 5px 0px black;
    cursor: pointer;
    position: fixed;
    right: 2px;
    top: 62.5%; /* Ajusta la posición vertical del segundo botón */
}
.readMore_btn7:hover {
    box-shadow: none;
    background-color: #99998866;
    color: black;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 2.05s;
}
.readMore_btn8 {
    background-color: #91b9d0;
    border: 1.5px solid #009933;
    border-radius: 5px;
    color: #009933;
    font-size: 0.8em;
    padding: 5px 10px;
    box-shadow: 0px 0px 5px 0px black;
    display: inline-block; 
    cursor: pointer;
    position: fixed;
    right: 2px;
    top: 55%;
       text-decoration: none; 
}
.readMore_btn8:hover {
    box-shadow: none;
    background-color: #99998866;
    color: black;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 2.05s;
}

.readMore_btn9 {
    background-color: #009933;
    border: 1.5px solid #009933;
    border-radius: 5px;
    color: #009933;
    font-size: 0.8em;
    padding: 5px 10px;
    box-shadow: 0px 0px 5px 0px black;
    cursor: pointer;
    position: fixed;
    right: 2px;
    top: 62%; /* Ajusta la posición vertical del segundo botón */
}
.readMore_btn9:hover {
    box-shadow: none;
    background-color: #99998866;
    color: black;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 2.05s;
}
.cmt-box-view-overlay , .cmt-box-view-content-inner{ 
  position: relative;
  overflow: hidden;
  background-color: #000;
  
}
.cmt-box-view-overlay:before, .cmt-box-view-content-inner:before{
  position: absolute;
  content: "";
  top: 0px;
  left: 0;
  right: 0px;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0,44,91,.69);
  transition: all .2s ease 0s;
}
div:hover > .cmt-box-view-overlay:before, div:hover > 

.cmt-box-view-content-inner:before{
  opacity: 1.8;
  visibility: visible;
}
/* slider efecto*/
script {
  display: none;
}

ol li::marker {
  content: counter(list-item - ' SERVICE') ' - ' ;
  color: #999966;
 
  
}
ol li:hover::marker {
  color : blue; 
}
strong {
  font-weight: bold;
}

.boton{
	background: silver;
	color: #004976;                        /*color:#000;      #004976;    rgba(0,73,118,0.96)  */
	font-weight: bolder;
	border-bottom: thin solid Silver;
	border-left: thin solid Silver;
	border-right: thin solid Silver;
	border-top: thin solid Silver;
}



.video {
  text-align: center;
  align-items: center;
  
}

.slider{
  overflow: hidden;
  position: relative; 
  object-fit: cover; 
}

.slider--inner{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  transition: all 0.1s ease-in;
  position: relative;
  align-items: center; 
  
   background-size: cover;
    /* Cubre todo el div */
    background-repeat: no-repeat;
    /* Evita que la imagen se repita */
    background-position: center 0%;
    /* Posiciona la imagen en el centro */
    /* opacity: 0.1; */
    background-blend-mode: overlay;
}

.carousel-inner {
  display: flex;
  justify-content: left;
  align-items: center;
  width: 100%;
  height: 343px;
  
}

.carousel-inner img {
  max-width: 100%;
  max-height: 150%;
}
.slider--img {
aspect-ratio: 16/17;  /* aspect-ratio: 16/9;*/
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
width: 100%;
height: 343px; /* 343px; Altura fija para pantallas grandes */
object-fit: cover; /* Ajusta la imagen manteniendo la relación de aspecto y cubriendo todo el contenedor */

}
.card {
    width: 49%;
    height: autoS;
}
.card-body {
    padding: 1rem;
}
.card-img-top {
    width: 100%;
    /* height: 100%; /* Asegura que la imagen ocupe todo el contenedor */
    object-fit: cover; /* Ajusta la imagen para cubrir el contenedor */
    height: 600px; /* Establece la altura deseada para las imágenes */
       
}
.user-select {
    background-color: rgb(172, 209, 252);
    border-radius: 20px;
    box-shadow: 1px 1px 12px 1px rgba(0, 0, 0, 0.2);
    padding: 20px;
}
.filtros {
    display: flex;
    margin-left: 25%;
    margin-top: 50px;
    text-align: center;
}
.ingresar {
    margin-right: 20px;
    margin-top: -90px;
    padding: 30px;
}

.form-label {
    color: white;
}

::placeholder {
    color: #0d6efd;
}

.detail {
    margin-top: -10px;
    text-align: left;
    color: grey;
}


.compartirSocialDos {
            margin-top: -50px;
}
.compartirSocialDos ul {
     list-style: none;
     display: flex;
     margin: 0;
     padding: 0;
}
.compartirSocialDos ul li {
        margin-left: 10px;
}
.compartirSocialDos a svg {
        width: 22px;
        height: 22px;
        fill: currentColor;
}

.article h3 {
    color: #3d33cc;
    margin: 0;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
     background-color: white;
}

.image-box {
     width: 100%;
    height: 343px; /* Altura fija para el contenedor de imágenes */
}
 .text-box .main,
 .text-box .sub,
 .text-box .no-hover-color-change {
     cursor: pointer;
 }

/* --- Contacto ---*/

/*******************
CONTACTO FORM
*******************/

/*.cardCont {
        width: 30%;
        height: 410px;
	width: 390px;
	margin: 0 auto;
	position: relative;
	
	background: #F2F4F3;
	border: 1px solid #fff;
	border-radius: 5px;
	
	box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}*/
.cardCont {
    width: 40%;
   /* height: 410px;*/
/*    margin: 10% auto;*/
     margin: 10% auto; /* Centra verticalmente */
     padding: 20px; /* Espaciado interno */
     background: #F2F4F3;
/*    background-color: pink;   #f2f2f2;  Fondo gris claro */
    border: 1px solid #fff; /*border: 1px solid #3b5988;  Borde sólido azul oscuro */
    border-radius: 5px; /* Bordes redondeados */
    
    box-shadow: 0 1px 3px rgba(0,0,0,0.5); /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Sombra suave */ 
   
/*    width: 390px;*/
/*	margin: 0 auto;*/
/*	position: relative;*/
	
	
	
	
	box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
/*******************
HEADER
*******************/

.cardCont-form .header {
	padding: 40px 30px 30px 30px;
}

.cardCont .header h1 {
	font-family: 'Bree Serif', serif;
	font-weight: 300;
	font-size: 28px;
	line-height:34px;
	color: #414848;
	text-shadow: 1px 1px 0 rgba(256,256,256,1.0);
	margin-bottom: 10px;
}

.cardCont .header span {
	font-size: 11px;
	line-height: 16px;
	color: #678889;
	text-shadow: 1px 1px 0 rgba(256,256,256,1.0);
}

/*******************
CONTENT
*******************/

.cardCont .content {
	padding: 0 30px 25px 30px;
}

/* Input field */
.cardCont .content .input {
	width: 188px;
	padding: 15px 25px;
	
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #9d9e9e;
	text-shadow: 1px 1px 0 rgba(256,256,256,1.0);
	
	background: #fff;
	border: 1px solid #fff;
	border-radius: 5px;
	
	box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
	-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
	-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.50);
}

/* Second input field */
.cardCont .content .password, .cardCont .content .pass-icon {
	margin-top: 25px;
}

.cardCont .content .input:hover {
	background: #dfe9ec;
	color: #414848;
}

.cardCont .content .input:focus {
	background: #dfe9ec;
	color: #414848;
	
	box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
	-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
}

.user-icon, .pass-icon {
	width: 46px;
	height: 47px;
	display: block;
	position: absolute;
	left: 0px;
	padding-right: 2px;
	z-index: -1;
	
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
}

.user-icon {
	top:153px; 
}

.pass-icon {
	top:201px;
	
}

.content input:focus + div{
	left: -46px;
}

/* Animation */
.input, .user-icon, .pass-icon, .button, .register {
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
}

/*******************
FOOTER
*******************/

.cardCont .footer {
	padding: 25px 30px 40px 30px;
	overflow: auto;

	background: rgba(153, 150, 102, 0.25); /* fondo gris-amarronado translúcido */
	border-top: 1px solid #999966;

	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4); /* sombra hacia afuera */
	-webkit-box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);

	backdrop-filter: blur(8px); /* efecto vidrio si hay fondo detrás */
	-webkit-backdrop-filter: blur(8px);

	border-radius: 12px;
}
/* contacto button */
.cardCont .footer .button {
	float:right;
	padding: 11px 25px;
	
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	font-size: 18px;
	color: #414848;
	text-shadow: 0px 1px 0 rgba(0,0,0,0.25);
	
	/*background: #3f9db8;*/
	border: 1px solid #46b3d3;
	border-radius: 5px;
	cursor: pointer;
	
	box-shadow: inset 0 0 2px rgba(256,256,256,0.75);
	-moz-box-shadow: inset 0 0 2px rgba(256,256,256,0.75);
	-webkit-box-shadow: inset 0 0 2px rgba(256,256,256,0.75);
}

.cardCont .footer .button:hover {
	/*background: #3f9db8;*/
	border: 1px solid rgba(256,256,256,0.75);
	
	box-shadow: inset 0 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.5);
}

.cardCont .footer .button:focus {
	position: relative;
	bottom: -1px;
	
	/*background: #56c2e1;*/
	
	box-shadow: inset 0 1px 6px rgba(256,256,256,0.75);
	-moz-box-shadow: inset 0 1px 6px rgba(256,256,256,0.75);
	-webkit-box-shadow: inset 0 1px 6px rgba(256,256,256,0.75);
}

/* Register button */
.cardCont .footer .register {
	display: block;
	float: right;
	padding: 10px;
	margin-right: 20px;
	
	background: none;
	border: none;
	cursor: pointer;
	
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	font-size: 18px;
	color: #414848;
	text-shadow: 0px 1px 0 rgba(256,256,256,0.5);
}

.cardCont .footer .btn2:hover {
	color: #3f9db8;
}

.cardCont .footer .register:focus {
	position: relative;
	bottom: -1px;
}

/*----------------------------------------------------------------------------------------------------------------------------*/


.cardCont form .form-control::placeholder {
    color: #999999; /* Color gris para el placeholder */
    font-style: italic; /* Estilo cursiva para el placeholder */
}


.cardCont-body{
/*    width: 100%;*/
    height: 300px;
}

.cardCont:hover{
/*    transform: scale(1.1);  este atributo importante*/
}

.cardCont img {
    width: 96%;
    height: 220px;
    margin-left: -18%;
    border-radius: 5px;
    box-shadow: 1px 1px 12px 1px rgba(0, 0, 0 , 0.2); 
    
}

.cardCont-body .card-title{
    text-align: left;
    font-size: small;
}

.cardCont-body .detail{
    font-size:smaller;
/*    margin-top: -10px;  /* margin-top: -10px;*/
    text-align: left;
              /*#91b9d0;*/
    
    
}
/*---- fin ---*/

/*ESTILO DEL CARRUSEL*/
.carr {
  grid-area: carr;
  justify-content: center;
  align-items: center;
  margin-top: 0em;
}

/*ESTILO DEL CONTENEDOR 1*/
.cont {
  grid-area: cont;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  height: 25em;                  
  margin: 10px; /* Ajusta este valor según tu diseño */
  
  
}

.especialidades {
  width: 68em; /* Cambiar el valor según el tamaño deseado */
  display: flex;
/*  justify-content: space-evenly;*/
  align-items: center;
  flex-direction: row;
  /* border: 3.5px solid #999966; /* #46b3d1;  #999966;*/
   border: 0.3px solid #999966;
   max-width: 1250px; /* Ancho máximo para el diseño */
}

/*---- iteractivo ---*/
@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.no-hover-color-change {
  animation: blink 1s infinite;
/*  color: #3f9db8; */
     color: #00bfff; /* Azul vibrante */
      display: block;
      font-size: 2em;
}

.no-hover-color-change:hover,
.no-hover-color-change:hover * {
  color: inherit !important;
}
.no-hover-color-change1 {
  animation: blink 1s infinite;
/*  color: #3f9db8; */
     color: aqua; /* Azul vibrante */
      display: block;
}

.no-hover-color-change1:hover,
.no-hover-color-change:hover * {
  color: inherit !important;
}
/*---- fin ---*/
.no-hover1 {
 /* animation: blink 1s infinite;*/
  color: #3f9db8 !important;
/* margin-top: -150px;*/
text-align: center;
text-justify: auto;
justify-content: space-between; 
color: #3f9db8;
}
.no-hover2 {
  animation: blink 1s infinite;
/*  color: #3f9db8 !important;*/
/* margin-top: -150px;*/
text-align: center;
text-justify: auto;
justify-content: space-between; 
color: #3f9db8;
}

.cardCont .content .input:focus {
    
   
color: red; /*  #021d49; Cambia el color del texto cuando el campo está enfocado */
}
.card {
  width: 450px;            /* width: 200px;*/
  aspect-ratio: 1/1.3;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}

.card .image-box {
  width: 390%;              /* width: 100%;  */
  height: 98%;              /*  height: 100%;  */
  overflow: hidden;
}

.card .image-box img {
  width: 390%;                /*  width: 100%;  */
  height: 65%;               /* height: 100%; */
  object-fit: cover;
  filter: grayscale(0) brightness(1);
  scale: 1.2;
  transition: scale 2s ease-in-out, filter 1s ease-in-out;
}

.card:hover .image-box img {
  filter: grayscale(1) brightness(0.7);
  scale: 1;
}

.card .text-box {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: white;
}


.text-box .main {
  font-size: 26px;
  font-weight: 600;
  text-transform: uppercase;
  position: relative;
    display: block;
}

.text-box .sub {
  font-size: 14px;
  font-weight: 300;
}

.text-box .text-box {
 color: aqua; 
 font-size: 33px;
 font-weight: 600;
 text-transform: uppercase;
 position: relative;
  display: block;
}

.main span,
.sub span {
  display: block;
  transition: transform 0.2s ease;
}

.main span {
  transition-delay: 0.2s;
  transform: translateY(100%);
}

.sub span {
  transform: translateY(-100%);
  transition-delay: 0.2s;
}

.card:hover .text-box :is(span) {
  transform: translateY(0%);
}

.text-box::after {
  position: absolute;
  content: "";
  top: 52%;
  left: 50%;
  width: 102%;                  /*  width: 102%;;*/
  height: 3px;
  transform: translate(-50%, -50%) scaleX(0);
  transform-origin: left;
  transition: 0.5s ease;
  background-color: cyan;
}

.card:hover .text-box::after {
  transform: translate(-50%, -50%) scaleX(1);
}


h2 {
  font-size: 20px;
  line-height: 28px;
  color: #021d49; /* #021d49;*/
  background-color: transparent; /* Hacer el fondo transparente */
    border: none;  /* Quitar el borde */
   
    font-family: canada-type-gibson, sans-serif; /* Asegurarte de usar la fuente deseada */
    font-weight: 600;  /* Grosor del texto */
    line-height: 32px; /* Altura de línea */
    cursor: pointer;  /* Cambiar el cursor al pasar por encima */
    padding: 10px 20px;  /*Añadir algo de espacio alrededor del texto */ 
    text-align: left;  /*Centrar el texto */
}

h4, h5 {
  font-size: 1.3em;
 /* color: black; /*rgb(36, 13, 92);*/
}

h5 {
  font-size: 20px;
  line-height: 28px;
}
h5 {
  display: block;
  font-size: 1.35em;
  margin-block-start: 1.67em;
  margin-block-end: 1.67em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-weight: bold;
  /*color:dimgray;*/
  color: #999966; /*#6699CC;*/
  
  }
  .blog-post-meta {
      width: 100%;
            font-size: 0.9rem;
        }
  .social-icons svg {
            width: 24px;
            height: 24px;
        }  


.footer-container {
    display: flex;
    justify-content: space-around; /* Distribuye las secciones horizontalmente */
    margin-top: 30px; /* Espacio entre el contenido superior y el footer */
   /* gap: -50px;  Espacio entre las columnas */
   max-width: 1230px;
}
.footer-section {
    width: 45%; /* Ancho de cada sección */
}


.footer-section h3 {
    color: #3b5988;  /*#81b5d6; #3b5988; azure;Color del texto del encabezado */
    font-size: 0.5em; /* Tamaño del texto del encabezado */
    margin-bottom: 10px; /* Espacio entre el encabezado y la lista */
    text-decoration: underline; /* Subrayado en los encabezados */
    text-shadow: 1px 1px 0 #000, -0.5px -0.4px 0 beige; 
}

.footer-section ul {
    list-style-type: none; /* Elimina los puntos de la lista */
    padding: 0;
}

.footer-section ul li {
    margin-bottom: 5px; /* Espacio entre elementos de la lista pie Derecha */
    color:  #3b5988;          /* #3b5988;  #3b5988; */
    text-shadow: 0.3px 0.3px 0 #000, -0.3px -0.3px 0 beige;
    
}

.footer-section ul li a {
    color: #3b5988;   /*#3b5988; Color del texto de los enlaces pie izquierdo */
    text-decoration: none; /* Quita el subrayado de los enlaces */
     text-shadow: 0.5px 0.5px 0 #000, -0.5px -0.4px 0 beige;  
    
}

.footer-section ul li a:hover {
    text-decoration: underline; /* Subrayado al pasar el mouse por los enlaces */
}


.logo-marca {
  width: 150px;
  height: 90px;
  /*margin-right: 10px;  Margen a la derecha de la imagen */
  /* Otros estilos según tus preferencias */
}

/* -----FOOTER --- */


    .footer-containerPie{                        
         display: flex;
         flex-wrap: wrap;
         justify-content: space-between; 
         align-items: flex-start; 
/*         max-width: 1230px;*/
         min-height: 80px;
         width: 100%;
         margin: 0 auto;
         max-width: 1230px;
         margin-top: 0;
         margin-top: -20px;
         
	padding: 25px 30px 40px 30px;
	overflow: auto;
	background: rgba(153, 150, 112, 0.25); /* fondo gris-amarronado translúcido background: rgba(153, 150, 102, 0.25); rgba(153, 150, 112, 0.25); */
	border-top: 1px solid #999966;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4); /* sombra hacia afuera */
	-webkit-box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4); /*-webkit-box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);*/
	backdrop-filter: blur(8px); /* efecto vidrio si hay fondo detrás  */
	-webkit-backdrop-filter: blur(8px);
/*	border-radius: 12px;*/
} 
.footer-containerIndex{                        
         display: flex;
         flex-wrap: wrap;
         justify-content: space-between; 
         align-items: flex-start; 
/*         max-width: 1230px;*/
         min-height: 80px;
         width: 100%;
         margin: 0 auto;
         max-width: 1300px; 
         margin-top: -5px;
         
         
	padding: 25px 30px 40px 30px;
	overflow: auto;
	background: rgba(153, 150, 112, 0.25); /* fondo gris-amarronado translúcido */
	border-top: 1px solid #999966;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4); /* sombra hacia afuera */
	-webkit-box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
	backdrop-filter: blur(8px); /* efecto vidrio si hay fondo detrás */
	-webkit-backdrop-filter: blur(8px);
/*	border-radius: 12px;*/
} 
   .footer-sectionPie {
    width: 25%;
    padding: 10px;
    box-sizing: border-box;
    text-align: left;
    font-size: 14px;
    color: #021d49;
    flex: 1;
    min-width: 200px;
}


.footer-containerPieBlog {                        
         display: flex;
         flex-wrap: wrap;
         justify-content: space-between; 
         align-items: flex-start; 
/*         max-width: 1230px;*/
         min-height: 80px;
         width: 100%;
         margin: 0 auto;
         max-width: 1300px;
         margin-top: -50px;
         
	padding: 25px 30px 40px 30px;
	overflow: auto;
	background: rgba(153, 150, 112, 0.25); /* fondo gris-amarronado translúcido */
	border-top: 1px solid #999966;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4); /* sombra hacia afuera */
	-webkit-box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
	backdrop-filter: blur(8px); /* efecto vidrio si hay fondo detrás */
	-webkit-backdrop-filter: blur(8px);
/*	border-radius: 12px;*/
} 




    .footer-sectionPie h3 {
        margin-bottom: 10px;
       font-size: 17px; /* Tamaño de fuente reducido */
       margin-bottom: 10px;
       font-size: 17px;
       color: #021d49; 
    }

    .footer-sectionPie ul {
        list-style-type: none;
        padding: 0;
       color:  #021d49; 
       
    }

    .footer-sectionPie .horizontal-list-itemPie {
        display: block;
        margin-bottom: 5px;
        color:  #021d49;
    }

    .footer-sectionPie a {
    color: #021d49; /* Color de los enlaces */
    text-decoration: none; /* Opcional: para eliminar el subrayado de los enlaces */
}
    
    .footer-sectionPie a:hover {
     color: #99999888;                                        /*     #22333B;  #F2F4F3; #3b5988; #3f9db8 ;Cambia a tu color deseado  */
    
}
/* -----FIN FOOTER ---///////////////////////////////////*/



.social-menu ul li:first-child a {
    border-radius: 5px 5px 0 0;
}
.social-menu ul li:nth-child(1) a {
    background: #81b5d6;
}
.social-menu ul li:first-child a {
    border-radius: 5px 5px 0 0;
}
.social-menu ul li:nth-child(1) a {
    background: #81b5d6;
}




























































































































/* Pantallas extra pequeñas  */




/* ======================================================================
   === RESPONSIVE MOBILE / TABLET OVERRIDES =============================
   === No toca estilos desktop; solo aplica cuando la pantalla es chica ==
   ====================================================================== */

/* MacBook y pantallas grandes: más de 1440px */
/* -----INICIO PANTALLAS  ---> Monitores grandes ---//*/
/* -----INICIO PANTALLAS @media only screen and (min-width: 1025px)and (max-width: 1400px) ---//*/
@media only screen and (min-width: 1025px) and (max-width: 1400px) {
    /* Ajustes específicos para MacBook Pro 13" */
    
.contenedorGeneral {
        width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
         border: 0.05px solid #999966; /*Mantiene el borde */
     /*   padding: 0px 5px 0px 5px;  superior, derecha, inferior, izquierda */
        display: flex;
        flex-wrap: wrap;
        box-sizing: border-box;
 
    }
        .container {
         width: 100%;   /* Ajusta el ancho del contenedor según sea necesario */
         margin: 0 auto;   /* Centra el contenedor */
         justify-content: center;   /* Centra el contenido horizontalmente */
         background-position: center;
        background-size: cover;
 /*    padding: 0px 20px 0px 20px;     superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
         display: flex;
        flex-wrap: wrap;
      /* max-width: calc(100% - 100%);  Asegura que el contenedor no sea más ancho que su contenedor padre */
     /*  max-width: calc(100% - 20px);    Asegura que el contenedor no sea más ancho que su contenedor padre */
    }
     .containerIndex  {
        width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
     /*    margin: 0 auto;  Centra el contenedor */
        justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
        padding: -600px 0px 0px 0px;   /*  superior, derecha, inferior, izquierda */
       
         word-wrap: break-word; /*Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        display: flex;
        flex-wrap: wrap;
        background-size: cover;
      /*  max-width: calc(100% - 7px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
     /*  max-width: calc(100% - 4%);    Asegura que el contenedor no sea más ancho que su contenedor padre */
      
    
     } 
    
     .textoSuperpuestoDer {
        position: absolute; /* Asegura que las propiedades top y right tengan efecto */
        box-sizing: border-box; /* Incluye padding y border en el cálculo del ancho y alto */
        overflow: hidden; /* Maneja el desbordamiento del texto */
        line-height: 2.2; /* Ajusta el valor según tus necesidades */
        font-size: 2.5em;
        right: 10%;
        width: 70%;
        height: 15%;
        padding: 15% 0% 15% 0%;
        top: 34%;
        margin: 0px;
        margin-left: 0%;
        margin-right: 5%;
     } 
    /* Otra configuración */
/*  .textoSuperpuesto {
    font-size: 1.2rem;
    max-width: 100%;
  }*/
  
    .textoSuperpuesto{
        position: absolute;   /* position: relative;*/
       font-size: 2em;
       left: 8%; /*   right: -5%;*/
       top: 79%; /*top: 350px;*/
       flex-wrap: wrap;
          display: initial;
       overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */ 
       
    }
    
    .servicioTecnico {
        font-size: 9rem;
        justify-content: flex-start;
        top: 65%;
        left: 47%; 
        padding: 0px 25px;
    }
    
    .Icon2servicioTecnico {
         width: 20%; /* width: 48px;*/
        height: 310%; /* height: 45px;*/
        justify-content: flex-start;
        top: 65%;
        left: -07%; /*  left: -159%;*/
    }
    
    .telefono {
      width: 70%;
     height: 2%;  /*    height:  100%;     height: 50px; */
   
    }
    
     
      .contenedor, 
       .parte_baja, 
       .home-steps__section {
        width: 130%; 
         max-height: 570px;/*height: 830px;*/
        margin: 0 auto; /* AGREGADO*/
       /*  position: static; Cambiado de unset a static */
       /* box-shadow: none;  Cambiado de unset a none */
       /*  flex-direction: row;  flex-direction: row;*/
  /*       align-items: stretch;  align-items: flex-start ; align-items: flex-end;*/
        box-sizing: border-box; /* Ajustado el padding */
        text-align: start ; 
        display: grid;     /* AGREGADO*/
        grid-template-columns: repeat(2, 1fr);   /* Dos columnas de igual tamaño --COMENTADO*/
        grid-template-rows: repeat(2, auto); 
      /*  gap: 20%; /* Espacio entre los elementos  --COMENTADO*/
        grid-gap: 2rem; /* Espacio entre las columnas y filas */
        padding: 0px 1% -200px 1%; /* AGREGADO Añadimos algo de padding para el contenedor */
        box-sizing: border-box; /*AGREGADO Incluye padding en el ancho total */
       font-size: 1.5em;  /* AGREGADO texto de los iconos -- acceso directo  */
      
    }
  
     .horizontal-layout {
        flex-direction: column;
        align-items: center; /* Centra los elementos en pantallas pequeñas */
    }

    
    .home-step__icon {
        width: 170px;
        height: 100px;
        margin: 0 auto;
        padding: 0px 0px;
        align-items: center;
        text-align: center;
        justify-content: center;
        display: flex ;    /*  display: block;  grid*/
    }
    
    
    
    .list-unstyled {
        flex-direction: row; /* Cambia la dirección a fila para los íconos de redes sociales */
        justify-content: center; /* Centra los íconos de redes sociales */
        width: 100%;
    }
       
    .title {
        position: relative;
        font-size: 2.5em; /* Ajusta el tamaño de fuente para pantallas pequeñas */
      /* margin: 100px;   Aplica un margen de 10px en todos los lados */
       padding: -700px 20px 30px 20px;  /*  Aplica padding a los lados para evitar que el texto toque los bordes */
        /* max-width: calc(100% - 100px); Asegura que el contenedor no sea más ancho que su contenedor padre */
        box-sizing: border-box; /* Incluye padding y border en el tamaño total del elemento */
        word-wrap: break-word;  /* Permite que las palabras largas se dividan */
        word-break: break-word; /* Rompe palabras largas al final de una línea */
        overflow: hidden; /* Oculta el desbordamiento del contenido */
        text-overflow: ellipsis; /* Añade puntos suspensivos si el texto es demasiado largo */
        text-align: center;
        margin-top: 100px; /*MODIFICAMOS LA ALTURA DEL TITULO ADEMAS DE MODIFICAR ALTURA SLIDER CONJUNTAMENTE */
    }
      .especialidades, /*NO TOCAR ESTA CLASE CORRESPONDE AL SLIDER ------ */
     .card, .image-box{
                width: 100%;
                height: auto;
                display: flex;      
               justify-content: space-between;    /*  Distribuye los ítems con espacio entre ellos */
                align-items: center;  /* Centra los ítems verticalmente */
/*                grid-template-columns:  repeat(2, 1fr);
                grid-template-rows: repeat(2, auto); 
                grid-gap: 0px; */
                /*NO TOCAR ESTA CLASE CORRESPONDE AL SLIDER ------ */
        }
        
        .cont {  /**MODIFICAMOS LA ALTURA DEL SLIDER */
        white: 100%; 
        margin: 0 auto;
        padding: -100px 0px 0px 0px; /*  margen de arriba , derecha, abajo, izquierda*/ 
        overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */      
        margin-top: 0px;  /*MODIFICAMOS LA ALTURA DEL SLIDER */
        position: unset;
        content: unset;
         box-shadow: unset;
    }
    
     video {
        width: 100%;
        height: auto;
        max-width: 100%;  /*Asegura que el texto no se salga del contenedor */
       width: 100%;
       display: block;
    } 
    #myVideo {
        position: absolute;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
     #myVideo1 {
        position: absolute;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .video-container video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: auto; /* Ajusta la altura según sea necesario */
    }
    
         .shinedos{ 
         width: 100%;
         font-size: 3.5em; /*LAVARROPAS ESTOY ACA 05/08/24*/
         top: -162px;  
         left: -10%;
          
        position: relative;
        display: inline-block;
        color: #021d49;  /*#000; */
        background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
        background-size: 200%;
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        animation: shine 4s linear infinite;
        text-align: center;
    }
        .shine{ 
         width: 100%;
         font-size: 3.5em;
         top: -170px;  
          left: -5%;
          
         position: relative;
        display: inline-block;
        color: #021d49;  /*#000; */
        background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
        background-size: 200%;
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        animation: shine 4s linear infinite;
        text-align: center;
    }
    /* ESTAMOS ACA HAY QUE DIRECCIONAR LOS ICONOS DE COMPARTIR SOCIAL*/
    .compartirSocialDos ul {
/*        flex-direction: column;*/
        align-items: center;
        position: absolute;
        left: -80px;
        top: 200px;
        
    }
    .compartirSocialDos ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocialDos a svg {
        width: 20px;
        height: 20px;
         
    }
    .compartirSocial ul {
/*        flex-direction: column;*/
        align-items: center;
        position: absolute;
        left: -80px;
        top: 144px;
    }
    .compartirSocial ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocial a svg {
        width: 20px;
        height: 20px;
    }
     .card-footer { /* compartir LAVARROPAS ESTOY ACA 05/08/24*/
        width: 70%;
        left: 17%;
        height: 30px; 
        padding: 300px 2px;
/*        font-size: 0.9em; */
        top: 16%; 
        position: absolute;
        margin-top: auto;
        text-align: center;
        box-sizing: border-box;
    }    
     .hero-section {
        flex-direction: row;
        padding: 3rem;
    }
    .hero-text {
        font-size: 1.6rem;
    }
    .hero-image {
        width: 70%;
    }
    
    .hero-section {
        flex-direction: row;
        padding: 4rem;
    }
    .hero-text {
        font-size: 1.8rem;
    }
    .hero-image {
        width: 60%;
    }
    /*-------------------------------SERVICE-------------------------------------------   */

    .telefono img {
        width: 30px;
    }
    .socialResto, 
    .list-unstyled,
    .link-body-emphasis {    
        width: 50%;
        left: 60%;
        top: 6.9%;         top: 10%;
        font-size: 0.7rem;
        white-space: nowrap;  /*  SE AGREGO ESTA PROPIEDAD */
       overflow-wrap: break-word;  
    }
    .socialResto svg {
        width: 18px;
        height: 23px;
      
    }
        .socialResto ul {
        flex-direction: row;
        top: 6.9%;
    }

    .socialResto li {
        margin-bottom: 0;
    }
    
    
     .containerService h2 {
        font-size: 2rem;
        margin: 0 auto;
        padding-top: 0px;
    }

    .containerService .card-text {
        font-size: 0.9rem;
    }
     #parrafo {
        font-size: 0.9rem;
    }
   
    .small-screen {
    width: 100%; /* Asegura que la columna ocupe todo el ancho disponible */
    }
  
   .card-body {
    padding: 10px; /* Ajusta el padding si es necesario */
    overflow: hidden; /* Evita que el contenido dentro del contenedor se desborde */
   }

   .responsive-img {
    max-width: 100%; /* La imagen no excederá el ancho del contenedor */
    height: auto; /* Mantiene la proporción de la imagen */
    display: block; /* Elimina cualquier espacio en línea alrededor de la imagen */
   }
    
    .home-step__titlePrinc{
        width: 100%;
        font-size: 3em;
        margin: 10 auto;
    }
    
    .textoSuperpuestoDer1 {
      width: auto;
      line-height: 2;
      margin: 0 10px;
      padding: 2;
      top: 7.2%;/*        top: 42%;*/
      align-items: center;  /* SE AGREGO ESTO AL DISEÑO*/
      background-position: center center; /* SE AGREGO ESTO AL DISEÑO*/
    }
    
     #myVideo6 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN SERVICE-------------------------------------------   */
    .imagenFondoAlsika {
       width: 100%;
    }
    
    .servicioTecnicoCont  {
        font-size: 9rem;
        justify-content: flex-start;
        top: 57%;
        left: 62%; 
        padding: 0px 25px;
    }

    
    .icon2servicioTecnicoCont {
        width: 30%; 
        height: 290%;  
        position: absolute;
        top: 43%; /* Ajusta según tu diseño */
        left: -13%;
        transform: translate(-50%, -50%);
        z-index: 1; /* Asegura que esté delante del texto */
    }
    
    
    .readMore_btn1 {
     width: 16%;  /*10%; Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
        right: 29.8%; /*26.8%;    right: 60px;*/
      top: 50.8%;
     } 
     
     .readMore_btn2 {
     width: 16%; /*10%; Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
        right: 58.8%; /* 26.8%;   right: 60px;  */
      top: 45.9%; /* Ajusta la posición vertical del segundo botón */
     } 
     
    .readMore_btn3 {
        width: 86%;
        height: 3%;
        margin: 0 10px;
        left: 3%;
        align-items: center;
        position: relative;
            top: 65%;
    }
    
     .readMore_btn4 {
      width: 10%;  /*Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
      right: 9%;    
      top:50.8%;
     } 
     
     .readMore_btn5 {
      width: 10%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
      right: 9%;  /*  right: 60px; */
     top: 45.9%; /*  Ajusta la posición vertical del segundo botón */
     } 
     
     .readMore_btn6 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
      right: 9%;    
      top: 50.8%;
     } 
     
     .readMore_btn7 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
      right: 9%;  /*  right: 60px; */
     top: 45.9%;  /* Ajusta la posición vertical del segundo botón */
     } 
      .readMore_btn8 {
      width: 8%;   /* Tamaño de imagen ajustado chap*/
      height: 45px; 
      right: 3.6%;    
      top: 50.8%;
     } 
     
     .readMore_btn9 {
      width: 8%;  /*Tamaño de imagen ajustado llamados */
      padding: 0px 0px;
      height: 45px;
      right: 3.6%;   /* right: 60px; */
     top: 45.9%;  /* Ajusta la posición vertical del segundo botón */
     } 
     /* Contenedor social-menu: fijado al lado izquierdo */
.social-menu {
    position: fixed !important;
  /*  left: 10px !important;      A la izquierda */
/*    left: 160px !important; */
    left: 145px !important; 
    right: auto !important;    /* Anula cualquier right */
    bottom: 40px !important; /*  bottom: 20px !important;*/
    z-index: 9999 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
/*    margin-top: 60%;*/
}

/* Botones dentro del menú */
.social-menu button,
.social-menu a {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;  /* Desactiva cualquier posicionamiento previo */
    box-shadow: none !important;
}

/* Íconos dentro de social-menu */
.social-menu button img,
.social-menu a img {
/*    width: 44px !important;*/
    width: 57px !important;
    height: auto !important;
    display: block !important;
}

/* Neutralizar cualquier botón que tenga estilos fijos */
.readMore_btn1,
.readMore_btn2,
.readMore_btn3,
.readMore_btn4,
.readMore_btn5,
.readMore_btn6,
.readMore_btn7,
.readMore_btn8,
.readMore_btn9 {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}
     

      /* Otra configuración */
  .imagenFondoTaller {
    background-size: cover;
    background-position: center;
  }

  
     .containerblog {
      width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
      /*   border: 0.05px solid #999966; Mantiene el borde */
        padding: 0px 40px 0px 30px; /* superior, derecha, inferior, izquierda */
          display: flex;
          flex-wrap: wrap;
/*          box-sizing: border-box;*/
       max-width: calc(100% - 2px); /*  Asegura que el contenedor no sea más ancho que su contenedor padre */    
    }
    
     .blog-post-meta {
      width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
       margin: 0%; /*  Centra el contenedor */
       justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
       padding: 0px 10px 0px 10px;  /* superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        flex-wrap: wrap;
        background-size: cover;
       /* max-width: calc(100% - 20px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
         max-width: calc(100% - 100px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
    
       max-width: 100%; /* La imagen no excederá el ancho del contenedor */
       height: auto; /* Mantiene la proporción de la imagen */
       display: block; /* Elimina cualquier espacio en línea alrededor de la imagen */
      }
     .social-icons svg {
                width: 20px;
                height: 20px;
            }
     #myVideo7 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN BLOG-------------------------------------------   */
    
    
     #myVideo5 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    #myVideo8 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 200%;
        height: 100%;
    }
    #myVideo9 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN TALLER-------------------------------------------   */
    .containerContacto {
            position: relative; /* o absolute, dependiendo de lo que necesites */
      margin: 0px;
      min-height: 110vh;  /*  Asegura que el contenedor tenga al menos el tamaño de la pantalla */
     
    }
        .text-center {
            text-align: center;
        }
        .form-label {
            font-size: 0.875rem;
            
        }
        .form-control, 
        .form-select {
            font-size: 0.875rem; 
        }
    
  
     /*-------------------------------FIN CONTACTO-------------------------------------------   */
     footer {
        width: 100%;
        clear: both;
        text-align: center;
        margin-top: 20px;
        padding: 0px 0px 0px 8px;
          text-align: center; /* Alineación de texto centrada */
        margin-top: auto;
        margin-right: auto;
        margin-left: auto;
       
    }
  }
  /* -----FIN @media only screen and (min-width: 1025px)and (max-width: 1400px)  --- **/

/* -----INICIO PANTALLAS 1024 --> Desktop normal ---//*/
/*@media (min-width: 1200px) {  SE RESTABLECIO VER MAÑANA ---> NO OLVIDAR*/
@media only screen and (min-width: 993px) and (max-width: 1024px) {    
.contenedorGeneral {
        width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
         border: 0.05px solid #999966; /*Mantiene el borde */
     /*   padding: 0px 5px 0px 5px;  superior, derecha, inferior, izquierda */
          display: flex;
          flex-wrap: wrap;
          box-sizing: border-box;
      
   
    }
        .container {
         width: 100%;   /* Ajusta el ancho del contenedor según sea necesario */
         margin: 0 auto;   /* Centra el contenedor */
         justify-content: center;   /* Centra el contenido horizontalmente */
         background-position: center;
        background-size: cover;
 /*    padding: 0px 20px 0px 20px;     superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
         display: flex;
        flex-wrap: wrap;
      /* max-width: calc(100% - 100%);  Asegura que el contenedor no sea más ancho que su contenedor padre */
     /*  max-width: calc(100% - 20px);    Asegura que el contenedor no sea más ancho que su contenedor padre */
    }
     .containerIndex  {
        width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
     /*    margin: 0 auto;  Centra el contenedor */
        justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
        padding: -600px 0px 0px 0px;   /*  superior, derecha, inferior, izquierda */
       
         word-wrap: break-word; /*Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        display: flex;
        flex-wrap: wrap;
        background-size: cover;
      /*  max-width: calc(100% - 7px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
     /*  max-width: calc(100% - 4%);    Asegura que el contenedor no sea más ancho que su contenedor padre */
      
    
     } 
    
     .textoSuperpuestoDer {
        position: absolute; /* Asegura que las propiedades top y right tengan efecto */
        box-sizing: border-box; /* Incluye padding y border en el cálculo del ancho y alto */
        overflow: hidden; /* Maneja el desbordamiento del texto */
        line-height: 2.2; /* Ajusta el valor según tus necesidades */
        font-size: 2.5em;
        right: 10%;
        width: 70%;
        height: 15%;
        padding: 15% 0% 15% 0%;
        top: 34%;
        margin: 0px;
        margin-left: 0%;
        margin-right: 5%;
     } 
    
    .textoSuperpuesto{
        position: absolute;   /* position: relative;*/
       font-size: 2em;
       left: 8%; /*   right: -5%;*/
       top: 79%; /*top: 350px;*/
       flex-wrap: wrap;
          display: initial;
       overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */ 
       
    }
    
    .servicioTecnico {
        font-size: 9rem;
        justify-content: flex-start;
        top: 65%;
        left: 47%; 
        padding: 0px 25px;
    }
    .Icon2servicioTecnico {
         width: 20%; /* width: 48px;*/
        height: 310%; /* height: 45px;*/
        justify-content: flex-start;
        top: 65%;
        left: -07%; /*  left: -159%;*/
    }
    .telefono {
      width: 70%;
     height: 2%;  /*    height:  100%;     height: 50px; */
   
    }
    
     
      .contenedor, 
       .parte_baja, 
       .home-steps__section {
        width: 130%; 
         max-height: 570px;/*height: 830px;*/
        margin: 0 auto; /* AGREGADO*/
       /*  position: static; Cambiado de unset a static */
       /* box-shadow: none;  Cambiado de unset a none */
       /*  flex-direction: row;  flex-direction: row;*/
  /*       align-items: stretch;  align-items: flex-start ; align-items: flex-end;*/
        box-sizing: border-box; /* Ajustado el padding */
        text-align: start ; 
        display: grid;     /* AGREGADO*/
        grid-template-columns: repeat(2, 1fr);   /* Dos columnas de igual tamaño --COMENTADO*/
        grid-template-rows: repeat(2, auto); 
      /*  gap: 20%; /* Espacio entre los elementos  --COMENTADO*/
        grid-gap: 2rem; /* Espacio entre las columnas y filas */
        padding: 0px 1% -200px 1%; /* AGREGADO Añadimos algo de padding para el contenedor */
        box-sizing: border-box; /*AGREGADO Incluye padding en el ancho total */
       font-size: 1.5em;  /* AGREGADO texto de los iconos -- acceso directo  */
      
    }
  
     .horizontal-layout {
        flex-direction: column;
        align-items: center; /* Centra los elementos en pantallas pequeñas */
    }

    
    .home-step__icon {
        width: 170px;
        height: 100px;
        margin: 0 auto;
        padding: 0px 0px;
        align-items: center;
        text-align: center;
        justify-content: center;
        display: flex ;    /*  display: block;  grid*/
    }
    
    
    
    .list-unstyled {
        flex-direction: row; /* Cambia la dirección a fila para los íconos de redes sociales */
        justify-content: center; /* Centra los íconos de redes sociales */
        width: 100%;
    }
       
    .title {
        position: relative;
        font-size: 2.5em; /* Ajusta el tamaño de fuente para pantallas pequeñas */
      /* margin: 100px;   Aplica un margen de 10px en todos los lados */
       padding: -700px 20px 30px 20px;  /*  Aplica padding a los lados para evitar que el texto toque los bordes */
        /* max-width: calc(100% - 100px); Asegura que el contenedor no sea más ancho que su contenedor padre */
        box-sizing: border-box; /* Incluye padding y border en el tamaño total del elemento */
        word-wrap: break-word;  /* Permite que las palabras largas se dividan */
        word-break: break-word; /* Rompe palabras largas al final de una línea */
        overflow: hidden; /* Oculta el desbordamiento del contenido */
        text-overflow: ellipsis; /* Añade puntos suspensivos si el texto es demasiado largo */
        text-align: center;
        margin-top: 100px; /*MODIFICAMOS LA ALTURA DEL TITULO ADEMAS DE MODIFICAR ALTURA SLIDER CONJUNTAMENTE */
    }
      .especialidades, /*NO TOCAR ESTA CLASE CORRESPONDE AL SLIDER ------ */
     .card, .image-box{
                width: 100%;
                height: auto;
                display: flex;      
               justify-content: space-between;    /*  Distribuye los ítems con espacio entre ellos */
                align-items: center;  /* Centra los ítems verticalmente */
/*                grid-template-columns:  repeat(2, 1fr);
                grid-template-rows: repeat(2, auto); 
                grid-gap: 0px; */
                /*NO TOCAR ESTA CLASE CORRESPONDE AL SLIDER ------ */
        }
        
        .cont {  /**MODIFICAMOS LA ALTURA DEL SLIDER */
        white: 100%; 
        margin: 0 auto;
       padding: -100px 0px 0px 0px; /*  margen de arriba , derecha, abajo, izquierda*/ 
        overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */      
        margin-top: 0px;  /*MODIFICAMOS LA ALTURA DEL SLIDER */
        position: unset;
        content: unset;
         box-shadow: unset;
    }
    
     video {
        width: 100%;
        height: auto;
        max-width: 100%;  /*Asegura que el texto no se salga del contenedor */
       display: block;
    } 
    #myVideo {
        position: absolute;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
     #myVideo1 {
        position: absolute;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .video-container video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: auto; /* Ajusta la altura según sea necesario */
    }
    
         .shinedos{ 
         width: 100%;
         font-size: 3.5em; /*LAVARROPAS ESTOY ACA 05/08/24*/
         top: -162px;  
         left: -10%;
          
        position: relative;
        display: inline-block;
        color: #021d49;  /*#000; */
        background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
        background-size: 200%;
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        animation: shine 4s linear infinite;
        text-align: center;
    }
        .shine{ 
         width: 100%;
         font-size: 3.5em;
         top: -170px;  
          left: -5%;
          
         position: relative;
        display: inline-block;
        color: #021d49;  /*#000; */
        background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
        background-size: 200%;
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        animation: shine 4s linear infinite;
        text-align: center;
    }
    /* ESTAMOS ACA HAY QUE DIRECCIONAR LOS ICONOS DE COMPARTIR SOCIAL*/
    .compartirSocialDos ul {
/*        flex-direction: column;*/
        align-items: center;
        position: absolute;
        left: -80px;
        top: 200px;
        
    }
    .compartirSocialDos ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocialDos a svg {
        width: 20px;
        height: 20px;
         
    }
    .compartirSocial ul {
/*        flex-direction: column;*/
        align-items: center;
        position: absolute;
        left: -80px;
        top: 144px;
    }
    .compartirSocial ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocial a svg {
        width: 20px;
        height: 20px;
    }
     .card-footer { /* compartir LAVARROPAS ESTOY ACA 05/08/24*/
        width: 70%;
        left: 17%;
        height: 30px; 
        padding: 300px 2px;
/*        font-size: 0.9em; */
        top: 16%; 
        position: absolute;
        margin-top: auto;
        text-align: center;
        box-sizing: border-box;
    }     /*-------------------------------SERVICE-------------------------------------------   */

    .telefono img {
        width: 30px;
    }
   
    .socialResto, 
    .list-unstyled,
    .link-body-emphasis {    
        width: 50%;
        left: 60%;
        top: 4.9%;         top: 10%;
        font-size: 0.7rem;
        white-space: nowrap;  /*  SE AGREGO ESTA PROPIEDAD */
       overflow-wrap: break-word;  
    }
    .social-menu svg {
        width: 18px;
        height: 23px;
      
    }
        .socialResto ul {
        flex-direction: row;
        top: 4.9%;
    }

    .socialResto li {
        margin-bottom: 0;
    }
    
    
     .containerService h2 {
        font-size: 2rem;
        margin: 0 auto;
        padding-top: 0px;
    }

    .containerService .card-text {
        font-size: 0.9rem;
    }
     #parrafo {
        font-size: 0.9rem;
    }
   
    .small-screen {
    width: 100%; /* Asegura que la columna ocupe todo el ancho disponible */
    }
  
   .card-body {
    padding: 10px; /* Ajusta el padding si es necesario */
    overflow: hidden; /* Evita que el contenido dentro del contenedor se desborde */
   }

   .responsive-img {
    max-width: 100%; /* La imagen no excederá el ancho del contenedor */
    height: auto; /* Mantiene la proporción de la imagen */
    display: block; /* Elimina cualquier espacio en línea alrededor de la imagen */
   }
    
    .home-step__titlePrinc{
        width: 100%;
        font-size: 3em;
        margin: 10 auto;
    }
    
    .textoSuperpuestoDer1 {
      width: auto;
      line-height: 2;
      margin: 0 10px;
      padding: 2;
      top: 7.2%;/*        top: 42%;*/
      align-items: center;  /* SE AGREGO ESTO AL DISEÑO*/
      background-position: center center; /* SE AGREGO ESTO AL DISEÑO*/
    }
    
    
     #myVideo6 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN SERVICE-------------------------------------------   */
    .imagenFondoAlsika {
       width: 100%;
    }
    .servicioTecnicoCont  {
        font-size: 9rem;
        justify-content: flex-start;
        top: 57%;
        left: 62%; 
        padding: 0px 25px;
    }

    
    .icon2servicioTecnicoCont {
        width: 30%; 
        height: 290%;  
        position: absolute;
        top: 43%; /* Ajusta según tu diseño */
        left: -13%;
        transform: translate(-50%, -50%);
        z-index: 1; /* Asegura que esté delante del texto */
    }
     
    
    .readMore_btn1 {
     width: 16%;  /*10%; Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
        right: 29.8%; /*26.8%;    right: 60px;*/
      top: 50.8%;
     } 
     
     .readMore_btn2 {
     width: 16%; /*10%; Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
        right: 58.8%; /* 26.8%;   right: 60px;  */
      top: 45.9%; /* Ajusta la posición vertical del segundo botón */
     } 
     
    .readMore_btn3 {
        width: 86%;
        height: 3%;
        margin: 0 10px;
        left: 3%;
        align-items: center;
        position: relative;
            top: 65%;
    }
    
     .readMore_btn4 {
      width: 10%;  /*Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
      right: 9%;    
      top:50.8%;
     } 
     
     .readMore_btn5 {
      width: 10%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
      right: 9%;  /*  right: 60px; */
     top: 45.9%; /*  Ajusta la posición vertical del segundo botón */
     } 
     
     .readMore_btn6 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
      right: 9%;    
      top: 50.8%;
     } 
     
     .readMore_btn7 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
      right: 9%;  /*  right: 60px; */
     top: 45.9%;  /* Ajusta la posición vertical del segundo botón */
     } 
      .readMore_btn8 {
      width: 8%;   /* Tamaño de imagen ajustado chap*/
      height: 45px; 
      right: 3.6%;    
      top: 50.8%;
     } 
     
     .readMore_btn9 {
      width: 8%;  /*Tamaño de imagen ajustado llamados */
      padding: 0px 0px;
      height: 45px;
      right: 3.6%;   /* right: 60px; */
     top: 45.9%;  /* Ajusta la posición vertical del segundo botón */
     } 
     /* Contenedor social-menu: fijado al lado izquierdo */
.social-menu {
    position: fixed !important;
  /*  left: 10px !important;      A la izquierda */
/*    left: 160px !important; */
    left: 145px !important; 
    right: auto !important;    /* Anula cualquier right */
    bottom: 40px !important; /*  bottom: 20px !important;*/
    z-index: 9999 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
/*    margin-top: 60%;*/
}

/* Botones dentro del menú */
.social-menu button,
.social-menu a {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;  /* Desactiva cualquier posicionamiento previo */
    box-shadow: none !important;
}

/* Íconos dentro de social-menu */
.social-menu button img,
.social-menu a img {
/*    width: 44px !important;*/
    width: 57px !important;
    height: auto !important;
    display: block !important;
}

/* Neutralizar cualquier botón que tenga estilos fijos */
.readMore_btn1,
.readMore_btn2,
.readMore_btn3,
.readMore_btn4,
.readMore_btn5,
.readMore_btn6,
.readMore_btn7,
.readMore_btn8,
.readMore_btn9 {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}
     
     .containerblog {
      width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
      /*   border: 0.05px solid #999966; Mantiene el borde */
        padding: 0px 40px 0px 30px; /* superior, derecha, inferior, izquierda */
          display: flex;
          flex-wrap: wrap;
/*          box-sizing: border-box;*/
       max-width: calc(100% - 2px); /*  Asegura que el contenedor no sea más ancho que su contenedor padre */    
    }
    
     .blog-post-meta {
      width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
       margin: 0%; /*  Centra el contenedor */
       justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
       padding: 0px 10px 0px 10px;  /* superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        flex-wrap: wrap;
        background-size: cover;
       /* max-width: calc(100% - 20px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
         max-width: calc(100% - 100px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
    
       max-width: 100%; /* La imagen no excederá el ancho del contenedor */
    height: auto; /* Mantiene la proporción de la imagen */
    display: block; /* Elimina cualquier espacio en línea alrededor de la imagen */
      }
     .social-icons svg {
                width: 20px;
                height: 20px;
            }
     #myVideo7 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN BLOG-------------------------------------------   */
    
    
     #myVideo5 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    #myVideo8 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 200%;
        height: 100%;
    }
    #myVideo9 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN TALLER-------------------------------------------   */
    .containerContacto {
      position: relative; /* o absolute, dependiendo de lo que necesites */
      margin: 0px;
      min-height: 110vh;  /*  Asegura que el contenedor tenga al menos el tamaño de la pantalla */
     
        }
        
        .text-center {
            text-align: center;
        }
        
        .form-label {
            font-size: 0.875rem;
            
        }
        
        .form-control, 
        .form-select {
            font-size: 0.875rem; 
        }
    
  
     /*-------------------------------FIN CONTACTO-------------------------------------------   */
     footer {
        width: 100%;
        clear: both;
        text-align: center;
        margin-top: 20px;
        padding: 0px 0px 0px 8px;
          text-align: center; /* Alineación de texto centrada */
        margin-top: auto;
        margin-right: auto;
        margin-left: auto;
       
    }
    
  }
/* -----FIN @media only screen and (min-width: 992px) and (max-width: 1024px) --- **/











/* -----INICIO PANTALLAS 768px Tablet en adelante (iPad incluido)-- MEDIA PANTALLA DE NOTEBOOK PANTALLASSSSSSSSS SEMIS GRANNNNNNNNNNNDESSSSSSSSSSSSSSSSSSSSSSSSSS---//*/
/* -----INICIO PANTALLAS 768px Tablet en adelante (iPad incluido)-- MEDIA PANTALLA DE NOTEBOOK PANTALLASSSSSSSSS SEMIS GRANNNNNNNNNNNDESSSSSSSSSSSSSSSSSSSSSSSSSS---//*/
/* -----INICIO PANTALLAS 768px Tablet en adelante (iPad incluido)-- MEDIA PANTALLA DE NOTEBOOK PANTALLASSSSSSSSS SEMIS GRANNNNNNNNNNNDESSSSSSSSSSSSSSSSSSSSSSSSSS---//*/
/* iPad en horizontal, Samsung Galaxy Tab en horizontal, Tablets de 8–10", Netbooks antiguas (11") --- Algunas pantallas de notebooks c {*/
@media only screen and (min-width: 769px) and (max-width: 992px) {
/*    html, body {   ********** Otra configuración *****************
    height: auto;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    max-width: 100%;
      margin: 0;            Quita márgenes por defecto TICTAC 
      padding: 0;           Quita padding por defecto TICTAC 
  }*/
  
  /* Contenedores principales */
/*  .container-xxl, 
  .containerService,
  .p-4,
  .p-md-5 {                   ********** Otra configuración *****************
    padding: 10px !important;
    margin: 0 auto !important;
  }*/
  
  main {                  /*********** Otra configuración ******************/
    min-height: unset; /* ❗ Quitar el 100vh si hay contenido que necesita más espacio */
    height: auto;
  }
  .imagenFondo1,
  .imagenFondoAlsika,
  .imagenFondoIndex,
  .imagenFondoTaller,
  .imagenFondoService,
  .imagenFondoCont {       /*********** Otra configuración ******************/
    background-attachment: scroll !important;
    
  }
  
/*    .imagenFondoTaller {
  background-image: url("/img/Repair.jpg");
  background-attachment: scroll !important;
  background-position: top center !important;
  background-size: cover;
  width: 100%;
  max-width: 100%;
  margin: 0;

   ✅ Corrección aquí 
   min-height: 100vh; Asegura que ocupe al menos toda la pantalla 
  padding-bottom: 5rem;  Aumenta el espacio inferior si es necesario 
}
  */

.contenedorGeneral {
        width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
         border: 0.05px solid #999966; /*Mantiene el borde */
     /*   padding: 0px 5px 0px 5px;  superior, derecha, inferior, izquierda */
          display: flex;
          flex-wrap: wrap;
          box-sizing: border-box;
      
   
    }
        .container {
         width: 100%;   /* Ajusta el ancho del contenedor según sea necesario */
         margin: 0 auto;   /* Centra el contenedor */
         justify-content: center;   /* Centra el contenido horizontalmente */
         background-position: center;
        background-size: cover;
 /*    padding: 0px 20px 0px 20px;     superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
         display: flex;
        flex-wrap: wrap;
      /* max-width: calc(100% - 100%);  Asegura que el contenedor no sea más ancho que su contenedor padre */
     /*  max-width: calc(100% - 20px);    Asegura que el contenedor no sea más ancho que su contenedor padre */
    }
    
     .containerIndex  {
        width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
        /* margin: 0 auto;  Centra el contenedor */
                margin: 5px auto !important; /* Si antes tenían 20px arriba/abajo, ahora la mitad */
        justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
    /*  padding: 0px 0px 0px 0px;     superior, derecha, inferior, izquierda */
                padding: 0px auto !important;  /*  5px 10px !important; / Antes 24px, ahora la mitad */
        word-wrap: break-word; /*Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        display: flex;
        flex-wrap: wrap;
        background-size: cover;
      /*  max-width: calc(100% - 7px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
        max-width: calc(100% - 4%);   /* Asegura que el contenedor no sea más ancho que su contenedor padre */
      
     } 
    
     .textoSuperpuestoDer {
        position: absolute; /* Asegura que las propiedades top y right tengan efecto */
        box-sizing: border-box; /* Incluye padding y border en el cálculo del ancho y alto */
        overflow: hidden; /* Maneja el desbordamiento del texto */
        line-height: 2.3; /* 2.2; Ajusta el valor según tus necesidades */
        font-size: 2em;
        right: 10%;
        width: 70%;
        height: 15%;
        padding: 15% 0% 15% 0%;
/*        top: 34%;*/
        top: 37%;
        margin: 0px;
        margin-left: 0%;
        margin-right: 5%;
     } 
    
    .textoSuperpuesto{
        position: absolute;   /* position: relative;*/
       font-size: 1.8em;
       left: 14%; /*   right: -5%;*/
       top: 78%; /*top: 350px;*/
       flex-wrap: wrap;
          display: initial;
       overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */ 
       
    }
    
    .servicioTecnico {
        font-size: 6rem;
        justify-content: flex-start;
        top: 62%;
        left: 50%; 
        padding: 0px 25px;
    }
    .Icon2servicioTecnico {
         width: 20%; /* width: 48px;*/
        height: 200%; /* height: 45px;*/
        justify-content: flex-start;
        top: 50%;
        left: -07%; /*  left: -159%;*/
    }
    .telefono {
      width: 70%;
     height: 2%;  /*    height:  100%;     height: 50px; */
     flex-direction: row;  /*  Ícono y número en fila */
     
         
            flex-direction: row;
            gap: 0px !important;
           white-space: nowrap; /* Evita que el número baje */
    }
    
    
    .telefono .numero-telefono {
         font-size: 1.7rem;
         margin: 0;  /* Quitamos márgenes extra  */
        justify-content: center;
     
            flex-direction: row;
            font-weight: bold;
            gap: 0px !important;
            white-space: nowrap; /* Evita que el número baje */
            margin-top: -40px;
     }

          /************************************ ICONOS  ACCESO DIRECTO ********************************************************/
    .contenedor,
    .parte_baja,
    .home-steps__section {   /*********** Otra configuración ******************/
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 5px; /*        gap: 20px;*/
                margin-top: 20px;    /***********************************************DEFINIENDO CONFIGURACION DE ALTO DE ICONOS 15/08*****************/
    }


     .home-step {              /*********** Otra configuración ******************/
        width: calc(50% - 20px) !important; /* 2 columnas más amplias */
        max-width: 350px;
          padding: 6px;/* padding: 12px;*/  /***********************************************DEFINIENDO CONFIGURACION DE ALTO DE ICONOS 15/08*****************/
        text-align: center;
    }

    .home-step__icon {           /*********** Otra configuración ******************/
        width: 100px !important;
        margin-bottom: 0px !important; /*        margin-bottom: 10px !important;*//***********************************************DEFINIENDO CONFIGURACION DE ALTO DE ICONOS 15/08*****************/
    }

/*    .home-step__title {
        font-size: 15px !important;
    }*/

/*    .home-steps__section {
        margin-top: 100px !important;
    }*/

    
/* Texto debajo del ícono */
.home-step__title {            /*********** Otra configuración ******************/
    white-space: normal !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

/* Ocultar descripciones largas */
.home-step__description {     /*********** Otra configuración ******************/
       display: flex !important; /*    display: none !important;*/
}
.home-steps__section {         /*********** Otra configuración ******************/
   /*  margin-top: 150px !important;  Espacio entre la portada y los iconos */
}

    /************************************Fin ICONOS ACCESO DIRECTO ********************************************************/
  /* Menús sociales on‑hover no sirven bien en táctil; ocultar */
/*  .share-buttons {
    display: none !important;
  }*/

    
    .list-unstyled {
        flex-direction: row; /* Cambia la dirección a fila para los íconos de redes sociales */
        justify-content: center; /* Centra los íconos de redes sociales */
        width: 100%;
    }
       
    .title {
        position: relative;
        font-size: 2.5em; /* Ajusta el tamaño de fuente para pantallas pequeñas */
      /* margin: 100px;   Aplica un margen de 10px en todos los lados */
     /*   padding: 2005px 20px 30px 20px;   Aplica padding a los lados para evitar que el texto toque los bordes */
        /* max-width: calc(100% - 100px); Asegura que el contenedor no sea más ancho que su contenedor padre */
        box-sizing: border-box; /* Incluye padding y border en el tamaño total del elemento */
        word-wrap: break-word;  /* Permite que las palabras largas se dividan */
        word-break: break-word; /* Rompe palabras largas al final de una línea */
        overflow: hidden; /* Oculta el desbordamiento del contenido */
        text-overflow: ellipsis; /* Añade puntos suspensivos si el texto es demasiado largo */
        text-align: center;
        margin-top: 100px; /*MODIFICAMOS LA ALTURA DEL TITULO ADEMAS DE MODIFICAR ALTURA SLIDER CONJUNTAMENTE */
    }
     .especialidades, /*NO TOCAR ESTA CLASE CORRESPONDE AL SLIDER ------ */
     .card, .image-box{
                width: 100%;
                height: auto;
                margin: 0px auto; 
                display: grid;      
                padding: 0 0.1% 0 0.1%;
               justify-content: space-between;    /*  Distribuye los ítems con espacio entre ellos */
                align-items: center;  /* Centra los ítems verticalmente */
                grid-template-columns:  repeat(2, 1fr);
                grid-template-rows: repeat(2, auto); 
                grid-gap: 0px; 
                /*NO TOCAR ESTA CLASE CORRESPONDE AL SLIDER ------ */
        }
        
        .cont {  /**MODIFICAMOS LA ALTURA DEL SLIDER /
        white: 100%; 
/*        margin: 0 auto;*/
        padding: 0px 0px 160px 0px; /* margen de arriba , derecha, abajo, izquierda*/ 
        overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */      
        margin-top: 410px;  /*MODIFICAMOS LA ALTURA DEL SLIDER */  /***********************************************DEFINIENDO CONFIGURACION DE ALTO DE ICONOS 15/08*****************/
        margin-bottom: 50px; /*MODIFICAMOS LA ALTURA INFERIOR DEL SLIDER PARA DAR ESPACIO AL TITULO */
         position: unset;
        content: unset;
         box-shadow: unset;
    }
    
     video {
        width: 100%;
        height: auto;
        max-width: 100%;  /*Asegura que el texto no se salga del contenedor */
       display: block;
    } 
    #myVideo {
        position: absolute;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
     #myVideo1 {
        position: absolute;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .video-container video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: auto; /* Ajusta la altura según sea necesario */
    }
    
         .shinedos{ 
         width: 100%;
         font-size: 2.5em; /*LAVARROPAS ESTOY ACA 05/08/24*/
         top: -80px; 
          left: -10%;
         position: relative;
        display: inline-block;
        color: #021d49;  /*#000; */
        background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
        background-size: 200%;
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        animation: shine 4s linear infinite;
        text-align: center;
    }
        .shine{ 
         width: 100%;
         font-size: 2.5em;
         top: -80px;  
          left: -10%;
         position: relative;
        display: inline-block;
        color: #021d49;  /*#000; */
        background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
        background-size: 200%;
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        animation: shine 4s linear infinite;
        text-align: center;
    }
    /* ESTAMOS ACA HAY QUE DIRECCIONAR LOS ICONOS DE COMPARTIR SOCIAL*/
    .compartirSocialDos ul {
/*        flex-direction: column;*/
        align-items: center;
        position: absolute;
        left: -125px;
        top: -18px;
        
    }
    .compartirSocialDos ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocialDos a svg {
        width: 20px;
        height: 20px;
         
    }
    .compartirSocial ul {
/*        flex-direction: column;*/
        align-items: center;
         position: absolute;
        left: -125px;
        top: -75px;
    }
    .compartirSocial ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocial a svg {
        width: 20px;
        height: 20px;
    }
     .card-footer { /* compartir LAVARROPAS ESTOY ACA 05/08/24*/
        width: 70%;
        left: 17%;
        height: 30px; 
        padding: 300px 2px;
/*        font-size: 0.9em; */
        top: 11%; 
        position: absolute;
        margin-top: auto;
        text-align: center;
        box-sizing: border-box;
    } 
    
    
    /* Contenedor social-menu: fijado al lado izquierdo */
.social-menu {                     /*********** Otra configuración ******************/
    position: fixed !important;
  /*  left: 10px !important;      A la izquierda */
    left: 160px !important; 
    right: auto !important;    /* Anula cualquier right */
    bottom: 10px !important; /*  bottom: 20px !important;*/
    z-index: 9999 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Botones dentro del menú */
.social-menu button,
.social-menu a {                /*********** Otra configuración ******************/
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;  /* Desactiva cualquier posicionamiento previo */
    box-shadow: none !important;
}

/* Íconos dentro de social-menu */
.social-menu button img,
.social-menu a img {           /*********** Otra configuración ******************/
/*    width: 44px !important;*/
    width: 48px !important;
    height: auto !important;
    display: block !important;
}

/* Neutralizar cualquier botón que tenga estilos fijos */
.readMore_btn1,
.readMore_btn2,
.readMore_btn3,
.readMore_btn4,
.readMore_btn5,
.readMore_btn6,
.readMore_btn7,
.readMore_btn8,
.readMore_btn9 {                        /*********** Otra configuración ******************/
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
     position: relative !important;  /* AGREGADADA ULTIMA */
     margin-left: 0Px;
}


    .readMore_btn1 {
     width: 16%;  /*10%; Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
           right: 26%;   /* right: 60px;  */
      top: 50.8%;
     } 
     
     .readMore_btn2 {
     width: 16%; /*10%; Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
       right: 26%; /*     right: 58.8%;  26.8%;   right: 60px;  */
      top: 45.9%; /* Ajusta la posición vertical del segundo botón */
     } 
     
    .readMore_btn3 {
        width: 86%;
        height: 3%;
        margin: 0 10px;
        left: 3%;
        align-items: center;
        position: relative;
            top: 65%;
    }
    
     .readMore_btn4 {
      width: 10%;  /*Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
      right: 26%;    
      top:50.8%;
     } 
     
     .readMore_btn5 {
      width: 10%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
      right: 26%;    /*   right: 60px; */
     top: 45.9%; /*  Ajusta la posición vertical del segundo botón */
     } 
     
     .readMore_btn6 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
      right: 26%;    
      top: 50.8%;
     } 
     
     .readMore_btn7 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
    right: 26%;    /*  right: 60px; */
     top: 45.9%;  /* Ajusta la posición vertical del segundo botón */
     } 
      .readMore_btn8 {
      width: 8%;   /* Tamaño de imagen ajustado chap*/
      height: 45px; 
      right: 26%;    
      top: 50.8%;
     } 
     
     .readMore_btn9 {
      width: 8%;  /*Tamaño de imagen ajustado llamados */
      padding: 0px 0px;
      height: 45px;
       right: 26%; /*  right: 60px; */
     top: 45.9%;  /* Ajusta la posición vertical del segundo botón */
     } 
     /* Contenedor social-menu: fijado al lado izquierdo */
    
 
    .telefono img {
        width: 30px;
    }
    
    .socialResto, 
    .list-unstyled,
    .link-body-emphasis {    
        width: 50%;
        left: 60%;
        top: 6.5%;       
        font-size: 0.7rem;
        white-space: nowrap;  /*  SE AGREGO ESTA PROPIEDAD */
       overflow-wrap: break-word;  
    }
    .social-menu svg {
        width: 18px;
        height: 23px;
      
    }
        .socialResto ul {
        flex-direction: row;
        top: 6.5%;
    }

    .socialResto li {
        margin-bottom: 0;
    }
    
    /* Contenedor principal de portada */
    .header-portada {                                 /*********** Otra configuración ******************/
       display: flex !important;
       flex-direction: column !important; /* Icono+ALSIKA arriba, textoSuperpuesto abajo */
       align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      gap: 2px !important; /* Espacio entre ALSIKA y el texto */
      margin: 0 auto !important;
     /*    padding: 0 8px !important;*/
     padding: 0 4px !important;
    }

    .containerIndex .card,
    .containerIndex .card .image-box,
    .containerIndex .card .image-box img {   /*********** Otra configuración ******************/
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        scale: 1 !important;
     }

     
     .containerService h2 {
        font-size: 2rem;
        margin: 0 auto;
        padding-top: 0px;
    }

    .containerService .card-text {
        font-size: 0.9rem;
    }
     #parrafo {
        font-size: 0.9rem;
    }
   
    .small-screen {
    width: 100%; /* Asegura que la columna ocupe todo el ancho disponible */
    }
  
   .card-body {
    padding: 10px; /* Ajusta el padding si es necesario */
    overflow: hidden; /* Evita que el contenido dentro del contenedor se desborde */
   }

   .responsive-img {
    max-width: 100%; /* La imagen no excederá el ancho del contenedor */
    height: auto; /* Mantiene la proporción de la imagen */
    display: block; /* Elimina cualquier espacio en línea alrededor de la imagen */
   }
    
    .home-step__titlePrinc{
        width: 100%;
        font-size: 3em;
        margin: 10 auto;
    }
    
    .textoSuperpuestoDer1 {
       width: auto;
       line-height: 2;
       margin: 0 10px;
       padding: 2;
       top: 5%;/*        top: 42%;*/
       align-items: center;  /* SE AGREGO ESTO AL DISEÑO*/
       background-position: center center; /* SE AGREGO ESTO AL DISEÑO*/
    }
    
     #myVideo6 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN SERVICE-------------------------------------------   */
    .imagenFondoAlsika {
       width: 100%;
    }
    .servicioTecnicoCont  {
        font-size: 9rem;
        justify-content: flex-start;
        top: 57%;
        left: 62%; 
        padding: 0px 25px;
    }

    
    .icon2servicioTecnicoCont {
        width: 30%; 
        height: 290%;  
        position: absolute;
        top: 43%; /* Ajusta según tu diseño */
        left: -13%;
        transform: translate(-50%, -50%);
        z-index: 1; /* Asegura que esté delante del texto */
    }
     
     .containerblog {
      width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
      /*   border: 0.05px solid #999966; Mantiene el borde */
        padding: 0px  50px 0px 10px; /* superior, derecha, inferior, izquierda */
          display: flex;
          flex-wrap: wrap;
/*          box-sizing: border-box;*/
       max-width: calc(100% - 2px); /*  Asegura que el contenedor no sea más ancho que su contenedor padre */    
    }
    
     .blog-post-meta {
      width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
       margin: 0%; /*  Centra el contenedor */
       justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
       padding: 0px 10px 0px 10px;  /* superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        flex-wrap: wrap;
        background-size: cover;
       /* max-width: calc(100% - 20px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
         max-width: calc(100% - 100px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
    
       max-width: 100%; /* La imagen no excederá el ancho del contenedor */
    height: auto; /* Mantiene la proporción de la imagen */
    display: block; /* Elimina cualquier espacio en línea alrededor de la imagen */
      }
     .social-icons svg {
                width: 20px;
                height: 20px;
            }
     #myVideo7 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN BLOG-------------------------------------------   */
    
    
     #myVideo5 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    #myVideo8 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    #myVideo9 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN TALLER-------------------------------------------   */
    .containerContacto {
      position: relative; /* o absolute, dependiendo de lo que necesites */
      margin: 0px;
      min-height: 110vh;  /*  Asegura que el contenedor tenga al menos el tamaño de la pantalla */
     
    }
        .text-center {
            text-align: center;
        }
        .form-label {
            font-size: 0.875rem;
            
        }
        .form-control, 
        .form-select {
            font-size: 0.875rem; 
        }
    
  
     /*-------------------------------FIN CONTACTO-------------------------------------------   */
    
    
    
     footer {
        width: 100%;
        clear: both;
        text-align: center;
        margin-top: 20px;
        padding: 0px 0px 0px 8px;
          text-align: center; /* Alineación de texto centrada */
        margin-top: auto;
        margin-right: auto;
        margin-left: auto;
       
    }
    
  }
/* -----FIN @media only screen and (min-width: 769px) and (max-width: 991px)  --- **/

















/*/*-----------------------------------------------------------------------------------------------------------------------*/
/* Pantallas extra pequeñas  ***************  iPhone SE (375px)
iPhone iPhone 14, 15 (normal, Plus) en modo vertical (375–430px aprox.)
Samsung Galaxy S7, S8, S9, S10, S20, S21, A-series, etc. en vertical (360–412px)
Samsung Galaxy S, A, M (la mayoría de gamas actuales)
Google Pixel 4, 5, 6 en vertical (390–412px)
Xiaomi, Huawei y la mayoría de Android estándar en vertical (360–420px)
Tablets de 7" en modo vertical (ej: Samsung Tab A7, iPad Mini en vertical)
Tablets pequeñas si están en vertical (ejemplo: iPad Mini en portrait 768px → ahí justo queda en el límite). **********************//* Pantallas extra pequeñas  ***************  TELEFONO SANSUNG A14 GALAXYS **********************/
/* Pantallas extra pequeñas  ***************  TELEFONO SANSUNG A14 GALAXYS **** iPhone iPhone 14, 15 (normal, Plus) en modo vertical (375–430px aprox.)******************//* Pantallas extra pequeñas  ***************  TELEFONO SANSUNG A14 GALAXYS **********************/
    @media (max-width: 768px) {   
   .contenedorGeneral {
        width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
      /*   border: 0.05px solid #999966; Mantiene el borde */
        padding: 0px 0px 0px 0px; /* superior, derecha, inferior, izquierda */
          display: flex;
          flex-wrap: wrap;
/*          box-sizing: border-box;*/
       max-width: calc(100% - 2px); /*  Asegura que el contenedor no sea más ancho que su contenedor padre */    
    }

        .container {
    /*     width: 100%; Ajusta el ancho del contenedor según sea necesario */
        margin: 0%; /*  Centra el contenedor */
        justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        padding: 0px 0px 0px 0px;  /* superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        display: flex;
        flex-wrap: wrap;
        background-size: cover;
        max-width: calc(100% - 2px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
     /*    max-width: calc(100% - 100px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
    
             width: 100% !important;
             max-width: 100% !important;
        }
    
    .containerIndex  {
           margin-top: 2270px; /*        top: 400px;*/
      /*  width: 100%;  Ajusta el ancho del contenedor según sea necesario */
     /*   margin: 0%;  Centra el contenedor */
       justify-content: center;  /* Centra el contenido horizontalmente */
       background-position: center;
       background-size: cover;
       padding: 66px 2px 0px 2px;  /* superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word;  /*    Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
       display: flex;
       flex-wrap: wrap;
        max-width: 100% !important; /*SE COMENTO PARA AGREGAR COLUMNAS*/
        box-sizing: border-box;

 /* flex-direction: column; Para que los elementos se apilen verticalmente */
        align-items: center; /* Centrar el contenido horizontalmente */
        text-align: center; /* Centrar textos y títulos */
    }
    
/*    .containerIndex .card-text {
        font-size: 14px;  Ajusta tamaño de texto para móviles 
        line-height: 1.5;
    }*/

/*    .containerIndex h2.title {
        font-size: 18px;  Ajusta título para móviles 
    }*/
    
    
     /* Si quieres dividir el texto en dos columnas en móvil */
/*    .containerIndex > div > span {
        flex: 1 1 100%;  cada span ocupa toda la fila en móvil 
        box-sizing: border-box;
    }
    */
    .containerIndex .card,
    .containerIndex .card .image-box,
    .containerIndex .card .image-box img {   /*********** Otra configuración *****************/
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        scale: 1 !important;
     }



    .containerHeader {
/*    width:100%;*/
     height: 47vh;   /*  height: 55vh; height: 290px;   */
   /* max-height: 140%;  max-height: 500px; */
    box-shadow: 100px 100px 300px 2px black;     /*   100px 100px 255px 50px black;  VER QUE ONDA MODIFICAR LOS DOS PRIMEROS */
/*    border: 5.5px solid transparent;                */
    padding: 10px; 
    line-height: 1px;
    padding-top: 0px;
    padding-bottom: 0px;  
                   
             width: 100% !important;
             max-width: 100% !important;
    
    }
    
     .containerTaller {
        display: flex;
        flex-wrap: wrap;
        padding-top: 43vh;   /* Ajuste menor para móviles */
        padding-bottom: 1rem; /* Pequeño padding inferior */
        width: 100%;          /* Ocupa todo el ancho disponible */
        max-width: 100%;      /* Evita que se salga del contenedor padre */
        margin: 0 auto;       /* Centrado horizontal */
        box-sizing: border-box;
        background-size: contain; /* Mantiene la imagen dentro del contenedor */
    }

 .containerTaller .card-text-responsive {
    margin-left: 2px;   /* margen mínimo a la izquierda */
    margin-right: 2px;  /* margen mínimo a la derecha */
}
  
     
        
/*     .containerService{ margin-bottom: 0 !important; }*/
     
    
        .containerService {
        display: flex;
        flex-wrap: wrap;
        padding-top: 43.2vh;       /* Aumenta la separación desde arriba */
        padding-bottom: 1rem;    
        width: 100%;             
        max-width: 100%;         
        margin: 0 auto;          
        box-sizing: border-box;  
        background-size: contain; 
    }
       
    
        
/*     .containerService{ margin-bottom: 0 !important; }*/
     
   .containerService p.card-text {
        margin-left: 2px;   /* margen mínimo a los lados */
        margin-right: 2px;
        width: calc(100% - 10px); /* ancho completo restando márgenes */
        box-sizing: border-box;   /* asegura que los márgenes/padding no salgan del contenedor */
  }
/*   .imagenFondoTaller {
    background-size: cover;
    background-position: center top;
     background-attachment: fixed; 
  }*/

/*     .containertaller {
      width: 100%;
        box-sizing: border-box;  Asegura que el padding se incluya en el ancho total 
        margin: 0 auto;  Centra horizontalmente 
        padding: 10px 35px 10px 30px;  superior, derecha, inferior, izquierda 
          display: flex;
          flex-wrap: wrap;
       max-width: calc(100% - 2px);   Asegura que el contenedor no sea más ancho que su contenedor padre     
    }*/
    
    
      
        

    .social-menu,.image-box, .slider, .carousel-inner, .carousel-item, .container-fluid, .main, .sub, .home-step__text, .home-step__description, .share-buttons li, .servicioTecnico, h2, .Icon2servicioTecnico, .textoSuperpuesto, .textoSuperpuestoDer, .telefono img, .home-steps__title, .video-container, .video-container video, .btn-outline-dark, .list-unstyled, .list-unstyled li, iframe, footer {
        width: 100%;
    
    }
    
    .imagenFondo {
         width:100%; /*       width: 100vw;*/
         height: auto;  /*       height: 100vh;*/
    
    }  
    
   

     .card-text {
        width: 100%;
        margin: 0px auto;
      /*  padding: 0px 10px;  margen de arriba , derecha, abajo, izquierda*/ 
        font-size: 0.8em; /* Asegúrate de que el tamaño de la fuente esté en minúsculas */
        color: #414848;
        text-align: justify;
        justify-content: center;  /* Centra el contenido horizontalmente */
         background-position: center;
        background-size: cover;

        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        position: unset;
        content: unset;
   /*      box-shadow: unset;*/
         max-width: calc(100% - 100px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
       object-fit: cover;  /* Ajusta la imagen manteniendo la relación de aspecto y cubriendo todo el contenedor */
/*       clear: both;*/
 /*       text-align: center;
        width: 100%;
        margin-top: 20px;
        padding: 0px 0px 0px 8px;
          text-align: center;  Alineación de texto centrada 
        margin-top: auto;
        margin-right: auto;
        margin-left: auto;*/
   
    
    } 
  .card {
        width: 100%;
        height: auto;
        margin-bottom: 15px;
        box-sizing: border-box;
     }
    .card-body {
        white: 100%;
        padding: 0px;
/*        text-overflow: ellipsis;*/
        margin-top: 0%; /* Elimina márgenes externos */
        margin-left: 3%;
        justify-content: space-between;     /*  Distribuye los ítems con espacio entre ellos */
    /*    max-height: 450px;  Limita la altura máxima */
 /*       overflow: hidden;  Oculta el contenido que sobresalga */
         grid-template-columns:  repeat(2, 1fr);
         display:  block;      
         box-sizing: border-box;
    }
   
         .shinedos{ 
         width: 100%;
         font-size: 1.2em; /*LAVARROPAS */
         top:-100px; 
         left: -10.5%;
         position: relative;
         display: inline-block;
         color: #021d49;  /*#000; */
         background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
         background-size: 200%;
         background-clip: text;
         -webkit-background-clip: text;
         color: transparent;
         animation: shine 4s linear infinite;
         text-align: center;
    }
        .shine{    /*HELADERAS*/
         width: 100%;
         font-size:  1.6em;
         top: -80px;  
         left: -14%;
         position: relative;
         display: inline-block;
         color: #021d49;  /*#000; */
         background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
         background-size: 200%;
         background-clip: text;
         -webkit-background-clip: text;
         color: transparent;
         animation: shine 4s linear infinite;
         text-align: center;
    }
    .no-hover1 {
         width: 100%;
         height: auto;
         font-size: 3em;
         top: -500px;
    }
    .no-hover2 {
         width: 100%;
         font-size: 3em;
         top: -250px;
    }
  
    h5.no-hover-color-change {
    text-align: center;
    font-size: 1.4rem;  /* más chico para móviles */
    margin-bottom: 10px;
      }

  .containerIndex h2.title {
    text-align: center;
    font-size: 1.5rem; /* más chico para que no desborde */
    margin-top: 15px; /* ajusta si queda muy arriba */
    line-height: 1.5;  /* mejor lectura en móviles */
  }

    .text-box {
        width: 100%;
        padding: 10px;
     /*   font-size: 20px;  Asegúrate de que el tamaño de la fuente esté en minúsculas */
    }
    .no-hover-color-change {
/*        display: block;*/
        text-align: center;
        font-size: 1.3em; /* Asegúrate de que el tamaño de la fuente esté en minúsculas */
          max-width: 100%; /* Asegura que el texto no se salga del contenedor */

    }
     .no-hover-color-change1 {
/*        display: block;*/
       text-align: center;
       font-size: 0.6em; /* Asegúrate de que el tamaño de la fuente esté en minúsculas */
       word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
       max-width: 100%; /* Asegura que el texto no se salga del contenedor */
       margin-top: -25px;
       position: relative;
     }
   
     
     .text-span {
/*        display: block;*/
        width: 100%;
        text-align: center;
        font-size: 0.9em; /* Asegúrate de que el tamaño de la fuente esté en minúsculas */
          margin-top: -30px;
        max-width: 100%; 
     }

    .title {
        position: relative;
        font-size: 1em; /* Ajusta el tamaño de fuente para pantallas pequeñas */
        margin: 0px; /* Aplica un margen de 10px en todos los lados */
        padding: 20px 20px 20px 20px; /* Aplica padding a los lados para evitar que el texto toque los bordes */
        max-width: calc(100% - 100px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
        box-sizing: border-box; /* Incluye padding y border en el tamaño total del elemento */
        word-wrap: break-word;  /* Permite que las palabras largas se dividan */
        word-break: break-word; /* Rompe palabras largas al final de una línea */
        overflow: hidden; /* Oculta el desbordamiento del contenido */
        text-overflow: ellipsis; /* Añade puntos suspensivos si el texto es demasiado largo */
/*        margin-top: -80px;  */
        text-align: center;
/*        margin-top: 0px;*/
      
        
    }
       h2 {
     font-size: 2rem;/*    font-size: 16px;*/
    line-height: 24px;
    padding: 8px 15px;
    text-align: center; /* más centrado en tablets */
/*    top: 500px;*/
  }

          /************************************ ICONOS  ACCESO DIRECTO ********************************************************/
    .contenedor,
    .parte_baja,
    .home-steps__section {   /*********** Otra configuración ******************/
         margin-top: 0 !important;/*  quitar margen extra */
         padding: 0px !important;    /*padding: 0 !important;  eliminar padding */
         gap: 5px !important;/*-800px gap: 5px !important;      espacio mínimo entre iconos */
/*        display: flex;*/
         flex-wrap: wrap;
         margin-bottom: 0px !important; 
         justify-content: left !important; /* justify-content: center !important;  centra las columnas */
         /*       margin-top: 5px !important;  reduce espacio arriba */  /* margin-top: 20px;  ACABO DE PONER EN AUTO   **********************************************DEFINIENDO CONFIGURACION DE ALTO DE ICONOS 15/08*****************/
         top: -5px !important; /* eliminar desplazamiento hacia arriba */    /*   unset     anula el top que empuja */  
         margin-left: 19px !important;
        
    }
    
    
     .home-step {              /*********** Otra configuración ******************/
   /*      margin-top: 0 !important;  /*  margin: 0 2px 5px 2px !important; márgenes pequeños para filas y columnas */
        top: -5px !important; /* eliminar desplazamiento hacia arriba */
        width: calc(50% - 20px) !important;  /*width: 50% !important; width: calc(50% - 20px) !important;  2 columnas ajustadas */
       /* max-width: 100px !important;           max-width: 350px;*/
        padding-top: 0 !important; /* quitar padding extra */
        gap: -800px !important; /*gap: 5px !important;  reducir espacio entre filas */
        /*  margin: 2px auto !important; centrado y pequeño espacio entre filas */
        padding: 0px !important;  
        justify-content: left !important;
        margin-left: 19px !important;
    }
   
    .home-step > div {
    flex: 1 1 calc(50% - 10px); /* Dos columnas con gap */
    box-sizing: border-box;
    }

    .home-step__icon {           /*********** Otra configuración ******************/
        width: 95px !important; /* tamaño de ícono */
        margin-bottom: 0px !important;  /* margin-bottom: 5px !important; pequeño espacio entre ícono y texto   margin-bottom: 10px !important;*//***********************************************DEFINIENDO CONFIGURACION DE ALTO DE ICONOS 15/08*****************/
        height: auto !important;
        top: -5px !important; 
        display: none; 
        justify-content: left !important;
        margin-left: 19px !important;
    }
    


/*    .home-step__title {
        font-size: 15px !important;
    }*/

/*    .home-steps__section {
        margin-top: 100px !important;
    }*/

    
/* Texto debajo del ícono */
.home-step__title {            /*********** Otra configuración ******************/
    white-space: normal !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

/* Ocultar descripciones largas */
.home-step__description {     /*********** Otra configuración ******************/
       display: flex !important; /*    display: none !important;*/
}
.home-steps__section {         /*********** Otra configuración ******************/
   /*  margin-top: 150px !important;  Espacio entre la portada y los iconos */
}

    /************************************Fin ICONOS ACCESO DIRECTO ********************************************************/
  /* Menús sociales on‑hover no sirven bien en táctil; ocultar */
/*  .share-buttons {
    display: none !important;
  }*/

    
   
.home-step:hover .share-buttons {
        top: -50px; /* Sube los botones más arriba, ajustá según lo necesites */
        right: 10px; /* Mantener alineación a la derecha */
        left: auto;  /* Evita conflicto con left en pantallas pequeñas */
        padding: 10px; /* Opcional: ajustar tamaño */
    }

    /* Si usás .ms-3 en los íconos de la lista, podés reducir el margen lateral en móviles */
    .ms-3 {
        margin-left: 0.5rem; /* Ajusta según necesites */
    }


    .list-unstyled {
        flex-direction: row; /* Cambia la dirección a fila para los íconos de redes sociales */
        justify-content: center; /* Centra los íconos de redes sociales */
        width: 100%;
    }

    .slider--img {
        margin: 0;
/*        aspect-ratio: 16/45; */
        aspect-ratio: 16/28;
        width: 100%;
        height: 100%;
         max-width: calc(100% - 100px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
       object-fit: cover;  /* Ajusta la imagen manteniendo la relación de aspecto y cubriendo todo el contenedor */
/*       top: -60%;*/
    }
    
    .home-steps.horizontal-layout {  /*********************AGREGADO PARA ICONOS MARQUETINEROS*********************/
       border: 3.5px dashed #46b3d1;   /* Línea punteada */
       border-radius: 16px;
       background-color: #f9f9f9;     /*  Fondo claro para resaltar */
       padding: 5px 10px;  /*  5px 20px;   padding: 20px; menos padding arriba y abajo */
       max-height: fit-content;  /*asegura que no se estire de más */
    }

/*      .home-steps.horizontal-layout {  *********************AGREGADO PARA ICONOS MARQUETINEROS*********************-----
           display: none !important;
    }*/
    
   .especialidades {
     width: 100% !important;       /* Ocupa todo el ancho disponible */
     max-width: 100% !important;   /* No se salga del contenedor */
     flex-direction: column !important;  /* Columnas en móvil */
     align-items: center;
     margin-top: 0px !important;  /* 20px !important;  Baja el slider sin romper layout */
   }



  /* Imagen del slider */
  .slider--img, .card-img-top {
    width: 100% !important;
    height: auto !important; /* Ajusta altura según ancho */
  }
             /************************************ICONOS ACCESO DIRECTO ********************************************************/
     /* Contenedor de iconos / accesos directos */
  .cont {
    width: 100% !important;
    margin-top: 0px !important;  /* Baja sin usar top absoluto */
    position: relative !important;
    padding: 0 1rem !important;
  }
    /************************************Fin ICONOS ACCESO DIRECTO ********************************************************/
   
    .readMore_btn1 {
     width: 16%;  /*10%; Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
        right: 29.8%; /*26.8%;    right: 60px;*/
      top: 50.8%;
     } 
     
     .readMore_btn2 {
     width: 16%; /*10%; Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
        right: 58.8%; /* 26.8%;   right: 60px;  */
      top: 45.9%; /* Ajusta la posición vertical del segundo botón */
     } 
     
    .readMore_btn3 {
        width: 86%;
        height: 3%;
        margin: 0 10px;
        left: 3%;
        align-items: center;
        position: relative;
            top: 65%;
    }
    
     .readMore_btn4 {
      width: 10%;  /*Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
      right: 9%;    
      top:50.8%;
     } 
     
     .readMore_btn5 {
      width: 10%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
      right: 9%;  /*  right: 60px; */
     top: 45.9%; /*  Ajusta la posición vertical del segundo botón */
     } 
     
     .readMore_btn6 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
      right: 9%;    
      top: 50.8%;
     } 
     
     .readMore_btn7 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
      right: 9%;  /*  right: 60px; */
     top: 45.9%;  /* Ajusta la posición vertical del segundo botón */
     } 
      .readMore_btn8 {
      width: 8%;   /* Tamaño de imagen ajustado chap*/
      height: 45px; 
      right: 3.6%;    
      top: 50.8%;
     } 
     
     .readMore_btn9 {
      width: 8%;  /*Tamaño de imagen ajustado llamados */
      padding: 0px 0px;
      height: 45px;
      right: 3.6%;   /* right: 60px; */
     top: 45.9%;  /* Ajusta la posición vertical del segundo botón */
     } 
     /* Contenedor social-menu: fijado al lado izquierdo */
.social-menu {
    position: fixed !important;
  /*  left: 10px !important;      A la izquierda */
/*    left: 160px !important; */
    left: 145px !important; 
    right: auto !important;    /* Anula cualquier right */
    bottom: 40px !important; /*  bottom: 20px !important;*/
    z-index: 9999 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
/*    margin-top: 60%;*/
}

/* Botones dentro del menú */
.social-menu button,
.social-menu a {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;  /* Desactiva cualquier posicionamiento previo */
    box-shadow: none !important;
}

/* Íconos dentro de social-menu */
.social-menu button img,
.social-menu a img {
/*    width: 44px !important;*/
    width: 57px !important;
    height: auto !important;
    display: block !important;
}

/* Neutralizar cualquier botón que tenga estilos fijos */
.readMore_btn1,
.readMore_btn2,
.readMore_btn3,
.readMore_btn4,
.readMore_btn5,
.readMore_btn6,
.readMore_btn7,
.readMore_btn8,
.readMore_btn9 {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}
     
     
    .textoSuperpuestoDer {
        position: absolute; /* Asegura que las propiedades top y right tengan efecto */
        box-sizing: border-box; /* Incluye padding y border en el cálculo del ancho y alto */
        overflow: hidden; /* Maneja el desbordamiento del texto */
        line-height: 2; /* Ajusta el valor según tus necesidades */
        font-size: 1.5em;
        right: -5%;
        width: 100%;
        height: 15%;
        padding: 20% 0% 20% 0%;
        top: 35%;
        margin: 0px;
        margin-left: 0%;
        margin-right: 5%;
     } 
    
    .textoSuperpuesto{
      /*   position: absolute;   osition: relative;*/
       font-size: 1em;
       left: 8%; /*   right: -5%;*/
       top: 75%; /*top: 350px;*/
       flex-wrap: wrap;
          display: initial;
       overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */ 
       
    }
    
    .servicioTecnico {
        font-size:4.5rem;
        justify-content: flex-start;
        top: 60%;
        left: 57%; 
        padding: 0px 25px;
    }
    .Icon2servicioTecnico {
         width: 12%;
         height: 55px;
/*        justify-content: flex-start;*/
        top: 52%;
        left: 8%; /*  left: -159%;*/
    }
    .telefono {
/*      width: 70%;*/
    /* height: 2%;      height:  100%;     height: 50px; */
   
    }
    
    
    

    
      article {
        width: 100%;
        height: auto;
      /*  font-size: 0.2em;   Ajustado para mejor legibilidad */
          max-width: 100%;  /*Asegura que el texto no se salga del contenedor */
    } 

     video {
        width: 100%;
        height: auto;
        max-width: 100%;  /*Asegura que el texto no se salga del contenedor */
       display: block;
    } 
        #myVideo {
        position: absolute;
         top: -10%;
        left: 0;
        width: 100%;
        height: 100%;
    }
        #myVideo1 {
        position: absolute;
        top: -6%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .video-container video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: auto; /* Ajusta la altura según sea necesario */
    }
    
  
/*       ESTAMOS ACA HAY QUE DIRECCIONAR LOS ICONOS DE COMPARTIR SOCIAL*/
    .compartirSocialDos ul {
        flex-direction: row;
        grid-gap: 0.5rem; /* Espacio entre las columnas y filas */
        align-items: center;
        position: absolute;
        left: -102px;
        top: 130px;
        
    }
    .compartirSocialDos ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocialDos a svg {
        width: 20px;
        height: 20px;
         
    }
    .compartirSocial ul {
/* flex-direction: column;*/
        flex-direction: row;
        grid-gap: 0.5rem; /* Espacio entre las columnas y filas */
        align-items: center;
        position: absolute;
        left: -102px;
        top: 54px;
    }
    .compartirSocial ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocial a svg {
        width: 20px;
        height: 20px;
    }
    source {
      width: 100%;
      height: 50px;  /*   height:  100%;     height: 50px; */
      border: 0;
    }

    
    .nav-item1{
        width: 100%;
        padding: 15px 0;
    }
     .nav-link{
        width: 100%;
        padding: 15px 0;
    }
     .navbar1{
        width: 100%;
        padding: 15px 0;
    }
     .noscroll{
        width: 100%;
        padding: 15px 0;
    }
    .card-footer { /* compartir LAVARROPAS ESTOY ACA 05/08/24*/
        width: 70%;
        left: 17%;
        height: auto;
        top: 11%; 
        position: absolute;
        margin-top: auto;
        text-align: center;
        box-sizing: border-box;
    } 
   
    /*-------------------------------SERVICE-------------------------------------------   */
      .imagenFondoService {
         margin: 0 auto;
    }
  

    .telefono img {
/*        width: 30px;*/
    }
    


 

   .socialResto, 
    .list-unstyled,
    .link-body-emphasis {    
        width: 50%;
         left: 60%;
/*        right:50.7%;*/
          top: 6.9%;       
        font-size: 0.7rem;
        white-space: nowrap;  /*  SE AGREGO ESTA PROPIEDAD */
       overflow-wrap: break-word;  
    }
    .social-menu svg {
        width: 18px;
        height: 23px;
      
    }
        .socialResto ul {
        flex-direction: row;
           top: 6.9%; 
    }

    .socialResto li {
        margin-bottom: 0;
    }


    
 
     
/*     .containerService h2 {
        font-size: 1.2rem;
        margin: 0 auto;
        padding-top: 0px;
    }

    .containerService .card-text {
        font-size: 0.9rem;
    }*/
     #parrafo {
        font-size: 0.9rem;
    }
        .small-screen {
        width: 100%; /* Asegura que la columna ocupe todo el ancho disponible */
        }

       .card-body {
        padding: 10px; /* Ajusta el padding si es necesario */
        overflow: hidden; /* Evita que el contenido dentro del contenedor se desborde */
       }

       .responsive-img {
        max-width: 100%; /* La imagen no excederá el ancho del contenedor */
        height: auto; /* Mantiene la proporción de la imagen */
        display: block; /* Elimina cualquier espacio en línea alrededor de la imagen */
       }
   
    .home-step__titlePrinc{
        width: 100%;
        font-size: 2.6em;
        margin: 10 auto;

    } 
    
   .textoSuperpuestoDer1 {
        width: auto;
        margin: 0 10px;
        line-height: 2;
        padding: 2;
       top: 30%;    /*       top: 42%;*/
         align-items: center;  /* SE AGREGO ESTO AL DISEÑO*/
             background-position: center center; /* SE AGREGO ESTO AL DISEÑO*/
       
         
    }
    
     #myVideo6 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN SERVICE-------------------------------------------   */
/*         .imagenFondoAlsika {
       width: 100%;
        max-width: calc(100% - 2px);
    }*/
 
    .imagenFondoAlsika {
        background-attachment: scroll; 
        height: 50vh; /* Menor altura en móviles */
    }

    .imagenFondoAlsika .contenidoFondo {
        position: relative; /* Para que fluya dentro del contenedor */
        top: auto;
        left: auto;
        transform: none;
        width: 95%;
        padding: 0.5rem;
        max-height: none;
    }  
    
  
    .servicioTecnicoCont  {
        font-size: 4.8rem;
        justify-content: flex-start;
        top: 67%;
        left: 62%; 
        padding: 0px 25px;
    }

    
    .icon2servicioTecnicoCont {
        width: 30%; 
        height: 220%;  
        position: absolute;
        top: 47%; /* Ajusta según tu diseño */
        left: -13%;
        transform: translate(-50%, -50%);
        z-index: 1; /* Asegura que esté delante del texto */
    }

     .containerblog, .mt-5 {
      width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
      /*   border: 0.05px solid #999966; Mantiene el borde */
        padding: 10px 20px 10px 2px; /* superior, derecha, inferior, izquierda */
          display: flex;
          flex-wrap: wrap;
       max-width: 100%;
        box-sizing: border-box;
    }
     .containerblog font {
      display: block;
      width: 100%;
      box-sizing: border-box;
      word-wrap: break-word;      /* compatibilidad legacy */
      overflow-wrap: break-word;  /* estándar moderno */
      padding: 10px 20px 10px 10px; 
    }

    /* Si hay textos dentro de columnas */
    .containerblog * {
        word-wrap: break-word; /* Permite que el texto se ajuste al ancho */
    }
    
     .blog-post-meta {
      width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
       margin: 0%; /*  Centra el contenedor */
       justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
       padding: 0px 5% 0px 5%;  /* superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        display: flex;
        flex-wrap: wrap;
        background-size: cover;
        max-width: calc(100% - 2px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
     /*    max-width: calc(100% - 100px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
    }
    
.containerblog { margin-bottom: 0 !important; }
.blog-post { margin-top: 0 !important; padding-top: 1px !important; }
    


     .social-icons svg {
                width: 20px;
                height: 20px;
                right: 50px;
            }
     #myVideo7 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN BLOG-------------------------------------------   */
    
    
     #myVideo5 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    #myVideo8 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 200%;
        height: 100%;
    }
    #myVideo9 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN TALLER-------------------------------------------   */
/*    .containerContacto {
            position: relative;  o absolute, dependiendo de lo que necesites 
      margin: 0px;
      min-height: 110vh;    Asegura que el contenedor tenga al menos el tamaño de la pantalla 
      display: flex;
      flex-wrap: wrap;
      box-sizing: border-box;  Asegura que el padding se incluya en el ancho total 
        }
        .text-center {
            text-align: center;
        }
        .form-label {
            font-size: 0.875rem;
            
        }
        .form-control, 
        .form-select {
            font-size: 0.875rem; 
        }-------------------------------FIN CONTACTO-------------------------------------------   */
/* ==============================
   Estilos base para containerContacto
   ============================== */
.containerContacto {
    padding: 1rem;
    box-sizing: border-box;
    margin: 5px;
}
   .containerContacto .home-step__title h2 {
        margin-top: 1rem !important;  /* Margen más pequeño y positivo */
        font-size: 1.5rem;             /* Ajustamos el tamaño del texto */
        text-align: center;            /* Centrado en móviles */
        margin-top: -180px;
    }

/* Formulario */
.containerContacto .cardCont.form-control {
    width: 100% !important;
    margin: 0 auto !important;
    padding: 1rem !important;
    box-sizing: border-box;
    margin-top: 115px;
}

/* Inputs, selects y textarea */
.containerContacto .cardCont.form-control input,
.containerContacto .cardCont.form-control select,
.containerContacto .cardCont.form-control textarea {
    width: 100% !important;
    margin-left: 0 !important;
    box-sizing: border-box;
    font-size: 0.95rem;
}
.containerContacto .col-md-6 p-4  .text-body-emphasis .mb-4 h2 {
    font-size: 1.1rem;
    margin-top: 5rem;
    text-align: center;
}

.containerContacto .col-md-6 p-4  .text-body-emphasis .mb-5 h6 {
    font-size: 1.1rem;
    margin-top: 0rem;
    text-align: center;
}

/* Títulos dentro del formulario */
.containerContacto .cardCont.form-control h2,
.containerContacto .cardCont.form-control h6 {
    font-size: 1.1rem;
    margin: 0.5rem;
    text-align: center;
}

/* Botón Enviar */
.containerContacto .cardCont.form-control .footer input.button {
    width: 100% !important;
    padding: 0.8rem;
    font-size: 0.95rem;
}

/* Ajustes de columnas */
.containerContacto .col-md-6.col-12 {
    width: 100% !important;
    margin-bottom: 2rem;
    padding: 0 0.5rem;
}
 .containerContacto .col-md-6.col-12.mb-4 .cardCont {
        width: 100%;
        margin: 0 auto;
  }
    
/* Columna derecha con imagen y texto */
/*.containerContacto .col-md-6.p-4.text-body-emphasis {
    margin-top: 8rem !important;
    text-align: center;
    width: 100% !important;
    padding: 0 1rem;
    top: 1000px;
}*/
.containerContacto .col-md-6.p-4.text-body-emphasis {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin-top: 400px !important; /* Baja la imagen */
    text-align: center;
}

.containerContacto .col-md-6.p-4.text-body-emphasis img {
    width: 350px !important;   /* ancho fijo */
    height: 350px !important;  /* alto fijo */
    object-fit: cover;         /* evita deformación, recorta si es necesario */
    display: block;
    margin-left: 60px;
    margin-right: auto;            /* centra la imagen */
  

}
  
  
 .containerContacto .cardCont.form-control .footer input.button {
        font-size: 0.95rem;
        padding: 0.7rem 1rem;
    }
    /************COMPRAR ******************************************************************/
  
    
      /* Contenedor principal de compras */
    .container-xxl.compra .mt-5 .justify-content-center { /*YO AGREGUE*/
         width: 100% !important; /*YO AGREGUE*/
        padding: 0 1rem;
        margin: 0 auto;
    }

    /* Formulario de filtros dentro de compras */
    .container-xxl.compra .filtros {
        flex-direction: column !important;
        gap: 1rem;
        width: 100%;
    }

    .container-xxl.compra .filtros label {
        width: 100% !important;
        text-align: left;
        font-size: 0.9rem;
        margin-top: 0 !important;
    }

    .container-xxl.compra .filtros select,
    .container-xxl.compra .filtros input[type="text"] {
        width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box;
    }

    /* Botones del formulario */
    .container-xxl.compra .ingresar input[type="submit"],
    .container-xxl.compra .ingresar input[type="button"] {
        width: 100% !important;
        margin-bottom: 0.5rem;
        font-size: 0.9rem;
    }

    /* Cards de propiedades */
    .container-xxl.compra .col-lg-3.col-md-4 {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto 1rem auto;
    }

    .container-xxl.compra .card img {
        width: 100% !important;
        height: auto !important;
        object-fit: cover;
    }

    .container-xxl.compra .card-body {
        margin-top: 0 !important;
        font-size: 0.85rem;
        padding: 0.5rem;
    }

    .container-xxl.compra .card-footer {
        margin-top: 0 !important;
        padding: 0.5rem;
    }

    /* Paginación */
    .container-xxl.compra .pagination {
        flex-wrap: wrap;
        justify-content: center;
    }

    /* Ajuste general para inputs y selects */
    .container-xxl.compra input,
    .container-xxl.compra select,
    .container-xxl.compra textarea,
    .container-xxl.compra .button {
        width: 100% !important;
        margin-left: 0 !important;
        box-sizing: border-box;
    }

         /******************************************************************************/
    footer {
        clear: both;
        text-align: center;
        width: 100%;
        margin-top: 20px;
        padding: 0px 0px 0px 8px;
          text-align: center; /* Alineación de texto centrada */
        margin-top: auto;
        margin-right: auto;
        margin-left: auto;
    }
    
  }

@supports (-webkit-touch-callout: none) {
  .imagenFondoTaller {
    background-attachment: scroll !important;
  }
}

/*---------------------------FIN DE PANTALLAS @media (max-width: 768px) {------------------------------------------------------------------------------*/













 /*---------------------------  pantallas muy pequeñas (mobile chico)  -------------------------------------------------------------------*/
/* Pantallas extra pequeñas  ---  ≤576px → móviles chicos -----iPhone SE; Samsung Galaxy A10, A01 /// Teléfonos gama baja/medios con pantallas ≤ 5.5  */

@media (max-width: 576px) {
    
       html, body {   /*********** Otra configuración ******************/
       height: auto;
       min-height: 100%;
       overflow-x: hidden;
       overflow-y: auto;
       max-width: 100%;
       margin: 0;           /* Quita márgenes por defecto TICTAC */
       padding: 0;          /* Quita padding por defecto TICTAC */
  }
  
    .contenedorGeneral {
        width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
      /*   border: 0.05px solid #999966; Mantiene el borde */
        padding: 0px 5px 0px 5px; /* superior, derecha, inferior, izquierda */
          display: flex;
          flex-wrap: wrap;
/*          box-sizing: border-box;*/
/*       max-width: calc(100% - 100px);  Asegura que el contenedor no sea más ancho que su contenedor padre */    
    }

        .container {
        width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
       margin: 0%; /*  Centra el contenedor */
       justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
       padding: 2px 2px 0px 2px;  /* superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        display: flex;
        flex-wrap: wrap;
        background-size: cover;
        max-width: calc(100% - 0.5px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
     /*    max-width: calc(100% - 100px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
    }
    
    .containerIndex  {
        width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
       margin: 0%; /*  Centra el contenedor */
       justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
       padding: 47px 2px 0px 2px;  /* superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        display: flex;
        flex-wrap: wrap;
        background-size: cover;
        max-width: calc(100% - 0.5%);/*  Asegura que el contenedor no sea más ancho que su contenedor padre */
         /* max-width: calc(100% - 20px); Asegura que el contenedor no sea más ancho que su contenedor padre */
    }
    
      .containerTaller {
        width: 100% !important;  /* casi todo el ancho del padre */
      /*  width: 100%;  Ajusta el ancho del contenedor según sea necesario */
        margin: 0 auto; /* 0%; Centra el contenedor */
        justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        display: flex;
        flex-wrap: wrap;
/*        background-size: cover; COMENTADO  AHORA*/
/*       max-width: calc(100% - 20px);   Asegura que el contenedor no sea más ancho que su contenedor padre */
        max-width: calc(100% - 100px);   /*Asegura que el contenedor no sea más ancho que su contenedor padre */

           /*  max-width: 85% !important;   asegura que no se expanda más */
                box-sizing: border-box;
        }

    .social-menu,.image-box, .slider, .carousel-inner, .carousel-item, .container-fluid, .main, .sub, .home-step__text, .home-step__description, .share-buttons li, .servicioTecnico, h2, .Icon2servicioTecnico, .textoSuperpuesto, .textoSuperpuestoDer, .telefono img, .home-steps__title, .video-container, .video-container video, .btn-outline-dark, .list-unstyled, .list-unstyled li, iframe, footer {
        width: 100%;
    
    }
    
    .imagenFondo {
         width:100%; /*       width: 100vw;*/
         height: auto;  /*       height: 100vh;*/
        
    }  
    
    .containerHeader {
    width:100%;
     height: 47vh;   /*  height: 55vh; height: 290px;   */
   /* max-height: 140%;  max-height: 500px; */
    box-shadow: 100px 100px 300px 2px black;     /*   100px 100px 255px 50px black;  VER QUE ONDA MODIFICAR LOS DOS PRIMEROS */
/*    border: 5.5px solid transparent;                */
    padding: 10px; 
    line-height: 1px;
    padding-top: 0px;
    padding-bottom: 0px;                                 
    
    }

    .card-text {
        width: 100%;
        margin: 0px auto;
      /*  padding: 0px 10px;  margen de arriba , derecha, abajo, izquierda*/ 
        font-size: 0.8em; /* Asegúrate de que el tamaño de la fuente esté en minúsculas */
        color: #414848;
        text-align: justify;
        justify-content: center;  /* Centra el contenido horizontalmente */
         background-position: center;
        background-size: cover;

        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        position: unset;
        content: unset;
   /*      box-shadow: unset;*/
         max-width: calc(100% - 100px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
       object-fit: cover;  /* Ajusta la imagen manteniendo la relación de aspecto y cubriendo todo el contenedor */
/*       clear: both;*/
 /*       text-align: center;
        width: 100%;
        margin-top: 20px;
        padding: 0px 0px 0px 8px;
          text-align: center;  Alineación de texto centrada 
        margin-top: auto;
        margin-right: auto;
        margin-left: auto;*/
   
    
    }
     .card {
        width: 100%;
        height: auto;
        margin-bottom: 15px;
        box-sizing: border-box;
     }
    .card-body {
        white: 100%;
        padding: 0px;
/*        text-overflow: ellipsis;*/
        margin-top: 0%; /* Elimina márgenes externos */
        margin-left: 3%;
        justify-content: space-between;     /*  Distribuye los ítems con espacio entre ellos */
    /*    max-height: 450px;  Limita la altura máxima */
 /*       overflow: hidden;  Oculta el contenido que sobresalga */
         grid-template-columns:  repeat(2, 1fr);
         display:  block;      
         box-sizing: border-box;
    }
   
    .card-footer { /* compartir LAVARROPAS ESTOY ACA 05/08/24*/
        width: 70%;
        left: 21%;
        height: 10px; 
        top: 6%; 
        text-align: center;
        box-sizing: border-box;
    }

         .shinedos{ 
         width: 100%;
         font-size: 1.4em; /*LAVARROPAS */
          top:-100px;
          left: -13%;
         position: relative;
         display: inline-block;
         color: #021d49;  /*#000; */
         background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
         background-size: 200%;
         background-clip: text;
         -webkit-background-clip: text;
         color: transparent;
         animation: shine 4s linear infinite;
         text-align: center;
    }
        .shine{  /*HELADERAS */
         width: 100%;
         font-size: 1.4em;
         top:-90px;  
          left: -13%;
         position: relative;
         display: inline-block;
         color: #021d49;  /*#000; */
         background: linear-gradient(90deg, #000 10%, #fff 30%, #000 50%);
         background-size: 200%;
         background-clip: text;
         -webkit-background-clip: text;
         color: transparent;
         animation: shine 4s linear infinite;
         text-align: center;
    }
    .no-hover1 {
         width: 100%;
         height: auto;
         font-size: 3em;
         top: -500px;
    }
    .no-hover2 {
         width: 100%;
         font-size: 3em;
         top: -250px;
    }
  
    
    .text-box {
       width: 100%;
        padding: 10px;
        font-size: 10px; /* Asegúrate de que el tamaño de la fuente esté en minúsculas */
    }
    .no-hover-color-change {
/*        display: block;*/
        text-align: center;
        font-size: 1.3em; /* Asegúrate de que el tamaño de la fuente esté en minúsculas */
          max-width: 100%; /* Asegura que el texto no se salga del contenedor */

    }
     .no-hover-color-change1 {
/*        display: block;*/
       text-align: center;
       font-size: 0.5em; /* Asegúrate de que el tamaño de la fuente esté en minúsculas */
       word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
       max-width: 100%; /* Asegura que el texto no se salga del contenedor */
       margin-top: -25px;
       position: relative;
     }
     
     .text-span {
/*        display: block;*/
        width: 100%;
        text-align: center;
        font-size: 0.8em; /* Asegúrate de que el tamaño de la fuente esté en minúsculas */
          margin-top: -30px;
        max-width: 100%; 
    }

    .title {
        position: relative;
        font-size: 1em; /* Ajusta el tamaño de fuente para pantallas pequeñas */
        margin: 0px; /* Aplica un margen de 10px en todos los lados */
        padding: 10px 10px 10px 10px; /* Aplica padding a los lados para evitar que el texto toque los bordes */
        max-width: calc(100% - 100px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
        box-sizing: border-box; /* Incluye padding y border en el tamaño total del elemento */
        word-wrap: break-word;  /* Permite que las palabras largas se dividan */
        word-break: break-word; /* Rompe palabras largas al final de una línea */
        overflow: hidden; /* Oculta el desbordamiento del contenido */
        text-overflow: ellipsis; /* Añade puntos suspensivos si el texto es demasiado largo */
/*        margin-top: -80px;  */
        text-align: center;
        margin-top: 0px;
    }
    
      .main {
      font-size: 1em;
      }

       .contenedor, 
       .parte_baja, 
       .home-steps__section {
        width: 435px; 
        max-height: 830px; /*height: 700px;*/
        margin: 0 auto; /* AGREGADO*/
        position: static; /* Cambiado de unset a static */
        box-shadow: none; /* Cambiado de unset a none */
        flex-direction: column; /*  flex-direction: row;*/
        align-items: stretch; /*  align-items: flex-start ; align-items: flex-end;*/
        box-sizing: border-box; /* Ajustado el padding */
        text-align: start ; 
        display: grid;     /* AGREGADO*/
        grid-template-columns: repeat(2, 1fr);   /* Dos columnas de igual tamaño --COMENTADO*/
        grid-template-rows: repeat(2, auto); 
        gap: -15%; /*Espacio entre los elementos  --COMENTADO*/
        grid-gap: 1.5rem; /* Espacio entre las columnas y filas */
       /* width: 100%;/*  /*  AGREGADO Asegura que el contenedor ocupe el ancho completo */
        padding: 8% 5% 0px 5%; /* AGREGADO Añadimos algo de padding para el contenedor */
        box-sizing: border-box; /*AGREGADO Incluye padding en el ancho total */
       font-size: 1em;  /* AGREGADO texto de los iconos -- acceso directo  */
/*        margin-top: auto;/*  --COMENTADO*/
        margin-right: 15%;
        margin-left: auto;
        margin-top: -46px;
        margin-bottom: -140px; 
        
        
    }
    
    .home-steps, h2 {
/*        font-size: 1.5em;*/
        margin: 0px auto;
        flex-direction: column;
        padding: 15% 5% 0px 5%; 
         max-width: calc(100% - 20px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
      
    } 

    .home-step {
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* Dos columnas de igual tamaño */
        grid-gap: 0.2rem; /* Espacio entre las columnas y filas */
        text-align: center; /* Alineación de texto centrada */
        margin: 0px 5px 0px 0px;
        flex: 0 0 30%; /* Ajustar el ancho de cada home-step */
        top: -4%;
    }

    .home-step > div {
        flex: 0 0 100%; /* Ajustar el ancho de cada item en el grid */
        padding: 0px;
        box-sizing: border-box;
    }
     .especialidades, /*NO TOCAR ESTA CLASE CORRESPONDE AL SLIDER ------ */
     .card, .image-box{
                width: 100%;
                margin: 0px auto; 
                display: grid;      
                padding: 0 1.5% 0 1.5%;
             /*   justify-content: space-between;     /*  Distribuye los ítems con espacio entre ellos */
            /*     align-items: center;  Centra los ítems verticalmente */
                grid-template-columns:  repeat(2, 1fr);
                grid-template-rows: repeat(2, auto); 
                grid-gap: 0px; 
                /*NO TOCAR ESTA CLASE CORRESPONDE AL SLIDER ------ */
             }
         
    .horizontal-layout {
        width: 100%;
        display: table-header-group ;/*        display: flex; se cambio para alinear todos los textos por debajos de los iconos */
         flex-wrap: nowrap;           /*        flex-wrap: wrap;*/
        top: 4%; /*quitamos el top porque hace que una columna icono y texto no esten alineados*/
        grid-template-columns:  repeat(2, 1fr);
        grid-template-rows: repeat(2, auto); 
        grid-gap: 0px; 
        
    }

     .home-step__title {
        
        position: relative;
        text-align: left; 
        display: table-header-group ;
        flex-wrap: wrap;
        font-size: 0.6em;
        background-size: cover;
        flex-wrap: wrap;
        justify-content: center;
        
    }

    .home-step__icon {
        width: 80px;
        height: 50px;
        margin: 0 auto;
        align-items: center;
        text-align: center;
        justify-content: center;
        display: flex ;    /*  display: block;  grid*/
/*        top: 100%;*/
    }
 
   .readMore_btn1 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 43px; 
      right: 32.5%; /*      right: 60px;*/
      top:52.9%;
     } 
     
     .readMore_btn2 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 43px;
      right: 32.5%; /*      right: 60px;*/
      top: 56.8%; /* Ajusta la posición vertical del segundo botón */
     } 

     
    .textoSuperpuestoDer {
        position: absolute; /* Asegura que las propiedades top y right tengan efecto */
        box-sizing: border-box; /* Incluye padding y border en el cálculo del ancho y alto */
        overflow: hidden; /* Maneja el desbordamiento del texto */
        line-height: 1.3; /* Ajusta el valor según tus necesidades */
        font-size: 1.2em;
        right: 15%;
        width:60%;
        height: 15%;
        padding: 35% 1% 25% 1%;
        top: 34%;
        margin: 0px;
        margin-left: 0%;
        margin-right: 5%;
     } 
    
    .textoSuperpuesto{
       font-size: 0.8em;
       left: 1%; /*   right: -5%;*/
       top: 75%; /*top: 350px;*/
       flex-wrap: wrap;
          display: initial;
       overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */ 
       
    }
    
    .servicioTecnico {
        font-size: 3.3rem;
        justify-content: flex-start;
        top: 63%;
        left: 60%; 
        padding: 0px 25px;
    }
    .Icon2servicioTecnico {
         width: 15%; /* width: 48px;*/
        height: 125%; /* height: 45px;*/
        justify-content: flex-start;
        top: 50%;
        left: 10%; /*  left: -159%;*/
    }
    .telefono {
/*      width: 70%;*/
    /* height: 20px;      height:  100%;     height: 50px; */
   
    }
    
    .slider--img {
        margin: 0;
/*        aspect-ratio: 16/45; */
        aspect-ratio: 16/28;
        width: 100%;
        height: 100%;
         max-width: calc(100% - 100px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
       object-fit: cover;  /* Ajusta la imagen manteniendo la relación de aspecto y cubriendo todo el contenedor */
/*       top: -60%;*/
    }
    .cont {
        white: 100%; 
        margin: 0 auto;
        padding: 0px 0px 40px 20px; /* margen de arriba , derecha, abajo, izquierda*/ 
        overflow-wrap: break-word; /* Opción de ajuste del tamaño del texto */      
        margin-top: -90px;
         position: unset;
        content: unset;
   /*      box-shadow: unset;*/
    }

    
      article {
        width: 100%;
        height: auto;
      /*  font-size: 0.2em;   Ajustado para mejor legibilidad */
          max-width: 100%;  /*Asegura que el texto no se salga del contenedor */
    } 
       video {
        width: 100%;
        height: auto;
        max-width: 100%;  /*Asegura que el texto no se salga del contenedor */
       display: block;
    } 
        #myVideo {
        position: absolute;
         top: -10%;
        left: 0;
        width: 100%;
        height: 100%;
    }
        #myVideo1 {
        position: absolute;
        top: -6%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    video-container video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: auto; /* Ajusta la altura según sea necesario */
    }            

/*       ESTAMOS ACA HAY QUE DIRECCIONAR LOS ICONOS DE COMPARTIR SOCIAL*/
    .compartirSocialDos ul {
        flex-direction: row;
        grid-gap: 0.4rem; /* Espacio entre las columnas y filas */
        align-items: center;
        position: absolute;
        left:  -97px;
        top: 125px;
/*        left: 147px;
        top: -210px;*/
        
    }
    .compartirSocialDos ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocialDos a svg {
        width: 20px;
        height: 20px;
         
    }
    .compartirSocial ul {
        flex-direction: row;
        grid-gap: 0.4rem; /* Espacio entre las columnas y filas */
        align-items: center;
        position: absolute;
        left: -97px;
        top: 60px;
    }
    .compartirSocial ul li {
        margin-left: 0;
        margin-bottom: 10px;
    }
    .compartirSocial a svg {
        width: 20px;
        height: 20px;
    }
    source {
      width: 100%;
      height: 50px;  /*   height:  100%;     height: 50px; */
      border: 0;
    }

    h2 {
       font-size: 2rem;
       text-align: center ;
   
    }
    .nav-item1{
        width: 100%;
        padding: 15px 0;
    }
     .nav-link{
        width: 100%;
        padding: 15px 0;
    }
     .navbar1{
        width: 100%;
        padding: 15px 0;
    }
     .noscroll{
        width: 100%;
        padding: 15px 0;
    }
  
    /*-------------------------------SERVICE-------------------------------------------   */
/*     .containerService {
        display: flex;
        flex-direction: row;  Asegura la disposición horizontal 
        align-items: center;  Alinea verticalmente los elementos 
    }*/
 
/*    .imagenFondoService {
         margin: 0 auto;
         width: 100%;
    }*/
  

    .telefono img {
/*        width: px;*/
    }

    .socialResto, 
    .list-unstyled,
    .link-body-emphasis {    
        width: 50%;
        left: 60%;
        top: 6.9%;         top: 10%;
        font-size: 0.7rem;
        white-space: nowrap;  /*  SE AGREGO ESTA PROPIEDAD */
       overflow-wrap: break-word;  
    }
    .socialResto svg {
        width: 18px;
        height: 23px;
      
    }
        .socialResto ul {
        flex-direction: row;
        top: 6.9%;
    }

    .socialResto li {
        margin-bottom: 0;
    }
    
 
    .readMore_btn3 {
        width: 86%;
        height: 3%;
/*        margin: 0 10px;*/
        left: 8%;
        align-items: center;
        position: relative;
            top: 55%;
    }
    .readMore_btn4 {
      width: 10%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 43px; 
      right: 9.5%; /*      right: 60px;*/
      top:66%;
     } 
     
     .readMore_btn5 {
      width: 10%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 43px;
      right: 9.5%; /*      right: 60px;*/
      top: 70%; /* Ajusta la posición vertical del segundo botón */
     } 
     .readMore_btn6 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px; 
      right: 9%;    
      top:63.5%;
     } 
     
     .readMore_btn7 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
      right: 9%;/*    right: 60px; */
     top: 59%; /*  Ajusta la posición vertical del segundo botón */
     } 
     
/*     .containerService h2 {
        font-size: 1.2rem;
    }

    .containerService .card-text {
        width: 100%;
        font-size: 0.1rem;
       flex: 1;   Ocupa todo el espacio disponible 
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }*/
     #parrafo {
        font-size: 0.9rem;
        
    }
    .card-body img {
        width: 100%;
      /*  height: auto;  Mantendrá la proporción de la imagen */
      /*  max-width: 100%;  Evita que la imagen sobresalga del contenedor */
      /*  display: block; Elimina el espacio en blanco debajo de la imagen */
    }
    .home-step__titlePrinc{
        width: 100%;
        font-size: 1.9em;
        margin: 0 auto;

    }
    .textoSuperpuestoDer1 {
      width: auto;
      line-height: 2;
      margin: 0 10px;
      padding: 2;
      top: 7.2%;/*        top: 42%;*/
      align-items: center;  /* SE AGREGO ESTO AL DISEÑO*/
      background-position: center center; /* SE AGREGO ESTO AL DISEÑO*/
      
    }
     #myVideo6 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN SERVICE-------------------------------------------   */
       .imagenFondoAlsika {
       width: 100%;
        max-width: calc(100% - 2px);
    }
    .servicioTecnicoCont  {
        font-size: 4rem;
        justify-content: flex-start;
        top: 21%;
        left: 62%; 
        padding: 0px 25px;
    }

    
    .icon2servicioTecnicoCont {
        width: 30%; 
        height: 150%;  
        position: absolute;
        top: 47%; /* Ajusta según tu diseño */
        left: -13%;
        transform: translate(-50%, -50%);
        z-index: 1; /* Asegura que esté delante del texto */
    }
     .readMore_btn8 {
      width: 8%; /* Tamaño de imagen ajustado */
      height: 45px; 
      right: 3.5%;    
      top:70.8%;
     } 
     
     .readMore_btn9 {
      width: 8%; /* Tamaño de imagen ajustado */
      padding: 0px 0px;
      height: 45px;
      right: 3.5%;/*    right: 60px; */
     top: 65.9%; /*  Ajusta la posición vertical del segundo botón */
     } 
     .containerblog {
      width: 100%;
        box-sizing: border-box; /* Asegura que el padding se incluya en el ancho total */
        margin: 0 auto; /* Centra horizontalmente */
      /*   border: 0.05px solid #999966; Mantiene el borde */
        padding: 0px 50px 0px 30px; /* superior, derecha, inferior, izquierda */
          display: flex;
          flex-wrap: wrap;
/*          box-sizing: border-box;*/
       max-width: calc(100% - 2px); /*  Asegura que el contenedor no sea más ancho que su contenedor padre */    
    }
    
    
     .blog-post-meta {
      width: 100%; /* Ajusta el ancho del contenedor según sea necesario */
       margin: 0%; /*  Centra el contenedor */
       justify-content: center;  /* Centra el contenido horizontalmente */
        background-position: center;
        background-size: cover;
       padding: 0px 10px 0px 10px;  /* superior, derecha, inferior, izquierda */
      /*  padding: 0 5px;  Ajusta el padding según sea necesario */
       /* padding: 0px 20px 0px; /* 10px arriba, 20px a los lados, 15px abajo padding: 0 10px; */
        word-wrap: break-word; /* Permite que las palabras largas se rompan y se ajusten dentro del contenedor */
        display: flex;
        flex-wrap: wrap;
        background-size: cover;
        max-width: calc(100% - 2px); /* Asegura que el contenedor no sea más ancho que su contenedor padre */
     /*    max-width: calc(100% - 100px);  Asegura que el contenedor no sea más ancho que su contenedor padre */
    }
     .social-icons svg {
                width: 20px;
                height: 20px;
            }
     #myVideo7 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN BLOG-------------------------------------------   */
    
    
     #myVideo5 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    #myVideo8 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }
    #myVideo9 {
        position: absolute;
        padding: 0%;
        top: 0%;
        left: 0;
        width: 100%;
        height: 100%;
    }/*-------------------------------FIN TALLER-------------------------------------------   */
    .containerContacto {
      position: relative; /* o absolute, dependiendo de lo que necesites */
      margin: 0px;
      min-height: 110vh;  /*  Asegura que el contenedor tenga al menos el tamaño de la pantalla */
     display: grid;
     
    }
        .text-center {
            text-align: center;
        }
        .form-label {
            font-size: 0.875rem;
            
        }
        .form-control, 
        .form-select {
            font-size: 0.875rem; 
        }
    
  
     /*-------------------------------FIN CONTACTO-------------------------------------------   */
      footer {
        clear: both;
        text-align: center;
        width: 100%;
        margin-top: 20px;
        padding: 0px 0px 0px 8px;
          text-align: center; /* Alineación de texto centrada */
        margin-top: auto;
        margin-right: auto;
        margin-left: auto;
    } 
    
  }
/*-------------------FIN CONFIGUACION DISPOSITIVOS ----------*/ 



