/* Museum of London - MOL site

	Style sheet for all screen layout */



body

{

	background-color: #FFFFFF;

	color: #333333;

	margin: 0 0 10px 0;

	padding: 0;

	text-align: center;

}



body, td, td table td, td table td p, table ul

{

	font: small/1.3 Arial, Verdana, Helvetica, sans-serif;	

}



a 

{

	color: #9B0101;

	text-decoration: none;

}



a:hover

{

	text-decoration: underline;

}



form

{

	margin: 0;

}



em

{

	color: #9B0100;

	font-style: normal;

}



p

{

	padding: 0;

	margin: 0 0 0.5em 0;

}

.topSpacing	/*this one used to give a bit of space above e.g. in between form elements. Best for block level elements, not inline*/

{

	margin-top: 1.5em;

	clear:both;

}





select, input

{

	font-size: 11px;

	color: #666666;

}



.noNothin

{

	margin:0px;

	padding:0px;

	border:0px

}



ul

{

	list-style-type: none;

	list-style-image: url(../images/square_11.gif);

	padding: 0 0 3px 0;

	margin: 0 0 0 10px;

}



ol

{

	padding: 0 0 3px 0;

	margin: 0 0 0 10px;

}



/* this needs updating to MOL style */

.sidebar ul

{

	list-style-image: url(../images/portal/square_11.gif);

}





li

{

	font-size: 100%;

	margin: 0 0 10px 0; /*the bottom margin revised up from 3px to give more space in the content area. Overridden in the nav styles*/

	padding: 0;

}



.postlister ul li, .postlister li	/*this should catch <ul>s with this class, or within a span of the postlister class*/

{

	font-size: 100%;

	margin: 0 0 3px 0;

}





/*this scrapped because we want to be more specific and only use this gray for navigation e.g. postlister class

li a

{

	color: #333333;

}

*/



.postlister ul li a, .postlister li a

{

	color: #333333;

}

h1

{

	color: #970100;

	font-size: 135%;

	font-weight: normal;

	margin: 0;

	padding: 0;

}



h2 

{

	color: #666666;

	font-size: 120%;

	margin: 4px 0 0 0;

	padding: 0;

}



h3

{

	color: #666666;

	font-size: 125%;

	font-weight: bold;

	margin: 10px 0 0 0;

}



h4

{

	color: #333333;

	font-size: 110%; 

	font-weight: normal;

	margin: 0;

}



h5

{

	color: #333333;

	margin: 0;

}



table

{

	margin-bottom: 10px;

}



td

{

	font-size: 80%;

	padding: 0 2px 2px 0;

	vertical-align: top;

}



th

{

	text-align: left;

}



td img

{

	padding-top: 2px;

}



img

{

	border: 0;

}







/* main classes */



.ButtonGo

{

	position: relative;

	top: 3px;

}







.container

{

	text-align: left;

	width: 760px;

	margin-top: 10px;

	margin-bottom: 10px;

	margin-left: auto;

	margin-right: auto;	

}



.header

{

	height: 30px;

	clear: both;

}



.language

{

	color: #CD0100;

	font-size: 12px;

	float: left;

	text-align: right;

	width: 550px;

	clear: left;

}



.language input

{

	position: relative;

	top: 3px;

	left:3px

}



.search

{

	color: #CD0100;

	font-size: 12px;

	text-align: right;

}



.search-input

{

	border: 1px solid #CBCBCB;

	height: 15px;

	width: 115px;

}





.logo

{

	clear: left;

	float: left;

	height: 75px;

	width: 760px;

}



.menu

{

	clear: right;

	border: 1px solid #CECACE;

	float: left;

	height: 25px;

	width: 608px;

	margin-bottom:10px

}



.menu a

{

	color: #676767;

	display: block;

	float: left;

	padding: 4px 5px 4px 5px;

}



.menu a.active

{

	color: #444444;

	font-weight: bold;

	text-decoration: none;

}



.menu a:hover

{

	color: #444444;

}



.image

{

	clear: both;

/*	padding-top: 10px;*/

}



/* stuff added by MST */

.image span a

{

	border: 0px;

	margin: 0px;

	padding:0px;

}



.image span

{

	margin: 0px;

	padding:0px;

}



/* end of stuff added by MST */





.image-info

{

	background-color: #CCCCCC;

	clear: both;

	font-size: 85%;

	padding: 2px 5px 2px 5px;

	text-align: right;

}



.image-info a

{

	background-image: url(../images/bullet.gif);

	background-repeat: no-repeat;

	background-position: left center;

	padding-left: 10px;	

	border: 0px;

	margin: 0px;

}

/* calendar */



.calendar

{

	/*background-image: url(../images/calendar_extra.gif);*/

	background-repeat: no-repeat;

	color: #434343;

	/*height: 190px;*/

	margin: 0;

	text-align: center;

	/* width: 200px;*/

}



.DayHeaderStyle

{

	width: 28px;

}



.DayStyle

{

	color: #444444;

	font-size: 11px;

	/*background-color:Lime;*/

}



.NextPrevStyle, .calendar .NextPrevStyle a

{

	font-size: large;

}



.SelectedDayStyle

{

	border: 1px solid #FF3200;

	padding: 0 2px 0 2px;

	/*background-color:white;*/

	font-size: 11px;

}



.TitleStyle

{

	color: #FFFFFF;

	font-size: 12px;

	text-align: center;

	background-color:gray;



}





.calendar th

{

	color: #FFFFFF;

	font-size: 12px;

	text-align: center;

	padding-top: 2px;

}



.calendar th img

{



	padding-top: 2px;

}



.calendar td

{

	font-size: 11px;

	padding: 1px;

	margin: 0;	

}



.calendar .weekday

{

	width: 28px;

}



.calendar a

{

	color: #444444;

	font-size: 11px;

}



.calendar a.active

{

	border: 1px solid #FF3200;

	padding: 0 2px 0 2px;

}



/* treenav */



.treenav

{	

	background: none;

	list-style-type: none;

	list-style-image: none;

	margin: 0;	

}



.treenav li

{

	margin-bottom: 0;

}



.treenav li a

{

	color: #333333;

	font-size: 100%;

	font-weight: bold;	

}



.treenav li ul li a

{

	color: #999999;

	font-size: 100%;

	font-weight: normal;	

}



.treenav li ul

{

	list-style-image: url(../images/square.gif);

}



.treenav li ul li a.selected

{

	color: #990100;	

}



.options

{

	padding: 5px 0 5px 0;

}



.email

{

	background-image: url(../images/email.gif);

	background-repeat: no-repeat;

	background-position: left center;

	color: #986667;

	font-size: 80%;

	height: 9px;

	padding: 2px 0 2px 15px;

}



.options .email

{

	margin-left: 560px;

}



.print

{

	background-image: url(../images/print.gif);

	background-repeat: no-repeat;

	background-position: left center;

	color: #986667;

	font-size: 80%;

	height: 13px;

	margin-left: 20px;

	padding: 2px 0 2px 15px;

}



.contents

{

	clear: both;

	padding: 5px 0 10px 0;

}



table.contents td

{

	padding: 0;

	margin: 0;

}



.links

{

	background-color: #DCDCDC;

	clear: both;

	font-size: 80%;

	margin: 0 0 10px 0;

	padding: 1px;

	text-align: center;	

}



.links a

{

	color: #666666;

}



.about

{

	color: #7B7B7B;

	font-size: 80%;

	text-align: center;

}



.compliance

{

	color: #7B7B7B;

	font-size: 80%;	

	text-align: center;

}







/* other */







.article

{

	background-image: url(../images/dot.gif);

	height:100%;

	background-repeat: repeat-y;

	background-position: 550px;

	clear: both;

	margin: 10px 0 10px 0;

}



.article p

{

	margin-bottom: 1.5em;

	padding-right: 10px;	

}



.article .date 

{

	margin: 10px 0 10px 0;

}



.article h2

{

	color: #990100;

	font-size: 110%;

}



.article h3

{

	color: #990100;

	font-size: 100%;

	font-weight: bold;

}



.article h4

{

	color: #990100;

	font-size: 100%;

	font-weight: normal;

	text-decoration:underline;

}



.article blockquote p

{

	margin-bottom: 0;

}





.intro

{

	font-size: 105%;

	margin-bottom: 10px;

}



.box-left

{

	background-color: #F3F3F3;

	float: left;

	font-size: 80%;

	margin: 3px 10px 0 0;

	width: auto;

}



.box-right

{

	background-color: #F3F3F3;

	float: right;

	text-align: right;

	font-size: 80%;

	margin: 3px 10px 0 0px;

	width: auto;

}

/* stuff added by MST */

.box-align-left

{

/*	background-color: #F3F3F3;

	text-align:left;

	font-size: 80%;

	margin: 3px 10px 0 0px;

	width: auto;

	clear:both;

*/

	background-color: #F3F3F3;

	text-align:left;

	font-size: 80%;

	margin: 3px 0px 0 0px;

	width: auto;

	clear:both;

}

.box-align-right

{

	background-color: #F3F3F3;

	text-align:right;

	font-size: 80%;

	margin: 3px 0px 0 0px;

	padding:0px 0px 2px 0px;

	width: auto;

	clear:both;

}

.box-align-centre

{

    MARGIN-LEFT: auto;

    MARGIN-RIGHT: auto;

    POSITION: relative;

    TEXT-ALIGN: center;

	width: auto;

	clear:both

}



.imgCapGroupCaption

{

	padding:0 2px 0 2px;

}



/* end of stuff added by MST */



.banner, SPAN.banner div img	/*the latter is used because the style isn't working directly on the containing span where an image/caption pair is used e.g. in the RH article column*/

{

	padding-top: 5px;

}



.banner-text

{

	color: #666666;

	font-size: 80%;

}



.box img

{

	display: block;

	border: 0;

}



.box p

{

	padding: 3px;

}



.box

{

	background-color: #DEDBCE;

}



table .box

{

	font-size: 85%;

}



.gray,

.gray a

{

	color: #666666;

}



.bullet, .event-links A, .bulletLinks A

 /*this last one added by MST */

{

	background-image: url(../images/bullet.gif);

	background-repeat: no-repeat;

	background-position: left center;

/*	font-size: 85%;*/

	padding-left: 10px;	

}



.article-col-1

{

	float: left;

	margin-right: 10px;

	width: 140px;

}

.article-col-2

{

	float: left;

	margin-right: 10px;

	width: 400px;

}



.open-2-col-main

{

	width: 610px;

}



.open-1-col-main

{

	width: 760px;

}





.article-col-3

{

	float: left;

	width: 200px;

	margin: 0;

}



.navigation-col-1

{

	float: left;

	margin-right: 10px;

	width: 130px;

}



.navigation-col-2

{

	float: left;

	margin-right: 10px;

	width: 200px;

}

/*

.navigation-col-2 li

{

	font-size:100%

}

*/

.navigation-col-3

{

	float: left;

	margin-right: 10px;

	width: 200px;

}



.navigation-col-23

{

	float: left;

	margin-right: 10px;

	width: 410px;

}



.navigation-col-4

{

	float: left;

	width: 200px;

	margin: 0;

}



.overview-col-1

{

	float: left;

	margin-right: 10px;

	width: 130px;

}



.overview-col-2

{

	float: left;

	margin-right: 10px;

	width: 200px;

}



.overview-col-3

{

	float: left;

	margin-right: 10px;

	width: 200px;

}



.overview-col-4

{

	float: left;

	width: 200px;

	margin: 0;

}



.column-200-nomargin

{

    FLOAT: left;

    MARGIN: 0px;

    WIDTH: 200px;

/*    position:absolute;

	border:solid black 1px   */

}



/* Mike Parris 18 03 2005 - dont think these are used

.column-200 table

{

	width: 190px;

}



.column-305

{

	float: left;

	margin-right: 10px;

	width: 305px;

} 



.column-400-rborder

{

	float: left;

	margin-right: 10px;

	width: 400px;

}

*/



.date

{

	color: #666666;

	font-size: 80%;	

}



.hide

{

	display: none;

}



.left

{

	float: left;

/*	margin-right:5px;*/

}



.right

{

	float: right;

}



.overline

{

	border-top: 1px solid #D5D5D5;

	padding-top: 3px;

}



.section

{

	clear: both;

	margin-bottom: 10px;

}



.small

{

	font-size: 80%;

}



.underline

{

	border-bottom: 1px solid #D5D5D5;

}



/* - frontpage - */



.feature

{



/*	background-color:Red;*/

	float: left;

	margin-right: 10px;

	padding-bottom: 10px;

	width: 330px;

}



.feature h1

{

	font-size: 160%;

	font-weight: normal;

	margin: 0;

	padding: 5px 0 0 0;

}



.feature A.bullet, .bulletLinks A

{

    COLOR: #666666

}



.today

{

/*	background-color:Aqua;*/

	float:right;

	width:420px

}



.today h1

{	

	font-size: 120%;

	font-weight: bold;

	margin: 0;

	padding: 1.85em 0 0 0;

}

.today H2

{

    PADDING-RIGHT: 0px;

    PADDING-LEFT: 0px;

    FONT-WEIGHT: bold;

    FONT-SIZE: 120%;

    PADDING-BOTTOM: 0px;

    MARGIN: 0px;

    PADDING-TOP: 1.85em

}

.event 

{

	float: left;

	margin-right: 10px;

	width: 340px;

}



.visitMoL

{

	float: left;

	margin-right: 10px;

	width: 200px;	

}



.visitMiD

{

	float: left;

	width: 200px;

}



.event h1,

.visit h1,

.whatson h1

{

/*	color: #666666;*/

	font-size: 155%;

	font-weight: normal;

}



.event h1

{

	margin: 0;

}



.event h2

{

	font-size: 110%;

	margin: 0;

	padding: 0.5em 0 0 0;

}



.event-links a

{

	color: #676767;

}



.visit

{

	height: 200px;

}



.visit img

{

	margin: 5px 0 1px 0;

}



.visit .wrapper

{

	background-color: #ECECEC;

	padding: 2px;

	

}



/* stuff added by MST */



.highlight-box

{

	background-color: #ECECEC;

	position:relative;

	padding: 2px;

	font-size:100%; /*was 80%*/

}



.highlight-box ul{

	padding-left:10px

}



.highlight-box li{

}



.translation

{

	background-color:#eeeeee;

	margin:10px 5px 10px 5px;

	padding:5px;	

}



/* end of stuff added by MST */



.visit a

{

	color: #660000;

}



.whatson

{

	clear: right;

	height:200px; 

}



.whatson .wrapper

{	

	border: 1px solid #DDDDDD;

	clear: right;

	height: 156px; 

	margin-top: 5px; 

	padding: 3px;	

}



.whatson h2

{

	color: #990100;

	font-size: 80%;

	margin: 0;	

}



.whatson a

{

	color: #9B0101;/*was 676767*/

}



.exhibitions li 

{

	font-size: 100%;	

}



/* --- */



.extra

{

	padding: 1px 0 0 5px;

	text-align: left;	

}



.extra img

{

	vertical-align: middle;

}



.filter

{

	background-color: #660000;

	color: #FFFFFF;

	font-size: 14px;

	height: 25px;

	padding-top: 2px;

	

}



.filter h1

{

	color: #FFFFFF;

	margin: 0;

	float:left; 

	font-size: 16px;

	padding: 2px 0 0 5px;

	word-spacing: 20px;	

}



.filter .navigate

{

	float: left;

	padding: 4px 0 0 10px;

	width: 170px;

}



.list

{

	background-color: #F9FBF8;

	border-bottom: 1px solid #C1E0C0;

	border-top: 1px solid #C1E0C0;

	empty-cells: show;

	width: 760px;

}



.list th,

.list td

{

	padding: 4px;

}



.list th

{

	border-bottom: 2px solid #C1E0C0;

	font-size: 90%; 

	white-space: nowrap;

}



.list td

{

	color: #333333;

	font-size: 85%;

	border-bottom: 1px solid #C1E0C0;	

}



.list td.red

{

	background-color: #EE1B2C;

}



.list td.blue

{

	background-color: #003398;

}

span.red, .red

{

	color:#EE1b2c;

}

span.blue

{

	color:#003398;

}

.list td a

{

	font-size: 100%;

}



.paging

{

	color: #9A0000;

	font-weight: bold;

	margin: 0;

	padding-right: 100px;

	text-align: right;

}



.paging a

{

	color: #666666;

	font-weight: normal;

	margin-left: 3px;

}



.paging a.current

{

	font-weight: bold;

}





.sidebar p

{

	margin-bottom: 5px;

}



.sidebar h1

{

	color: #444444;

/*	font-size: 15px; */

	font-size: 120%;

	margin: 5px 0 3px 0;

}



.sidebar ul

{

	list-style-image: url(../images/square_11.gif);

	margin: 0 0 0 7px;

	padding: 0 0 3px 0;

}



.sidebar li a

{

	color: #666666;

}



/* this stuff relates to the events listings in the RH column*/



.sidebar h3

{

	font-size: 110%;

	margin-bottom: 3px;

}



.sidebar h4.orange,

.sidebar h4.blue,

.sidebar h4.pink,

.sidebar h4.red,

.sidebar h4.green,

.sidebar h4.yellow,

.sidebar h4.black

{

	background-repeat: no-repeat;

	background-position: left center;

	padding-left: 14px;

}



.sidebar h4.orange

{

	background-image: url(../images/dot_orange.gif);

}



.sidebar h4.blue

{

	background-image: url(../images/dot_blue.gif);

}



.sidebar h4.pink

{

	background-image: url(../images/dot_pink.gif);

}



.sidebar h4.red

{

	background-image: url(../images/dot_red.gif);

}



.sidebar h4.green

{

	background-image: url(../images/dot_green.gif);

}



.sidebar h4.yellow

{

	background-image: url(../images/dot_yellow.gif);

}



.sidebar h4.black

{

	background-image: url(../images/dot_black.gif);

}



.sidebar .date

{

	color: #666666;

}



/*end of sidebar events stuff*/



/* For CMS authoring*/



.MCMSCaption

{

	background-color:Yellow;

	border-color:Black;

	border-style:solid;

	border-width:thin;

}



error

{

	display:none

}













.search-button

{

	position: relative;

	top: 3px;

}



/*  from the original portal sheet */



.mol, .mid, .mol-arch

{

	display: block;

	height: 129px;

	width: 35px;	

}







/* Fahrner Image Replacement - FIR */

.mol span, .mid span, .mol-arch span

{

	display: none;

}



a.mol             { background-image: url(../images/portal/mol.gif);           }

a:hover.mol       { background-image: url(../images/portal/mol_over.gif);      }

a.mid             { background-image: url(../images/portal/mid.gif);           }

a:hover.mid       { background-image: url(../images/portal/mid_over.gif);      }

a.mol-arch        { background-image: url(../images/portal/mol_arch.gif);      }

a:hover.mol-arch  { background-image: url(../images/portal/mol_arch_over.gif); }



.sites

{

	float: left;

	padding-top: 30px;

	width: 35px;

}



.portal

{

	float: left; 

	width: 760px;

}























.catcher

{

	margin: 0;

	padding: 0;

	width: 725px;

}



.catcher .about-brown,

.catcher .about-red

{

	background-color: #8C8A3A;

	color: #FFFFFF;

	padding: 4px 4px 4px 7px;

	width: 410px;

	height: 95px;

}



.catcher .about-red

{

	background-color: #6B0000;

}



.catcher .about-brown h1,

.catcher .about-red h1

{

	color: #C5CA94;

/*	font-size: 14px; */

	margin: 0;

}



.catcher .about-red h1

{

	color: #CE9A94;

}



.catcher h2,

.catcher .about-red h2

{

	color: #FFFFFF;

/*	font-size: 22px;	 */

	font-size: 180%;

	font-weight: normal;

	margin: 0;

	line-height: 1.1;

}



.catcher .about-brown h3,

.catcher .about-red h3

{

	color: #FFFFFF;

/*	font-size: 12px; */

	font-weight: normal;

	margin: 0 0 3px 0;

}



.catcher .about-brown a,

.catcher .about-red a

{

	color: #EFEFDE;

	font-size: 100%; 

}



.catcher .info

{

	background-color: #9CB621;

	color: #EFEFDE;

/*	font-size: 12px; */

/*	font-size: 100%; */

	padding: 7px;

}



.catcher .info h1

{

	color: #6B6100;

/*	font-size: 12px; */

	font-size: 110%;

	font-weight: bold;

	margin: 0;

}





.catcher .info a

{

	color: #FFFFFF;

	font-size: 100%; 

}



.catcher .goto 

{

	background-color: #CE9694;

	padding-left: 20px;

	vertical-align: middle;	

}



.catcher .goto a

{

	color: #6B3131;

	font-size: 24px;

	font-weight: bold;

}



.press-office

{

	background-color: #F7EFEF;

	padding: 5px;

}



.press-office h1

{

	color: #3A3520;

	font-size: 12px;

	font-weight: bold;

}



.press-office a

{

	color: #313131;

	font-size: 11px;	

}





/* this needs setting to MOL style - currently Portal style */



 .blockquoteStyle

{

	background-color: #DEDBCE;

	margin: 10px 10px 10px 0;

	padding: 7px;

}





a.highlight

{

	color: #986667;

}





h1.boxed

{

	background-color: #EFEFEF;

	color: #333300;

	font-size: 12px;

	font-weight: bold;

	margin: 0;

	padding: 3px;

}



h1.underlined

{

	border-bottom: 1px solid #CCCCCC;

	color: #333333;

	font-size: 180%;

	margin: 0 0 5px 0;

}



.theForm

{

	float:left;

	width:300px;

}



.theFormText

{

	margin:20px;

	font-weight:bold;

}





/*Revised left hand menu styles for use with _all_class XSL



THIS IS NOT YET READY FOR PUBLIC CONSUMPTION



*/



#navigation {line-height : 100%;}





#navigation a{

/*	text-decoration : none;*/

}



#navigation a.active{color : #990000;font-weight : bold;}



#navigation .current a { color:#660000; text-decoration:none; }



li.navLevel1, li.navLevel2, li.navLevel3, li.navLevel4 {	list-style: none;}/*this is the root of the nav, which in other places is an H1 instead of the lowest level LI*/





li.navLevel1 a:link, li.navLevel1 a:visited{	font-weight: bold;}

li.navLevel1 a:link, li.navLevel1 a:visited{	color : #666666;}



li.navLevel1 { margin-left : 0px; font-size: 100%; margin-top:5px;}



li.navLevel2 { margin-left : 10px; font-size: 100%; }

li.navLevel2Active a, li.navLevel2Active a:visited { margin-left : 10px; font-size: 100%; color:#a01111; text-decoration:underline; }

li.navLevel2 a:link, li.navLevel2 a:visited{color : #333333;}





li.navLevel3 { margin-left : 15px; font-size: 95%;}

li.navLevel3Active {  }

li.navLevel3 a:link, li.navLevel3 a:visited {color : #333333;}



li.navLevel4 { margin-left : 20px; font-size: 95%;}

li.navLevel4{color : #666666;}

li.navLevel4 a:link, li.navLevel4 a:visited{color : #666;}



li.navLevel1 a:hover, li.navLevel2 a:hover, li.navLevel3 a:hover, li.navLevel4 a:hover {	color : #000;text-decoration : underline;}







.flagorama{

	clear: both;

	font-size: 85%;

	padding: 0px 0px 2px 5px;

	text-align: right;

}



#tabs1 {	z-index: 4; 	position: absolute; 	top: 90px;	padding: 0px 0px 0px 22px; 	float:left; 	background:transparent; 	font-size:14px; 	line-height:normal; 	font-weight:bold;       }

#tabs1 ul {           margin:0;           padding:0px 0px 0px 0px;           list-style:none;       }

#tabs1 li {       display:inline;       margin:0;       }

#tabs1 a{ 	float:left; 	background: transparent url(images/menu.png) no-repeat right top; 	margin:0; 	color: white; 	padding:0px 12px 3px 10px; 	text-decoration:none;       }

#tabs1 a:hover { 	float:left; 	color: #c1e7f0; 	margin:0; 	text-decoration:none;}