/* Fonts */

@import url('https://fonts.googleapis.com/css2?family=Chango&family=Coiny&display=swap');
@font-face { font-family: 'Maldive'; src: url('Maldive.ttf'); } 
@font-face { font-family: 'Blinka'; src: url('Blinka.ttf'); } 

/* Tags */

html {
    margin: 0 auto;
    padding: 0;
    width: 100vw;
    max-width: 1280px;
    user-select: none;
    color: #B4DD1E;
}

body {
    background: #1E133E;
    margin: 0;
    padding: 1vw 1vw 7vw;
}

a {
    color: #CDEA65;
    text-decoration: underline;
}

a:hover, button:hover {
    transition-duration: 0.15s;
    opacity: 0.7;
}

h1 {
    display: inline-block;
    font-family: 'Blinka';
    font-size: 7vw;
    letter-spacing: 1;
    line-height: 1.2;
    margin: 0;
    width: fit-content;
}

h2, h3, h4, h5, h6 {
    font-family: 'Chango';
    margin: 0;
}

h3 {font-size: 3vw;}

p {
    font-family: 'Coiny';
    font-size: 2vw;
}

header {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 0;
    margin: 0;
}

nav {
    display: inline-block;
    align-self: center;
}

nav div {
    display: inline-block;
    font-family: 'Coiny';
    text-decoration: underline;
    margin: 1.2vw;
    font-size: 2vw;
}

nav div:nth-last-child(-n + 1) {margin-right: 0;}

nav a {color: #B4DD1E;}

section {
    background: #1A0F37;
    border: 0.125em solid #2B1A5C;
    border-radius: 1em;
    box-shadow: 0 0 0.2em 0 #000;
    text-align: center;
    margin: 0 0 1vw;
    padding: 0.25vw;
}

section h3 {text-decoration: underline;}

section p, footer p {margin: 0;}

footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 99vw;
    padding: 0.5vw;
    background: #1A0F37;
    border-top: 0.125em solid #2B1A5C;
    text-align: center;
}

#aboutme {
    font-family: 'Coiny';
    font-size: 1.25vw;
    margin: 0 0.5vw;
}

/* Max Sizes */

@media screen and (min-width: 1280px) { /*{ (n[vw]/100)*1280 }*/
    body {padding: 12.8px 12.8px 89.6px;}
    h1 {font-size: 89.6px;}
    h3 {font-size: 38.4px;}
    section {margin: 0 0 12.8px;}
    p, nav div {font-size: 25.6px;}
    nav div {margin: 15.36px;}
    #aboutme {font-size: 16.0px;}
}