/* Limpiadores: resetean los valores predefinidos de la página*/
*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    text-decoration: none;
}

body{
    display: flex;
    flex-direction: column;

    font-family: Poppins, "Arial Black", Gadget, sans-serif;
    letter-spacing: 0.5px;
    text-shadow: 1px 1px 1px #0000ff;
}
    .nav{
        width: 100vw;
        height: 13vh;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        background-color: black;
        position: fixed;
    }
        .nav__links{
            display: flex;
            flex-direction: row;
            justify-content: space-around;
        }
            .links__link{
                color: white;
                padding: 15px 40px;
            }
            .links__link:hover{
                background-color: #0000ff;
            }
    .contacto{
        background-color: #0055ff;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        padding: 50px;
    }
        .contacto__div{
            width: 60%;
            color: white;
            display: flex;
            flex-direction: column;
            gap: 40px;
            padding-top: 9%;
            padding-bottom: 7%;
        }
            .contacto__text{
                display: flex;
                flex-direction: column;
                gap: 10px;
                font-size: 20px;
            }
            .contacto__div--formulario{
                display: flex;
                flex-direction: column;
                gap: 20px;
            }
                input[type=text]{
                    font-family: Arial, Helvetica, sans-serif;
                    font-size: 100%;
                    background-color: #0055ff;
                    padding: 8px;
                    border: none;
                    border-bottom: 2px solid white;
                    outline: none;
                    color: white;
                }
                input[type=text]::placeholder{
                    color: white;
                }
                label{
                    font-family: Arial, Helvetica, sans-serif;
                    font-size: 100%;
                }
                textarea{
                    width: 100%;
                    height: 150px;
                    padding: 12px 20px;
                    box-sizing: border-box;
                    border: 2px solid #ccc;
                    border-radius: 4px;
                    background-color: #f8f8f8;
                    resize: none;
                    font-family: Arial, Helvetica, sans-serif;
                    font-size: 15px;
                }
                .contacto__button{
                    font-family: inherit;
                    font-size: 100%;
                    padding: 8px;
                    border: none;
                    box-shadow: 2px 3px 2px black;
                    border-radius: 15px;
                    background-color: #0000ff;
                    color: white;
                    text-shadow: 0.5px 1px 1px black;
                }
                .contacto__button:active {
                    background-color: #10f294;
                    box-shadow: 0 5px black;
                    transform: translateY(4px);
                }
        .contacto__icono{
            padding-bottom: 200px;
        }
    .footer{
        background-color: black;

        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        padding: 20px;
    }
        .footer__rrss{
            display: flex;
            flex-direction: row;
            gap: 20px;
        }
        .footer__copyrigth{
            color: white;
            font-size: 11px;
        }