body{
margin:0;
padding:0;
font-family:"Arial";font-size:100%;line-height:110%;
background: #000000;
}

p{font-family:"Arial";color:#dadada;font-size:1.0em;text-align:justify;}
p.logo{font-family:"Arial";color:#FFFFFF;font-size:1.125em;font-weight:bold;text-align:justify;}
p.heading{font-family:"Arial";color:#FFFFFF;font-size:1.0em;font-weight:bold;text-align:justify;}
p.maintext{font-family:"Arial";color:#dadada;font-size:0.938em;text-align:justify;}
p.genealogyname{font-family:"Arial";color:#0066CC;font-size:0.938em;font-weight:bold;text-align:justify;}
p.genealogytext{font-family:"Arial";color:#999999;font-size:0.938em;font-style:italic;text-align:justify;}
p.newspapertext{font-family:"Arial";color:#cccccc;font-size:0.938em;text-align:justify;}
p.newspaperref{font-family:"Arial";color:#999999;font-size:0.875em;text-align:justify;}
p.footer{font-family:"Arial";color:#808080;font-size:0.938em;text-align:justify;}
b{font-family:"Arial";font-size:100%;}
em{color:#FFFFFF;}

.newspaperref {
  font-size:0.625em; font-weight: bold; color: #999999
}

.quotation {
  font-size:0.938em; font-weight: bold; color: #999999
}



a:link {color:#f7941d;}    /* unvisited link */
a:visited {color:#f7941d;} /* visited link */
a:hover {color:#fdd8ae;}   /* mouse over link */
a:active {color:#f7941d;}  /* selected link */

a:link {text-decoration:none;}    /* unvisited link */
a:visited {text-decoration:none;} /* visited link */
a:hover {text-decoration:none;}   /* mouse over link */
a:active {text-decoration:none;}  /* selected link */

#topsection{
background: #000000;
height: 80px; /*Height of top section*/
}


.gallerycontainer{
position: relative;
}

.thumbnail img{
border: 1px solid white;
margin: 0 3px 3px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid white;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: gray;
padding: 5px;
left: -0px;
border: 1px solid white;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: -20px;
left: 38px;
z-index: 50;
}




#topsection 
h1
{font-family:"Arial";color:#000000;font-size:0.25em;text-align:justify;margin:0;padding-top:0px;}
h2
{font-family:"Arial";color:#cc6600;font-size:1.05em;font-weight:bold;text-align:justify;margin:0;padding-top:0px;padding-bottom:10px;}
img { border: 0;}

#contentwrapper{
float: left;
width: 100%;
}

#links
{
width:100%;font-family:"Arial";color:#000000;font-size:1.0em;text-align:justify;border-collapse:collapse;
}
#links td 
{
vertical-align:top;text-align:left;font-family:"Arial";color:#dadada;font-size:1.0em;text-align:justify;border:1px solid #000000;
padding:10px 10px 10px 0px;
}
#links th 
{
vertical-align:top;text-align:left;font-family:"Arial";color:#dadada;font-size:1.0em;text-align:justify;border:1px solid #000000;
padding:0px 0px 10px 10px;
}

#contentcolumn{
margin-right: 640px; /*Set right margin to (LeftColumnWidth + RightColumnWidth)*/
background: #000000;
}

#googlead
{
width:100%;font-family:"Arial";color:#000000;font-size:1.0em;text-align:center;border-collapse:collapse;
}
#googlead td 
{
vertical-align:top;text-align:center;font-family:"Arial";color:#dadada;font-size:1.0em;text-align:center;border:1px solid #000000;
padding:0px 0px 0x 0px;
}
#googlead th 
{
vertical-align:top;text-align:center;font-family:"Arial";color:#dadada;font-size:1.0em;text-align:center;border:1px solid #000000;
padding:0px 0px 0px 0px;
}

#leftcolumn{
float: left;
width: 370px; /*Width of left column in pixels*/
margin-left: -640px; /*Set left margin to -(LeftColumnWidth + RightColumnWidth)*/
background: #000000;
}

#rightcolumn{
float: left;
width: 270px; /*Width of right column in pixels*/
margin-left: -270px; /*Set margin to -(RightColumnWidth)*/
background: #000000;
}

#footer{
clear: left;
width: 100%;
background: black;
color: #FFF;
text-align: center;
padding: 20px 0;
}

#footer a{
color: #FFFF80;
}

.innertube{
margin-top: 12px;
margin-bottom: 0px;
margin-right: 7px;
margin-left: 7px;
}

/* ####### responsive layout CSS ####### */

@media (max-width: 840px){ /* 1st level responsive layout break point- drop right column down*/

	#leftcolumn{
	margin-left: -370px; /*Set margin to -(LeftColumnWidth)*/
	}
	
	#rightcolumn{
	float: none;
	width: 100%;
	margin-left: 0;
	clear: both;
	}
	
	#contentcolumn{
	margin-right: 370px; /*Set margin to -(LeftColumnWidth)*/
	}
}

@media (max-width: 600px){ /* 2nd level responsive layout break point- drop left column down */
	#leftcolumn{
	float: none;
	width: 100%;
	clear: both;
	margin-left: 0;
	}
	
	#contentcolumn{
	margin-right: 0;
	}
}

#image1
{
width: 100%;
height: auto;
}

#image2
{
width: 100%;
height: auto;
}

#image3
{
width: 100%;
height: auto;
}

#image4
{
width: 100%;
height: auto;
}

#image5
{
width: 100%;
height: auto;
}

#image6
{
width: 100%;
height: auto;
}

#image7
{
width: 100%;
height: auto;
}

#image8
{
width: 100%;
height: auto;
}

#image9
{
width: 100%;
height: auto;
}

#image10
{
width: 100%;
height: auto;
}

#image11
{
width: 100%;
height: auto;
}

#image12
{
width: 100%;
height: auto;
}

#image13
{
width: 100%;
height: auto;
}

#image14
{
width: 100%;
height: auto;
}

#image15
{
width: 100%;
height: auto;
}

#image16
{
width: 100%;
height: auto;
}

#image17
{
width: 100%;
height: auto;
}

#image18
{
width: 100%;
height: auto;
}

#image19
{
width: 100%;
height: auto;
}

#image20
{
width: 100%;
height: auto;
}

#image21
{
width: 100%;
height: auto;
}

#image22
{
width: 100%;
height: auto;
}

#image23
{
width: 100%;
height: auto;
}

#image24
{
width: 100%;
height: auto;
}

#image25
{
width: 100%;
height: auto;
}

#image26
{
width: 100%;
height: auto;
}

#image27
{
width: 100%;
height: auto;
}

#image28
{
width: 100%;
height: auto;
}

#image29
{
width: 100%;
height: auto;
}

#image30
{
width: 100%;
height: auto;
}

#image31
{
width: 100%;
height: auto;
}

#image32
{
width: 100%;
height: auto;
}

#image33
{
width: 100%;
height: auto;
}

#image34
{
width: 100%;
height: auto;
}

#image35
{
width: 100%;
height: auto;
}

#image36
{
width: 100%;
height: auto;
}

#image37
{
width: 100%;
height: auto;
}

#image38
{
width: 100%;
height: auto;
}

#image39
{
width: 100%;
height: auto;
}

#image40
{
width: 100%;
height: auto;
}

#imageL1
{
width: 100%;
height: auto;
}

#imageL2
{
width: 100%;
height: auto;
}

#imageL3
{
width: 100%;
height: auto;
}

#imageL4
{
width: 100%;
height: auto;
}

#imageL5
{
width: 100%;
height: auto;
}

#imageL6
{
width: 100%;
height: auto;
}

#imageL7
{
width: 100%;
height: auto;
}

#imageL8
{
width: 100%;
height: auto;
}

#imageL9
{
width: 100%;
height: auto;
}

#imageL10
{
width: 100%;
height: auto;
}

#imageL11
{
width: 100%;
height: auto;
}

#imageL12
{
width: 100%;
height: auto;
}

#imageL13
{
width: 100%;
height: auto;
}

#imageL14
{
width: 100%;
height: auto;
}

#imageL15
{
width: 100%;
height: auto;
}

#imageL16
{
width: 100%;
height: auto;
}

#imageL17
{
width: 100%;
height: auto;
}

#imageL18
{
width: 100%;
height: auto;
}

#imageL19
{
width: 100%;
height: auto;
}

#imageL20
{
width: 100%;
height: auto;
}

#imageL21
{
width: 100%;
height: auto;
}

#imageL22
{
width: 100%;
height: auto;
}

#imageL23
{
width: 100%;
height: auto;
}

#imageL24
{
width: 100%;
height: auto;
}

#imageL25
{
width: 100%;
height: auto;
}

#imageL26
{
width: 100%;
height: auto;
}

#imageL27
{
width: 100%;
height: auto;
}

#imageL28
{
width: 100%;
height: auto;
}

#imageL29
{
width: 100%;
height: auto;
}

#imageL30
{
width: 100%;
height: auto;
}

#imageR1
{
width: 100%;
height: auto;
}

#imageR2
{
width: 100%;
height: auto;
}

#imageR3
{
width: 100%;
height: auto;
}

#imageR4
{
width: 100%;
height: auto;
}

#imageR5
{
width: 100%;
height: auto;
}

#imageR6
{
width: 100%;
height: auto;
}

#imageR7
{
width: 100%;
height: auto;
}

#imageR8
{
width: 100%;
height: auto;
}

#imageR9
{
width: 100%;
height: auto;
}

#imageR10
{
width: 100%;
height: auto;
}

#imageR11
{
width: 100%;
height: auto;
}

#imageR12
{
width: 100%;
height: auto;
}

#imageR13
{
width: 100%;
height: auto;
}

#imageR14
{
width: 100%;
height: auto;
}

#imageR15
{
width: 100%;
height: auto;
}

#imageR16
{
width: 100%;
height: auto;
}

#imageR17
{
width: 100%;
height: auto;
}

#imageR18
{
width: 100%;
height: auto;
}

#imageR19
{
width: 100%;
height: auto;
}

#imageR20
{
width: 100%;
height: auto;
}

#imageR21
{
width: 100%;
height: auto;
}

#imageR22
{
width: 100%;
height: auto;
}

#imageR23
{
width: 100%;
height: auto;
}

#imageR24
{
width: 100%;
height: auto;
}

#imageR25
{
width: 100%;
height: auto;
}

#imageR26
{
width: 100%;
height: auto;
}

#imageR27
{
width: 100%;
height: auto;
}

#imageR28
{
width: 100%;
height: auto;
}

#imageR29
{
width: 100%;
height: auto;
}

#imageR30
{
width: 100%;
height: auto;
}

#imageR31
{
width: 100%;
height: auto;
}

#imageR32
{
width: 100%;
height: auto;
}

#imageR33
{
width: 100%;
height: auto;
}

#imageR34
{
width: 100%;
height: auto;
}

#imageR35
{
width: 100%;
height: auto;
}

#imageR36
{
width: 100%;
height: auto;
}

#imageR37
{
width: 100%;
height: auto;
}

#imageR38
{
width: 100%;
height: auto;
}

#imageR39
{
width: 100%;
height: auto;
}

#imageR40
{
width: 100%;
height: auto;
}

.video {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	border-style: none;
	width: 100%;
	height: 100%;
}

.arrowlistmenu{
width: 100%; /*width of menu*/
}

.arrowlistmenu .headerbar{
font: bold 16px Arial;
color: #f7941d;
background: black url(http://www.midlandspubs.co.uk/images/titlebar.png) repeat-x center left;
margin-bottom: 4px; /*bottom spacing between header and rest of content*/
text-align:center;
padding: 4px 4px 4px 4px; /*header text is indented 10x*/
}

.arrowlistmenu ul{
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 4px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{
padding-bottom: 2px; /*bottom spacing between menu items*/
}

.arrowlistmenu ul li a{
color: #cccccc;
background: url(http://www.midlandspubs.co.uk/images/arrowbullet.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #dadada;
font-size: 90%;
}

.arrowlistmenu ul li a:visited{
color: #cccccc;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #ff9933;
background-color: #333333;
}