@charset "utf-8";
/* CSS Document */
@import url(http://fonts.googleapis.com/css?family=Nunito:400,700);
@import url(http://fonts.googleapis.com/css?family=Handlee);

/* STRUCTURE */
body {
	font:400 90% "Nunito", sans-serif;
	background:#fff url(../images/bg-linen1.jpg) repeat top left;
	margin:0;
	padding:0;
	color:#000; /* text colour */
}
.clearfloat {clear:both; height:0;}
.container {
	width:960px;
	margin:0 auto; /* the auto value on the sides, coupled with the width, centres the layout */
  position:relative
}
.top {width:960px; height:20px;}
.header {
	background:url(../images/studio-header.jpg) no-repeat; 
	width:960px; 
	height:175px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}
.head-spacer-top {height:84px}
.head-spacer-mid {float:left; width:840px; height:48px}
#links {margin:0; padding:0}
#fb {float:left; width:100px; height:30px}
#donate {float:right; width:110px; height:30px; padding-right:20px}
.head-spacer-left {float:left; width:390px; height:30px; clear:none}
.menu {width:550px; float:left}
.wrapmid {
	width: 960px;	
  position: relative;
	border-radius:10px;
	box-shadow:0 0 25px #666;
}
.col-left {float:left; width:600px; padding:20px; position:relative}
.col-right {float:right; width:292px; padding:14px}
.content {
	float:left; 
	width:960px; 
	background:#fff url(../images/content-bg.jpg) top repeat-y;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
}
.newsbox {width:292px; border-bottom:#006699 solid 1px}
.caption-box {border:#006699 solid 1px; background-color:#ccff66; margin-bottom:10px}
.caption {font:700 0.9em "Nunito", sans-serif;; text-align:center; padding:2px 6px}
.support {
	height:50px;
	float:left; 
	width:920px;
	background-color:#ccff66;
	padding:10px 20px;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
}
.footer {width:960px; margin:10px auto; text-align:center; clear:both}
.footer-left {float:left; width:470px; text-align:left}
.footer-right {float:right; width:470px; text-align:right}

/* CONTENT */
hr {color:#006699; clear:both}
img.centred {display:block; margin:0 auto}
img.left {float:left; margin-right:10px}
img.right {float:right; margin-left:10px}
img.head {display:block; margin:0 auto; margin-bottom:10px}

/* TEXT STYLES*/
h1, h2, h3, h4, h5, h6, p {margin-top:0} /* removing the top margin gets around an issue where margins can escape from their containing div. 
											The remaining bottom margin will hold it away from any elements that follow. */
h1 {width:100%; height:30px; text-align:center; font-size:1.6em; font-weight:bold; color:#fff; background-color:#006699; margin-bottom:20px}
h2 {font-size:1.2em; font-weight:bold; text-align:left; color:#006699; margin:1px 0 3px 0}
h3 {font-size:1.2em; font-weight:bold; text-align:left; color:#333333; margin:10px 0}

a img {border:none}
p {
	padding-bottom:10px;
	margin:0;
	color: #333333;
	line-height:1.2em;
}
.newsbox p {font:normal 1em Georgia, "Times New Roman", serif; text-align:justify}
.newsbox p.ragged {text-align:left}

p.copyright {font-size:0.7em; color:#333333}
p.blue {color:#006699}

.hilite {font-weight:bold; color:#006699}

a:link {text-decoration:underline; color:#006699}
a:visited {text-decoration:underline; color:#006699}
a:hover {text-decoration:underline; color:#333333}

.blue-bold {color:#006699; font-weight:bold}
.qualif {font-size:1.2em}

/* VIDEO LINKS */
/* large */
.triggers {
	padding-bottom:20px;
	width:160px;
	float:left;
}
.trigger {
	cursor:pointer;
	background-color:#fff;
}
.vidinfo {
	float:left;
	width:430px;
	padding-bottom:8px;
	padding-left:5px;
}
/* small */
.vidwrap-s {float:left; width:270px}
.vidwrap-l {float:left; width:270px;}
.vidwrap-r {float:right; width:270px;}
.s-trigs {float:left; width:90px; height:90px}
.s-info {float:left; width:500px; padding-left:5px}

a.video {font-weight:bold; color:#006699; text-decoration:underline; cursor:pointer;}
a.video:link {color:#006699;}
a.video:visited {color:#006699;}
a.video:hover {color:#333333;}

/* MENUBAR */
#menubar {margin:0; padding:0}
	
#menubar li
	{	float:left;
		list-style:none}

#menubar li a
	{	display:block;
		background:url(../images/roll-btn-blu110-flat.png) no-repeat;
		width:110px;
		height:18px;
		padding:6px 0;
		text-align:center;
		text-decoration:none;
		color:#fff;
}
		
#menubar li a:hover {background-position:0 -30px;}
				
#menubar li ul
		{	margin: 0;
			padding: 0;
			position: absolute;
			visibility: hidden;
			z-index:1000}
		
#menubar li ul li
		{	float: none;
			height:30px;
			display: inline}
		
#menubar li ul li a
		{	width: auto;
			padding:6px 8px; /* top-bottom\left-right */
			text-align:left;
			border:none;
			background:url(../images/roll-btn-grn-slice.png) repeat-x;
			color:#000;
}
		
#menubar li ul li a:hover
		{
		background-position:0 -30px;
		}