/* Normalizing styles
-------------------------------------------------------------------------------------------- */

/* Normalized margin, padding */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td {margin: 0; padding:0;}

/* Normalizes font-size for headers */
h1, h2, h3, h4, h5, h6 {font-size: 100%;}

/* Removes list-style from lists */
ol, ul {list-style: none;}

/* Normalizes font-style and font-weight to normal */
address, caption, cite, code, dfn, em, strong, th, var {font-style: normal; font-weight: normal;}

/* Removes borders and spacing from tables */
table {border-collapse: collapse; border-spacing: 0;}

/* Removes border from fieldset and img */
fieldset, img {border: 0;}

/* Left-aligns text in caption and th */
caption, th { text-align: left;}

/* Removes quotation marks from q */
q:before, q:after {content:' ';}

a:link, a:visited {text-decoration: none;}


/* Layout styles
---------------------------------------------------------------- */

body {
	background: #aecde1;
}

div#c {
	position: relative;
	min-width: 780px;
	max-width: 1000px;
	border: solid #aecde1;
	border-width: 0 20px;
	margin: 0 auto;
	border-left: 3px double #1c628f;
	border-right: 3px double #1c628f;
}

/* Branding tyles
---------------------------------------------------------------- */

div#branding {
	background: #2583be;
	height: 171px;
	width: 100%;
	background: url(img/branding_bg.jpg);
}

h1 {
	width: 200px;
	height: 100%;
	margin: 0 8px;
	margin-left: 11px;
	text-indent: -9999px;
	background-image: url(img/logo_small2.png);
	background-repeat: no-repeat;
	background-position: bottom;
}

h2#motto {
	display: block;
	float: right;
	margin: -51px 0 0 0;
	border: none;
	padding: 0 .2em 0 0;
	font: 1.1em Arial, Helvetica, sans-serif;
	color: #13425f;
}

h1 a#h1 {
	display: block;
	height: 175px;
	width: 180px;
	margin-left: 10px;
}

span#home a {
	text-indent: 0;
	display: block;
	width: 49px;
	height: 20px;
	font: bold 12pt Arial, Helvetica, sans-serif;
	color: #000;
	position: relative;
	top: -28px;
	padding-left: 3px;
	padding-top: 8px;
	background: #4b9fcf;
}

/* Navigation styles
---------------------------------------------------------------- */

#nav {
	position: absolute;
	top: 0;
	width: 100%;
}

#nav a {
    display: block;
    width: 119px;
	background: #5ca2cf;
	padding: 6px 5px;
}

#nav li {
	position: relative;
    float: right;
}

#nav li ul {
    position: absolute;
    left: -999em;
}

#nav li:hover ul, #nav li.sfhover ul {
    left: 0;
}

#nav > li > a {
	border-left: 1px solid black;
	border-bottom: 1px solid black;
}

#nav ul > li > a {
	border-left: 1px solid black;
	border-bottom: 1px solid black;
	border-right: 1px solid black;
}


ul#links, ul#stafflinks, ul#studs {
	font: 1em Arial, Helvetica, sans-serif;
	width: 90%;
	margin: 1em 2em;
	padding: .5em;
	border: 1px dashed #c8e0ef;
}


ul#links {height: 7.1em;}
ul#studs {height: 4.2em;}
ul#stafflinks {height: 5.7em;}
ul#links.long {height: 8.4em;}
ul#links.longer {height: 9.8em;}
ul#links.longest {height: 16.8em;}

ul#links.longer ul#col4 li, ul#links.longer ul#col5 li, ul#links.longer ul#col6  li {border-left: 5px solid #c8e0ef;}
ul#links.longer ul#col4 li.here {border-left: 5px solid #93c2df;}

ul#links ul li, ul#stafflinks ul li, ul#studs ul li {
	margin-bottom: .3em;
	border-left: 5px solid #93c2df;
	padding-left: 10px;
}

ul#links a, ul#stafflinks a, ul#studs a {
	color: #092130;
	border-bottom: 1px dotted #93c2df;
}

ul#links a:hover, ul#stafflinks a:hover, ul#studs a:hover {
	border-bottom: 1px solid #13425f;
}

div#content ul#links li.head, div#content ul#stafflinks li.head, div#content ul#studs li.head {
	font-weight: bold;
	margin-bottom: .25em;
	border-left: none;
	margin-left: -.5em;
}
div#content ul#links li.none, div#content ul#stafflinks li.none, div#content ul#studs li.none {border-left: none;}

ul#col1, ul#col2, ul#col3, ul#col4, ul#col5, ul#col6 {width: 16.66%;}
ul#studs ul#col1 {width: 30%;}
ul#studs ul#col2 {width: 35%;}
ul#studs ul#col3 {width: 35%;}

ul#col1, ul#col2, ul#col3, ul#col4, ul#col5 {float: left;}
ul#col6 {float: right;}

ul#studs ul#col1.wide {width: 90%;}
ul#links ul#col4.wide {width: 33.32%;}
ul#links ul#col5.wide {width: 33.32%;}
ul#links ul#col6.wide {width: 16.7%;}


/* Main content styles
---------------------------------------------------------------- */

div#content {
	background: #fff;
	min-height: 400px;
	padding-bottom: 2em;
}

div#news {
	float: right;
	width: 25%;
	margin-top: -7.19em;
	border-left: 3px double #93c2df;
	border-bottom: 3px double #93c2df;
	margin-left: 1em;
}

h2#welcome {
	width: 72%;
	padding: 2em 0 .3em 1.5em;
	margin: 0 0 2em 0;
}

div#news h3 {
	border: none;
	margin: 1.46em 0 1.7em 0;
	padding: 0 0 .3em 1em;
	border-bottom: 2px dotted #93c2df;
}

div#news p {
	font: .8em Arial, Helvetica, sans-serif;
	line-height: 1.3em;
	text-indent: .7em;
	margin: 0;
	padding: 1em .5em 1em .7em;
	border-bottom: 1px dashed #5ca2cf;
}

div#news p.last {border-bottom: none;}

div#news span.strong {font: bold 1em Georgia, "Times New Roman", Times, serif; color: #13425f; font-weight: bold; font-size: 1em; display: block; margin-left: -.7em; margin-bottom: .5em;}
div#news span.line {display: block; margin-top: .5em;}

body div#content img.drop {margin-top: 1em;}

body div#content div.narrower {width: 600px;}

#content img.new {
	position: static;
	margin: 0 0 2em 1em;
	height: 180px;
	width: 70%;
	z-index: 0;
}

#content p.new {
	margin: 0 0 2em 0;
	position: absolute;
	top: 288px;
	text-align: center;
	font: bold 14px Arial, Helvetica, sans-serif;
	line-height: 1.4em;
	width: 57%;
	height: 172px;
	padding: 4.2% 75px 0 8.5%;
	color: #13425f;
	z-index: 1;
}

#content p.soon {
	margin: 1em auto;
	text-align: center;
	width: 500px;
	overflow: auto;
	background-color: #eaf3f9;
	border: 3px dashed #c8e0ef;
	padding-bottom: 1em;
}

p.soon span {display: block;}
p.soon span strong {font-weight: bold; margin-right: .2em;}

#content p.negative {margin-top:-4em;}
#content span.negative {margin-top:-4em;}

/*
#content p.right, body #content p.right:hover {float: right; width: 39%; margin-right: 2em; margin-left: -2em; border-color: #93c2df;}
#content p.left, body #content p.left:hover {float: left; width: 39%; margin-left: 2em; margin-right: -2em; border-color: #13425f;} 

body #content p.right:hover, body #content p.left:hover {margin: 2em; padding: 1em; border-width: 8px;}

*/

span.red {
	display: inline;
	font-weight: bold;
	color: #CC0000;
}

/* List styles
---------------------------------------------------------------- */

ul.list li > ul.list {
	margin: 0;
}

ul.list li {
	font: 1em Arial, Helvetica, sans-serif;
	margin: .5em 5em;
	list-style: url(img/list.png) outside;
}

dl.prices {
	font: 1em Arial, Helvetica, sans-serif;
	margin: .5em 3em;
	margin-top: 2em;
}

dl.prices dt {
	font-weight: bold;
	border-left: 5px solid #c8e0ef;
	padding-left: 10px;
	margin-top: .6em;
	margin-bottom: .2em;
}

dl.prices dd {
	margin-left: 2em;
}

dl.prices span, ul.list span {
	font-size: .9em;
	font-weight: normal;
	color: #13425f;
}

/* Image styles
---------------------------------------------------------------- */

#content > a img.right, #content p > a img.right {
	float: right;
	margin: 1em;
	margin-right: 2em;
}

#content > a img.left, #content p > a img.left {
	float: left;
	margin: 1em;
	margin-left: 2em;
}

#content > a img.tiny, #content p > a img.tiny {
	width: 13%;
	margin-top: 0;
}

#content > a img.smaller, #content p > a img.smaller {
	width: 18%;
	margin-top: 0;
}

#content > a img.small, #content p > a img.small {
	width: 25%;
	margin-top: 0;
}

#content > a img, #content p > a img {
	width: 30%;
	border: 1px solid #000;
	margin-top: 0;
}

#content p > a img.mid {
	margin-top: 1em;
}

#content > a img.med, #content p > a img.med {
	width: 35.8%;
	margin-top: 0;
}

#content > a img.large, #content p > a img.large {
	width: 42%;
}

/* Gallery styles
---------------------------------------------------------------- */

iframe#gallery {
	float: left;
	margin: -1.3em 0 0 0;
	width: 99.99%;
	border: none;
	height: 650px;
}

p#iframe {height: 600px;}

div.pics {
	margin: .5em auto;
	text-align: center;
	width: 550px;
	height: 255px;
	overflow: auto;
	background-color: #eaf3f9;
	border: 5px dashed #c8e0ef;
}

div.pics h4 {
	font: bold 1.1em Arial, Helvetica, sans-serif;
	margin: .4em 0 .1em 0;
}

div.pics img {
	border: 1px solid #000;
	display: inline;
	height: 210px;
	margin: .2em;
}

div.wide {width: 740px;}
div.tall {height: 475px;}

div.picsns {
	margin: 1em auto;
	text-align: center;
	width: 740px;
	overflow: auto;
	background-color: #eaf3f9;
	border: 5px dashed #c8e0ef;
	padding-bottom: 1em;
}

div.picsns h4 {
	font: bold 1.1em Arial, Helvetica, sans-serif;
	margin: 1em 0 .5em 0;
}

div.picsns img {
	border: 1px solid #000;
	display: inline;
	height: 200px;
	margin: .2em;
}

div.stretch {
	width: 83%;
	min-width: 740px;
	margin-top: 2em;
}

div.narrow {
	width: 600px;
	margin-top: 2em;
}

div.narrower {
	width: 75%;
}

div#fac {
	width: 90%;
	height: 220px;
	padding-top: 4px;
}

div#hoofpics {
	width: 65%;
	height: 220px;
	padding-top: 4px;
}

img.head {
	width: 30%;
	border: 1px solid #000;
	float: right;
	margin: 1em;
	margin-right: 2em;
}

img.small {width: 20%;}
img.left {float: left; margin-left: 2em;}

div#nickels div.pics {
	margin-top: 3em;
}

div#nico span.top, div#nikita span.top, div#david span.top {margin-top: 3em;}

div#nadine img.left, div#brownie img.left, div#cleo img.left {
	width: 30%;
	float: left;
	border: 1px solid #000;
	margin: 1em;
	margin-left: 2em;
}
div#nadine a img.smaller, div#brownie img.smaller, div#cleo img.smaller {
	width: 18%;
	margin-top: 0;
}
div#brownie img.small {width: 25%;}
div#nadine div.pics {margin-top: 2em;}
div#nadine span.top, div#cleo span.top {margin-top: 3em;}
div#abby span.top  {margin-top: 10em;}

/* Contact styles
---------------------------------------------------------------- */

div.vcard {
	font: 1em Arial, Helvetica, sans-serif;
	margin: 2em 0 -2em 2em;
	padding: .2em 1em;
	height: 330px;
	width: 350px;
	background: url(img/vcard_bg.gif) no-repeat;
}

div.holly div.vcard, div.david div.vcard {
	margin: -.1em 0 -5em 11em;
	padding: 1.2em 1em;
	height: 200px;
	width: 400px;
	background: url(img/vcard_bg_small.gif) no-repeat;
}

div.david div.vcard {
	margin-top: -.5em;
	padding-top: 3em;
	padding-left: 2em;
}

div.holly span.value, div.david span.value {
	left: 5.5em;
}

div.vcard div, div.vcard span {
	margin: .5em 0;
}

div.org {
	font: bold 1.1em Arial, Helvetica, sans-serif;
}

span.postal-code {
	display: block;
}

div.tel  {
	padding-top: 2em;
}

div.tel span {
	margin:  .1em 0;
}

span.type {
	font-weight: bold;
}

span.value {
	display: block;
	margin: 0;
	position: relative;
	top: -1.3em;
	left: 4em;
}

div.vcard > span.value  {
	top: -1.7em;
}

span.value a{
	color: #1c628f;
}

span.value a:hover {
	color: #5ca2cf;
	border-bottom: 1px dotted #5ca2cf;
}

iframe {
	float: right;
	height: 330px;
	width: 45%;
	margin: .5em 2em 0 0;
	border: 1px solid #000;
}

/* Footer styles
---------------------------------------------------------------- */

div#footer {
	background: #2583be;
	height: 25px;
}

#footer > p {
	position: relative;
	left: 2em;
	top: 5px;
}

#footer p + p {
	position: relative;
	top: -1em;
	margin-right: 4em;
	text-align: right;
}

#footer {
	font: .8em Arial, Helvetica, sans-serif;
	color: #13425f;
}

#footer a {
	color: #5ca2cf;
}

#footer a:hover {
	color: #93c2df;
	border-bottom: 1px dotted #93c2df;
}

/* Typography styles
---------------------------------------------------------------- */

#content p {
	padding: 1em 2em;
	font: 1em Arial, Helvetica, sans-serif;
	text-indent: 1.5em;
}

#content > span, div#david > span, div#holly > span {
	display: block;
	padding: 1em 2em;
	font: 1em Arial, Helvetica, sans-serif;
}

h2 {
	padding: 2em 0 .5em 1em;
	margin: 0 1.5em;
	margin-bottom: 1em;
	font: bold 1.3em Arial, Helvetica, sans-serif;
	border-bottom: 2px dotted #93c2df;
}

h2 + h4 {
	font: bold .9em Arial, Helvetica, sans-serif;
	width: 20%;
	margin: -1em 0 0 2.2em;
	padding: 0 0 .2em 1.5em;
	border-bottom: 1px dotted #93c2df;
}

h2 + h4.wide {width: 40%;}

h2 + p#tips {text-indent: 0;}

h2.bold {font-size: 1.5em; border-top: 2px dotted #93c2df; padding-top: .5em; background-color: #eaf3f9; margin: 1em 0;}

h3 {
	font: bold 1.5em Georgia, "Times New Roman", Times, serif;
	padding: .5em 0 .5em .8em;
	margin: .5em 1.5em .5em 1.3em;
	border-top: 1px dashed #93c2df;
	border-bottom: 1px dashed #93c2df;
}

h3 + h4 {
	font: bold .9em Arial, Helvetica, sans-serif;
	width: 40%;
	margin: -.5em 0 0 2.2em;
	padding: 0 0 .2em 1.5em;
	border-bottom: 1px dashed #93c2df;
}

h4.dld {
	width: 49%;
}

#content span.sn, span.snlg {
	font: bold 1em Georgia, "Times New Roman", Times, serif;
	color: #13425f;
}

span.snlg {font-size: 1.3em;}

#content span.poem {
	padding: .2em 0 .2em 3em;
}

span.block {display: block; font: 1em Arial, Helvetica, sans-serif;}

span.divider {
	margin: -.8em 2em 0 2em;
	margin-bottom: 1em;
	border-bottom: 2px dotted #93c2df;
}

div.picsns span.divider {
	margin: 0 auto 2em auto;
	width: 90%;
	padding-bottom: 1.9em;
	border-bottom: 1px dashed #5ca2cf;
}

span.spacer {height: 100%;}

#content span.top {
	position: relative;
	top: -35px;
	left: 88%;
	font: .9em Arial, Helvetica, sans-serif;
	display: block;
	padding: .3em;
	width: 71px;
	border: 1px dashed #93c2df;
}

span.tall {margin-top: 7em; margin-bottom: -2em;}

span.top a {
	color: #000;
}

p + span.top {
	margin-top: 10em;
}

#nav > li > a {
	font: bold .95em Arial, Helvetica, sans-serif;
	color: #000;
}

#nav > li > a:hover {
	background: #1c628f;
	color: #fff;
}

#nav li a:hover {
    position:static;
}

#nav ul > li > a {
	font: .75em Arial, Helvetica, sans-serif;
	background: #1f6fa2;
	color: #c8e0ef;
}

#nav ul > li > a:hover {
	background: #13425f;
	color: #fff;
}

#nav li#last a {
	border-right: none;
}

span.sold {text-decoration: line-through; color: #CC0000;}
h3 span.sold {text-decoration: none; font-size: 200%; float: right; margin-top: -.25em;}
span.year {float: right; margin-top: -.2em;}

span.ul {text-decoration: underline;}

#content > p.nextclass {
	font-size: 1.2em;
	border: 2px dotted #93c2df;
	width: 75%;
	margin: 1em auto;	
	padding: .5em auto;
	text-align: center;
	text-indent: 0;
	background-color: #eaf3f9;
}
#content p.nextclass > span.sn {
	padding-right: .2em;
	margin: 0;
	text-decoration: underline;
}

ul#donors {
	font: 1em Verdana, Arial, Helvetica, sans-serif;
	margin: 2em 0;
}

ul#donors li {margin: .3em 0;}

ul#donors div.fleft {float: left; margin-left: 6em; margin-top: -.3em;}
ul#donors div.fright {float: right; margin-right: 2em;}
ul#donors div.fclear {clear: both; padding: 1em 0;}

/* Lightbox styles
-----------------------------*/

#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/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, 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; }