/* GLOBAL STYLES */

body {
	background: #000;
	font-family: Helvetica, Arial, sans-serif;
	color: #F0B740;
	font-size: 12px;
	}
	
 p {
	font-family: Helvetica, Arial, sans-serif;
	font-size:12px;
	color: #F0B740;
	line-height: 18px;
	}
	
td {margin-top:0px;}


a:link, a:visited {
	color: #F1B740;
	text-decoration: none;
	}	
a:hover, a:active, a:focus { 
	color: #FFFFFF;
	text-decoration: none;
	}
	
h1 {color:#f0b740; font-size:14px; font-weight:normal;}
h2 {color:#f0b740; text-align:center; font-weight:normal; font-size:14px; line-height:18px;}
h3 {color:#FFFFFF; font-size: 14px; font-weight:normal;}
h4 {color:#FFFFFF; text-align:center; font-weight:normal; font-size:14px; line-height:18px;}

ul {list-style-type: square;}
ul li {margin: 1em 0 1em 0; line-height:18px;}


/* ID STYLES */

/* header bar and top nav*/

#logo {
	background:url(images/case.gif) left no-repeat;
	height: 130px;
	vertical-align:top;
	width:800px;
	}
#linkbox1 {height:70px; width:80px; margin: 15px 0 0 240px; float:left;}
#linkbox1 img {border-style:none;}
#linkbox {height:70px; width:80px; margin: 15px 0 0 12px; float:left;}
#linkbox img {border-style:none;}

/* swoosh*/

#swoosh { background:url(images/swooshpurple.gif) top left no-repeat;
	height: 37px;
	}

#swooshgrey { background:url(images/swooshgrey.gif) top left no-repeat;
	height: 37px;
	}
	
/* left nav */

#nav {
	width: 220px;
	text-align: left;
	background: #290f26;
	padding: 20px 0 30px 0;
}
#nav ul {
	list-style:none;
	margin-top: 8px;
	margin-bottom: 5px;
}
#nav ul li {
	line-height:16px;
	margin: 0 0 0 -2.5em;
}
#nav img {
	padding-top:10px;
}


/* main section */
#main {background: #290f26; padding:0px 0px 30px 20px;}
#main img.title {margin:40px 0 -30px 90px;}
#main img.title2 {margin:40px 0 -30px 50px;}
#main img.title3 {margin:40px 0 -30px 35px;}
#main img.title4 {margin:40px 0 -30px 20px;}

#mainwelcome {background: #290f26; padding:45px 0px 30px 20px;}
#mainwelcome img.title {margin:40px 0 -30px 60px;}

#maingrey {background: #191817; padding:0px 0px 30px 20px;}
#maingrey img.title {margin:40px 0 -30px 90px;}

#maingreywide {background: #191817; padding:0px 0px 30px 0px;}
#maingreywide img.title {
	margin-top: 40px;
	margin-bottom: -30px;
}

/* content divs */
#welcome {
	width: 520px;
	background:url(images/titles/welcometothefamily.gif) top left no-repeat #000;
	padding-top: 50px;
	}

#info {
	width: 520px;
	background:url(images/boxtoppurple.gif) top left no-repeat #000;
	padding-top: 16px;
	margin-top: 30px;
	}

#leftquotes {
	margin: 30px 25px 50px 25px;
	font-style: italic;
	line-height: 20px;
}

#topquote {float:right; height: 55px; width: 160px; margin: 0 20px -30px 0;}
#topquote2 {float:right; height: 55px; width: 170px; margin: 0 20px -30px 0;}
#topquote3 {float:right; height: 55px; width: 180px; margin: 0 20px -30px 0;}
#topquote4 {float:right; height: 55px; width: 190px; margin: 0 20px -30px 0;}
#topquote5 {float:right; height: 55px; width: 200px; margin: 0 20px -30px 0;}

#infogrey {
	width: 520px;
	background:url(images/boxtopgrey.gif) top left no-repeat #000;
	padding-top: 10px;
	margin-top: 30px;
	}
	
#leftcol {
	width: 220px;
	text-align: left;
	background: #191817;
	padding-top: 20px;}
	
#centralgrey {
	width:520px;
	background:url(images/boxtopgrey.gif) top left no-repeat #000;
	margin:30px 0 0 140px;
	padding-top:10px;
	}

#text {padding: 0 25px 0 25px;}
#textCentre {padding: 0 25px 0 25px; text-align:center;}

#support {height: 75px; padding: 0 25px 0 25px}
#liability {
	height: 50px;
	padding: 0 25px 0 25px;
	margin-top: 10px;
}

/* text formatting section */
#grey {background:#191817;}
	
/* gallery section */
#gallery {padding: 0 0 0 20px;}
#gallery img {border: none; margin: 10px 10px 10px 0}
#gallery img.tall {border: none; margin: 10px 10px 10px 20px}

/* copyright notice */
#copy {text-align:center; font-size:11px; color:#666666; padding-top:10px;}

/* flash images */
#flash {float:right; padding:10px 0 10px 25px;}
#flashleft {float:left; padding:10px 25px 10px 0;}

/* lightbox section */

#lightbox {position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/lightbox/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{font: 10px Helvetica, Arial, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

/* CLASS STYLES */

.quote {color:#f0b740; font-size:12px; font-style:italic; line-height:20px;}
.quotew {color:#ffffff; font-size:12px; font-style:italic; line-height:20px;}
.quoteref {color:#FFFFFF; font-size:11px; line-height: 16px; font-style: normal;}
.quoteWhite {color:#ffffff; font-size:12px; font-style:italic; line-height:18px; text-align:center;}
.quoterefYellow {color:#F0b740;	font-size:11px; line-height: 16px; font-style: normal;}
.white {color:#FFFFFF;}
.red {color:#CC0000;}
.smallyellow {font-size:11px;}
.image10 {margin:10px 10px 10px 10px;}
.image15 {margin:15px 15px 15px 15px;}
.image20 {margin:20px 20px 20px 20px;}

.left {float:left; padding: 10px 25px 10px 0;}
.left10 {float:left; padding: 10px 35px 10px 0;}
.leftnopad {float:left; padding: 10px 0 10px 0;}
.leftnopadtop {float:left; padding:0 25px 10px 0;}
.leftpadtop10 {float:left; padding:10px 25px 20px 0px;}
.leftpadtop25 {float:left; padding:25px 25px 20px 0px;}
.leftpadtop40 {float:left; padding:40px 25px 20px 0px;}
.flushleft {float:left; margin-left: -25px; padding:10px 25px 10px 0;}
.flushleftnopad {float:left; margin-left: -25px; padding: 10px 0 10px 0;}
.flushleftpadtop20 {float:left; margin-left: -25px; padding:20px 25px 25px 0;}
.flushleftnopadtop {float:left; margin-left:-25px; padding: 0 25px 10px 0;}

.right {float:right; padding: 10px 0 10px 25px;}
.rightpad20 {padding-right: 20px;}
.rightpadtop25 {float:right; padding:25px 0 20px 25px;}
.rightnopadtop {float:right; padding:0 0 10px 25px;}
.flushright {float:right; margin-right: -25px; padding: 10px 0 10px 25px;}
.flushrightnopad {float:right; margin-right: -25px;}

.family {float:left; padding-right: 25px; padding-bottom: 40px;}
.familyjem {float:left; padding-right: 25px; padding-bottom: 80px;}
.last {margin: 0 0 30px 20px;}
.fools {margin-left: 10px;}
.stars {text-align:center;}
.centre {text-align:center; padding-top:10px;}
.padtop15 {padding-top:15px;}
.supright {float:right;}
.supleft {float:left; padding-right: 25px;}
