/*
	Author	:	Christopher Robinson
	Email		:	christopher@edg3.co.uk
	Website	:	http://www.edg3.co.uk/
*/
* {
	border:0;
	margin:0;
	padding:0;
}

/* general */
a {
	color:#b484da;
	text-decoration:none;
}
a:hover {
	color:#666;
	text-decoration:underline;
}
blockquote {
	background:#f1f1f1;
	border-left:2px solid #7534aa;
	color:#444;
	display:block;
	font-style:oblique;
	line-height:20px;
	margin:0 0 0 10px;
	padding:0 0 0 10px;
}
.left {
	float:left;
	margin:0 10px 0 0;
}
.right {
	float:right;
	margin:0 0 0 10px;
}

/* body */
body {
	background:#fff url('image/background_body.jpg') repeat-x top;
	color:#666;
	font:0.7em Verdana, "Trebuchet MS", Georgia, "Times New Roman", Times, serif;
}

/* header */
#header {
	background:url('image/background_header2.jpg');
	height:320px;
	margin:0 auto;
	position:relative;
	width:760px;
}
#header:after {
	clear:both;
	content:'.';
	display:block;
	height:0;
	visibility:hidden;
}
#header h1 {
	color:#666;
	font-size:40px;
	font-weight:400;
	left:0;
	letter-spacing:-2px;
	position:absolute;
	top:40px;
}
#header p {
	bottom:70px;
	color:#fff;
	font-size:20px;
	position:absolute;
	right:25px;
}
#header ul {
	list-style:none;
	position:absolute;
	top:100px;
}
#header ul li {
	list-style:none;
}
#header ul li a {
	color:#fff;
	display:block;
	font-size:14px;
	font-weight:700;
	height:20px;
	padding:10px;
	width:190px;
}
#header ul li a:hover {
	background:#b484da;
	color:#eee;
	text-decoration:none;
}

/* content */
#content {
	height:auto;
	margin:0 auto;
	width:760px;
}
#content:after {
	clear:both;
	content:'.';
	display:block;
	height:0;
	visibility:hidden;
} 

/* sidebar */
#sidebar {
	float:left;
	width:210px;
}
#sidebar h1 {
	border-bottom:2px solid #7534aa;
	color:#444;
	font-size:165%;
	font-weight:400;
	line-height:30px;
	padding:0 10px;
}
#sidebar input {
	background:#f1f1f1;
	color:#555;
	margin:10px;
	padding:5px;
	width:180px;
}
#sidebar p {
	background:#f1f1f1;
	color:#555;
	display:block;
	font-size:90%;
	line-height:20px;
	margin:10px 0;
	padding:10px;
}
#sidebar p a.more {
	display:block;
	text-align:right;
}
#sidebar ul {
	margin:10px;
}
#sidebar ul li {
	border-bottom:1px solid #b484da;
	list-style:none;
	padding:5px 2px;
}
#sidebar ul li a {
	color:#333;
	display:block;
	font-family:Geneva;
	padding:5px;
	text-decoration:none;
}
#sidebar ul li a:hover {
	color:#000;
}

/* Main */
#main {
	float:right;
	width:520px;
}
#main p {
	color:#555;
	line-height:20px;
	padding:10px;
}
#main h1 {
	border-bottom:2px solid #7534aa;
	color:#444;
	font-size:165%;
	font-weight:400;
	line-height:30px;
	padding:0 10px;
}

#main h2 {
	color:#444;
	font-size:165%;
	font-weight:400;
	line-height:30px;
	padding:0 10px;	
	
}

/* wrap for XHTML & CSS valid icons and any other elements inside the main section */

.wrap {width: 500px;}
.icon {width: 88px; padding: 10px; float: left;}

/* footer */
#footer {
	margin:10px auto;
	width:760px;
}
#footer:after {
	clear:both;
	content:'.';
	display:block;
	height:0;
	visibility:hidden;
}
#footer p {
	border-top:2px solid #7534aa;
	color:#555;
	font-size:90%;
	line-height:20px;
	padding:10px;
	text-align:center;
}

/* Styling for family.html */



.container {
	width: 500px;
	margin: 5px auto 0 20px;
}

.figure {
	float: left;
	width: 150px;
	margin-left:5px;
}

.photo {
	padding: 10px 0 0 0;
	width: 150px;
	float: inherit;
}

.photo img {
	border: 1px solid #666;
	background-color: #FFF;
	padding: 4px;
	position: relative;
}

.caption {
	padding: 0;
	margin: 0;
	width: 150px;
	float: inherit;
}

.clear {clear:both;}

.instructions {font-size:9px; margin-top: 10px;margin-bottom:-15px; border-top:#7534AA 1px solid;}


/* Formatting for rip-june.html */

.container-rip {
	width: 100%;
	/* margin: 5px auto 10px 10px; */
	
}

.figure-left {
float: left;
margin: 12px 12px 0 12px;
width: 210px;
}

.figure-rip {
margin-left: 12px;
width: 210px;
}

.photo-rip {
	padding-top: 2px;
	width: 210px;
	float: inherit;
}

.photo-rip img {
	border: 1px solid #666;
	background-color: #FFF;
	padding: 4px;
	position: relative;
}

.caption-rip {
width: 210px;
padding-top: 3px;
}

/* Boxes side by side */

.b-left {
    display: inline-block;
    position: relative;
    margin: 1%;
	padding: 5px;
    float: left;
    width: 42%;
    height: 210px;
    /* background-color: lightgrey; */
}

.b-right {
    display: inline-block;
    position: relative;
    margin: 1%;
	padding: 5px;
    float: left;
    width: 42%;
    height: 210px;
    /* background-color: lightgrey; */
}

.indent-list-outer {
	margin: 20px;
}

/* Three images side-by-side */

.photo-b1-3 {
	padding-top: 2px;
	width: 105px;
	float: inherit;
}

.photo-b1-3 img {
	border: 1px solid #666;
	background-color: #FFF;
	padding: 4px;
	position: relative;
}

.b1-3-figure {
	width: 100%;
}

.b1-3-caption1-3 {
	width: 100%;
	padding: 5px;
	height: 30px;
	clear: left;
	font-style: italic;
	text-align: center;
}

.b1 {
    display: inline-block;
    position: relative;
    margin: 1%;
	padding: 5px;
    float: left;
    width: 29%;
    height: 150px;
    /* background-color: lightgrey; */
}

.b2 {
    display: inline-block;
    position: relative;
    margin: 1%;
	padding: 5px;
    float: left;
    width: 29%;
    height: 150px;
    /* background-color: lightgrey; */
}

.b3 {
    display: inline-block;
    position: relative;
    margin: 1%;
	padding: 5px;
    float: left;
    width: 29%;
    height: 150px;
    /* background-color: lightgrey; */
}

.rip-under-heading-spacer {
	margin-top: 10px;
}

/* Indent nested list */

.indent-list-outer {
	margin: 20px;
}


.indent-list {
	margin-left: 20px;
	margin-bottom: 15px;
}

#highlight {
	width: 520px;
	background: #8B46D2;
	margin-top: 10px;
	margin-bottom: 10px;
	
	/* padding: 10px; */
}

#highlight p {
  color:#FFFFFF;
  font-size:20px;
  padding: 0;
}

 #highlight a:hover {
  background:#B484DA;
  color:#EEEEEE;
  text-decoration:none;
}

 #highlight a {
  color:#FFFFFF;
  display:block;
  font-size:14px;
  font-weight:700;
  height:20px;
  padding:10px;
}

/* YouTube video container to make it responsive */

.youtubevideowrap {	
	width: 80%;
    max-width: 520px;
    margin-left: 10px;
}

.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}