/*
CSS for marvellous memories site home
*/

body {
font-family: Verdana, Helvetica, Arial, sans-serif;
background-image: url(images/printsbackground5.jpg);
background-repeat: no-repeat;
line-height: 125%;
padding: 0;
margin: 0;
}

h1, h2, h3 {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}

h1 {
font-size: x-large;
background-color: white;
background-image: url(images/kodak.jpg);
background-repeat: no-repeat;
color: white;
padding-top: 2em;
padding-bottom: .2em;
padding-left: .4em;
height: 1.8em;
margin: 0;
}

h3 {
color: navy;
font-size: 130%;
font-weight: normal;
padding-top: 15px;
}

h2, ul {
margin-top: 15px
}

#navigation {
width: 856px;
height: 49px;
}

li {
font-size: medium;
color: black;
}

#tagline p {
font-size: 18px;
font-style: italic;
font-family: Monotype Corsiva;
background-color: white;
border-top: 3px solid orange;
border-bottom: 3px solid orange;
padding-top: .2em;
padding-bottom: .2em;
padding-left: .8em;
height: 1.5em;
margin: 0;
}

a {
font-weight: bold;
}

a:link {
color: black;
}

a:visited {
color: navy;
}

a:hover {
text decoration: none;
color: white;
background-color: navy;
}

a:active {
color: aqua;
background-color: navy;
}

#header {
border-top: 3px solid orange;
}

/*
This section deals with the posistion of items on the screen. It uses absolute positioning - fixed x and y coordinates measured from the top - left corner of the browser's conent display.
*/

#navigation, #header, #tagline, #map, #copyright {
	position: absolute;
	left: 135px;
	width: 677px;
	top: 1px;
	height: 35px;
}

#bodycontent{
	position: absolute;
	left: 135px;
	width: 589px;
	top: 1px;
	height: 35px;
}

#copyright{
	position: absolute;
	color: #999;
	font-size:12px;
	left: 830px;
	width: 410px;
	top: 1083px;
	height: 35px;
}

#map {
	width: 592px;
	left: 602px;
	top: 580px;
}

#navigation{
	top: 159px;
	left: 250px;
	border-bottom: 3px solid white;
}

#tagline {
top: 98px;
left: 0px;
width: 100%;
}

#bodycontent {
	top: 408px;
	left: 615px;
}

#header {
top: 0px;
left: 0px;
width: 100%;
}

#image {
	position: absolute;
	left: 105px;
	top: 775px;
}

#image2 {
	position: absolute;
	left: 7px;
	top: 423px;
}



.feature {
float: right;
margin: 10px;
}

img {
border: 5px solid orange;
}