/* RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}


/* Layout */
body {
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
}

#wrapper {
	position: relative;
	margin: 0 auto 0 auto;
	text-align: left;
}

#header {
	border-bottom: 10px solid black;
}

#header h1 {
	width: 373px;
	height: 216px;
}

ul#navigation {
  float: left;
  margin: 0 0 10px 0; padding: 0;
  font-size: 25px;
  text-align: center;
}
#navigation li { float: left; }
#navigation li a { display: block;  padding: 10px 10px; }

#whoare {
	float: right;
	width: 223px;
	height: 500px;
	margin: 10px 10px 0 0;
	padding: 90px 10px 0 10px;
	background: url(../images4/whoare_top.gif) top left no-repeat;
}

#content {
	clear: left;
	margin: 10px;
}


/* Graphics */
#header {
  background: #def0f7 url(../images4/nick_banner.png) no-repeat right bottom;
}

#header h1 {
  background: url(../images4/turtleblack.png) no-repeat;
}
#header h1 span { display: none; }

#navigation li a { color: inherit; text-decoration: none; font-weight: bold; }
#navigation li.blue { color: #4aa0cc; }
#navigation li.blue a:hover,
#navigation li.blue a.current { color: white; background-color: #4aa0cc; }
#navigation li.purple { color: #c971da; }
#navigation li.purple a:hover,
#navigation li.purple a.current { color: white; background-color: #c971da; }
#navigation li.green { color: #3fa62b; }
#navigation li.green a:hover,
#navigation li.green a.current { color: white; background-color: #3fa62b; }
#navigation li.yellow { color: #e0cd69; }
#navigation li.yellow a:hover,
#navigation li.yellow a.current { color: white; background-color: #e0cd69; }

/* Type */
body { font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 16px; }
#content h2 { font-family: Verdana, sans-serif; font-weight: normal; }
#whoare {font-size: 12px; line-height: 14px;}

/* Bios */

ul.people li {
  margin-bottom: 20px;
  clear: left;
}

ul.people li h2 {
  float: left;
  width: 129px;
  margin: 0 10px 20px 0;
  padding: 203px 5px 3px 5px;
  font-size: 1.4em;
  line-height: 1.1em;
  text-align: center;
}
ul.people li.michael h2 { background-image: url(../images4/michael_thumb.jpg); }
ul.people li.nickon h2  { background-image: url(../images4/nickon_thumb.jpg); }
ul.people li.clayton h2 { background-image: url(../images4/clayton_thumb.jpg); }
ul.people li.nicole h2  { background-image: url(../images4/nicole_thumb.jpg); }
ul.people li.carlo h2   { background-image: url(../images4/carlo_thumb.jpg); }
ul.people li.olivia h2  { background-image: url(../images4/olivia_thumb.jpg); }
ul.people li.nick h2    { background-image: url(../images4/nick_thumb.jpg); }
ul.people li h2 { background-repeat: no-repeat; }

ul.people li.blue h2 { color: white; background-color: #4aa0cc; }
ul.people li.purple h2 { color: white; background-color: #c971da; }
ul.people li.green h2 { color: white; background-color: #3fa62b; }
ul.people li.yellow h2 { color: white; background-color: #e0cd69; }
ul.people li h2 a { color: inherit; text-decoration: none; }


/* Episodes */
ul.episodes li { margin-bottom: 20px; background: #DDDDDD; }

ul.episodes h2 { font-size: 1.5em; line-height: 1em; padding: .25em 0; font-weight: bold !important; }

ul.episodes dl { float: left; margin: .25em 0; }
ul.episodes dt { float: left; font-weight: bold; margin-right: 3px; clear: left; }
ul.episodes dt:after { content: ': '; }
ul.episodes dd { float: left; }
ul.episodes p.description { clear: left; padding: .5em; margin-top: .5em; background: #FFFFFF; }

div.thumbnails { position: relative; float: left; width: 130px; margin-right: 10px; }
div.thumbnails ul { float: left; display: none; }
div.thumbnails ul li { float: left; display: none; margin: 0; width: 130px; height: 97px; }
div.thumbnails a.play { position: absolute; bottom: 0; left: 0; width: 130px; height: 97px; background: url(../images4/play.png) no-repeat bottom left; }
div.thumbnails a.play span { display: none; }
