/* <!-- */
/* General styles */
body {
	margin:0;
	padding:0;
	border:0;			/* This removes the border around the viewport in old versions of IE */
	width:100%;
	background:#000;
	color: #000;
	min-width:600px;    /* Minimum width of layout - remove line if not required */
	/* The min-width property does not work in old versions of Internet Explorer */
	font: 76% Helvetica,Arial,sans-serif;
	text-align:center;
}
a {
color:#369;
}
a:hover {
	color:#fff;
	background:#369;
	text-decoration:none;
}
h1, h2, h3, h4, h5 {
	margin:0;
	padding:0;
}
p {
	margin:0;
	padding:0;
	}
img {
	margin:0;
	padding:0;
}
/* Header styles */
#header {
	clear:both;
	float:left;
	width:100%;
}
#header {
	border-bottom:1px solid #000;
	height: 252px;
}
#header-left {
	background: url(/photos/DougAtThePiano2.jpg) no-repeat left bottom;
	background-size: 541px 370px;
	float: left;
	height: 252px;
	width: 333px;
}
#header-center {
	background: url(/images/DougLogo.png) no-repeat center top #231F20;
/*	background-size: 583px 258px; */
	background-size: 689px 305px;
	height: 252px;
	min-width: 600px;
}
#header-right {
	background: url(/photos/DougAtWeddingReception.jpg) no-repeat right top;
	background-size: 462px 300px;
	float: right;
	height: 252px;
	width: 331px;
}

/* column container */
.colmask {
position:relative;		/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	clear:both;
	float:left;
	width:100%;				/* width of whole page */
	overflow:hidden;		/* This chops off any overhanging divs */
}
/* holy grail 3 column settings */
.holygrail {
	/* background:#FFFF99;    	/* Right column background colour */
	background: url("/images/right.jpg") repeat scroll right top transparent;
}
.holygrail .colmid {
	float:left;
	width:200%;
	margin-left:-324px; 	/* Width of right column */
	position:relative;
	right:100%;
	background:#FFFFFF;    	/* Centre column background colour */
}
.holygrail .colleft {
	float:left;
	width:100%;
	margin-left:-50%;
	position:relative;
	left:657px;         	/* Left column width + right column width */
	/* background:#FFD8B7;    	/* Left column background colour */
	background: url("/images/left.jpg") repeat right top transparent;
}
.holygrail .col1wrap {
	float:left;
	width:50%;
	position:relative;
	right:333px;        	/* Width of left column */
	padding-bottom:1em; 	/* Centre column bottom padding. Leave it out if it's zero */
	background: url("/images/left.jpg");}
.holygrail .col1 {
	margin:0 324px 0 333px;     	/* Centre column side padding: 
	Left padding = left column width + centre column left padding width
	Right padding = right column width + centre column right padding width */
	position:relative;
	left:200%;
	overflow:hidden;
	text-align:center;
	background-color: #ffffff;
}
.holygrail .col2 {
	float:left;
	float:right;			/* This overrides the float:left above */
	width:333px;        	/* Width of left column content (left column width minus left and right padding) */
	position:relative;
	right:0px;         	/* Width of the left-had side padding on the left column */
}
.holygrail .col3 {
	float:left;
	float:right;			/* This overrides the float:left above */
	width:324px;        	/* Width of right column content (right column width minus left and right padding) */
	margin-right:0px;  	/* Width of right column right-hand padding + left column left and right padding */
	position:relative;
	left:50%;
}
/* Footer styles */
#footer {
	clear:both;
	float:left;
	width:100%;
	border-top:1px solid #000;
	text-align:center;
	background: url("/images/footer.jpg");
	height: 357px;
}

.frme{
margin: 1em;
}

#content {
margin: 0;
background-color: #ffffff;
}

.article {
border-top: 1px solid;
margin: 0 2% 0.5em;
padding-top: 0.2em;
text-align: center;
}
.article:first-of-type{
border-top: none;
}
.article .articlecolumn {
max-width: 46%;
margin: 0 1% 0.5em;
float: left;
text-align: justify;
}
.article .imgleft {
max-width: 100%;
}
.article p {
text-align: center;
margin-left: 1em;
margin-right: 1em;
margin-bottom: .5em;
}
.article .reading {
text-align: left;
text-indent: none;
margin-left: 1em;
margin-right: 1em;
margin-bottom: .5em;
max-width: 250px;
}

.clear { clear: both; height: 0; }

#content ul {
list-style: none;
text-align: left;
margin: 2px 0 0 11px;
}

#content ul li {
background: url('/images/bullet_label.jpg') no-repeat scroll left 0.5em;
line-height: 3em;
padding-left: 36px;
}

div.float, div.floatnob {
float: left;
}

div.floatnob{
margin-left: 10px;
}

div.x {
float:left;
}

div.float img {
height: 100px;
margin: 5px 10px 0;
}

div.float p{
width: 130px;
font-size: smaller;
}

div.spacer {
  clear: both;
}
div.wh {
  background-color: #FFFFFF;
}
.vid {
height: 0;
margin: 0 auto;
padding-bottom: 56.25%;
position: relative;
width: 75%;
}
.vid .ifrm {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
 }
/* --> */