body {
	background-color: #E0F0FF;
}

/* Styles for Mobile Layout */

/* Style for the container centers the page and specifies the width */
#container {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}
img{width:100%;
}

/* Style for the header specifies top margin, background color, rounded corners, and center align content */
header {
	font-family: Verdana, Arial, serif;
	font-size: 2em;
	margin-top: 0.2em;
	margin-bottom: 0.3em;
	text-align: center;
	padding: 0.2em;
	color: #000066;
}
/* Style for header in gallery */
#header{text-align:center;
}

#banner {
	text-align: center;
}

/* Style for nav specifies text properties */
/* Style for nav specifies text properties */
nav {
	font-family: Lucida, "Times New Roman", serif;
	font-size: 1em;
	font-weight: bold;
	text-align: center;
}
	/* Style specifies paddig and margin for unordered list*/
nav ul{padding:0;
		margin-top:0.5em;
		margin-bottom:0.5em;
		
}
/* Styles for nav li specifies the background color, round corners, removes bulletstyle, and applies margins and padding for list items 
within the navigation*/ 


nav li{
		background-color:#000066;
		list-style-type:none;
		border-radius:1em;
		margin:0.5em;
		padding:0.5em;
	}
nav li a{
		color:#FFFFFF;
		text-decoration:none;
	}


/* Style for the main specifies a block display, text properties, margins, padding, rounded corners, and borders  */
main {
	display: block;
	font-family: Georgia, "Times New Roman", sans-serif;
	font-size: 1em;
	margin-top: 0.5em;
	padding: 0.5em;
	border-radius: 1em;
	background-color: #FFFFFF;
}
/* Style for banner */
#banner h2{text-align:left;
}
/* Style for navigation in gallery */
#gallery{display:none;
}
article h3{text-align:center;
}
figure{text-align:center;
	   text-align:center;
}
/* Style for figurecaption in gallery */
figcaption{color:#000066;
}

#section{padding:1em;
}
#article{margin-top:1em;
		margin-bottom:0.5em;
		margin-left:0;
		margin-right:0.2em;
		padding:1em;
		background-color:#ACB7E6;	

}
#footer{text-align:center;
}
/* Style  for  second article */
#two{display:none;
}
/* style for third article */
#three{display:none;
}
/* Style for nav in gallery */
#nav{display:none;
}
/* Style for header in gallery */
#header{display:none;
}
/* Style for footer in gallery */
#footer{display:none;
}
/* Style for header in gallery */
@media only screen and (min-width:481px){
	#container{width:97%;
	}
	#gallery{display:block;
	}
	
/* Style for second image in gallery */
	#p2{display:none;
		
	}
	/* Style for third image in gallery */
	#p3{display:none;
	}
	#nav{display:block;
		margin-top:-1em;
		position:relative;
		text-align:center;
		top:-2em;
	}
	}
	nav li{
		background-color:#000066;
		list-style-type:none;
		border-radius:0;
		margin:0.8%;
		padding:0.5em;
		width:15%;
		float:left;
	}
	nav li a{
		color:#FFFFFF;
		text-decoration:none;
	}
	/* Style for first image in gallery to hide its title */
	#p1{margin-top:0.5em;
		margin-bottom:-3em;
	}
	figcaption{display:none;
	}
	#article{margin-top:1em;
		margin-bottom:0;
		margin-left:0.5em;
		margin-right:0.5em;
		padding:1em;
		background-color:#ACB7E6;

}

@media only screen and (min-width:769px){
	nav{margin-left:1em;
		margin-right:0.5em;
	}
	nav li{width:18.5%;
			margin:0;
	}
	#gallery{display:block;
	}
	#p1{height:35vh;
	margin-top:0;
	}

}