@charset "UTF-8";
/* CSS Document */


/*---------------------------------------------------------------------
Basic Style Sheet (for version 4 browsers)

version:	1.0
author: 	Tina Spear
email:		tina@avco.com

----------------------------------------------------------------------*/












/*------------------------------------------------------------------------

LAYOUT

--------------------------------------------------------------------------*/



body {
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}

.oneColFixCtrHdr {margin:0; padding:0;}


.oneColFixCtrHdr #container {
	width: 950px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	padding-left: 60px;
	text-align: left; /* this overrides the text-align: center on the body element. */
	
}
.oneColFixCtrHdr #header {
	 
	padding: 0 10px 0 0px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
}
.oneColFixCtrHdr #header {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 15px 0 5px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
.oneColFixCtrHdr #mainContent {
	padding: 0 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	
	background-color:#FFFFFF
}

.slideshow {margin: 63px 0 0 0}


#mainContent {float: left;  width: 950px}
#mainContent p {margin: 10px 0}
#header {float: left; margin: 0px 0 30px 0}

#mainText {float: left; padding-top: 40px; width: 650px}
#mainText p {margin: 10px 0}
#mainText p.footer {margin: 30px 0; font-size: 11px}
#mainText h1 {font-weight: normal; font-size: 14px;  margin-bottom: 25px;}

#mainContentUnrealised {float: left; width: 900px}


#mainWriting {float: left;  width: 625px; margin-top:20px}
#mainWriting p {margin: 0 0 18px 0}
#mainWriting h1 {font-size: 14px; padding-bottom:0px; line-height: 18px; margin: 0 0 3px 0}
#mainWriting h2 {font-size: 12px; margin: 0px 0 35px 0; line-height:18px}
#mainWriting h3 {font-size: 12px; margin: 0px 0 12px 0; line-height:18px}
#mainWriting .back { margin-bottom: 25px }
#mainWriting a {text-decoration: underline }
p.writingTitle {color:#7a7879}

/*------------------------------------------------------------------------

TYPOGRAPHY

--------------------------------------------------------------------------*/

body { font: 12px/18px "Lucida Grande", Geneva, Arial, Verdana, sans-serif; background-color:#fff; color:#333; }

a { color: #333; text-decoration:none }
a:hover {text-decoration:underline; color:#660000}
strong, b { font-weight:bold; }
a img {border: none}


#mainContent p { margin-bottom: 18px; }
#mainContent h1 { font-weight: bold; font-size: 24px; line-height: 36px; margin-bottom: 18px; }
#mainContent h2 { font-weight: bold; font-size: 16px; line-height: 18px; margin-bottom: 18px; }
#mainContent h3 { font-weight: bold; font-size: 1em; line-height: 18px; }
#mainContent h4 { font-weight: bold; font-size: 10px; line-height: 18px; }
#mainContent p.intro { font-weight: bold; }
#mainContent .more { text-align: right; }

#mainImage {padding-bottom: 12px}



#main a.pdf { background: url(http://images.apple.com/global/elements/icons/globaliconpdf12x12.gif) 0 0.4em no-repeat; display: block; padding-left: 20px; }
#main a.html { background: url(http://images.apple.com/global/elements/icons/globaliconhtml12x12.gif) 0 0.4em no-repeat; display: block; padding-left: 20px; }
#main a.qt { background: url(http://images.apple.com/global/elements/icons/globaliconqt12x12.gif) 0 0.4em no-repeat; display: block; padding-left: 20px; }
#main a.ical { background: url(http://images.apple.com/global/elements/icons/globaliconical12x12.gif) 0 0.4em no-repeat; display: block; padding-left: 20px; }
#main a.dl { background: url(http://images.apple.com/global/elements/icons/globalicondl11x10.gif) 0 0.4em no-repeat; display: block; padding-left: 20px; }
#main a.dmg { background: url(http://images.apple.com/global/elements/icons/globalicondmg12x12.gif) 0 0.4em no-repeat; display: block; padding-left: 20px; }
#main a.zip { background: url(http://images.apple.com/global/elements/icons/globaliconzip12x12.gif) 0 0.4em no-repeat; display: block; padding-left: 20px; }
#main a.keynote { background: url(http://images.apple.com/global/elements/icons/globaliconkeynote12x12.gif) 0 0.4em no-repeat; display: block; padding-left: 20px; }
#main a.audio { background: url(http://images.apple.com/global/elements/icons/globaliconaudio12x12.gif) 0 0.4em no-repeat; display: block; padding-left: 20px; }

#main .sidebar { font-size: 10px; line-height: 18px; color:#686868; }
#main .callout { font-size: 11px; line-height: 18px; margin-bottom: 18px; }
#main .last { margin-bottom: 0; }



#header ul {margin: 3px 0 0 0; padding:0; list-style:none; width: 830px; float: left; }
#header ul li {float:left;}

#header ul a {  display: block; padding:0 1em; line-height:1.5em; background: url(../img/divider.gif) no-repeat left center; text-decoration: none; color:#7a7879; }

#header ul .first a { background: none; padding-left: 0}
#header ul .selected a {color: #000}

#header ul a:hover { color:#660000}
#header h1 {font-weight: bold; font-size: 14px;  margin-bottom: 10px; }
#header h1 a {   text-decoration: none;  }
#header h1 a:hover {   color:#333  }

#thumbs ul{ list-style:none; display:inline }
#thumbs li { display:block}





#next {font-size: 11px; margin-top: 15px }
#next ul {margin:  0px 0 5px 0; padding:0; list-style:none; width: 830px; float: left;  }
#next ul li {float:left;}
#next ul a {  display: block; padding:0 1em; line-height:1.5em; background: url(../img/divider.gif) no-repeat left center; text-decoration: none; color:#7a7879; }
#next ul .first a { background: none; padding-left: 0}
#next ul a:hover { color:#660000}

#nextList {font-size: 11px; margin-top: 15px }
#nextList ul {margin:  0px 0 31px 0; padding:0; list-style:none; width: 830px; float: left;  }
#nextList ul li {float:left;}
#nextList ul a {  display: block; padding:0 1em; line-height:1.5em; background: url(../img/divider.gif) no-repeat left center; text-decoration: none; color:#7a7879; }
#nextList ul .first a { background: none; padding-left: 0}
#nextList ul a:hover { color:#660000}


#next2 ul {margin:  0px 0 0px 0; padding:0; list-style:none; width: 830px; float: left;  }
#next2 ul li {float:left;}
#next2 ul a {  display: block; padding:0 1em; line-height:1.5em; background: url(../img/divider.gif) no-repeat left center; text-decoration: none; color:#7a7879; }
#next2 ul .first a { background: none; padding-left: 0}
#next2 ul a:hover { color:#660000}
#next2 {margin-bottom: 20px}


#nextImage ul {margin:  0px 0 30px 0; padding:0; list-style:none; width: 830px; float: left; color:#7a7879  }
#nextImage ul li {float:left;}
#nextImage ul a {  display: block; padding:0 7px; line-height:1.5em; text-decoration: none; color:#7a7879; }
#nextImage ul .first a { background: none; padding-left: 0}
#nextImage ul li.number { padding-right: 15px}
#nextImage ul a:hover { color:#660000}

#picCaption { margin: 10px 0 0 0; font-size: 12px; color:#000000}

.thumbnail { float: left;  margin: 0 40px 55px 0; padding: 0; font-size: 11px; line-height: 14px; color:#333; text-decoration:none }
.thumbnail img { margin-bottom: 4px; border: 0px; text-decoration: none; display: block}


.thumbnail img a:hover {border:0; text-decoration:none}

#gallery .thumbnail {margin-bottom:55px}

#imageCaption { margin: 0px 0 15px 0; font-weight: normal; color:#000000; clear:both}
 
#imageText {float: left; margin-right: 5px;  color:#7a7879; font-size: 11px }
#currentImageID  {float: left;  color:#7a7879; font-size: 11px }
#ofText {float: left; margin: 0 5px;  color:#7a7879; font-size: 11px }
#totalImagesID {float: left; margin: 0 7px 0 0;  color:#7a7879; font-size: 11px }
#previousID {float: left; width: 35px;  color:#7a7879; font-size: 11px; margin-left: 5px; }
#previousID a { color:#7a7879; font-size: 11px }
#previousID a:hover {  color:#660000; text-decoration:none}

#nextID {float: left;   color:#7a7879; font-size: 11px; margin-left: 5px; }
#nextID a { color:#7a7879; font-size: 11px }
#nextID a:hover {  color:#660000; text-decoration:none}

#nextLink {float: left; margin-left: 5px; text-decoration:none;  color:#7a7879; font-size: 11px }
#nextLink a { text-decoration:none;  color:#7a7879; font-size: 11px } 
#nextLink a:hover { color:#660000}

.clearboth { clear: both; }

#writing ul li {list-style: none}

 dl.event
{
margin: 0 0;
padding: 0; border-bottom:0 ;  top:0;

}

.event dt
{
position: relative;
left: 0;
top: 1.4em;
width: 50px;

}

.event dd
{

margin: 0px 0 0 5em;
padding: 0 0 .5em 0;
width: 520px;
}

.event dd a {text-decoration: underline }


.notes {font-size: 11px; line-height: 14px }

dl.notes
{margin: 0 0 20px 0 ; padding: 0; font-size: 11px; line-height: 14px}

.notes dt{
position: relative;
left: 0;
top: 1.3em;
width: 30px; margin: 0; padding: 0

}

.notes dd
{

margin: 0px 0 0 2em;
padding: 0 0 0
 0;
width: 450px;
}

#weblink {clear: both; padding-top: 5px; width: 600px}
#weblink a {text-decoration:underline; color:#7a7879}




/* _______________________________ BASESTRIP ________________________________ */

@media screen{
	body > div#footerstrip { position: fixed; padding-left:0 }
}

/* Footer elements */

#footer {
width: 1000px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFFFFF;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	color: #525252;
	height: 22px;
	line-height: 18px;
	padding-left: 0;
}





@media screen {

	#footerstrip {
		background: #fff;
		width: 100%;
		height: 22px;
		position: absolute;
		bottom: 0px;
		left: 0px;
		z-index: 900;
	padding-left:0;
	}
}

ul#baselist {
	list-style: none;
	padding: 1px 0 0 0px;
	margin: 0 auto;
	
}


ul#baselist li {
	display: block;
	float: left;
	margin-right: 5px;
	padding: 3px 19px 0 0 ;
		padding-left: 60px;
	font:  11px "Lucida Grande", Arial, Sans-Serif;
	color: #999999;
	font-weight: 100 ;
}


a.basestrip, a.basestrip:active, a.basestrip:visited {
	font-family: Lucida Grande, Helvetica, Arial, sans;
	font-size: 11px;
	text-decoration: none;
	color: #999;
}

a.basestrip:hover {
	font-family: Lucida Grande, Helvetica, Arial, sans;
	font-size: 11px;
	text-decoration: none;
	color: #000000;
}






ul#baselistright {
	list-style: none;
	padding: 1px 0 0 0px;
	margin: 0 auto;
	text-align: right ;
}


ul#baselistright li {
	display: block;
	float: right;
	margin-right: 5px;
	padding: 3px 19px 0 0 ;
	font:  11px "Lucida Grande", Arial, Sans-Serif;
	color: #999999;
	font-weight: 100 ;
}


#back { margin: 0 ; padding: 0; float:left }

.left-element {
   float: left;
padding: 2px 0 0 20px;

   }

.right-element {
   float: right;
padding: 2px 20px 0 0 ;
   text-align: right; /* depends on element width */

   }