@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-Italic.eot');
    src: local('Whyte Italic'), local('Whyte-Italic'),
        url('../fonts/whyte/Whyte-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Italic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Italic.woff') format('woff'),
        url('../fonts/whyte/Whyte-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-ExtraLightItalic.eot');
    src: local('Whyte ExtraLight Italic'), local('Whyte-ExtraLightItalic'),
        url('../fonts/whyte/Whyte-ExtraLightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-ExtraLightItalic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-ExtraLightItalic.woff') format('woff'),
        url('../fonts/whyte/Whyte-ExtraLightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte Book';
    src: url('../fonts/whyte/Whyte-Book.eot');
    src: local('Whyte Book'), local('Whyte-Book'),
        url('../fonts/whyte/Whyte-Book.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Book.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Book.woff') format('woff'),
        url('../fonts/whyte/Whyte-Book.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-HeavyItalic.eot');
    src: local('Whyte Heavy Italic'), local('Whyte-HeavyItalic'),
        url('../fonts/whyte/Whyte-HeavyItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-HeavyItalic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-HeavyItalic.woff') format('woff'),
        url('../fonts/whyte/Whyte-HeavyItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-Regular.eot');
    src: local('Whyte Regular'), local('Whyte-Regular'),
        url('../fonts/whyte/Whyte-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Regular.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Regular.woff') format('woff'),
        url('../fonts/whyte/Whyte-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Whyte Super';
    src: url('../fonts/whyte/Whyte-Super.eot');
    src: local('Whyte Super'), local('Whyte-Super'),
        url('../fonts/whyte/Whyte-Super.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Super.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Super.woff') format('woff'),
        url('../fonts/whyte/Whyte-Super.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-LightItalic.eot');
    src: local('Whyte Light Italic'), local('Whyte-LightItalic'),
        url('../fonts/whyte/Whyte-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-LightItalic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-LightItalic.woff') format('woff'),
        url('../fonts/whyte/Whyte-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte Book';
    src: url('../fonts/whyte/Whyte-BookItalic.eot');
    src: local('Whyte Book Italic'), local('Whyte-BookItalic'),
        url('../fonts/whyte/Whyte-BookItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-BookItalic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-BookItalic.woff') format('woff'),
        url('../fonts/whyte/Whyte-BookItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-Heavy.eot');
    src: local('Whyte Heavy'), local('Whyte-Heavy'),
        url('../fonts/whyte/Whyte-Heavy.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Heavy.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Heavy.woff') format('woff'),
        url('../fonts/whyte/Whyte-Heavy.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Whyte Super';
    src: url('../fonts/whyte/Whyte-SuperItalic.eot');
    src: local('Whyte Super Italic'), local('Whyte-SuperItalic'),
        url('../fonts/whyte/Whyte-SuperItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-SuperItalic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-SuperItalic.woff') format('woff'),
        url('../fonts/whyte/Whyte-SuperItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-MediumItalic.eot');
    src: local('Whyte Medium Italic'), local('Whyte-MediumItalic'),
        url('../fonts/whyte/Whyte-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-MediumItalic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-MediumItalic.woff') format('woff'),
        url('../fonts/whyte/Whyte-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-Bold.eot');
    src: local('Whyte Bold'), local('Whyte-Bold'),
        url('../fonts/whyte/Whyte-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Bold.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Bold.woff') format('woff'),
        url('../fonts/whyte/Whyte-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-Black.eot');
    src: local('Whyte Black'), local('Whyte-Black'),
        url('../fonts/whyte/Whyte-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Black.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Black.woff') format('woff'),
        url('../fonts/whyte/Whyte-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-BlackItalic.eot');
    src: local('Whyte Black Italic'), local('Whyte-BlackItalic'),
        url('../fonts/whyte/Whyte-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-BlackItalic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-BlackItalic.woff') format('woff'),
        url('../fonts/whyte/Whyte-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-ExtraLight.eot');
    src: local('Whyte ExtraLight'), local('Whyte-ExtraLight'),
        url('../fonts/whyte/Whyte-ExtraLight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-ExtraLight.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-ExtraLight.woff') format('woff'),
        url('../fonts/whyte/Whyte-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-Light.eot');
    src: local('Whyte Light'), local('Whyte-Light'),
        url('../fonts/whyte/Whyte-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Light.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Light.woff') format('woff'),
        url('../fonts/whyte/Whyte-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-Medium.eot');
    src: local('Whyte Medium'), local('Whyte-Medium'),
        url('../fonts/whyte/Whyte-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Medium.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Medium.woff') format('woff'),
        url('../fonts/whyte/Whyte-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-BoldItalic.eot');
    src: local('Whyte Bold Italic'), local('Whyte-BoldItalic'),
        url('../fonts/whyte/Whyte-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-BoldItalic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-BoldItalic.woff') format('woff'),
        url('../fonts/whyte/Whyte-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-ThinItalic.eot');
    src: local('Whyte Thin Italic'), local('Whyte-ThinItalic'),
        url('../fonts/whyte/Whyte-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-ThinItalic.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-ThinItalic.woff') format('woff'),
        url('../fonts/whyte/Whyte-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'Whyte';
    src: url('../fonts/whyte/Whyte-Thin.eot');
    src: local('Whyte Thin'), local('Whyte-Thin'),
        url('../fonts/whyte/Whyte-Thin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/whyte/Whyte-Thin.woff2') format('woff2'),
        url('../fonts/whyte/Whyte-Thin.woff') format('woff'),
        url('../fonts/whyte/Whyte-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'GT America Mono';
    src: url('../fonts/gt-america/GT-America-Mono-Regular-Trial.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'GT America Mono';
    src: url('../fonts/gt-america/GT-America-Mono-Medium-Trial.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'GT America Mono';
    src: url('../fonts/gt-america/GT-America-Mono-Bold-Trial.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'GT America Mono';
    src: url('../fonts/gt-america/GT-America-Mono-Regular-Italic-Trial.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
}

html { height: 100%; }

body {
    background-image:
        linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)),
        url('../assets/wallpapers/main.webp');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color: #ffffff;
    margin: 0;
    padding: 0;
    padding-top: 11rem;
    display: flex;
    flex-direction: column;
}

header {
    font-family: 'Whyte', Arial, sans-serif;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    backdrop-filter: blur(15px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    /* padding: 1rem 0; */
    color: #ffffff;
}

header a {
    color: inherit;
    text-decoration: none;
}



.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
    font-size: 1rem;
    color: #ffffff;
    font-style: italic;
}

.menu {
    display: flex;
    gap: .6rem;
}

.menu a {
    font-size: 1rem;
    color: #d8d8d8;
    text-decoration: none;
    transition: color 0.3s ease;
    align-items: center;
    justify-content: center;
    display: flex;
    padding: .3rem .9rem;
}

.menu a.exception {
    color: #dadada;
    padding: .7rem 1rem;
    border-radius: .8rem;
    background-color: rgba(255, 255, 255, 0.068);
    transition: all 0.3s ease;
}
.menu a.exception:hover {
    background-color: rgba(255, 255, 255, 0.103);
    color: #ffffff;
}

.menu a:hover {
    color: #ffffff;
}

footer {
    width: 100%;
    background-image:
        linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)),
        url('../assets/wallpapers/main.webp');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color: #ffffff;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.logo-footer h1 a {
    font-family: 'Whyte', Arial, sans-serif;
    font-size: 1.2rem;
    color: #ffffff;
    font-style: italic;
    text-align: center;
    text-decoration: none;
}

.social {
    font-family: 'GT America Mono', Arial, sans-serif;
    display: flex;
    gap: 2.5rem;
    justify-content: center;
    align-items: center;
}

.social a {
    color: #d8d8d8;
    text-decoration: none;
}