* {
	position: relative;
	margin: 0;
}

body, html {
	width: 100%;
	height: 100%;
	font-family: "Nunito";
	font-size: 1rem;
	color: #840;
}


#active_logo, #face{
	text-align: center;
	background: #b3d177;
	display: block;
}

#active_logo {
	height: 100vh;
	line-height: 100vh;
}

#face {
	height: 100%;
}

#page {
	background: #b3d177;
	text-align: left;
	min-height: 100%;
}

#mask {
	display: inline-block;
	line-height: 5vw;
}

#active_logo > img {
	width: 9vw;
  vertical-align: middle;
}


h1 {

	font-size: 6vw;
	line-height: 7.5vw;
}

a {
	display: inline-block;
	color: #448;
	border-bottom: 1px solid rgba(68,68,136,.5);
	text-decoration: none;
}

a:hover {
	border-bottom: 0;
	border-bottom: 2px solid rgba(68,68,136,1);
}

.varieties div {
	margin-left: 3vw;
	font-size: 4vw;
}

.varieties > div > div {
	font-size: 3.5vw;
	color: #630;
}

.varieties > div > div > div {
	font-size: 3vw;
	color: #420;
}

key {
	display: inline;
	font-weight: bold;
}