img:hover {
	opacity: 1; /* Making a duck show at full opacity when you roll over him with a mouse */
}

/* Begin button bar styling */

nav {
	background-color: rgba(247,247,247,0.70);
	height: 65px;
	position: relative; /* This gives our z-index something to hook on to */
	z-index: 1000; /* This makes sure our navigation appears over the top of the foreground duck image */
}

/* This is the base of our bulleted list */
nav ul {
	padding: 0px;
	margin: 0px;
	list-style-type: none; /* Hide those bullets */
	list-style-image: none; /* NO REALLY, hide those bullets */
}

nav ul li {
	display: block; /* Turns our list item into a box to contain our buttons */
	width: 20%; /* We want our buttons to take up equal parts of the navigation area. Because we have four buttons, then the width must be 25% */
	height: 65px; /* Match our <nav> tag height of 65px */
	float: left; /* Float them left so they go horizontally across the page */
}

/* Here is the actual button style itself */

nav ul li a {
	display: block; /* Makes <a> tag fill 100% of the width of it's containing <li> */
	height: 50px; /* This is really 65px, but I have subtracted the padding-top from this number in order to horizontally balance the type */
	text-align: center;
	background-color: rgba(50,54,54,0.70);
	color: rgba(205,164,107,1.00);
	text-decoration: none;
	font-size: 2em;
	font-style: italic;
	font-weight: bold;
	padding-top: 15px; /* This padding vertically centeres the type */
	
	/* Shadow border */
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: rgba(54,54,54,.7);
	
	/* Highlight border */
	border-left-width: 2px;
	border-left-style: solid;
	border-left-color: rgba(54,54,54,.7);
}

/* End of button */


/* Using a freaky :first-child pseudo-class style to take the orphan highlight border off the left edge */
nav ul li:first-child a {
	border-left: none;
}


/* This is all Agostina's fault. She wanted to dye the second button a different color in our navigation for some reason. So, using an :nth-child(n) pseudo-class style, we did. 
nav ul li:nth-child(2) a {
	background-color: rgba(42,66,80,1.00);
}*/

/* AND she wanted a rollover of a different color. So we did that too. */
nav ul li:nth-child(2) a:hover {
	/*background-color: rgba(237,216,132,1.00);*/
}

/* Using a freaky :last-child pseudo-class style to take the orphan shadow border off the right edge */
nav ul li:last-child a {
	border-right: none;
}

/* Rollover color */
nav ul li a:hover {
	background-color: rgba(44,56,70,.7);
}

body{
	background-imgage: url(../images/wall_image.jpg);
	background-position: 100% 100%;
	margin: 0;
	padding: 0;
	witdth: 100%;
	height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	
}

footer {
	
		float:right;
		font-size: 6em;
		color: rgba(205,164,107,1.00);
		text-shadow: 1px 1px rgba(252,252,252,1.00);
		padding-right: 2%;

}

/*! http://responsiveslides.com v1.55 by @viljamis */

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

/* This media query applies only to your website when it is displayed in a browser that is 960 pixels or smaller */
@media only screen and (max-width: 960px) {
	
	body {
		background-image: none; /* Gets rid of background gradient */
		background-color: red;
	}
	
}

/* This media query applies only to your website when it is displayed in a browser that is 500 pixels or smaller */
@media only screen and (max-width: 500px) {
	
	body {
		background-image: none; /* Gets rid of background gradient */
		background-color: limegreen;
	}
	
	nav ul li {
		float: none; /* Gets rid of left floats on buttons */
		width: 100%; /* Makes buttons stretch to 100% of the container width */
		height: auto; /* Removes fixed height to allow drop down menu to work */
		
	}
	
	nav ul li a {
		border-left: none; /* Gets rid of left borders */
		border-right: none; /* Gets rid of right borders */
		height: auto; /* Removes fixed height to allow drop down menu to work */
		padding: 30px; /* Makes buttons fat enough for fingers to use on touch devices */
		border-bottom-color: aqua;
	}
	
	
}