.content{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.content > *{
    height: 65vh;
    width: 65vh;
    margin: 10vh;
}

.content > img{
    border-radius: 1vh;
}

@media (max-width: 1500px){
    .content > *{
        margin: 0;
    }
    
    .content > img{
        display: none;
    }    
}

.content > #form{
    padding: 2vh 2vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
}

#form > h1{
    font-size: 5vh;
    font-family: 'Nunito', sans-serif;
}

#form > .input-control{
    width: 100%;
}

.input-control > select,
.input-control > div,
.input-control > textarea,
.input-control > input{
    width: 100%;
    font-size: 2vh;
    outline: none;
    border: 1px solid gray;
}

.input-control > input{
    height: 3vh;
    border-width: 0 0 1px 0;
    text-indent: 1vh;
    padding: 0;
}

.input-control > textarea{
    border-radius: 1vh;
    padding: 1vh;
    font-family: sans-serif;
    box-sizing: border-box;
    resize: none;
}

.input-control > div{
    display: flex;
    height: 3vh;
    border-radius: 1vh;
    padding: 0;
    box-sizing: border-box;
    overflow: hidden;
}

.input-control > select{
    height: 3vh;
    border-radius: 1vh;
    color: gray;
    text-indent: 1vh;
}

.input-control > div > label{
    height: 100%;
    width: 50%;
    display: flex;
    align-items: center;
    cursor: pointer;
    color: gray;
    justify-content: center;
}

#form > button{
    height: 7vh;
    width: 100%;
    color: white;
    background-color: #3A70D1;
    border: none;
    border-radius: 1vh;
    font-size: 3vh;
    text-decoration: none;
}

#form > button:hover{
    background-color: orange;
    cursor: pointer;
    transition: 0.2s 0.1s ease-in;
}

#row-container{
    display: flex;
    width: 100%;
    justify-content: space-between;
}

#row-container > div{
    width: 45%;
}

input[type="radio"] {
    display: none;
}

.input-control div.invalid > input[type="radio"]:checked + label,
input[type="radio"]:checked + label {
    background-color: #3A70D1;
    color: white;
}

/* Validation error */

.input-control > .invalid{
    border-color: red;
}

.input-control select.invalid,
.input-control div.invalid > label,
.input-control .invalid::placeholder{
    color: red;
}

.input-control > .error{
    padding: 0;
    margin: 0;
    height: 1.4vh;
    font-size: 1.4vh;
    color: red;
}