form{
    display: flex;
    flex-direction: column;
    border: solid 4px var(--mypurple);
    width: 40%;
    margin : 2em auto 0px auto;
}

label{
    font-family: Arial, Helvetica, sans-serif;
    color: var(--mywhite);
    font-weight: bold;
    font-size: 1.5em;
    text-align: center;
}

.label_input{
    width: 100%;
    margin: 1em auto 1em auto;
    display: flex;
    flex-direction: column;
}

.inputText{
    width: 60%;
    margin: 1.5em auto;
    height: 1.5em;
    background: var(--myblack);
    border: var(--mypurple) solid 2px;
    color: var(--mywhite);
}

button{
    width: 20%;
    margin: 2em auto 2em 20%;
    background: var(--mypurple);
    color: var(--mywhite);
    border: var(--myblack) solid 2px;
    font-size: 1em;
    cursor: pointer;
}

.invitation{
    color: var(--mywhite);
    width: 40%;
    margin: 1em auto;
}

@media (max-width: 480px) {

    button{
        width: 80%;
        margin: 1em auto;
    }

    form{
        width: 90%;
    }
    .inputText{
        width: 90%;
    }

    .invitation{
        width: 90%;
    }
  }