h1 { font-size:197%; }
h1.task-name { font-size:330%; font-family: "Adobe Garamond", Georgia, Garamond, "Times New Roman", serif; }
h1.task-name a { text-decoration:none; color:#333; border-bottom:2px dotted #ddd; }
h2 { font-size:174%; }
h3 { font-size:153.9%; color:#777; }
h4 { font-size:123.1%; }
html { background:#900; }
body { background:#900; background:url(/images/bg_body.png) top center repeat-x; }
a { color:#ffc; }
p.proper { margin:5px 0; }
strong { font-weight:bold; }
em { font-style:italic; }
#hd { height:150px; padding:40px 20px 20px 230px; background:url(/images/bg_hd.png) top center no-repeat; }
#hd a h1 { color:#040; font-size:450%; }
#hd p { font-size:146.5%; color:#390; }
#ft { text-align:center; }

/* FORMS */
fieldset { width: 100%; margin-bottom:1em; }
legend { font-size: 130%; font-weight: bold; margin-bottom: 1em; }
label { font-weight: bold; }
dd input, dd textarea, dd select { padding:.2em; font-size: 105%; }
form dl dd { margin-left:0; }

.desc { font-size: 88%; margin: .2em 0 .7em 31.3%; }
input.error { border: 2px solid; }
dd label { font-weight: normal; font-style: italic; font-family: Georgia, "Times New Roman", serif; font-size:90%; margin-bottom:-1em; }
dd.upload-file input { width:50%; }
dt.checkbox { float:left; margin:0 .5em 0 1em!important; }
dt.checkbox input { width:auto; height:auto; }
dd.checkbox { float:left; width:85%; }
dt label span { color: #FF0000; }
div.button input { padding: 0; width:auto!important; margin-right:10px; }

.regular { clear:both; }
	.regular dt { margin-bottom: .4em!important; }
	.regular dd { margin-bottom: .8em!important; }
	.regular dt.checkbox { width:3%; float:left; margin-right:1%; display:inline; }
	
.parallel { clear:both; margin:10px 0; }
	.parallel dt { width: 30%; float: left; text-align:right!important; margin: 0 .5em .8em 0!important; }
	.parallel dd { margin: 0 .5em .8em 0!important; }
	.parallel dd div.description { margin: 0.5em 0 0 31%; font-size:92.3%; color:#888; }
	.parallel input { width: 48%; }
	.parallel div.button { margin-left: 30.6%; }

.simple { clear:both; }
	.simple input, .simple select { font-size: 135%; }
	.simple .button { margin-top:.5em; }
	.simple .button input { font-size: 115%; }
	
	.regular dt { margin-bottom: .5em; padding-left:1em; }
	.regular dd { margin-bottom:1em; padding-left:1em; }
	.regular textarea { width: 80%; }
	.regular div.button input{ margin-top:.5em; }
	.regular dt.checkbox { float: left; margin: 0 .5em 0 0!important; }

.form-item-group { display: block; }
	.form-item-group dd.group-item { float: left!important; width:25.5%!important; display:inline!important; }
	.form-item-group dd.group-item p.desc { margin:0!important; }
	.form-item-group dd.group-item input { width: 85%!important; }
	.form-item-group dd.group-item em { width:6.8%; }

/* END FORMS */

table th, table td { padding:3px; border:1px solid #ccc; }	
table th { font-weight:bold; background:#ffc; }

p.intro { font-size:146.5%; line-height:1.8em; padding:180px 150px 20px 150px; }
p.sub-intro { font-size:123.1%; padding-top:20px; padding-bottom:10px; line-height:1.6em; }

div.main { width:910px; overflow:hidden; margin:0 auto; text-align:left; }
div.main div { float:left; margin:0; padding:0; display:inline; background-repeat:no-repeat; background-position:top center; }
div.main .gorilla { width:312px; height: 408px; background-image:url(/images/bg_main_01.png); }
div.main .masthead { width:598px; height: 227px; background-image:url(/images/bg_main_02.png); }
div.main .search { width:532px; height: 125px; padding:56px 0 0 66px; background-image:url(/images/bg_main_04.png); }
div.main .leftside { width: 147px; height: 660px; background-image:url(/images/bg_main_06.png); }
div.main .player { width: 763px; height: 660px; background-image:url(/images/bg_main_07.png); }

div.main .masthead h1 { width:500px; height:200px; display:block; }
div.main .masthead h1 span { display:none; }

div.main .search input { float:left; margin-right:15px; display:inline; }
div.main .search input.search-field { font-size:174%; width:280px; height:45px; }
div.main .search input.submit { background:url(/images/spacer.png); width:140px; height:50px; margin:0; }
div.main .search .recent { float:left; clear:both; margin-top:5px; font-size:77%; color:#f30; }
div.main .search .recent a { color:#fcc; }

div.main .player .player-container, div.main .player .files-container { float:left; margin: 0px 10px 0 0; display:inline; }
div.main .player .files-container { width:290px; height:200px; overflow-y:scroll; color:#999; }
div.main .player .player-container { width:300px; height:200px; margin-left:75px; }
div.main .player .files-container li { margin-bottom:5px; }
div.main .player .files-container li a { font-size:85%;  }
div.main .player .files-container small { font-size:85%; }
div.main .player .currently { padding:20px 0 0 160px; font-weight:bold }

#ft { width:880px; background:#000; padding:10px 30px; margin:10px auto; color:#f00; }

#myGallery, #myGallerySet, #flickrGallery
{
	width: 598px;
	height: 400px;
	z-index:5;
	margin:6px 0 0 77px; 
}

#flickrGallery
{
	width: 500px;
	height: 334px;
}

#myGallery img.thumbnail, #myGallerySet img.thumbnail
{
	display: none;
}

.jdGallery
{
	overflow: hidden;
	position: relative;
}

.jdGallery img
{
	border: 0;
	margin: 0;
}

.jdGallery .slideElement
{
	width: 100%;
	height: 100%;
	background-color: #000;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url('img/loading-bar-black.gif');
}

.jdGallery .loadingElement
{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color: #000;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url('img/loading-bar-black.gif');
}

.jdGallery .slideInfoZone
{
	position: absolute;
	z-index: 10;
	width: 100%;
	margin: 0px;
	left: 0;
	bottom: 0;
	height: 40px;
	background: #333;
	color: #fff;
	text-indent: 0;
	overflow: hidden;
}

* html .jdGallery .slideInfoZone
{
	bottom: -1px;
}

.jdGallery .slideInfoZone h2
{
	padding: 0;
	font-size: 80%;
	margin: 0;
	margin: 2px 5px;
	font-weight: bold;
	color: inherit;
}

.jdGallery .slideInfoZone p
{
	padding: 0;
	font-size: 60%;
	margin: 2px 5px;
	color: #eee;
}

.jdGallery div.carouselContainer
{
	position: absolute;
	height: 135px;
	width: 100%;
	z-index: 10;
	margin: 0px;
	left: 0;
	top: 0;
}

.jdGallery a.carouselBtn
{
	position: absolute;
	bottom: 0;
	right: 30px;
	height: 20px;
	/*width: 100px; background: url('img/carousel_btn.gif') no-repeat;*/
	text-align: center;
	padding: 0 10px;
	font-size: 13px;
	background: #333;
	color: #fff;
	cursor: pointer;
}

.jdGallery .carousel
{
	position: absolute;
	width: 100%;
	margin: 0px;
	left: 0;
	top: 0;
	height: 115px;
	background: #333;
	color: #fff;
	text-indent: 0;
	overflow: hidden;
}

.jdExtCarousel
{
	overflow: hidden;
	position: relative;
}

.jdGallery .carousel .carouselWrapper, .jdExtCarousel .carouselWrapper
{
	position: absolute;
	width: 100%;
	height: 78px;
	top: 10px;
	left: 0;
	overflow: hidden;
}

.jdGallery .carousel .carouselInner, .jdExtCarousel .carouselInner
{
	position: relative;
}

.jdGallery .carousel .carouselInner .thumbnail, .jdExtCarousel .carouselInner .thumbnail
{
	cursor: pointer;
	background: #000;
	background-position: center center;
	float: left;
	border: solid 1px #fff;
}

.jdGallery .wall .thumbnail, .jdExtCarousel .wall .thumbnail
{
	margin-bottom: 10px;
}

.jdGallery .carousel .label, .jdExtCarousel .label
{
	font-size: 13px;
	position: absolute;
	bottom: 5px;
	left: 10px;
	padding: 0;
	margin: 0;
}

.jdGallery .carousel .wallButton, .jdExtCarousel .wallButton
{
	font-size: 10px;
	position: absolute;
	bottom: 5px;
	right: 10px;
	padding: 1px 2px;
	margin: 0;
	background: #222;
	border: 1px solid #888;
	cursor: pointer;
}

.jdGallery .carousel .label .number, .jdExtCarousel .label .number
{
	color: #b5b5b5;
}

.jdGallery a
{
	font-size: 100%;
	text-decoration: none;
	color: inherit;
}

.jdGallery a.right, .jdGallery a.left
{
	position: absolute;
	height: 99%;
	width: 25%;
	cursor: pointer;
	z-index:10;
	filter:alpha(opacity=20);
	-moz-opacity:0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;
}

* html .jdGallery a.right, * html .jdGallery a.left
{
	filter:alpha(opacity=50);
}

.jdGallery a.right:hover, .jdGallery a.left:hover
{
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

.jdGallery a.left
{
	left: 0;
	top: 0;
	background: url('img/fleche1.png') no-repeat center left;
}

* html .jdGallery a.left { background: url('img/fleche1.gif') no-repeat center left; }

.jdGallery a.right
{
	right: 0;
	top: 0;
	background: url('img/fleche2.png') no-repeat center right;
}

* html .jdGallery a.right { background: url('img/fleche2.gif') no-repeat center right; }

.jdGallery a.open
{
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.withArrows a.open
{
	position: absolute;
	top: 0;
	left: 25%;
	height: 99%;
	width: 50%;
	cursor: pointer;
	z-index: 10;
	background: none;
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

.withArrows a.open:hover { background: url('img/open.png') no-repeat center center; }

* html .withArrows a.open:hover { background: url('img/open.gif') no-repeat center center;
	filter:alpha(opacity=80); }
	
	
/* Gallery Sets */

.jdGallery a.gallerySelectorBtn
{
	z-index: 15;
	position: absolute;
	top: 0;
	left: 30px;
	height: 20px;
	/*width: 100px; background: url('img/carousel_btn.gif') no-repeat;*/
	text-align: center;
	padding: 0 10px;
	font-size: 13px;
	background: #333;
	color: #fff;
	cursor: pointer;
	opacity: .4;
	-moz-opacity: .4;
	-khtml-opacity: 0.4;
	filter:alpha(opacity=40);
}

.jdGallery .gallerySelector
{
	z-index: 20;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: #000;
}

.jdGallery .gallerySelector h2
{
	margin: 0;
	padding: 10px 20px 10px 20px;
	font-size: 20px;
	line-height: 30px;
	color: #fff;
}

.jdGallery .gallerySelector .gallerySelectorWrapper
{
	overflow: hidden;
}

.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton
{
	margin-left: 10px;
	margin-top: 10px;
	border: 1px solid #888;
	padding: 5px;
	height: 40px;
	color: #fff;
	cursor: pointer;
	float: left;
}

.jdGallery .gallerySelector .gallerySelectorInner div.hover
{
	background: #333;
}

.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton div.preview
{
	background: #000;
	background-position: center center;
	float: left;
	border: none;
	width: 40px;
	height: 40px;
	margin-right: 5px;
}

.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton h3
{
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-weight: normal;
}

.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton p.info
{
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-weight: normal;
	color: #aaa;
}