@charset "UTF-8";
/******************************************************  local.css ***************************************************/
html {
	width: 100%;
	height: 100%;
	min-width: 100vmax;
	margin: 0 auto;
	background: linear-gradient(green, pink, yellow, cyan, brown);
}
body {
	height: 90vh;
	width: 90vmax;
	margin: 0 auto;
}
/*
main {
	top: 5.5vh;
	display: flex;
	flex-flow: column nowrap;
	justify-content: space-between;
	align-items: center;
}
*/
header {
	position: relative;
	top: 6vh;
	height: 15vmin;
	margin: 0 auto;
	display: flex;
	flex-flow: column nowrap;
	justify-content: space-around;
	align-items: center;
	text-align: center;
	border: .25vmax outset #000,
			.25vmax inset #000;
	border-radius: .5vmax;
	outline: 1vmin groove #F0C;
	outline-offset: .1vmin;
	z-index: 4;
}
.troak {
	position: fixed;
	height: 5vh;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	padding: 0; /* .1vh -1vw; */
	background: transparent;
}
.troak .kaort {
    width: 100%;
	margin: 0 auto;
	padding: 0 2vw;
	list-style: none;
	background: linear-gradient(to right, yellow, pink, green, brown, cyan);
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
	border-radius: .5vh;
}
.troak .kaort li a {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	cursor: pointer;
	width: 10vw;
	height: 3.5vh;
	margin: 1vmin;
	background: linear-gradient(#C8C8C8, #969696);
	color: #F00;
	vertical-align: baseline;
	font-variant: small-caps;
	font-size: calc((2vmax + 2vw)/3.5);
    border: .12vmin inset #FFF, .12vmin outset #000;
    border-radius: .1vmax;
	outline: .12vmin solid #DD3;
	outline-offset: .1vmin;
	z-index: 19;
}
.troak .kaort li a:hover {
	background: linear-gradient(#969696, #C8C8C8);
	color: #FCC;
    text-transform: uppercase;
	text-decoration: underline;
    border-radius: .5vmin;
	border: .12vmin outset #F63, .12vmin inset #000;
	outline: .12vmin solid #0D3;
}
.troak .kaort li a:active {
    color: #0F4;
    background: radial-gradient(crimson, gray, dodgerblue, gold, darkgreen);
	text-decoration: none;
    border: .1vmin solid #FFF;
    box-shadow: inset 0 0 #C9F;
	outline: .12vmin solid #00D;
}
header h1 {
	text-align: center;
	font-size: 6.5vmin;
	font-family: belligerent, serif;
	text-shadow: .15vmax .15vmax #FFF,
				-.15vmax -.15vmax #FFF,
				.25vmax .25vmax #000,
				-.25vmax -.25vmax #000;
}
header h2 {
	text-align: center;
	font-size: 3.5vmin;
	font-family: black_jack, serif;
	text-shadow: .15vmax .15vmax #000,
				-.15vmax -.15vmax #000,
				.25vmax .25vmax #FFF,
				-.25vmax -.25vmax #FFF;
}
section {
	
}
article {
	
}
aside {
	
}
footer {
	position: fixed;
	bottom: 0;
	height: 6vmin;
	margin: 0 auto;
	display: flex;
	flex-flow: column nowrap;
	justify-content: space-between;
	align-items: center;
	text-align: center;
}
#copy, #wrote {
	position: relative;
}
#copy {
	color: #FFF;
	text-shadow: .2vmin .2vmin .2vmin #000, 
				-.2vmin -.2vmin .2vmin #000;
}
#wrote {
	color: #D0C;
	text-shadow: .2vmin .2vmin .2vmin #000, 
				-.2vmin -.2vmin .2vmin #000,
				 .3vmin .3vmin .25vmin #FFF,
				-.3vmin -.3vmin .25vmin #FFF;
}
/*********************************************************************************************************************/
/*********************************************************************************************************************/
/*********************************************************************************************************************/
/*********************************************************************************************************************/
/*********************************************************************************************************************/
/*********************************************************************************************************************/
/*********************************************************************************************************************/