@font-face {
    font-family: favorit-std-regular;
    src: 
       url('../fonts/favorit-std-regular.woff') format('woff');
}
@font-face {
    font-family: favorit-std-light;
    src: url('../fonts/favorit-std-light.woff') format('woff');
}
@font-face {
    font-family: Century-exp-regular;
    src: url('../fonts/Century Expanded Regular.otf') format('otf');
}
* {
    box-sizing: border-box;
}
body {
    margin: 0%;
    padding: 0%;
    font-family: Century-exp-regular;
    font-size: 25px;
    overflow-x: hidden;
    overflow-y: visible;
}
a {
    color: black;
    text-decoration: none; 
    cursor: pointer;
}
a:hover { 
    text-decoration: underline;
}
.link {
    text-decoration: underline;
}
.text {
    padding-top: 2%;
    padding-left: 2%;
    padding-right: 3%;
    font-size: 20px;
}
.projectContentList {
    margin: 0;
}
#contentContainer {
    display: grid; 
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 2%;
}
.projectTitle {
    font-family: favorit-std-regular;
}
#projectText {
    width: 95%;
}
#projectPicture {
    width: 100%;
    height: 100vh;
    background-size: cover;
}
#keywordContainer {
    display: grid; 
    grid-template-columns: 60% 40%;
    grid-row-gap: 2%;
}
.keyword {
    text-decoration: underline;
}
.keywordTitle {
    font-family: favorit-std-regular;
}
#keywordProjectLinks{
    padding-top: 2vh;
    padding-left: 5%;
    font-size: 18px;
    font-family: favorit-std-regular;
}
#glossarLink {
    font-family: favorit-std-regular;
    font-size: 15px;
}
@media only screen and (max-width : 700px) {
    #contentContainer {
        grid-template-columns: auto;
        grid-column-gap: 0%;
    }
    #projectPicture {
        height: 50vh;
        background-position: center;
    }
    #keywordContainer {
        grid-template-columns: 100%;
        grid-column-gap: 0%;
    }
}