body {
            height: 190vh;
            background: url('../images/salle2.JPG') no-repeat center center fixed;
            background-size: cover;

            display: flex;
            flex-direction: column;
            justify-content: space-between;

        }

        /* Capa azul encima del fondo */
        body::before {
            content: "";
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 82, 204, 0.279);
            /* azul con transparencia */
            z-index: -1;
        }


        #imagen img {
            height: 100%;
            width: 100%;
            background-size: cover;
            background-position: center;

            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
        }

        #contacto {
            width: 100%;
            height: 100vh;
            /* margin-top: -30vh; */
        }

        /* El formulario parte de contactanos */
        #formulario h2 {
            font-family: "Segoe UI", Arial, sans-serif;
            font-weight: bold;
            letter-spacing: 1px;
            color: #f19a28 !important;
            background: #fff;
            border-radius: 10px;
            padding: 10px 0;
            margin-bottom: 20px;
            box-shadow: 0 2px 8px rgba(241, 154, 40, 0.08);
            text-shadow: 1px 1px 2px #fff2;
        }

        /* Aumentar tamaño de los iconos del formulario */
        .input-group-text i {
            font-size: 1.7rem;
        }

        /* Colores  para los iconos del formulario */
        .input-group-text .bi-person-fill {
            color: #f19a28;
            /* naranja */
        }

        .input-group-text .bi-envelope-fill {
            color: #007bff;
            /* azul */
        }

        .input-group-text .bi-telephone-fill {
            color: #28a745;
            /* verde */
        }

        .input-group-text .bi-chat-left-text-fill {
            color: #6f42c1;
            /* violeta */
        }

        .div-contactos {
            border-radius: 20px;
            border-left: 5px solid rgb(241, 154, 40);
        }

        .div-contactos:hover {
            transform: scale(1.04);
            box-shadow: 0 8px 32px rgba(241, 154, 40, 0.18);
            border: none;
            border-radius: 20px;
            border-left: 5px solid rgb(241, 154, 40);
            border-right: 5px solid rgb(241, 154, 40);
            z-index: 2;
        }

        /* moviento botton enviar */
        .mover-derecha {
            transform: translateX(-100px);
        }

        /* Estilos para el botón Enviar */
        /* Este estilo mueve el boton  cuando el campo no se ha rellenado */
        .mover-izquierda {
            transform: translateX(100px);
        }

        .mover-derecha,
        .mover-izquierda {
            transition: transform 0.4s cubic-bezier(0.4, 2, 0.6, 1);
        }

        /* Estilos para el botón Enviar */
        #Enviar {
            transition: transform 0.4s cubic-bezier(0.4, 2, 0.6, 1);
        }
        #contacto{
            height: 110vh;
        }