.map {
    grid-row: 15 / span 50;
    grid-column: 5 / span 40;
}

.contactform {
    grid-row: 10 / span 70;
    grid-column: 60 / span 35;
    border: 3px white solid;
}

form {
    display: grid;
    grid-template-columns: repeat(100,1fr);
    grid-template-rows: repeat(100,1fr);
}

input {
    background-color: black;
    border: solid 2px white;
    border-radius: 2px;
    height: 100%;
    width: 100%;
    color: white;
    font-size: 1.5cqw;
}
label {
    color: white;
    font-size: 2cqw;
}
.contactform div {
    padding: 10px;
}

.title {
    font-size: 3cqw;
    grid-row: 1 / span 15;
    grid-column: 1 / span 100;
    color: white;
    text-align: center;
}

.fname {
    grid-row: 10 / span 15;
    grid-column: 1 / span 50;
}
.lname {
    grid-row: 10 / span 15;
    grid-column: 50 / span 50;
}
.email {
    grid-row: 30 / span 15;
    grid-column: 1 / span 100;
}
.message {
    grid-row: 50 / span 35;
    grid-column: 1 / span 100;
}
.submit {
    grid-row: 90 / span 10;
    grid-column: 30 / span 40;
}

textarea {
    color: white;
    background-color: black;
    border: 2px solid white;
    resize: none;
    width: 100%;
    height: 100%;
    overflow: auto;
}

em {
    color: red;
}

.yt {
    grid-row: 70 / span 10;
    grid-column: 10 / span 30;
    transition: ease-in-out 0.2s;
}

.yt:hover {
    scale: 1.1;
    rotate: 5deg;
}

@media (max-width: 640px) {
    .map {
        grid-row: 71 / span 20;
        grid-column: 5 / span 90;
    }

    .contactform {
        grid-row: 10 / span 60;
        grid-column: 5 / span 90;
        border: 3px white solid;
    }

    input {
        font-size: 2cqw;
    }
    label {
        font-size: 2.5cqw;
    }

    .yt {
        grid-row: 3 / span 5;
        grid-column: 40 / span 45;
        transition: ease-in-out 0.2s;
    }
}