html, body {
 	margin: 0; 
  	padding: 0; 
}

body {
	background:#055;
	background-attachment: fixed;
	background-size: cover;
	color: mintcream;
	font-family: frutiger, arial, sans-serif;
}

a {
	text-decoration: none;
	color: mintcream;
}
a:hover {
	color: lightgrey;
}
li a:hover {
	margin-left: 1%;
}
.homebutton {
	margin-top: 1%;
	float: right;
}
.homebutton i {
	font-size: 100%;
}
ul {
	list-style: none;
}



#info {
}
#main-nav {
}
#faq-list {
	background: darkcyan;

	margin-left: 5%; 
	margin-right: 5%;
	padding-left: 1%;
}
#faq-list h2 {
	font-weight: normal;
}
#faq-list h2:hover{
	color:lightgrey;
	
	margin-left: 3%;
}
#faq-list h2 button { 
	background: darkcyan;
	color: mintcream;
	
	border: none;
	float: right;
	width: 15%;
	margin-right: 10%;

}
#faq-list .answer {
	visibility: hidden;
}
#faq-list .answer:hover {
	visibility: visible;
	height: 10%;
}

header {
	-webkit-text-stroke: 1px black; 
	background: darkcyan;

	width: 80%;
	padding-left: 5%;
	padding-right: 5%; 
	margin-left: 5%;
	font-size: 4vw;
	height: 10%;
	margin-bottom: 1%;
}


.flex-row{
	margin-left: 5%; 
	margin-right: 5%;
	width: 90%;

	display: flex;
	flex-flow: row nowrap;

}
main.flex-row {
	height: 60%;
	margin-top: 1.5%;
	margin-bottom: 2%;
}
footer.flex-row {
	margin-top:1%;
	height: 20%;
	bottom: 5%;
	height: 20%;
}
#contact, #thanks, #home-left, #home-right {
	padding-left: 2%;
	background: darkcyan;
	flex-basis: auto;
	border:inset 10px cyan;
	border-raidus: 3;
}
#contact, #home-right {
	margin-left: 2%;
	width: 20%;
	padding-right: 5%;
}
#thanks, #home-left {
	width:70%;
}
#home-right {
	font-size: 150%;
}
#nav-list-bottom  {
	visibility: visible;
}



@media (max-height: 480px) {
	#nav-list-bottom {
		visibility: hidden;
	}
	footer {
		visibility: visible;
	}
}
@media(max-height: 360px) {
	footer {
		visibility: hidden;
	}
}
@media (max-width: 2000px) {
	body {	
	}
	#thanks {
		visibility: visible;
		width: 70%;
	}
	#contact {
		width: 20%;
	}

}

@media (max-width: 1300px) {
	body {
		background: yellow;
		font-size: 150%;
	}
	footer.flex-row {
		width: 100%;
		margin-left: 0;
	}
	#thanks {
		visibility: hidden;
		width: 0;
	}
	#contact {
		
		margin: 0;
	}

@media (max-width: 1000px) {
	body {
		background: cyan;
      	padding: 0; 
      	margin: 0; 
      	
	}
  	header {
    	position: fixed; 
      	margin: 0; 
      	top: 0; 
      	width: 100vw; 
  	}
  	main.flex-row, #home-left {
		background: white; 
      	margin-left: 0; 
      	margin-right: 0; 
  	}

	#open-nav {
		visibility: visible;
	}
  	#home-right, #nav-list-bottom, nav, .right-aside {
		visibility: hidden;
      	background: blue; 
		width: 0;
      	height: 0; 
	}
	footer {
		visibility: hidden;
      	width: 0; 
      	height: 0; 
	}
}
@media print {
	body {
		background: white;
		color: black;
	}
}