body {
    font-family: "Open Sans", sans-serif;
    margin-bottom: 10%;

}

.heading {
    font-weight: 100;
    font-size: 48px;
    color: #fff;
    background: #673AB7;
    /* opacity: 0.8; */
    padding: 2%;
    font-weight: 100;
    margin-bottom: 0px;
}

.subheading {
    font-weight: 100;
    /* font-size: 32px; */
    color: #fff;
    background: #673AB7;
    opacity: 0.7;
    position: relative;
    top: 300px;
    /* width: 60%; */
    margin-left: auto;
    margin-right: auto;
    border-radius: 48px;
    padding: 2%;
    text-align: center;
}

.hero {
    background-image: url('/public/sky.jpg');
    min-height: 70vh;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}

.qtitle {
    /* background: #7E57C2; */
    opacity: 0.9;
    display: inline-block;
    padding: 2%;
    /* color: #fff; */
    border-radius: 8px;
}



.qexplanation {
    /* color: #9575CD; */
    /* color: darkgray; */
    font-size: 16px;
    line-height: 1.5em;
    border-left: 4px solid #E91E63;
    padding-left: 2%;
    /* font-weight: bold; */
}

.qpara {
    background-color: #E91E63;
    font-size: 32px;
    border-radius: 4%;
    color: white;
    padding: 2%;
    font-weight: 300;
    margin: 2%;
}

.topic-anchor{
    /* background-color: lightgray; */
    padding: 0.5%;
    display: inline;
    border-radius: 8px;
    border: 1px solid #673AB7;
}