/* Birmingham IMC CSS  */

body {
	margin: 0;
	padding: 0;
	font: small/1.4 "Lucida Grande", "Trebuchet MS", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
	background: white;
	color: black;
}

/* Basic  formatting */
img {
	display: block;
 	border: 0;
}
em {
	font-style: italic;
}
strong {
	font-weight: bold;
}
/* Access class, stuff we want to show to a text only browser (screen readers and all that gubbins) */
.access {
	display: none;
}
/* Basic links */
a:link { color: #4e2f6a; text-decoration: none; }
a:visited { color: #4e2f6a; text-decoration: none; }
a:hover { color: #4e2f6a; text-decoration: underline; }
a:active { color: #4e2f6a; text-decoration: underline; }

/* Top navigation */
/* At the moment in the XHTML the top nav is above the H1, which isn't that sexy, but it was that fucking Opera bug (I think) that made me put it there... */
div#sitenav {
	position: absolute;
	top: 0px;
	right: 2px;
	z-index: 2;
	font-weight: bold;
	line-height: 1.8;
	margin: 0;
	padding: 0;
}
ul#navlist {
	margin: 0;
	padding: 2px;
}
#navlist li {
	display: inline;
	list-style-type: none;
}
#navlist a { 
	padding: 1px 13px; 
	border: 1px dotted black;
	text-decoration: none;
}
#navlist a:link { color: #000000}; #navlist a:visited {
	color: #000000;
	background-color: #ffffff;
}
#navlist a:hover {
	color: #000000;
	background-color: #ffffff;
}
/* End top navigation line */

/* Holds the logo and the two top images */
/* By changing the height and position and source of these elements, well... should be easy to redesign... */
div#topbar {
	width: auto;
	height: 130px;
	background: #ccd0ea;
	border-bottom: px black solid ;
}

/* Logo */
#logo { 
	z-index: 2;
	position: absolute;
	left: 110px;
	top: 87px;
	width: 393px;
	height: 43px;
}
 h1 {
	text-indent:40px;
       font-size: 0px;
	margin: 0;
	padding: 0;
	border: 0;
}
h1 a:link, h1 a:visited	
h1 a:link, h1 a:visited	

/* This is the rollover on the logo, it's one image we just shift, so it's nice and quick */
div#logo h1 a:hover, div#logo h1 a:active	{
	;
}

/* Top left image */
div#himgleft {
 	float: left;
	height: 100px;
	width: 1000px;
	background: url(/images/2008/04/395544.png) top left no-repeat;
margin: 30px 5px 5px 5px;
}



/* Defines the left and middle column, set the right margin of the center col with this... */
div#threecol {
	margin: 0px 218px 0px 0px;
}

/* Two col, we set this to keep it consistant, just a nice 16px space down the right... */
div#twocol {
	margin: 0px 16px 0px 0px;
}

/* Left column */
div#leftcolumn {
	position: absolute; 
	background: #eff3f4;
	left: 0px;
	top: 131px;
	width: 140px;
	margin: 0px;
	padding: 0px;
	border-right: 1px dotted #000;
	border-bottom: 1px dotted #000;
}

/* Main content column */
/* Set the position of the left side of the main content with this */
/*MB*/

div#maincontent {
	position: relative;
	margin: 0 0 0 167px;
	padding: 0;
}

/*Firefox */
html>body div#maincontent {
	position: relative;
	margin: 0 0 0 147px;
	padding: 0;
}

/* Right column, homepage only I think... */
div#rightcolumn {
	position: absolute;
	right: 0px;
	top: 131px;
	width: 210px;
	margin: 0px;
	border-left: 1px dotted black;
	border-bottom: 1px dotted black;
	background: #eff3f4;
}

/* The left and right col headers */
div#rightcolumn h2, div#leftcolumn h2 {	
	background: #ccd0ea;
	border-top: 1px dotted black;
	border-bottom: 1px dotted black;
	font-size: 1.3em;
	padding: 2px 2px 2px 6px;
	margin: 0px;
	font-weight: bold;
}

/* Left and right col paragraphs */
div#rightcolumn p, div#leftcolumn p {
	padding: 5px;
	margin: 0px
}

/* Images in left column (thesk banner at the moment) */
div#leftcolumn img {
	border-top: 1px dotted black;
	border-bottom: 1px dotted black;
	margin-top: 4px;
	margin-bottom: 12px;
}

/* Special for publish button */
div#publishbutton h3 {
	width: auto;
	margin: 12px 10px 0px 10px;
	padding: 0;
	text-align: center;
	border: 1px solid black;
}
div#publishbutton h3 a {
	display: block;
	background: #ffffff url(/img/publish.gif) 48px -6px no-repeat;
	padding: 6px 4px 4px 4px;
	text-transform: uppercase;
	text-decoration: none;
}
div#publishbutton h3 a:hover {
	color: #fff;
	background: #06C;
}
div#publishbutton p {
	width: auto;
	text-align: center;
	margin-bottom: 0;
}

/* Special for search area */
div#searchnewswire {
	width: auto;
	text-align: center;
	padding: 0;
	margin: 0;
}
form {
	padding: 0;
	margin: 0;
}
.searchbutton {
	border: 1px solid #06C;
	background: #06C;
	color: #ffffff;
}
label {
	font-size: smaller;
	position: relative;
	top: -3px;
	font-weight: bold;
}
input {
	font: small/1.4 "Lucida Grande", "Trebuchet MS", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
}


/* Newswire */
div#newswire p {
 margin: 0 0 0 24px;
 padding: 0;
}
div#newswire img {
	display: inline;
	float: left;
	position: relative;
	top: 4px;
	left: 6px;
}
div#newswire em {
	margin: 0 0 5px 0;
	display: block;
	font-size: 0.9em;
	font-style: normal;
}
div#newswire img.xml {
	padding: 4px 0 20px 120px;
}

/* MAIN CONTENT STUFF */

/* Bold up all links in central col */
div#maincontent a { 
	font-weight: bold; 
}

/* Features and 'start'??? headers */
div.start h2, div.start h1, div.features h2, div.features h1 {
	font-size: 1.3em;
	padding: 0 0 12px 0;
	margin: 0;
}

div.article h1 {
	font-size: 1.6em;
	padding: 0 0 12px 0;
	margin: 0;
}

/* Timestamp in header */
div.start em.datetime, div.features em.datetime {
	float: right;
	font-style: italic;
	margin-left: 30px;
}

div.article em.datetime {
	float: right;
	font-style: italic;
	margin: 0.6em 0 0 0;
}

/* Padding around images */
div.features img, div.start img, div.breaking img, div.article img {
	float: left;
	margin: 4px 18px 10px 0;
	border: 1px solid black;
}

/* Main content paras */
div.breaking p, div.start p, div.features p, div.article p {
	padding: 0 0 1.3em 0;
	margin: 0;
}

div p.fullstory {
        padding: 0 0 0.2em 0;
	text-align: right;
}

div.breaking blockquote, div.start blockquote, div.features blockquote, div.article blockquote {
	padding: 0 16px 0 16px;
	margin: 0;
	font-style: italic;
}

div.breaking blockquote em, div.start blockquote em, div.features blockquote em, div.article blockquote em {
	display: block;
	padding: 0 0 0 10px;
	margin: 0;
	font-style: normal;
	font-weight: bold;
}



/* Breaking NEWS! */
div.breaking {
	margin: 2px 0 2px 0;
	padding: 1px 9px 1px 19px;
 	border: 1px dotted #000000;
	background: url(/img/breaking.gif) 5px 6px no-repeat;
}
div.breaking h2 {
	text-transform: uppercase;
	font-size: 1.9em;
	padding: 0 0 20px 80px;
	margin: 0;
}
div.breaking em.datetime {
	color: #CD4227;
	float: right;
		font-weight: bold;
	font-size: 1.2em;
	margin-left: 30px;
}

/* The rest of the divs all need some padding at the top */
div.features, div.article {
	padding: 10px 0 0 0;
}

/* Some have line breaks between them */
div.features hr, div.start hr {
display: block;
	clear: left;
	margin: 0;
	color: black;	
	padding: 0;
	border: 0;
 	height: 1px;
	background-color: black;
}

/* Others have the line break but soley to make sure the box expands for tall images */
div.breaking hr, div.article hr, div.comment hr {
	display: block;
	clear: left;
	margin: 1px;
 	visibility: hidden;
}

/* We've got an 'intro' div for articles and so on */
span.intro {
	font-style: italic;
	padding: 16px;
	display: block;
	border: 1px dotted black;
	background: #ccd0ea;
}

/* A couple of more heading styles for articles */
div.article h3 {
	padding: 0 0 0.2em 0;
	margin: 0;
	font-size: 1.4em;
	font-style: italic;
}
div.article h4 {
	padding: 0 0 0.2em 0;
	margin: 0;
	font-size: 1.2em;
	font-style: italic;
}

/* Kind of image gallery styles for article pages? */
div.bigimage {
	padding: 0 0 16px 16px;
	margin: 0;
}
div.bigimage img {
	display: block;
	float: none;
	padding: 0;
	margin: 0;
}
div.bigimage p {
	padding: 0 0 0 32px;
	margin: 0;
	font-style: italic;
	font-weight: bold;
}

/* For 'actions' at the end of articles... */
div.action {
	margin: 10px 16px 16px 16px;
	padding: 8px;
	border: 1px dotted black;
	background: #FCF7BF;
	text-align: center;
}

/* Comments */
div#comments h2 {
	font-size: 1.4em;
	padding: 6px 0 6px 0;
	border-top: 1px dotted black;
	border-bottom: 1px dotted black;
	margin: 16px 0 20px 0;
}

div.comment {
	border: 1px dotted black;
	padding: 16px;
	margin: 0px 16px 16px 16px;
	background: #eee;
}

div.comment h3 {
	font-size: 1.3em;
	padding: 0 0 0.4em 0;
	margin: 0;
}

div.comment span.datetime {
	width: auto;
	display: block;
	text-align: right;
	font-style: italic;
	font-weight: bold;
	padding: 0;
	margin: 0;
}

div.comment p {
	padding: 0 0 1.3em 0;
	margin: 0;
}


/* Events area, homepage only I think...*/
h2#eventsheader {
	width: auto;
	text-align: right;
	margin: 3px 0 0 0;
	padding: 0;	
	font-size: 1.3em;
}
div#events {
	display: block;
	width: auto;
	border: 1px dotted black;
	margin: 3px 0px 0px 0px;
	padding: 4px;
	background: #FCF7BF;
	font-size: 0.9em;
}
div#events ul {
	margin: 0 !important;
	padding: 0 !important;
}
div#events li {
	margin: 2px 0 0 10px;
	padding: 0;	
	list-style-type: none;
	display: block;
	overflow: hidden;
}
div#events p {
	margin: 0;
	padding: 0;
	border: 0;
}


div#moto {
	display: none;
}

div#bottomlinks {
	margin: 10px 0 0 0;
}

/* stuff aded by chris on 2005-11-18 follows... -->

/* article titles */
h1.arttitle {
	clear: both;
	text-indent: 0em;
	font-size: 1.6em;
}
h1.arttitle a:hover, 
h1.arttitle a:active {
	color: #000;
	background: transparent;
	text-decoration: none;
}

/* hidden articles and comments */
div.trash-article, 
div.trash div.comment {
	background: #666 url(/img/trash.gif) repeat top left;
	color: #000;
	padding: 1em;
	border: 1px dotted #000;
}
div.trash-message {
	color: #FFF;
	background: #000;
	padding: 1em;
        margin-bottom: 1em;
}
div.trash-message h2 {
	margin-top: 0em;
}
div.trash-message p {
	margin-bottom: 0em;
}
div.trash-message a:link, 
div.trash-message a:visited {
	color: #FFF;
	background: transparent;
	text-decoration: underline;
}

/* article thumbnail display */
div.articlecontent {
clear: both;
padding-top: 1em;
}

span.imageicon {
float: left;
width: auto;
text-align: center;
padding: 0.4em;
margin: 0.4em;
font-size: smaller;
font-style: italic;
font-weight: normal;
border: 1px solid #9d9da1;
}

span.imageicon img {
border: 1px solid #000;
margin: 0.4em;
}