/* So the HTML5 structural tags work in older browsers */
article, aside, figure, footer, header, nav, section {
    display: block;
}
/* the styles for the elements */
* {
	margin: 0;
	padding: 0;
}
html {
	background-color: white;
}
body {	font-family: Arial, Helvetica, sans-serif;
		font-size: 87.5%;
		width: 800px;
		margin: auto;
		border: 3px solid #006600;
		background-color: #EDF9ED;}

a {		font-weight: bold;}
a:hover, a:focus {font-style: italic;}

/* the styles for the header */
header img {	float: left;
			padding-top: 3px; 
			padding-left: 5px;
			padding-right: 0px;}
header {		text-align: center;
			border-bottom: 3px solid #006600;
			padding-top: .1em;
			}
header h1 {	font-family: French Script MT, Helvetica, sans-serif;
			font-size : 400%;
			font-style: bold;
			color: #800000;
			padding-top: .1em;}
header h2 {	text-align : right;
			font-family: French Script MT, Helvetica, sans-serif;
			font-size : 200%;
			font-style: italic;
			color: black;
			padding-right: .5em;}
header p {	text-align: right;
			Font-size : 100%;
			font-style: bold;
			color: black;
			padding-right : .5em;
			padding-bottom: .1em;}
			
/* the styles for the navigation bar */
nav {
	clear: left;
	margin: 0;
	padding: 0;
	border-bottom: 3px solid #006600;
}
nav ul {
	list-style: none;
	padding: 1em 0;
	background-color: #006600;
}
nav li {
	display: inline;
}
nav a {
	padding: 1em 2em;
	text-decoration: none;
	color: #FF6600;
	font-weight: bold;
	border-right: 2px solid #fffded;
}
nav a.current { color: #FFCC00; }

/* the styles for the section */
section img {	float: left;
			margin: 1em 0 1em 1em;
			border: none;
			height: 200px}
section {		width: 400;
			height: 350;
			margin-right: 75px;
			margin-left: 5px;
			float: right;
			padding-left: 2ems;
			padding-right: 2ems;
			padding-bottom: .5em;}
section ul {	padding-top: .5em;
			padding-bottom: .25em;}
section  li{	padding-bottom: .25em;}
section p {	padding-bottom: .1em;}	
section h3 {	font-family: French Script MT, Helvetica, sans-serif;
			font-size: 200%;
			text-align: center;
			font-style: italic;
			padding-top: 1.5em;}
section h4 {	font-size: 80%;
			text-align: right;
			padding-bottom: 2em;}
			

/* the styles for the form */
fieldset {
    margin-bottom: .5em;
    padding-top: .5em;
    padding-bottom: .5em;
    padding-left: 1em;
    padding-right: 1em;
}
legend {
    color: black;
    font-weight: bold;
    font-size: 85%;
}
label {
    float: left;
    width: 10em;
    text-align: right;
}
input, select {
    width: 15em;
    margin-left: 0.5em;
    margin-bottom: 0.5em;
}
input:required, input[required] {
	border: 2px solid #006600;
}
input:valid {
	border: 1px solid black;
}
input:invalid {
	box-shadow: none;
	border: 2px solid #006600;
}
br {
    clear: both;
}
#buttons input {
	width: 10em;
}
#radio {
	float: off;
	width: auto;
	margin-left: 3em;
	}
#exp_month {
	width: 7em;
	margin-left: .5em;
	}
#exp_year {
	width: 5em;
	margin-left: .5em;
	}
/* the styles for the aside */
aside {		width: 20%;
			height: 600px;
			float: left;
			padding-left: 20px;}
aside h1 {	font-size: 150%;
			color: #800000;
			padding-top: .5em;
			padding-bottom: .25em;}
aside ul {		padding-left: .5em;
			padding-top: 5em;
			padding-bottom: 1.5em;}
aside li {		padding-bottom: .35em;
			list-style-type: none;}	
aside img {	padding-bottom: 1em;}
aside a.current { color: #FFCC00;
				font-style: none;}


/* the styles for the footer */
footer p {		text-align: center;
			margin-top: auto;
			padding-left: 1em;
			padding-right: 1em;}
footer {		clear: left;
			border-top: 3px solid #800000;
			padding-top: .5em;
			padding-bottom: .5em;}
 .imageContainer {
       width:auto; 
       height:180px; 
       background-image: url("../images/vineyard.jpg");
 }
 #print {
	padding: .3em;
	margin-top: 1em;
	margin-left: 1em;}