/* Table of Contents

	- Global Reset
	- Basic Structures
	- Header & Footer
	- Content Structures
	- Navigation Rules
	- Flash Rules
	- Common Rules
	- Form Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/


/* Global Reset

	This is an easy way to make sure that all browsers will default all element rules to the same settings.
	
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/


body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin : 0;
	padding : 0;
	border : none;
	font-size : inherit;
	line-height : inherit;
}
fieldset,img { border : 0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style : normal; font-weight : normal; }
ol,ul { list-style : none; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight : normal; }
q:before,q:after { content:''; }
abbr,acronym { border : 0; }

/* Basic Structural Rules

	These ids and classes create the most basic building blocks for the website.
	(html) sets the default font type, color and size for the entire site.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

html {
	width : 100%;
	min-width : 1024px;
	color : #6c5c2b;
	font-size : 62.5%;
	font-family : "Times New Roman", Times, serif;
	text-align : center;
	background : url(../images/template/pageBackground.jpg) top center repeat;
}

body {
	width : 100%;
	min-width : 1024px;
	background : url(../images/template/pageBodyBackground.png) top center repeat-x;
}

/* Header & Footer */
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

#header {
	margin : 0 auto 0 auto;
	padding : 0;
	width : 1024px;
	font-size : 1.3em;
	text-align : left;
	display : block;
	clear : both;
}

#header div {
	margin : 0 auto 0 auto;
	padding : 0;
	height : 121px;
	width : 1024px;
	background : url(../images/template/headerBackgroundSmall.jpg) top center no-repeat;
	float : none;
}

#header p, #header ul {
	margin : 0 auto 0 auto;
	padding : 0;
	height : 121px;
	text-align : center;
	float : left;
}

#header p { width : 350px; }
#header ul.left { width : 337px; }
#header ul.right { width : 337px; }

#header li { padding : 0; width : auto; display : block; float : left; clear : none; }
#header a { padding : 0; width : 127px; text-indent : -5000px; overflow : hidden; display : block; float : left; clear : none; }

/* Graphic Header Links */
#header a.link1 { height : 58px; width : 207px; background : url(../images/template/headerLinks.gif) 0px 0px; }
#header a.link2 { margin : 0 130px 0 0; height : 58px; width : 207px; background : url(../images/template/headerLinks.gif) 0px 63px; }
#header a.logo { height : 121px; width : 350px; background : url(../images/template/headerLinks.gif) 687px 0px; }
#header a.link3 { margin : 0 0 0 160px; height : 121px; width : 50px; background : url(../images/template/headerLinks.gif) 177px 0px; }
#header a.link4 { height : 32px; background : url(../images/template/headerLinks.gif) 127px 0px; }
#header a.link5 { height : 14px; background : url(../images/template/headerLinks.gif) 127px 89px; }
#header a.link6 { height : 14px; background : url(../images/template/headerLinks.gif) 127px 75px; }
#header a.link7 { height : 14px; background : url(../images/template/headerLinks.gif) 127px 61px; }
#header a.link8 { height : 14px; background : url(../images/template/headerLinks.gif) 127px 47px; }

/* Graphic Header Hover States */
#header a.link1:hover { background : url(../images/template/headerLinksHover.gif) 0px 0px; }
#header a.link2:hover { background : url(../images/template/headerLinksHover.gif) 0px 63px; }
#header a.link4:hover { background : url(../images/template/headerLinksHover.gif) 127px 0px; }
#header a.link5:hover { background : url(../images/template/headerLinksHover.gif) 127px 89px; }
#header a.link6:hover { background : url(../images/template/headerLinksHover.gif) 127px 75px; }
#header a.link7:hover { background : url(../images/template/headerLinksHover.gif) 127px 61px; }
#header a.link8:hover { background : url(../images/template/headerLinksHover.gif) 127px 47px; }

/* Disables display of printHeader */
#printHeader { display : none; }

/* Rules for footer */

#footer {
	padding : 0;
	height : 150px;
	width : 1000px;
	display : block;
	float : none;
}

#footerFlash { height : 150px; width : 1000px; display : block; float : none; }

body.exhibit #footer, body.events #footer, body.downloads #footer
{ padding : 25px 0 0 0; background : url(../images/template/footerShadow.png) top center no-repeat; }

#footer {
	margin : 0 auto 0 auto;
	width : 1000px;
	text-align : left;
	display : block;
	clear : both;
}

/* Content Structures
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

#wrapper {
	margin : 0 auto 0 auto;
	padding : 0 95px 0 95px;
	width : 810px;
	font-size : 1.3em;
	display : block;
	clear : both;
}

#content {
	margin : 0;
	padding : 0 20px 35px 20px;
	width : 770px;
	text-align : left;
	display : block;
	float : left;
}

/* Shop Hotel Links */
 
#content a.shop { margin-left : 20px; height : 25px; width : 150px; background : url(../images/template/shop_hotel_links.gif) 0px 0px; }
#content a.hotel { margin-left : 20px; height : 25px; width : 150px; background : url(../images/template/shop_hotel_links.gif) 0px 125px; }

/* Shop Hotel Links Hover State */

#content a.shop:hover { background : url(../images/template/shop_hotel_hover.gif) 0px 0px; }
#content a.hotel:hover { background : url(../images/template/shop_hotel_hover.gif) 0px 125px; }


/* Main content elements */

body.explore #content { background : none; }
body.exhibit #content { background : url(../images/template/exhibitContentBackground.png) top left repeat-y; }
body.events #content { background : url(../images/template/eventsContentBackground.png) top left repeat-y; }
body.downloads #content { background : url(../images/template/downloadsContentBackground.png) top left repeat-y; }

/* Events listing */

.eventsListing strong {
	padding : 0;
	width : auto;
	color : #6c5c2b;
	font-size : 1.4em;
	font-family : Garamond, "Times New Roman", Times, serif;
	font-weight : bold;
	line-height : 100%;
	letter-spacing : -.5px;
	display : block;
}

.eventsListing li, .eventsListing li a, .eventsListing li span {
	margin : 0;
	padding : 0;
	width : 396px;
	display : block;
	float : left;
	clear : both;
}

.eventsListing li.links { margin : .5em 0 .5em 0; color : #4e1716; background : url(../images/template/eventsListBack.gif) bottom left repeat-x; }
.eventsListing li.links a, .eventsListing li.links span { padding : .3em 10px .3em 10px; color : #4e1716; width : 376px; background : url(../images/template/eventsListLinkBack.gif) top left repeat-x; clear : none; }
.eventsListing li.links a.icon { padding : .3em 0 .3em 0; width : 22px; }

.eventsListing img {
	margin : 8px 5px 5px 0px;
	display : block;
	border : 1px #960 solid;
}

/* Downloads Audio Links */

.downloadableAudio li {
	margin : 0;
	padding : 0;
	width : auto;
	display : block;
	float : left;
}

.downloadableAudio a {
	margin : 0;
	padding : .3em 0 .5em 0;
	width : auto;
	color : #6c5c2b;
	font-size : 1.1em;
	font-family : Garamond, "Times New Roman", Times, serif;
	font-weight : bold;
	line-height : 100%;
	letter-spacing : -.5px;
	text-align : left;
	display : block;
	float : left;
}

.downloadableAudio a.icon { padding : .3em 0 .3em 0; width : 22px; }

/* Downloads Page Wallpaper & Screensaver Graphic Links */

p.downloadText { padding : .6em 60px .6em 50px; }

p.downloadText a { color: #6c5c2b; }
p.downloadText a:hover { color: #369; }

div.paperLeft { padding : 0 0 0 31px; }
div.paperRight { padding : 0 31px 0 0; }

div.wallpaper h3 { margin : 0; padding : .5em 0 .5em 0; width : 222px; text-align : center; clear : both; }

div.wallpaper p { margin : 0; padding : 0; width : 222px; text-align : center; clear : both; }
div.wallpaper p img { margin : 0 auto 0 auto; padding : 0; float : none; clear : both; }

div.wallpaper ul {
	margin : 0 auto 0 auto;
	padding : 0;
	height : 58px;
	width : 222px;
	text-align : left;
	display : block;
	float : left;
	clear : both;
}

div.wallpaper li { padding : 0; width : auto; display : block; float : left; clear : none; }
div.wallpaper a { padding : 0; height : 29px; text-indent : -5000px; overflow : hidden; display : block; float : left; }

body.downloads div.wallpaper a.link1 { width : 111px; background : url(../images/template/downloadLinks4.gif) 0px 0px; }
body.downloads div.wallpaper a.link2 { width : 111px; background : url(../images/template/downloadLinks4.gif) 111px 0px; }
body.downloads div.wallpaper a.link3 { width : 111px; background : url(../images/template/downloadLinks4.gif) 0px 29px; }
body.downloads div.wallpaper a.link4 { width : 111px; background : url(../images/template/downloadLinks4.gif) 111px 29px; }

/* Screen Saver Links */

.screenSavers { background : url(../images/template/subTitleBar.gif) top left no-repeat; }

.screenSavers li {
	margin : 0;
	padding : 0;
	width : 132px;
	text-align : center;
	display : block;
	float : left;
}

.screenSavers a {
	margin : 0;
	padding : .3em 0 .5em 0;
	width : 132px;
	color : #6c5c2b;
	font-size : 1.1em;
	font-family : Garamond, "Times New Roman", Times, serif;
	font-weight : bold;
	line-height : 100%;
	letter-spacing : -.5px;
	text-align : center;
	display : block;
}

.screenSavers a img { margin : .5em auto .5em auto; width : 108px; float : none; clear : both; }

/* Side "downloadable" content elements */

div.downloadableContent h2, div.downloadableContent h3 {
	padding : 0;
	height : 25px;
	width : 264px;
	text-indent : -5000px;
	overflow : hidden;
	display : block;
	float : left;
}

body.exhibit div.downloadableContent h2 { background : url(../images/template/downloadLinks1.gif) 0px 0px; }
body.events div.downloadableContent h2 { background : url(../images/template/downloadLinks2.gif) 0px 0px; }
body.downloads div.downloadableContent h2 { background : url(../images/template/downloadLinks3.gif) 0px 0px; }
body.downloads div.downloadableContent h3 { background : url(../images/template/downloadLinks3.gif) 0px 50px; }



div.downloadableContent p {
	padding : 25px;
	color : #fc9;
	line-height : 1.2em;
}


div.downloadableContent p { margin : 0 0 20px 0; padding : 0 25px 35px 25px; }
body.exhibit div.downloadableContent p { background : url(../images/template/downloadBack1.jpg) bottom left no-repeat; }
body.events div.downloadableContent p { background : url(../images/template/downloadBack2.jpg) bottom left no-repeat; }
body.downloads div.downloadableContent p { background : url(../images/template/downloadBack3.jpg) bottom left no-repeat; }

div.downloadableContent p.image { margin : 0; padding : 13px 0 27px 0; height : 431px; width : 264px; clear : both; }

body.exhibit div.downloadableContent p.image { background : url(../images/template/downloadContentTop1.gif) top left no-repeat; }
body.events div.downloadableContent p.image { background : url(../images/template/downloadContentTop2.gif) top left no-repeat; }
body.downloads div.downloadableContent p.image { background : url(../images/template/downloadContentTop3.gif) top left no-repeat; }

div.downloadableContent ul {
	margin : 0 auto 0 auto;
	padding : 0;
	height : 75px;
	width : 264px;
	text-align : left;
	display : block;
	float : left;
	clear : both;
}
div.downloadableContent li { padding : 0; width : auto; display : block; float : left; clear : none; }
div.downloadableContent a { padding : 0; height : 25px; text-indent : -5000px; overflow : hidden; display : block; float : left; }

/* Exhibit Page Downloadable Content Graphic Links */
body.exhibit div.downloadableContent a.link1 { width : 132px; background : url(../images/template/downloadLinks1.gif) 0px 50px; }
body.exhibit div.downloadableContent a.link2 { width : 132px; background : url(../images/template/downloadLinks1.gif) 132px 50px; }
body.exhibit div.downloadableContent a.link3 { width : 132px; background : url(../images/template/downloadLinks1.gif) 0px 25px; }
body.exhibit div.downloadableContent a.link4 { width : 132px; background : url(../images/template/downloadLinks1.gif) 132px 25px; }

/* Related Events Page Downloadable Content Graphic Links */
body.events div.downloadableContent a.link1 { width : 132px; background : url(../images/template/downloadLinks2.gif) 0px 50px; }
body.events div.downloadableContent a.link2 { width : 132px; background : url(../images/template/downloadLinks2.gif) 132px 50px; }
body.events div.downloadableContent a.link3 { width : 132px; background : url(../images/template/downloadLinks2.gif) 0px 25px; }
body.events div.downloadableContent a.link4 { width : 132px; background : url(../images/template/downloadLinks2.gif) 132px 25px; }

/* Downloads Page Downloadable Content Graphic Links */
body.downloads div.downloadableContent a.link1 { width : 132px; background : url(../images/template/downloadLinks3.gif) 0px 25px; }
body.downloads div.downloadableContent a.link2 { width : 132px; background : url(../images/template/downloadLinks3.gif) 132px 25px; }

div.downloadableContent a.quote {
	height : 139px;
	width : 264px;
	text-indent : -5000px;
	overflow : hidden;
	display : block;
	float : left;
	background : url(../images/template/bostonGlobeQuote.gif) top left no-repeat;
}

body.exhibit div.downloadableContent p.links, body.events div.downloadableContent p.links, body.downloads div.downloadableContent p.links {
	padding : 0px 0 25px 50;
	color : #fc9;
	line-height : 1.2em;
	text-align : left;
	background : none;
}

div.downloadableContent p.links a {
	padding : 0 10px 0 0px;
	height : inherit;
	display : inline;
	float : none;
}

div.downloadableContent p.links a:hover { color : #fc9;}


/* Rules for Illuminated Letters
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

p.illuminate { padding : 25px 60px .5em 50px; background : top left no-repeat; }

p.illuminate span {
	padding : 0;
	height : 50px;
	width : 55px;
	text-indent : -5000px;
	overflow : hidden;
	display : block;
	float : left;
	clear : none;
}

p.spaced { padding : 25px 60px 1em 50px; }

/* Navigation Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

#navigation {
	margin : 0 auto 0 auto;
	padding : 0;
	width : 810px;
	font-size : 1.4em;
	display : block;
	float : left;
	clear : both;
}

body.explore #navigation { background : none; float : none; }
body.exhibit #navigation { background : url(../images/template/exhibitContentBackground.png) top center repeat-y; }
body.events #navigation { background : url(../images/template/eventsContentBackground.png) top center repeat-y; }
body.downloads #navigation { background : url(../images/template/downloadsContentBackground.png) top center repeat-y; }

#navigation ul {
	margin : 0 auto 0 auto;
	padding : 0;
	height : 118px;
	width : 810px;
	text-align : left;
	display : block;
	float : left;
	clear : both;
}

body.explore #navigation ul { background : none; float : none; }
body.exhibit #navigation ul { background : url(../images/template/exhibitNavigationBackground.png) top center repeat-y; }
body.events #navigation ul { background : url(../images/template/eventsNavigationBackground.png) top center repeat-y; }
body.downloads #navigation ul { background : url(../images/template/downloadsNavigationBackground.png) top center repeat-y; }

#navigation li { padding : 0; width : auto; display : block; float : left; clear : none; }
#navigation a { padding : 0; height : 44px; text-indent : -5000px; overflow : hidden; display : block; float : left; }

/* Graphic Header Links */
#navigation a.link1 { margin : 0 0 0 230px; width : 92px; background : url(../images/template/navigationLinks.gif) 580px 44px; }
#navigation a.link2 { width : 96px; background : url(../images/template/navigationLinks.gif) 488px 44px; }
#navigation a.link3 { width : 77px; background : url(../images/template/navigationLinks.gif) 392px 44px; }
#navigation a.link4 {  margin : 0 230px 0 0; width : 85px; background : url(../images/template/navigationLinks.gif) 315px 44px; }

/* Graphic Header Hover States */
#navigation a.link1:hover, #navigation a.selected1 { background : url(../images/template/navigationLinksHover.gif) 580px 44px; }
#navigation a.link2:hover, #navigation a.selected2 { background : url(../images/template/navigationLinksHover.gif) 488px 44px; }
#navigation a.link3:hover, #navigation a.selected3 { background : url(../images/template/navigationLinksHover.gif) 392px 44px; }
#navigation a.link4:hover, #navigation a.selected4 { background : url(../images/template/navigationLinksHover.gif) 315px 44px; }


/* Flash Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

body.explore #wrapper {
	margin : 0;
	padding : 0;
	width : 100%;
	font-size : 1.4em;
	text-align : center;
	background : url(../images/template/navigationBackground.png) top center no-repeat;
	display : block;
	float : left;
	clear : both;
}

body.explore #content, body.explore #explore {
	margin : 0;
	padding : 0;
	width : 100%;
	text-align : left;
	display : block;
	float : left;
}

/* Common Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

a { color : #c60; text-decoration : none; outline : none; }
a:hover { color : #369; }

#content div { display : block; }

/* COLUMNS
	You can use this class to make a div into a column
	The width here defaults to 50% but can be controlled through the class name in the html which is applied by the autowidth.js file
	
	To set a div column width by percent you would specify the class like this ( class="column percent_#" ) where # is the desired value.
	
	To set a div column width to a specific pixel size you would specify the class like this ( class="column pixels_#" ) where # is the desired value.
*/

.column { margin : 0; padding : 0; width : 50%; float : left; }

h1 {
	padding : 15px 80px .5em 70px;
	width : auto;
	font-size : 2.3em;
	font-family : Garamond, "Times New Roman", Times, serif;
	font-weight : bold;
	line-height : 105%;
	letter-spacing : -.5px;
	background : url(../images/template/quotesLeft.gif) top left no-repeat;
	display : block;
	clear : both;
}

h1 img { display : inline; }

h1 em {
	font-size : 60%;
	font-style : italic;
	text-align : right;
	display : block;
}

h2 {
	padding : 1em 60px .4em 50px;
	width : auto;
	color : #4e1716;
	font-size : 1.8em;
	font-family : Garamond, "Times New Roman", Times, serif;
	font-weight : bold;
	line-height : 100%;
	letter-spacing : -.5px;
	background : url(../images/template/subTitleBackground.gif) bottom left no-repeat;
	display : block;
	clear : both;
}

h2.topBar { padding : 1.5em 60px .4em 50px; background : url(../images/template/subTitleBackground.gif) top left no-repeat; }
h2 strong { font-size : 80%;}

h3 {
	padding : 1em 60px 0 50px;
	width : auto;
	color : #6c5c2b;
	font-size : 1.4em;
	font-family : Garamond, "Times New Roman", Times, serif;
	font-weight : bold;
	line-height : 100%;
	letter-spacing : -.5px;
	display : block;
	clear : both;
}

h4 {
	padding : .5em 60px .5em 50px;
	width : auto;
	font-weight : normal;
	display : block;
	clear : both;
}

h4 em {
	font-style : italic;
	text-align : right;
	display : block;
}

p {
	padding : 0 60px .5em 50px;
	line-height : 1.4em;
	width : auto;
	display : block;
}

ul {
	padding : .5em 60px 0 50px;
	width : auto;
	list-style : none;
	display : block;
}

ol {
	padding : .5em 1em 0 3em;
	width : auto;
	display : block;
}

ul li, ol li {
	padding : 0 0 .5em 0;
	width : inherit;
}

hr {
	margin : .5em 1.4em .5em 1.4em;
	display : block;
}

object, embed, img { display : block; }


sup { font-size : 55%; }
b { font-weight : bold; }
em { font-style : italic; }

/* apply this class to ad a divider between content sections */

.divider { border-bottom : 1px #d9d9d9 solid; }

/* apply this class to properly format images within content */

.photo {
	margin : 5px 10px 5px 10px;
	display : block;
}

/* Apply these classes to float stuff left or right */

.left { float : left; }

.right { float : right; }

.clear { clear : both; float : none; }

/* Apply this to hide anything */

.hide { display : none; }

/* Form Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

.form { margin : 5px 0 10px 0; padding : 5px 0 10px 0; }

fieldset {
	margin : 0;
	padding : 5px 10px 5px 10px;
	font-size : inherit;
	line-height : inherit;
	border : none;
	display : block;
	clear : both;
}

label { margin : 0; padding : 0 1em 0 0; text-align : left; width : auto; display : block; float : left; }

input { margin : .2em 0 0 0; height : 1.4em; border : 1px #333 solid; display : block; outline : none; }

textarea { border : 1px #333 solid; display : block; }

input.radio { margin : 0 .5em 0 0; border : none; display : block; float : left; }
input.checkbox { margin : 0 .5em 0 0; border : none; display : block; float : left; }

select { border : 1px #333 solid; display : block; outline : none; }

option { height : 1.3em; }

input.button {
	margin : 0 1em 0 0;
	padding : .2em 1em .2em 1em;
	height : auto;
	border : 1px #333 solid;
	background : url(../images/template/footerBackground.jpg) top left no-repeat;
	float : left;
}