* {
    margin: 0%;
    padding: 0%;
    box-sizing: border-box;
}

.contactameSection {
    background-color: #edcc9649;
    padding: 20%;
    width: 100vw;
    height: 120vh;
    display: flex;
    justify-content: center;
}

.contactameSection p {
    text-align: left;
}

.contactameBox {
    width: 80vw;
    border: #edcc9649 0.2px solid;
    background-color: #FFFFFF;
    border-radius: 25px;
    padding: 5%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
}

.redesSociales {
    margin-left: 20px;
    margin-right: 30px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.redesSociales a {
    text-decoration: none;
    font-size: 0.9em;
    color: #2F2E41;

}

.redesSociales a:hover {
    color: #EDCB96;
}

.redesSociales h1 {
    font-size: 2em;
    margin-bottom: 25px;

}

.redesSociales p {
    margin-bottom: 20px;
}

.redesSociales ul li {
    list-style: none;


}

.iconBox {
    font-size: 1.5em;
    color: #EDCB96;
    background-color: transparent;
    padding: 10px;
    border-radius: 50%;
    vertical-align: middle;

}

li:hover .iconBox {
    background-color: #EDCB96;
    color: #2F2E41;
}

.formBox {
    width: 50%;
    display: flex;
    margin-left: 20px;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: flex-start;
}

.formBox h1 {
    font-size: 2em;
    margin-bottom: 25px;

}


@media screen and (max-width: 500px) {
    .contactameSection {
        height: 150vh;

    }

    .contactameBox {
        flex-direction: column;

    }

    .redesSociales h1 {
        margin-bottom: 15px;

    }

    .redesSociales p {
        margin-bottom: 10px;
    }

    .formBox {
        width: 100%;
    }

    .formBox h1 {
        margin-top: 30px;
        margin-bottom: 5px;

    }


}