/* 
Sitio Web Creado por ITred Spa.
Direccion: Guido Reni #4190
Pedro Aguirre Cerda - Santiago - Chile
contacto@itred.cl o itred.spa@gmail.com
https://www.itred.cl
Creado, Programado y Diseñado por ITred Spa.
BPPJ 
*/


/* -------------------------------------------------------------------------------------------------------------
   ------------------------------------- INICIO ITred Spa creado_por .CSS --------------------------------------
   ------------------------------------------------------------------------------------------------------------- */

/* TITULO 1 CREADO POR */

   .creado_por {
      display: flex; /* establece la distribucion flexible */
      justify-content: center; /* centra horizontalmente el contenido */
      align-items: center; /* centra verticalmente el contenido */
      gap: 0.6vw; /* establece el espacio entre los elementos */
      font-family: 'Raleway', sans-serif; /* establece la tipografia */
      font-size: 1.7vh; /* establece el tamaño del texto */
      font-weight: 500; /* establece el grosor del texto */
   }


   /* SUBTITULO 1 TEXTO CREADO POR */

      .texto_creado_por {
         color: #182B3A; /* establece el color del texto */
      }

      .contenedor_datos_creado_por {
         display: flex; /* organiza los datos secundarios en una fila */
         justify-content: center; /* centra los datos secundarios */
         align-items: center; /* centra verticalmente los datos secundarios */
         gap: 0.6vw; /* establece el espacio entre los datos */
         white-space: nowrap; /* evita que los datos se separen en varias lineas */
      }


    /* SUBTITULO 2 SITIO WEB CREADO POR */

      .sitio_web_creado_por {
         color: #45494D; /* establece el color del sitio web */
         cursor: pointer; /* indica que el elemento es seleccionable */
      }

      .sitio_web_creado_por:hover {
         color: #99813D; /* cambia el color al pasar el cursor */
      }


    /* SUBTITULO 3 SEPARADOR SITIO WEB */

      .separador_sitio_web_creado_por {
         color: #686d73; /* establece el color del separador */
      }


    /* SUBTITULO 4 CORREO CREADO POR */

        .correo_creado_por {
            color: #686d73; /* establece el color del correo */
            cursor: pointer; /* indica que el elemento es seleccionable */
        }

        .correo_creado_por:hover {
            color: #99813D; /* cambia el color al pasar el cursor */
        }


   /* SUBTITULO 5 SEPARADOR CORREO */


        .separador_correo_creado_por {
            color: #686d73; /* establece el color del separador */
        }


   /* SUBTITULO 6 TELEFONO CREADO POR */


        .telefono_creado_por {
            color: #686d73; /* establece el color del telefono */
            cursor: pointer; /* indica que el elemento es seleccionable */
        }

        .telefono_creado_por:hover {
            color: #99813D; /* cambia el color al pasar el cursor */
        }


    /* pantallas grandes (monitores Full HD+, iMac, monitores gaming QHD/4K) */
    @media (min-width: 1441px) {

        /* Sin media */

    }


    /* notebooks grandes (1600x900, 1920x1080) */
    @media (max-width: 1440px) {

        /* Sin media */

    }


    /* notebooks comunes (1366x768, MacBook Air/Pro) */
    @media (max-width: 1200px) {

        /* Sin media */

    }


    /* tablets horizontales / pantallas medianas (iPad Pro en horizontal, notebooks pequeños) */
    @media (max-width: 992px) {

        .creado_por {
            width: 100%; /* utiliza todo el ancho disponible */
            flex-direction: column; /* organiza la informacion en dos filas */
            justify-content: center; /* centra horizontalmente las dos filas */
            align-items: center; /* centra verticalmente las dos filas */
            gap: 0.8vh; /* establece la separacion entre las filas */
            font-size: 1.6vh; /* adapta el tamaño del texto al dispositivo */
            text-align: center; /* centra todo el contenido */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }


        .texto_creado_por {
            width: 100%; /* ocupa todo el ancho de la primera fila */
            text-align: center; /* centra la primera fila */
        }


        .contenedor_datos_creado_por {
            width: 100%; /* ocupa todo el ancho de la segunda fila */
            display: flex; /* mantiene los datos en una sola fila */
            justify-content: center; /* centra horizontalmente los datos */
            align-items: center; /* centra verticalmente los datos */
            flex-wrap: nowrap; /* evita dividir los datos en varias filas */
            gap: 0.6vw; /* establece la separacion entre los datos */
            white-space: nowrap; /* mantiene los datos en una sola linea */
            text-align: center; /* centra los datos */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }

    }


    /* tablets verticales (iPad clásico, tablets Android estándar) */
    @media (max-width: 768px) {

        .creado_por {
            width: 100%; /* utiliza todo el ancho disponible */
            flex-direction: column; /* mantiene la informacion en dos filas */
            justify-content: center; /* centra horizontalmente las dos filas */
            align-items: center; /* centra verticalmente las dos filas */
            gap: 0.8vh; /* mantiene la separacion entre las filas */
            font-size: 1.55vh; /* adapta el tamaño del texto */
            text-align: center; /* centra todo el contenido */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }


        .texto_creado_por {
            width: 100%; /* ocupa todo el ancho de la primera fila */
            text-align: center; /* centra la primera fila */
        }


        .contenedor_datos_creado_por {
            width: 100%; /* ocupa todo el ancho de la segunda fila */
            justify-content: center; /* centra horizontalmente los datos */
            align-items: center; /* centra verticalmente los datos */
            flex-wrap: nowrap; /* mantiene todos los datos en una sola fila */
            gap: 0.5vw; /* reduce la separacion entre los datos */
            white-space: nowrap; /* evita dividir los datos */
            text-align: center; /* centra la segunda fila */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }

    }

   /* móviles extragrandes (pantallas compactas y dispositivos de gran tamaño) */
   @media (max-width: 576px) {

      /* Sin media */

   }
   
    /* móviles grandes (iPhone 11, iPhone Plus/Max, Android grandes) */
    @media (max-width: 414px) {

        .creado_por {
            width: 100%; /* utiliza todo el ancho disponible */
            flex-direction: column; /* mantiene la informacion en dos filas */
            justify-content: center; /* centra horizontalmente las dos filas */
            align-items: center; /* centra verticalmente las dos filas */
            gap: 0.7vh; /* establece la separacion entre las filas */
            font-size: 1.5vh; /* adapta el tamaño del texto */
            text-align: center; /* centra todo el contenido */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }


        .texto_creado_por {
            width: 100%; /* ocupa todo el ancho de la primera fila */
            text-align: center; /* centra la primera fila */
        }


        .contenedor_datos_creado_por {
            width: 100%; /* ocupa todo el ancho de la segunda fila */
            justify-content: center; /* centra horizontalmente los datos */
            align-items: center; /* centra verticalmente los datos */
            flex-wrap: nowrap; /* mantiene todos los datos en una sola fila */
            gap: 0.4vw; /* reduce la separacion entre los datos */
            white-space: nowrap; /* evita dividir los datos */
            text-align: center; /* centra la segunda fila */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }

    }


    /* móviles medianos (iPhone 12/13/14, Android gama media) */
    @media (max-width: 390px) {

        .creado_por {
            width: 100%; /* utiliza todo el ancho disponible */
            flex-direction: column; /* mantiene la informacion en dos filas */
            justify-content: center; /* centra horizontalmente las dos filas */
            align-items: center; /* centra verticalmente las dos filas */
            gap: 0.6vh; /* reduce la separacion entre las filas */
            font-size: 1.45vh; /* adapta el tamaño del texto */
            text-align: center; /* centra todo el contenido */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }


        .texto_creado_por {
            width: 100%; /* ocupa todo el ancho de la primera fila */
            text-align: center; /* centra la primera fila */
        }


        .contenedor_datos_creado_por {
            width: 100%; /* ocupa todo el ancho de la segunda fila */
            justify-content: center; /* centra horizontalmente los datos */
            align-items: center; /* centra verticalmente los datos */
            flex-wrap: nowrap; /* mantiene todos los datos en una sola fila */
            gap: 0.3vw; /* reduce la separacion entre los datos */
            white-space: nowrap; /* evita dividir los datos */
            text-align: center; /* centra la segunda fila */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }

    }


    /* móviles pequeños (Android estándar, iPhone SE) */
    @media (max-width: 360px) {

        .creado_por {
            width: 100%; /* utiliza todo el ancho disponible */
            flex-direction: column; /* mantiene la informacion en dos filas */
            justify-content: center; /* centra horizontalmente las dos filas */
            align-items: center; /* centra verticalmente las dos filas */
            gap: 0.5vh; /* reduce la separacion entre las filas */
            font-size: 1.4vh; /* adapta el texto al espacio disponible */
            text-align: center; /* centra todo el contenido */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }


        .texto_creado_por {
            width: 100%; /* ocupa todo el ancho de la primera fila */
            text-align: center; /* centra la primera fila */
        }


        .contenedor_datos_creado_por {
            width: 100%; /* ocupa todo el ancho de la segunda fila */
            justify-content: center; /* centra horizontalmente los datos */
            align-items: center; /* centra verticalmente los datos */
            flex-wrap: nowrap; /* mantiene todos los datos en una sola fila */
            gap: 0.2vw; /* reduce la separacion para pantallas pequeñas */
            white-space: nowrap; /* evita dividir los datos */
            text-align: center; /* centra la segunda fila */
            box-sizing: border-box; /* incluye el contenido dentro del ancho */
        }

    }


/* -------------------------------------------------------------------------------------------------------------
   -------------------------------------- FIN ITred Spa creado_por .CSS ----------------------------------------
   ------------------------------------------------------------------------------------------------------------- */


/* 
Sitio Web Creado por ITred Spa.
Direccion: Guido Reni #4190
Pedro Aguirre Cerda - Santiago - Chile
contacto@itred.cl o itred.spa@gmail.com
https://www.itred.cl
Creado, Programado y Diseñado por ITred Spa.
BPPJ 
*/