* {
    background-color: #a446d4;
}

h1 {
    text-align: center;
    font-family: sans-serif;
    color: black;
}

.row-2 .col-1 p {
    font-family: sans-serif;
    font-size: 1.25em;
    font-weight: 300;
    color: black;
}

.radio {
    font-size: 1.25em;
    font-family: sans-serif;
}

.radio label {
    padding-bottom: 10%;
}

button {
    color: white;
    background-color: rgb(95, 94, 94);
    padding: 5%;
    padding-left: 10%;
    padding-right: 10%;
    border-radius: 20px;
    border-color: #5e0f83;
    font-size: 1.25em;
}

button:hover {
    color: rgb(95, 94, 94);
    background: white;
}

[class *= "col-"] {
    padding: 2%;
    width: 100%;
}

footer {
    margin-top: 100%
}

footer p{
    text-align: center;
    font-family: sans-serif;
    font-size: .75em;
    margin-top: 0%;
    padding-top: 0px;
}

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

input[type=radio] {
    vertical-align: middle;
}

@media only screen and (max-width: 980px) {
    [class *= "col-1"] {
        width: 100%;
    }

    footer p {
        font-size: 1.5em;
    }

    footer {
        margin-top: 50%
    }

    label {
        font-size: 2em;
    }

    .row-2 .col-1 p {
        font-size: 3em;
    }

    button {
        font-size: 3em;
        padding: 10%;
        padding-left: 15%;
        padding-right: 15%;
    }

    h1 {
        font-size: 4em;
    }

    input[type=radio] {
        transform: scale(3);
        margin-bottom: 1.25%;
        margin-right: 3%
    }
}