* {box-sizing: border-box;}

#wrapper {margin-left: auto;
			margin-right: auto;
			background-image: linear-gradient(to bottom, #ffffff, #a3a3c2);
			background-repeat: no-repeat; 
			width: 80%;
			background-color: #90c7e3;
			min-width: 960px;
			max-width: 2048px;
			box-shadow: 3px 3px 3px #333333
			border: 1px solid #000033;}

body {background-color: #cccccc;
		}

main {padding: 5em;}


header {text-align: center;
			background-color: #47476b;
			height: 120px;
			padding-top: 30px;
			padding-left: 3em;
			line-height: 400%;}

header a {text-decoration: none;}

header a:link {color: #262626;}

header a:visited {color: #262626;}

header a:hover {color: #8c8c8c;}


			
h1 {margin-bottom: 0;
		margin-top: 0;
		font-family: Georgia, Time-New-Roman, serif;
		font-size: 4em;
		}
		
h2 {text-align: center;
	color: #262626;
	font-size: 400%;
	font-family: Georgia, Time-New-Roman, serif;}	

p {text-align: center;
	font-size: 250%;}



nav {padding: 0em;
		font-weight: bold;
		font-size: 120%;
		text-align: center;}
		
nav a {text-decoration: none;}

nav ul {list-style-type: none;
			margin: 0;
			padding-left: 0;
			font-size: 1.2em;
			overflow: hidden;
			padding-top: .5em;
			background-color: #a3a3c2;}
			
nav li {float: left;}

nav li a {display: block;
			color: white;
			text-align: center;
			padding: 14px 16px;
			text-decoration: none;}

nav a:link {color: #262626;}

nav a:visited {color: #262626;}

nav a:hover {color: #8c8c8c;}


table {border: 2px solid #47476b;
			border-collapse: collapse;
}

td, th {padding: 1em;
			border: 1px solid #47476b;
			}							
						
td {text-align: center;}	

.text {text-align: left;}						
							
						
							
							
div.gallery {
  margin: 5px;
 }

form {flex-flow: column nowrap;
		display: flex;}

input, textarea {margin-bottom: 1em;}



@media (min-width: 430px)  {

nav ul {flex-direction: row;
		flex-wrap: nowrap;
		display: flex;
		justify-content: space-around;}
		
	img { max-width: 100%;
			height: auto;}
			
	iframe {max-width: 100%;
				}
	
	
		form {display: grid;
			grid-gap: 1em;
			grid-template-columns: 8em 1fr;
			grid-template-rows: auto;
			width: 100%;}
			
	input[type="submit"] {grid-column: 2/3; 
							width: 9em;}
	
}

@media (min-width: 1024px) {

	nav ul {flex-direction: row;
			display: flex;
			}
	
	img { max-width: 100%;
			height: auto;}
			
	iframe {max-width: 100%;
			}
	
	#wrapper {margin: auto;
				width: 80%;
				display: grid;
				grid-template-rows: auto;
				grid-template-columns: 190 px auto;}
				

				
	header {grid-row: 1/2; grid-column: 1/3; }
	
	nav {grid-row: 2/3; grid-column: 1/3;  }
	
	div {grid-row: 3/4; grid-column: 1/3;  }
	
	main {grid-row: 4/5; grid-column: 1/3;  }
	
	footer {grid-row: 5/6; grid-column: 1/3;  }
	
	



}
			
			

#landscape {background-image: url(landscape.jpg);
			background-size: 100% 100%;
			background-repeat: no-repeat;
			height: 600px;}


footer {background-color: #47476b;
		color: #262626;
		text-align: center;
		font-style: italic;
		font-size: 75%;
		font-family: Georgia,Time-New-Roman;
		padding: 2em;
}