/* So the HTML5 structural tags work in older browsers */
/* the reset selector*/
*{
	margin: 0;
	padding: 0;}

html {
	background-color: white;
	}
	
article, aside, figure, footer, header, nav, section {
    display: block;
}

/* the styles for the elements */
body {	font-family: Arial, Helvetica, sans-serif;
		font-size: 87.5%;
		width: 700px;
		margin-top: 0;
		margin-bottom: 0;
		margin-right: auto;
		margin-left: auto;
		border: 3px solid #800000;
		background-color: #fffded;}

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

/* the styles for the header */
header img {	float: left;
			padding-left: 30px;
			padding-right: 30px;}
header {		text-align: center;
			border-bottom: 3px solid #800000;
			padding-top: 1.5ems;
			padding-bottom: 1.5ems;
			background-image: linear-gradient(30deg, #800000, #fffded, white, #fffded, #800000);}
header h1 {	width: 600px;
			border-top: 3px solid #800000;
			border-bottom: 3px solid #800000;
			margin-bottom: .75em;
			padding-left : 40px;
			border: 3px double black;
			border-radius: 10px 10px 10px 10px;
			box-shadow: 6px 6px 0 0;}

/* the styles for the section */
section img {	padding-bottom: 1em;}
section {		clear: left;
			margin-right: 30px;
			margin-left: 30px;
			padding-left: 2ems;
			padding-right: 2ems;}
section h1 {	font-size: 150%;
			color: #800000;
			padding-top: .5em;
			padding-bottom: .25em;}
section p {	padding-bottom :.5em;}			
			
/* the styles for the footer */
footer p {		text-align: center;
			margin-top: auto;
			padding-left: 1em;
			padding-right: 1em;}
footer {		border-top: 3px solid #800000;
			padding-top: .5em;
			padding-bottom: .5em;}