html,
body {
    margin: 0;
    padding: 0;
}
.container {
    background-color: #e8bebf;
}
.content p {
    margin: 0;
    padding: 0;
}

.content p img {
    width: 100%;
    vertical-align: bottom;
}
@media screen and (min-width: 800px) {
    .container {
        width: 800px;
        margin: 0 auto;
        background-color: #e8bebf;
    }
}
/* Q1 */
.q1 {
    padding: 0 4% 10px 5%;
    background-color: #e8bebf;
    height: 100px;
}

.q1_content {
    background-color: #a17d7d;
    display: flex;
    justify-content: space-around;
    font-size: 30px;
    padding: 30px 0px;
}

.q1 .radiobutton {
    display: none;
}

.q1 label {
    background-color: white;
    padding: 5px 10%;
    cursor: pointer;
    font-weight: bold;
}

.q1 label:hover {
    background-color: #c2c2c2;
}

.q1 .radiobutton:checked+label {
    background-color: black;
    color: white;
}

/* Q2 */
.q2 {
    padding: 0 4% 10px 5%;
    background-color: #e8bebf;
    height: 100px;
}

.q2_content {
    background-color: #a17d7d;
    display: flex;
    justify-content: space-around;
    font-size: 30px;
    padding: 30px 0px;
}

.q2 .radiobutton {
    display: none;
}

.q2 label {
    background-color: white;
    padding: 5px 10%;
    cursor: pointer;
    font-weight: bold;
}

.q2 label:hover {
    background-color: #c2c2c2;
}

.q2 .radiobutton:checked+label {
    background-color: black;
    color: white;
}