@font-face {
    font-family: "Departure";
    src: url(DepartureMono-Regular.woff2)
}

:root {
    font-family: Inter, sans-serif;
    font-feature-settings: 'liga' 1, 'calt' 1; /* fix for Chrome */    

    background: #222;
    color: white;

    --hilighter-yellow: #e9ff39;

    --darkblue: #055;
    --blue: teal;
    --lightblue: cyan;
}

@supports (font-variation-settings: normal) {
    :root { font-family: InterVariable, sans-serif; }
}

body {
    margin: 0;
}


a {
    color: var(--hilighter-yellow);
}

code {
    font-family: Departure;
}

header {
    background: var(--blue);
    color: white;
    font-family: Departure; 
    width: 100%;

    nav {
	// border-bottom: 2pt solid cyan;
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;

	
	menu {
	    display: flex;
	    list-style-type: none;
	    margin: 0;
	    padding: 0;
	    height: 3rem;

	    a {
		display: inline-block;
		color: inherit;
		text-decoration: none;
		font-weight: bold;
		text-shadow: 2px 2px black;

		&:visited {
		}

		&:hover {
		    text-shadow: 1px 1px var(--hilighter-yellow);
		}
	    }


	    li {    
		display: inline;
		padding-right: 1rem;
		margin-top: auto;
		margin-bottom: auto;
	    }

	    li:first-child {
		display: inline;
		font-size: 1.5rem;
		margin-left: 0;
		padding-left: 1rem;
	    }

	    li:nth-child(2) {
		margin-right: auto;
		margin-top: 0
			    margin-bottom: 0
	    }
	}
    }
}

main {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    padding: 1rem;
    article {
	header {	
	    background: inherit;
	    .title {
		font-family: Departure;
		font-size: 4em;
		text-align: center;
		text-shadow: 4px 4px #055;
	    }
	    .description {
		font-family: Departure;
		font-size: 1em;
		text-align: center;
		color: grey;
		text-shadow: 1px 1px black;
	    }
	}

	section.post-body {
	    font-size: 1.5rem;
	    h1, h2, h3, h4, h5, h6 {
		font-family: Inter;
		width: 100%;
		font-weight: bold;
		border-bottom: 2pt solid white;
		padding-bottom: 1rem;
	    }

	    pre {
		background: black;
		border-bottom: 2pt solid var(--blue);
		border-top: 2pt solid var(--blue);
		width: 90%;
		margin-left: auto;
		margin-right: auto;
		padding: 1em;
		overflow: scroll;
	    }
	}

    }
}

footer {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    font-size: x-small;
    font-family: Departure, sans-serif;
    color: darkgrey;

    #copyright {
	display: inline-block;
	width: 100%;
	text-align: center;
	color: darkgrey;
    }
}