/* CSS Document */
body {
	background-color: #FFFFFF;
   	text-align:center; 
   	font-family: Verdana, Arial, Helvetica, sans-serif;
   	letter-spacing:0.05em
}

#header{	
	border-top: 2px solid #778899;
	border-bottom:2px solid #B2BCC6;
	height: 5em;
}

#header .strapline{	
	font: 120% Verdana,Geneva,Arial,Helvetica,sans-serif;
	color: #778899;
	background-color: transparent;
	float: right;
	margin-right: 2em;
	margin-top: 0.5em;
}

#header .logo{	
	float: left;
	margin-left: 1.5em;
	margin-top: 0.5em;
}

h1{
	font: 120% Verdana,Geneva,Arial,Helvetica,sans-serif;
	color: #778899;
	text-align: center;
	background-color: transparent;
	margin-left: 10em;
	margin-right: 2em;
}

em{
	text-decoration: none;
	font size: larger;
	font-weight: bold;
}

#navigation{
	position: absolute;
	top: 15em;
	left: 1em;
	width: 8em;
	text-align: center;
	font-weight: bold;
	font-size: 1em;
	font-family: Verdana, Arial, Helvetica, sans-serif;		
}

#navigation ul {
	list-style: none;	
	margin: 0;
	padding: 0;	
	padding-top: 4px;
}

#navigation li {
	display: vertical; 
}

#navigation li a:link, #navigation li a:visited {
		display: block;
		padding: 5px 5px 5px 5px; 
		color: #FFFFFF;
		background-color: #082984;
		text-decoration: none;
		border-top: 1px solid #FFFFFF;
		border-left: 1px solid #FFFFFF;
		border-bottom: 1px solid #717171;	
		border-right: 1px solid #717171;
}

#navigation li a:hover {
		color: silver;
		border-top: 1px solid #717171;
		border-left: 1px solid #717171;
		border-bottom: 1px solid #FFFFFF;	
		border-right: 1px solid #FFFFFF;	
}
 
#container{
	margin-top: 0em;
	margin-left: 20em;
	margin-right: 20em;
	position:absolute; 
    width:680px; 
    height:396px; 
    margin:0px auto 0 auto; 
    border:2px solid #aaa; 
}

/* Removing the list bullets and indentation */
#container ul {
    padding:0; 
    margin:0; 
    list-style-type:none; 
}

/* Remove the images and text from sight */
#container a.gallery span {
    position:relative; 
    width:1px; 
    height:1px; 
    top:5px; 
    left:5px; 
    overflow:hidden; 
    background:#fff;
}
/* Adding the thumbnail images */
#container a.gallery, #container a.gallery:visited {
    display:block; 
    color:#000; 
    text-decoration:none; 
    border:1px solid #000; 
    margin:1px 2px 1px 2px; 
    text-align:left; 
    cursor:default;
}

/* set the size of the unordered list to neatly house the thumbnails */
#container ul {
    width:198px; 
    height:386px;
}

#container li {
    float:right;
}

/* move the thumbnails into the correct position */
#container ul {
    margin:5px; 
    float:right;
}

/* change the thumbnail border color */
#container a.gallery:hover {
    border:1px solid #fff; 
}

/* styling the :hover span */
#container a.gallery:hover span {
    position:absolute; 
    width:372px; 
    height:372px; 
    top:10px; 
    left:75px; 
    color:#000; 
    background:#fff;
}

#container a.gallery:hover img {
    border:1px solid #fff; 
    float:left; 
    margin-right:5px;
}

#container a.slideb:hover img, #container a.slidei:hover img {
    float:right;
}

#container {
    background:#fff url(images/back.jpg) 75px 10px no-repeat;
}

#container a.slidea {
    background:url(images/thumbnails/13.jpg); 
    height:60px; 
    width:93px;
}

#container a.slideb {
    background:url(images/thumbnails/15.jpg); 
    height:60px; 
    width:93px;
}

#container a.slidec {
    background:url(images/thumbnails/17.jpg); 
    height:60px; 
    width:93px;
}

#container a.slided {
    background:url(images/thumbnails/19.jpg); 
    height:60px; 
    width:93px;
}

#container a.slidee {
    background:url(images/thumbnails/21.jpg); 
    height:60px; 
    width:93px;
}

#container a.slidef {
    background:url(images/thumbnails/23.jpg); 
    height:60px; 
    width:93px;
}

#container a.slideg{
    background:url(images/thumbnails/25.jpg); 
    height:60px; 
    width:93px;
}

#container a.slideh{
    background:url(images/thumbnails/36.jpg); 
    height:60px; 
    width:93px;
}

#container a.slidei{
    background:url(images/thumbnails/38.jpg); 
    height:60px; 
    width:93px;
}
#container a.slidej{
    background:url(images/thumbnails/42.jpg); 
    height:60px; 
    width:93px;
}
#container a.slidek{
    background:url(images/thumbnails/44.jpg); 
    height:60px; 
    width:93px;
}
#container a.slidel{
    background:url(images/thumbnails/45.jpg); 
    height:60px; 
    width:93px;
}

#footer {
	position: absolute;
	bottom: 0;
	left: 0.5em;
	width: 100%;
	height: 0.5em;
	background-color: #B51032;
	color: #FFFFFF;
	border-top: #778899;
	text-align: right;	
	font-weight: bold;
	font-size: 0.5em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

html > body #footer {
  position: fixed;
}

#footer a:link, #footer a:visited {
	padding: 1em 1em 1em 1em;
	color: #FFFFFF;
	background-color: transparent;
	text-decoration: none;
}

#footer a:hover {
	text-decoration: none;
	color: #778899;
}