/****************************************************************/
/*	site-wide but non-sectional styles			*/
/****************************************************************/

/* ----- html elements ----- */
div, h2, h3, h4, h5, a
{
	background-repeat: no-repeat;	
}
a 
{
	background-position: right center;
	/* color: black; !!!!!!!! new default, so only A-tags which are actually links will be coloured (add :visited, :active, :link to sectional stylesheets) - miks - 12/2006 */
}
h1
{
	float: left; 
	width: 540px;		/* so following divs clear floated header */
	padding-bottom:5px;
	margin-top: -5px;
}

/* ----- generic classes ----- */
/************************************************************************/
/* NEED TO DECIDE - do link classes get display:block, and remove it 	*/
/* when needs to be inline, or vice versa...				*/
/* AND some of these maybe should go into content.css ??		*/
/************************************************************************/

.contrast { background-color: #E4E4E4; }
/* should there be a contrast2 class - cf sectional "accent" classes - miks */

a.pointRight, a.pointRight:link, a.pointRight:visited, a.pointRight:active, .footerLinksBar a 
{
	padding-right: 15px;
	text-decoration: none;
}

a.top, a.top:link, a.top:visited, a.top:active 
{
	float: right;
	padding-right: 15px;
	text-decoration: none;	
}
a.pointLeft, a.pointLeft:link, a.pointLeft:visited, a.pointLeft:active 
{
	background-position: center left;
	padding-left: 15px;
	text-decoration: none;
}

.panel a.printVersion:link, .panel a.printVersion:visited, .panel a.printVersion:active	
{
	font-weight: bold;
	background-image: url(generic/images/print.gif);
	padding-right: 20px;
	text-decoration: none;
}
/* if this rule isn't here the printVersion doesn't underline - not sure why - pats */
.panel a.printVersion:hover 	
{
	text-decoration: underline;
}




/* ----- panel classes ----- */
.column
{
	float: left;
}
#column-a
{
	margin-right: 15px;
}
.panel
{
	margin-bottom: 30px; 		/* due to a change in how the footers work this margin needs to be bigger now so changed from 15 to - pats */
	background-color: #F2F2F2;	/* default - override using individual panel IDs if necessary */
	line-height: 1.2em;		/* explicit line-height fixes peekaboo bug - other solutions: http://www.positioniseverything.net/explorer/peekaboo.html */			
}

/* this hides the bottom border of a subpanel - easier to do this than explicitly remove border using noSeperator class */
/* star7 hack - hides from Opera 7+ */
html*.panel div.footerLinksBar
{
	margin-top: -1px;
}
 

 
/* common panel header styles */
.panel h2 
{ 
	color: #FFF;
	margin: 0px;
	padding: 5px 5px 5px 10px; 
	background-position: top right;
}



/* ----- link bar styles ----- */
.searchBar
{
	padding: 5px 5px 6px 0px;
	text-align: right;
	color: #FFF;
	clear: both;
} 

div.footerLinksBar, div.middleLinksBar  
{
	
	background-position: bottom left;	
	padding: 4px 5px 4px 5px;		/* see commented backslash hack below- pats - really? - prob moved to hacks.css, as should clearfix hacks below - miks */ /* moved padding from li to containing div so that footer/middleLinksBars are more consistantly */
	line-height: 1.2;			/* explicit line-height fixes peekaboo bug - other solutions: http://www.positioniseverything.net/explorer/peekaboo.html */
	float:left;
	/* wierd problem in safari that I'm trying to fix that means that block elements when on the homepage and in middleLinksBars don't extend to the full width of their container - pats */

	font-size: 1.0em;
	font-weight: bold;
}


div.footerLinksBar a, div.middleLinksBar a
{
	float:right;		/* for the non-UL footerLinksBar links */

}
div.footerLinksBar ul li.firstItem a
{
	float:left;
}
div.footerLinksBar ul li a, div.middleLinksBar ul li a
{
	float:none;
}
div.footerLinksBar ul, div.middleLinksBar ul 
{
	display: inline; 
	padding: 0px;
	margin: 0px; 			/* removing an inheritance from content.css (panel.ul line 22-ish) - pats */
	list-style-type: none;
}
div.footerLinksBar ul li, div.middleLinksBar ul li
{
	padding: 0px;
	margin:0px;
	list-style: none;
	float:right;
}
.panel .middleLinksBar
{
	width:auto;
}
div.footerLinksBar ul li.firstItem, div.middleLinksBar ul li.firstItem 
{
	float: left;
	padding-left: 10px;	
}

div.footerLinksBar a, div.middleLinksBar a 
{
	color: #FFF; 
}
/* ----- end link bar styles ----- */



/* search bar styles - NEEDS FINALISING !! */
.searchBox		
/* site-wide class for search bar inputs - ummm... prob better to have a form ID and contextual rules - miks */ 
{
	height: 1.5em;			/* this should apply to button as well... - miks */
	border: 1px solid #DBDADA;	/* change to sectional colour ?? - miks */
	margin: 0px 0px 0px 3px;	/* seperate box from 'Search' label */
}
/* ----- end search bar styles ----- */




/* ----- GLOBAL LOCAL STYLES - should these be here or in a seperate sheet ?? 
	- prob opening times should be include, so could import it's own micro-stylesheet - miks */
#table-openingTimes 		
{ 
	width: 100%; 	
	font-size: 1.1em;
}
#table-openingTimes th		
{ 
	text-align: left; 
	background-color: transparent;
	color: #000;
}
#table-openingTimes td		
{ 
	text-align: right; 
}
/* ACTUALLY THESE (table-openingTimes styles) SHOULD BE MOVED TO CONTENT.CSS - miks - 08/2007 */


/******** 'enhancements'  ********/ 
/* not in hacks.css as too widely used */
.contentRow { display: inline-block; }		/* required to force correct enclosure of floated content in IE7 (triggers hasLayout=true) - see: http://www.tanfa.co.uk/ - "EasyClearing, the Aslett/PIE way is NOT broken in IE7!" */
.contentRow:after, .contentRow1:after, .contentRow0:after, .clearfix:after 
{
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
* html .contentRow {height: 1%;}
* html .contentRow1 {height: 1%;}
* html .contentRow0 {height: 1%;}
/* End hide from IE-mac */

/* ------ Microsites - Back to section button --------- */
/* REMOVE AFTER MICROSITES RE-PROCESSED */
#microsite-section-back{float:left;display:block;padding-right:10px;}
#microsite-section-back UL{display:inline;padding:0px;margin:0px;}
#microsite-section-back LI.pos1
{
	padding:3px 5px 3px 5px;
	color:#FFF;
	font-weight:bolder;
	float:left;
	padding-left:20px;
	background-position: left bottom;
	background-repeat: no-repeat;
}
#microsite-section-back LI.pos1 A{color:#FFF;text-decoration:none;}

#microsite-section-back LI.pos2
{
	display:block;
	padding:3px 10px 3px 5px;
	color:#FFF;
	font-weight:bolder;
	float:left;
	background-position: right top;
	background-repeat: no-repeat;
}

/* "back-to" nav (this prob doesn't need - or perhaps shouldn't have - "microsite-" prefix?) */
/* this section copied from microsites.css  */
#microsite-nav-backToSection
{
	float: left;
	margin: 0px 10px 0px 8px;		/* 8px for IE (which doubles margins of floated elements) */
}
html>body #microsite-nav-backToSection { margin: 0px 10px 0px 15px; } 	/* IE doubles margin - this is correct for FF - miks */

#microsite-nav-backToSection span, #microsite-nav-backToSection a
{
	display: block;
	float: left;
	font-size: 100%;
	font-weight: bold;
}

#microsite-nav-backToSection span
{
	color: #FFF;
	padding: 3px 10px 4px 25px;
}
#microsite-nav-backToSection a
{
	/* color: #000;						INCORRECT - should be sectional text colour - miks */
	padding: 3px 15px 4px 10px;
	text-decoration: none ! important;
}
#microsite-nav-backToSection a:hover
{
	text-decoration: underline ! important;
}
/* ----- END DEPRECATED ---------------------- */



/* ----- TYPOGRAPHICS ------------------------------------------ */
body
{
	/* font-size: 76%;		copied from typography.css - which will be removed - possibly dangerous to put here?? */
	/* 
	NEED TO CHECK THAT THIS WILL NOT CAUSE PROBLEMS
	Should be fine, as EVERY page should implement basic.css and typography.css.  However, if there are any pages which implement basic.css but NOT typography.css, adding this rule may break their font-sizes
	*/
}
body, textarea
{
	font-family: Arial, Sans-Serif;
}


/* generic font styles - is here the best place?? - miks - 08/2007 */
p, input, select, textarea, ol, ul, li 
{
	font-size: 1.0em;
}
.smaller { font-size: 80%; }


h1	{ font-size: 2.0em; }
h2	{ font-size: 1.4em; }
h3	{ font-size: 1.4em; }
h4	{ font-size: 1.2em; }
h5	{ font-size: 1.2em; } 
h6	{ font-size: 1.0em; }



/* Cookie banner display styles - added 2014/01 */
#nhm-cookie-notify {
	top: 0;
	margin-left: auto;
	margin-right: auto;
	width: 762px;
	position: fixed;
	z-index: 100;
}
#nhm-cookie-banner {
    background: none repeat scroll 0 0 #f2f2f2;
    border-top: 1px solid # #DADADA;
	border-bottom: 1px solid  #DADADA;
	/*border-radius: 5px;*/
    bottom: 0;
    color: #000000;
    /*font-family: "Verdana","Arial",sans-serif;*/
    font-size: small;
	top: 0;
    left: 0;
	height: 30px;
	padding: 10px 0px;
    right: 0;
	z-index: 999;
	position: relative;
}
#nhm-cookie-banner .left {
    float: left;
    margin-left: 10px;
    width: 70%;
}
#nhm-cookie-banner .right {
    float: right;
    margin-right: 5px;
    text-align: center;
    width: 25%;
}
#nhm-cookie-banner .right a {
	display: inline-block;
	padding-left: 32px;
	padding-top: 5px;
}