/*
   IT 270
   Final Project

   Chris Walters Contact Page Stylesheet
   Author: Christopher Walters
   Date:   August 15, 2015

   Filename:         contact.css
   Supporting Files: go.png, stop.png

*/
/* Display HTML5 structural elements as blocks */

article, aside, figure, figcaption, footer, hgroup, header, 
section, nav {
   display: block;
}
/* Set the default page element styles */

body * {
   font-family: Californian FB, Garamond, sans-serif;
   font-size: 102%;
   font-weight: inherit;
   line-height: 1.2em;
   list-style: none;
   margin: 0px;
   padding: 0px;
   text-decoration: none;
   vertical-align: baseline;

}
/* Body Styles */
body {
   width: 95%;
   background-color: navajowhite;
   background-image: url(images/hanginggrapes1.jpeg);
   background-size: cover;
   min-width: 900px;
   max-width: 1600px;
   font-family:  Garamond, Geneva, sans-serif;
   font-weight: normal;
   font-size: 16px;
   margin: 0px auto;
   position: relative;

}

/* Header styles */
header {
	font-family: Garamond, Courier, sans-serif;
	display: block;
	width: 95%;
	margin: 5px auto;
}


header img {
	height: 280px;
	width: 68%;
	float: left;
	margin-left: -2%;
	border-radius: 15px;
}

div.nameCard {
	color: indigo;
	float: right;
	width: 31%;
	border-radius: 25px;
	margin-top: 30px;
	background-color: moccasin;
	border: 1px solid black;
	opacity: 0.8;
	filter: alpha(opacity=80);
}

h1 {
	font-size: 2.6em;
	text-align: center;
}

h2 {
	font-size: 1.8em;
	text-align: center;
}


/*Navigation list styles */

nav {
	float: left;
	width: 100%;
	margin: 10px 1% 10px 1%;
}

nav li {
	display: block;
	width: 12%;
	margin-left: 1%;
	margin-bottom: 5px;
	float: left;
}

nav li a {
	display: block;
	width: 100%;
	height: 40px;
	line-height: 40px;
	text-align: center;
	color: moccasin;
	font-size: 1.5em;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	border-radius: 30px;
	background-color: indigo;
}

li a:hover {
	background-color: darkred;
}

/* Article styles */
article {
   float: left;
   width: 80%;
   background-color: moccasin;
   color: darkred;
   margin-left: 10%;
   border-radius: 15px;;
   border: 1px solid sienna;
   box-sizing: border-box;
   padding: 10px;
}

article h1 {
   font-size: 1.8em;
   font-family: Californian FB, serif;
   font-weight: bold;
   font-style: italic;
   color: darkred;
   letter-spacing: 2px;
   margin-right: 25%;
}

header p {
   font-size: 0.9em;
   color: darkred;
   margin: 10px 25% 10px 10px;
}


/* Section styles */

section {
   clear: left;
   width: 80%;
   margin-left: 10%;
   letter-spacing: 1px;
   
}

section p {
   color: darkred;
   margin-left: 40%;
   padding: 10px;
   background-color: moccasin;
   border-radius: 30px;
   text-align: center;
   width: 20%;
   border: 2px solid sienna;
}

/* Footer styles */

footer {
	background-color: moccasin;
	color: rgb(55, 25, 30);
	text-align: center;
	margin-top: 10px;
	letter-spacing: 1px;
	}

