@font-face {
	font-family: manoNegra;
	src: url(../fonts/WCManoNegraBta.otf);
}

* {
	margin: 0;
	padding: 0;
	border: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

main, header, section, footer, aside, nav, article, figure, figcaption {
    display: block;
}

html, body {
	width: 100%;
	height: 100%;
}

body {
	font-family: arial, sans-serif;
	font-size: 12px;
	font-weight: 100;
	background: #000;
	border: 2em solid #fff;
}

main {
	display: table;
	position: relative;
	width: 100%;
	height: 100%;
	padding: 2em 3em;
	color: #fff;
}

.white-bg {
	color: #000;
}

.day-night {
	width: 100%;
	color: #333;
	letter-spacing: 0.4em;
}

.selector {
	margin-bottom: 0.5em;
}

.selector:hover {
	cursor: pointer;
}

nav {
	display: table-cell;
	vertical-align: bottom;
	text-align: right;
}

h1 {
	font-family: manoNegra;
	font-weight: 400;
	font-size: 16em;
	margin-bottom: 0.2em;
	line-height: 1em;
}

ul {
	list-style: none;
	font-size: 1.2em;
	letter-spacing: 0.4em;
	margin-bottom: 3em;
}

li {
	margin-bottom: 1em;
}

a {
	font-weight: 900;
	position: relative;
	padding-left: 4px;
	text-decoration: none;
	color: #fff;
}
a:active {
	color: #666;
}
a:visited{
	color: #fff;
}
a:after {
	content: '';
	position: absolute;
	width: 250%;
	height: 0;
	bottom: -0.25em;
	left: 0;
	border-bottom: 1px solid #fff;
}

a.subtle-link {
	position: absolute;
	bottom: 10px;
	right: 10px;
	font-weight: 400;
	color: #666;
	letter-spacing: 0.4em;
}
a.subtle-link:active {
	color: #ddd;
}
a.subtle-link:visited {
	color: #666;
}
a.subtle-link:after {
	display: none;
}

main.white-bg .day-night {
	color: #ddd;
}

main.white-bg a {
	color: #000;
}
main.white-bg a:visited {
	color: #000;
}
main.white-bg a:after {
	border-bottom: 1px solid #000;
}

main.white-bg a.subtle-link {
	color: #666;
}
main.white-bg a.subtle-link:visited {
	color: #666;
}

@media (max-width: 767px){
	body {
		font-size: 14px;
		border-width: 0.5em;
	}
	main {
		padding: 1em;
	}
	h1 {
		font-size: 5em;
	}
	.day-night {
		font-size: 0.75em;
		letter-spacing: 0.2em;
	}
	ul {
		font-size: 1em;
		letter-spacing: 0.2em;
		margin-bottom: 1em;
	}
	a.subtle-link {
		left: 10px;
		letter-spacing: 0.2em;
	}
}