@font-face {
    font-family: 'Metropolis Medium';
    font-style: normal;
    font-weight: normal;
    src: local('Metropolis Medium'), local('Metropolis'), url('assets/fonts/Metropolis-Medium.woff') format('woff');
}
body {
    font-family: "Metropolis Medium", sans-serif;
    background-color: #171717;
    color: #ddd;
    margin: 0;
    cursor: default;
}
.site-fixed-width {
    width: 1300px;
    max-width: 90vw;
    margin: auto;
}
.site-bgc {
    background-color: #171717;
}
h1,h2,h3,h4,h5,h6,p {
    margin: 0;
}
.image-w50 {
    width:100px;
}
/* TOP NAVIGATION */
.top-navigation {
    display: flex;
    flex-wrap: wrap;
    padding: 10px 0;
    align-items: center;
}
.top-navigation-right {
    margin-left: auto;
}
.top-navigation-link {
    display: inline-block;
    color: inherit;
    text-decoration: none;
    font-weight: bold;
    margin-left: 10px;
    font-size: 18px;
}
.top-navigation-link-button {
    color: #171717;
    padding: 10px;
    background-color: #FFC000;
    border-radius: 10px
}
.top-navigation-logo img {
    width: 220px;
}
/* TOP NOTIFY */
.top-notify {
    overflow: hidden;
    transition: margin-top 1s, opacity .5s;
}
.top-notify-fixed {
    display: flex;
    align-items: center;
}
.top-notify-text {
    padding: 10px 0;
    display: block;
}
.top-notify-text a {
    color: inherit;
}
.top-notify-gray {
    background-color: #262626;
}
.top-notify-close {
    margin-left: auto;
    color: #FF5050;
    font-weight: bold;
    transition: transform .5s;
    text-decoration: none;
}
.top-notify-close:hover {
    transform: scale(1.75) rotate(90deg);
}

/* HEADER */
.header-main {
    padding: 120px 0;
}
.header-title {
    color: #FFC000;
    font-weight: normal;
    text-align: center;
    font-size: 40px;
}
.header-subtitle {
    font-weight: normal;
    text-align: center;
}
.section-three {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: auto;
    max-width: 1000px;
}
.section-three > div {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.section-three span {
    font-size: 25px;
    text-align: center;
}