/*
====================================================================================================================================
=STRUCTURE AND DEFAULTS
====================================================================================================================================
*/

body {
	margin:0;
	padding:0;
	height:100%;	/*this is needed to apply 100% height other divs in IE*/ 
	background-color: #000;
	font-family:"Helvetica", Arial, sans-serif;
	color: #CCC;
	font-size:62.5%;
	width:100%;
}

/* force scroll bar in Firefox to fix jogging bug */
html {overflow: -moz-scrollbars-vertical !important; }


#wrapper {
	/*border: 1px solid red;*/
	margin: 0 auto;
	text-align:center; /* centre in IE */
	width:99.8%;
	margin-top:15px;
}

h1.pageH1 {position:absolute;left:10px}/*push h1 of the page for accessibility*/

#wrapper.videoDownloads {margin-top:15px;}
#wrapper.imageGalleries {margin-top:15px;}
#wrapper.games {margin-top:15px;}
#wrapper.audio { margin-top:15px;}
#wrapper.kidsStuff {margin-top:15px;}
#wrapper.prizeForm {margin-top:15px;}

a {color:#fff;}
a:hover{color:#41525c}

img.left {float:left; margin-right: 10px; border: 1px solid #666; padding:4px;}
img.right{float:right; margin-left: 10px; border: 1px solid #666; padding:4px;}

img.icon {padding-right:5px; vertical-align:middle;}



/*
====================================================================================================================================
=TOP NAVIGATION
====================================================================================================================================
*/

ul#accessibilityOptions {display:none;}
/*IE6 Hack*/	
* html ul#accessibilityOptions {display:none;}
ul#nav {display:none;}


/* 
====================================================================================================================================
DEPARTMENT LINKS
====================================================================================================================================
*/

ul#departmentLinks{display:none;}
/*IE6 Hack*/
* html ul#departmentLinks {display:none;}


/*====================================================================================================================================
=ACCORDION
====================================================================================================================================*/

#accordion{position:relative;margin:0; width:auto;}

h3.toggler {
	cursor: pointer;
	border: 1px solid #333;
	background: #000;
	margin: 0 25px 4px 35px;
	*margin-left: 43px;
	clear:both;
	background: #000 url(../artwork/down-arrow.gif) right no-repeat;
	padding:5px 0 5px 20px;
	text-align:left;
	font-size:1.5em;
	text-transform:uppercase;
	color:#fff;
}

div.element p {margin:0px;padding:1px;}
.element p.accordionPara {margin:10px 40px 10px 40px; height:auto;font-weight:lighter;}

.element ul {list-style:none;}
.element ul li a{list-style:none;}

div.accordionTopElement {margin-left:110px;}

.element h4{margin:10px 30px 10px 40px; font-size:1.4em; color:#41525c; clear:both; border-bottom:1px solid #41525c; padding:10px 0 4px 0;}

.element h5 {margin:10px 35px 10px 40px; font-size:1.3em; color:#666;  font-weight:bold; clear:both;}

/* 
====================================================================================================================================
=CLIP PLAYER PAGE / HOME PAGE
====================================================================================================================================
*/


#playerWrap {
	/*border: 1px solid white;*/
	position:relative;
	font-size: 1.3em;
	width: 790px;
	margin: 0 auto;
	text-align:center;
	padding:2px;
}


#playerInner {
	border: 1px solid #333;
	background-color:transparent;
	width: 93%;
	height:550px;
	margin: 170px 20px 20px 32px;
}

#flashPlayer {
/*    border: 1px solid #333;
	background-color:#000;*/
   	margin-top: 7px;
    width:490px;
    height:420px;
    margin-left:230px;
}

ul#leftNav {
    border: 1px solid #333;
	background-color:#000;
    width:auto;
    text-align:left;
    list-style-type:none;
	float:left;
	margin:7px 0 0 20px;
	padding:10px;
}
ul#leftNav li {padding:2px 0 2px 10px; }
ul#leftNav li img {vertical-align:middle;}
ul#leftNav li a {text-decoration:underline;cursor:pointer;color:#666; font-size:1.1em; }
ul#leftNav li a:hover {color:#41525c;cursor:pointer;}

#noFlash {
	/*border: 1px solid green;*/
	position:absolute; /*position no flash message behind player*/
	left: 25%;
	top: 20%;
	text-align:center;
	z-index: 1;
}
	


/*
====================================================================================================================================
VIDEO DOWNLOADS
====================================================================================================================================
*/

#downloadContent span.topColumns {
   	border: 1px solid #333;
   	background-color: #000;
    width: 143px;
    margin:  15px 0px 10px 35px; 
    *margin-left: 36px;/* HACK IE 6&7 */
	*margin-bottom: -150px;/* HACK IE 6&7 */
    height: 155px;
    padding:6px;
    float:left;
}

#downloadContent a {text-decoration:underline;cursor:pointer;color: #666;}
#downloadContent a:hover {color:#41525c;cursor:pointer;}
#downloadContent img.Icon {vertical-align:top;}
#downloadContent img.accordIcon {vertical-align:middle;}



/*push down div from top of page */
#downloadContent { text-align:left;margin-top:170px;}

h1 {
	font-size: 1.4em;
	color:#FFF;
	background-color:#333;
	border-bottom: 1px solid #fff;
	width: 500px;
	margin-left: 50px;
}

h2.sectionHeader {
    margin-left:70px;
    margin-right:70px;
    margin-top: 10px;
	font-size: 1.4em;
	color: #41525c;
	border-bottom:1px solid #333;

}



#downloadContent ul li.col1{ /*clip titles*/
	list-style-type:none;
	font-weight:bold;
	font-size:.9em;
	line-height:1em;
	float:left;
	width: 300px;
	padding:0;
	margin:-10px 0px -8px 70px;/*Set margins in FX to rectify header loop isue */ 
	*margin:-15px 0px -10px 70px;/*Set margins in IE7 to rectify header loop isue */ 
	_margin:-15px 0px -10px 40px;/*Set margins in IE6 to rectify header loop isue */
}



#downloadContent ul li.col2{ /*clip download line*/
	list-style-type:none;
	font-size:.9em;
	line-height:1em;
	line-height:10px;
	padding:0;
	margin:-10px 0px -8px 70px;/*Set margins in FX to rectify header loop isue */ 
	*margin:-15px 0px -10px 70px;/*Set margins in IE7 to rectify header loop isue */
	_margin:-15px 0px -10px 40px;/*Set margins in IE6 to rectify header loop isue */ 
	padding-left:350px;	
}


img.clipHeader {margin-left: 0px;}
span.topColumns ul {list-style-type:none;margin:0;padding:0; }
span.topColumns ul li {display:block;line-height:1.4em;}
a.newWindow {background:transparent url(../artwork/externalLinkWhite.gif) no-repeat right; padding-right: 14px; border:none; vertical-align:middle;}
p.top {text-align:right;}


/*
====================================================================================================================================
=IMAGE GAL PAGE
====================================================================================================================================
*/

#galleryWrap {
    border: 1px solid #333;
	background-color:#000;
	width: 740px;
	height:820px;
	margin: 170px 20px 20px 32px;
	background-color:transparent;
}

#leftNavigation {
	border:1px solid #333;
	float: left; 
	width: 200px; 
	background: #000; 
	height: 300px;
	margin: 13px 0 0 5px;
}
#imageViewer {/*border:1px solid red;*/margin: 0 0 0 215px; padding: 0 10px 10px;}

/* begin gallery styling */
ul#jgal {
	/*border:1px solid orange;*/
	list-style: none; 
	width: 500px; 
	margin-top:460px;  
	*margin-top:490px; 
	margin-left:-50px; 
	*margin-left:-9px;}

#jgal li {
	opacity:.5; 
	float: left; 
	display: inline; 
	width: 60px; 
	height: 60px; 
	background-position: 50% 50%; 
	cursor:pointer; 
	border:3px solid #fff; 
	outline:1px solid #ddd;
	margin-right: 14px; 
	margin-bottom: 14px; 
}

/*Position the display image */
#jgal li img {
	position: absolute; 
	top: 240px;
	left: 250px; 
	display:none; 
	border:4px solid #fff; 
	cursor:default;}
	
/* Turtn on image */
#jgal li.active img {display:block;}

/*Download options bar */
#jgal li span.downloadOptions {
	position: absolute;
	background-color:#000; 
	top:205px;
	*top: 205px; 
	left: 250px; 
	display:none; 
	border:1px solid #333; 
	text-align:left;
	padding:5px;
	_width:350px;/*IE6 HACK */
	
	}
	
	
	
#jgal li.active span.downloadOptions {display:block;}

#jgal li span.downloadOptions a img.downloadIcon1{float:left; top:0; left:0; padding:2px; border:0; }
#jgal li span.downloadOptions a img.downloadIcon2{float:left; top:0; left:105px; padding:2px; border:0;  }
#jgal li span.downloadOptions a img.emailIcon{float:left; top:0; left:217px; padding:2px; border:0; }

#jgal li span.downloadOptions a.medium {margin-left:32px;}
#jgal li span.downloadOptions a.large {margin-left:42px;}
#jgal li span.downloadOptions a.email {margin-left:25px;}

#jgal li span.downloadOptions a:hover {color:#41525c;text-decoration:underline;}

#jgal li.active, #jgal li:hover {outline-color:#bbb; opacity: .99 /* safari bug */ }


#downloadOptions {
    border:1px solid #333;
    width:500px;
    height:20px;
    margin-top:15px;
    margin-left:-6px;

}

/*
====================================================================================================================================
=GAMES PAGE
====================================================================================================================================
*/

#innerWrap{
	background-color:transparent; 
	border: 1px solid #333; 
	margin:170px 0 0 35px;
	width:735px; 
	text-align:left;
 }
 
#innerWrap a{color:#fff; font-weight:lighter;}
#innerWrap a:hover{color:#41525c;}


/*
====================================================================================================================================
=KIDS ZONE PAGE
====================================================================================================================================
*/
ul#leftCol { float:left; width:300px;margin:7px 0 0 20px;}
ul#rightCol {margin-left:350px;}

/*
====================================================================================================================================
=FORM PAGE
====================================================================================================================================
*/
fieldset{border:1px solid #41525c;}
legend{font-size:1.4em; font-weight:bold;color:#41525c}
label {float:left;width:10em;}
.fields {border:1px solid #41525c;}
.btnSubmit {border:1px solid #41525c;background-color:#000000;color:#fff;padding:3px;cursor:pointer;}


/*
====================================================================================================================================
=FOOTER
====================================================================================================================================
*/

#footer {
	margin: 20px 25px 4px 31px;
	*margin-left: 43px;
	color:#fff;
	border: 1px solid #333;
	font-size:1em;
	padding:7px;
	vertical-align:middle;	
	clear:both;
}


#footer.clips {margin: 0px 65px 4px 15px;}
#footer a {text-decoration:underline;color:#666;}
#footer a:hover {color:#41525c;}

#footer a.addThis {text-decoration:none;}