body{
    background-color:#282b30;
    font-family: 'Roboto', 'Sans-Serif';
}

h1{
    font-size: 30px;
    text-align: center;
    background-color: #7289da;
    margin: -1%;
    width: 101.6%
}
p{
    color: #4dfff9;
    margin:auto;
}
#links:link,
#links:visited,
#links:hover,
#links:active {
  text-decoration: none;
  color:black;
}

#wrapper{
    position:relative;
    top:50px;
    display: grid;
    grid-template-columns: auto auto auto; 
    grid-gap:35px;

}
@media only screen and (max-width: 600px) {
    #wrapper{
        grid-template-columns: auto;
    }
}

#topic_wrapper{
    display: grid;
    grid-template-columns: auto auto; 
    grid-gap:35px;
}
@media only screen and (max-width: 600px) {
    #topic_wrapper{
        grid-template-columns: auto;
    }
}


.topic{
    background-color: #7289da;
    width: fit-content;
    text-align:center;
    border-radius: 25px;
    padding-left: 3%;
    padding-right: 3%;
    margin:auto;

    

}
.topic:hover{
    background: #424549;
}
.images{
    width: 90%;
}
.paragraphs{
    color: #4dfff9;
}


#home_button{
    text-align: center;
    background-color: #7289da;
    margin: -1%;
    margin-top: -1.85%;
    width:101.6%;
}
#home_button:hover{
    background-color: #424549;
}






#study{
    background-color: #7289da;
    width: 90%;
    text-align:center;
    border-radius: 25px;
    padding-left: 3%;
    padding-right: 3%;
    margin:auto;
    position:relative;
    top:50px;
    
}
#study:hover{
    background: #424549;
}