@font-face {
    font-family: Montserrat;
    src: url("../font/Montserrat-VariableFont_wght.ttf");
}
* {
    font-family: Montserrat;
    color: #174470; /* Should be #2f456f?? */
}


/* ELEMENTS CLASSES */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    padding: 0px;
    margin: 0px;
}
a {
    text-decoration: none;
}
header {
    margin: 0px;
}
footer {
    box-shadow: 0px -3px 3px -3px #174470;
    margin-top: auto;
}
p {
    margin: 0.5em 0px 0px 0px;
    padding: 0px;
}
li {
    list-style-image: url(../images/pentagon.svg);
}
ul {
    margin-top: 0.4em;
}
lb {
    color: #38c5c5;
}


/* DISPLAY: FLEX */
.flex-row {
    display: flex;
    flex-direction: row;
}
.flex-col {
    display: flex;
    flex-direction: column;
}
.align-center {
    align-items: center;
}
.justify-center {
    justify-content: center;
}


/* CUSTOM ELEMENTS */
.link {
    width: 25%; 
    text-align: center; 
    padding: 5px 10px;
    font-size: larger;
}
.selected-link {
    background-color: #38c5c5;
    color: white;
    font-weight: bold;
}
.icon {
    width: 1.8em; 
    height: 1.8em; 
    margin-right: 0.5em;
}
.vertical-bar {
    height: 75%;
    width: 0.1em;
    margin: 0em 1em;
    background-color: #174470;
}
.new-tab {
    content: url("../images/openinnew.svg");
    height: 1.2em;
    width: 1.2em;
    margin-left: 0.2em;
}
.pentagons {
    content: url("../images/pentagons.svg");
}
.title {
    font-size: 2em;
    width: 18em;
    font-weight: bold;
    text-shadow: 0.1em 0.1em white, 
        -0.1em -0.1em white, 
        0.1em -0.1em white, 
        -0.1em 0.1em white;
}
.part-title {
    color: white;
    width: 20em;
    height: fit-content;
    padding: 0.6em 0.8em;
    font-size: x-large;
}
.part-name {
    font-size: large;
    font-weight: bold;
    color: #38c5c5;
    margin-bottom: -0.7em;
    text-decoration: underline 2px;
}
.part-content {
    margin: 1.5vw 0% 0% 1vw;
    width: 35vw;
}
.bg-pentagons {
    background-image: url(../images/pentagons.svg); 
    background-repeat: no-repeat; 
    background-position: 8vw 0px;
}
.footer-logo {
    max-width: 6vw;
    margin-right: 2vw;
}
.social-network-logo {
    width: 1.5em;
    height: 1.5em;
    margin-left: 0.5em;
    margin-top: 0.2em;
}
.space-under {
    margin-bottom: 2em;
}
.shadow {
    box-shadow: 15px 15px 0px #38c5c5;
}
.illust {
    width: fit-content;
    height: 10vw;
    margin: 3px;
    border: solid 2px #38c5c5;
    box-shadow: 5px 5px 0px #38c5c5;
}


/* FONT */
.light-blue {
    color: #38c5c5;
}
.dark-blue {
    color: #174470;
}
.larger {
    font-size: larger;
}
.large {
    font-size: large;
}


/* CUT */
.cut-corner {
    background: linear-gradient(45deg, #38c5c5 0%, #38c5c5 96%, transparent 96%, transparent 100%);
}
.round-top-left {
    border-radius: 90% 10% 0% 1% / 90% 1% 0% 10%;
    box-shadow: 15px 15px 0px #38c5c5;
}
.round-top-right {
    border-radius: 10% 90% 1% 0% / 1% 90% 10% 0%;
    box-shadow: 15px 15px 0px #38c5c5;
}