:root {
    --background: #efe9f4;
    --basic-font-color: #484d6d;
    --header: #EE6352;
    --footer: #08B2E3;

}

.content-holder{
    background-color: var(--background);
    color: var(--basic-font-color);
    font-family: 'Fragment Mono', monospace;
}

.content{
    height: 100vh;
    /* max-width: ; */
}

.heading{
    padding: 30px;
    background-color: var(--header);
}

.navigation{
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* max-width: 1300px; */
}

a{
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.nav-holder a{
    margin-left: 20px;
    font-size: 16px;
}

#icon-container{
    display: none;
    font-size: 40px;
}

.logo{
   font-family: 'DynaPuff', cursive; 
   font-size: 40px;
   text-align: center;
}

footer{
    margin-top: 20px;
    background-color: var(--footer);
    padding: 20px;
}


@media (max-width: 768px){
    .nav-holder{
        display: none;
    }
    #icon-container{
        display: block;
        padding: 0 20px;
    }

}