/* MAIN SCREEN STYLESHEET FOR THE WORLD FAMOUS FIREWORKERS LTD : APRIL 2008 */

html {
margin: 0px;
padding: 0px;
}

body {
color: #fff;
background-color: #581414; /*this is the red in redbg */
margin: 0px;
padding: 0px;
font-family: Arial, Helvetica, sans-serif;
}

a { text-decoration: none; font-weight: bold; }
a:link { color: #ffcd5e; }
a:visited { color: #ffcd5e; } 
a:active { color: #ffcd5e; } 
a:hover { color: #ff9a24; }

/*===*/

form {
margin: 0px;
padding: 0px;
display: inline;
}

img { border: none; }

/*===*/

#rotator {
background-color: #571516;
background-position: 0% 0%;
background-repeat: repeat;
color: inherit;
}

#container {
width: 800px;
margin: 0px auto 0px auto;
padding: 0px;
background-color: #8798aa;
}

#header {
color: #fff;
padding: 0px;
margin-bottom: 0px;
width: 800px;
/* height: 140px; this pushes the navigation under the header */
background-color: #3c0b0a; /* this is bg of the swf */
background-image: url("../img/header.jpg");
background-position: 0% 100%;
background-repeat: no-repeat;
}

#toplinks {
color: #491010;
font-size: 0.7em;
font-weight: normal;
text-align: right;
margin: 0px 0px 0px 0px;
padding: 3px 11px 3px 3px;
background-color: #280404;

border-top: 0px solid #b03000;
border-right: 1px solid #3c0a0d;
border-bottom: 1px solid #3c0a0d;
border-left: 1px solid #280404;
}

#toplinks a { text-decoration: none; font-weight: normal; }
#toplinks a:link  { color: #ff9a24; }
#toplinks a:visited { color: #ff9a24; }
#toplinks a:active { color: #ff9a24; }
#toplinks a:hover { text-decoration: underline; color: #ffcd5e; }

/* --------------- STANDARD LAYOUT STUFF --------------- */

/* for every page but the homepage */
#wrapper {
color: #fff;
width: 100%;
border-top: 1px solid #abb7c6;
border-bottom: 1px solid #6b798c;
background-image: url("../img/twocolbg.jpg");
background-position: 0% 0%;
background-repeat: repeat-y;
}

/* only on index.html */
#wrapper-home {
color: #fff;
width: 100%;
border-top: 1px solid #abb7c6;
border-bottom: 1px solid #6b798c;
background-image: url("../img/threecolbg.jpg");
background-position: 0% 0%;
background-repeat: repeat-y;
}

/* only on index.html */
#leftcol {
float: left;
background-color: transparent;
width: 224px; /*269-44-1=224*/
margin: 0px 0px 0px 0px;
padding: 22px 22px 0px 22px;
}

/* only on index.html */
#midcol {
text-align: center;
float: left;
background-color: transparent;
width: 266px;
margin: 0px 0px 0px 0px;
padding: 22px 0px 0px 0px;
}

/* only on index.html */
#rightcol {
float: left;
background-color: transparent;
width: 220px; /*265-44-1=220*/
margin: 0px 0px 0px 0px;
padding: 22px 22px 22px 22px;
}

#rightcol a { text-decoration: none; }

/* --------------- SIDE NAVIGATION --------------- */

#sidenav {
float: left;
background-color: transparent;
width: 183px;
margin: 0px 0px 0px 0px;
padding: 22px 0px 22px 0px;
}

#sidenav ul {
margin: 0px 0px 0px 0px;
padding: 5px 0px 0px 0px;
list-style: none;
border: none;
}

#sidenav ul ul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

#sidenav li {
color: #fff;
background-color: transparent;
font-size: 0.85em;
font-weight: bold;
margin: 0px 5px 12px 25px;
padding: 0px 0px 0px 0px;
}

#sidenav li li {
color: #fff;
background-color: transparent;
font-size: 0.7em;
font-weight: normal !important;
margin: 5px 5px 5px 10px;
padding: 0px 0px 0px 0px;
}

#sidenav li.selected a { color: #fff !important; }
#sidenav li.selected { list-style-image: url("../img/pointer.gif"); }
/*#sidenav li:hover { list-style-image: url("../img/pointer.gif"); }*/

#sidenav .section {
margin: 0px 0px 12px 25px;
padding: 10px 0px 10px 0px;
border-top: 1px solid #76899a;
border-bottom: 1px solid #76899a;
}

/* --------------- MAIN CONTENT AREA --------------- */

#maincol {
float: left;
background-color: transparent;
width: 572px;
margin: 0px 0px 0px 0px;
padding: 22px 22px 22px 22px;
}

#maincol h1 { font-size: 1.2em; }
#maincol a { text-decoration: none; }

.heading {
/*background-image: url("../img/headingbg.jpg");*/
background-position: 1px 0px;
background-repeat: no-repeat;
}

#maincol.heading h1+p, #maincol.heading h1+h2 {
margin: 0px 0px 0px 0px;
padding: 33px 0px 0px 0px;
}

#miniplayer, #imagebox {
text-align: center;
float: right;
width: 219px;
max-width: 219px;
margin: 0px 0px 0px 22px;
padding: 0px 0px 0px 0px;
background-color: #6c7888;
}

.heading #miniplayer { margin-top: 55px; }
#miniplayer .prevnext a { text-decoration: none; }

.image-info { font-size: 0.7em; }

.miniplayer-extras, .extras {
clear: both;
float: right;
width: 219px;
max-width: 219px;
margin: 0px 0px 0px 22px;
padding: 0px 0px 0px 0px;
background-color: transparent;
}

.miniplayer-extras { text-align: center; }
.extras { text-align: left; }

.thumbnails img { margin: 0px; padding: 0px; text-align: center; border: 1px solid #505c67; }
.thumbnails img.active { border: 1px solid #fff; }

/*===*/

 .content .quote { font-size: 19px; }

.quotelink {
    text-decoration: none !important;
}

.quote {
color: #fff !important;
text-decoration: none !important;
margin: 15px 0px 15px 0px;
padding: 0px 0px 0px 0px;
/*font-size: 1.35em;*/
font-size: 2em;
line-height: 1em;
font-weight: normal;
}

.introduction .quote {
    font-size: 1.35em;
}

.quote-source {
color: #2e302f;
font-size: 0.7em;
font-weight: bold;
}

.news-heading {
/*color: #ffcd5e;*/
border-bottom: 1px solid #505c67;
}

.newsimage {
    float: right;
}

.profile {
clear: both;
margin: 10px 0px 10px 0px;
padding: 0px 0px 10px 0px;
border-bottom: 1px solid #505c67;
}

.person {}
.biography {}

.portrait img, .news-pic img {
float: right;
margin: 0px 0px 0px 10px;
padding: 0px 0px 0px 0px;
border: 1px solid #505c67;
}

.news { margin: 0px 0px 0px 0px; }
.news-item {}
.news-item-date { font-size: 80%; }
.news-item-detail {}
.location { color: #fff; font-size: 72%; }

.more { font-size: 0.75em; }
.more a { text-decoration: none; }

.newsletter {
position: relative;
margin: 15px 0px 0px 0px;
padding: 5px 11px 5px 11px;
background-image: url("../img/greybg.jpg");
background-position: 0% 0%;
background-repeat: repeat;
}

.newsletter p {color: #fff; }

.prevnext { color: #ffcd5e; }
.white {color: #fff; }

/* --------------- GLOBAL NAVIGATION --------------- */

#navigation {
color: #fff;
background-color: #710100;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
}

#navigation li>ul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

#navigation a:link  { text-decoration: none; color: #fe9a20; background-color: #700000; }
#navigation a:visited { text-decoration: none; color: #fe9a20; background-color: #700000; }
#navigation a:active { text-decoration: none; color: #fe9a20; background-color: #700000; }
#navigation a:hover { text-decoration: none; color: #fff; background-color: #a80001; }

/* lists nested under hovered list items - see dropdowns.js */
li:hover ul, li.over ul {
display: block;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

/* THE MENU - LEVEL 1 */

.level1menu {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

.level1menutitle {
color: #C4C4C6;
font-size: 1.05em;
font-weight: bold;
line-height: 1.1em;
text-decoration: none;
text-transform: none;
letter-spacing: 0px;
display: block;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;

background-image: url("../img/nav-unselected.jpg");
background-position: 0% 0%;
background-repeat: repeat;
}

.level1menutitle-selected {
font-size: 1.05em;
font-weight: bold;
line-height: 1.1em;
text-decoration: none;
text-transform: none;
letter-spacing: 0px;
display: block;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;

color: #fff !important;
background-color: #f87817 !important;
border-top: 1px solid #ffaa05 !important;
border-right: 1px solid #3c0a0d !important;
border-bottom: 1px solid #3c0a0d !important;
border-left: 1px solid #ffaa05 !important;

background-image: url("../img/nav-selected.jpg");
background-position: 0% 0%;
background-repeat: repeat;
}

.level1menuul {
list-style-type: none;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

.level1menuli {
width: 160px; /* this is 800/5=160*/
list-style-type: none;
float: left;
text-align: center;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

.level1menuli a {
margin: 0px 0px 0px 0px;
padding: 4px 10px 4px 10px; /* The spacing for the main menu items */
border-top: 1px solid #b03000;
border-right: 1px solid #3c0a0d;
border-bottom: 1px solid #3c0a0d;
border-left: 1px solid #b03000;
}

/* THE MENU - LEVEL 2 */

.level2menuul {
list-style-type: none;
position: absolute;
display: none;
font-size: 1.1em;
line-height: 1.1em;
background-color: transparent;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;

/*border-top: 1px solid #ddd;
border-right: 1px solid #ddd;
border-left: 1px solid #ddd;
border-bottom: 5px solid #b1a2cd;*/
}

.level2menuli {
width: 160px; /* this is 800/5=160*/
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

.level2menuli a {
display: block;
text-decoration: none;
background: none;
margin: 0px 0px 0px 0px;
padding: 0px 20px 0px 10px;
}

.level2menuli a:hover {
background-color: #eae4f3;
}

/* THE MENU - LEVEL 3 */

.level3menuul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

.level3menuli {
width: 160px;
list-style-type: none;
font-size: 100%;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

.level3menuli a:before { content: "> "; }

/* THE MENU - LEVEL 4 */

.level4menuul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

.level4menuli {
width: 160px;
list-style-type: none;
font-size: 100%;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

.level4menuli a { font-weight: normal; }
.level4menuli a:before { content: ">> "; }

/* --------------- STANDARD TYPOGRAPHY --------------- */

h1	{
color: #fff;
margin: 0px 0px 0px 0px;
padding: 0px 0px 5px 0px;
font-size: 0.95em;
font-weight: bold;
}

h2	{
color: #fff;
margin: 0px 0px 0px 0px;
padding: 0px 0px 5px 0px;
font-size: 0.9em;
font-weight: bold;
}

h3	{
color: #fff;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
font-size: 0.85em;
font-weight: bold;
}

h4	{
color: #fff;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
font-size: 0.8em;
font-weight: bold;
}

p {
color: #2e302f;
margin: 10px 0px 10px 0px;
padding: 0px 0px 0px 0px;
font-size: 0.8em;
line-height: 1.1em;
}



.p p {
font-size: 100%;
}

.p {
color: #2e302f;
margin: 10px 0px 10px 0px;
padding: 0px 0px 0px 0px;
font-size: 0.8em;
line-height: 1.1em;
}

ul, ol {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 20px;
}

li {
color: #2e302f;
margin: 5px 0px 5px 0px;
font-size: 0.8em;
text-align: left;
}

li li { font-size: 100%; }

ul.pointer, .pointer li { list-style-image: url("../img/pointer.gif"); }

#maincol ul { padding-left: 15px; }
#maincol ul ul { padding-left: 20px; }

.alert { color: #777; }

/* FOOTER */

#footer {
clear: both;
width: 100%;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
background-color: #3e0b0a; /*this is the red in redbg */
background-image: url("../img/redbg.jpg");
background-position: 0% 0%;
background-repeat: repeat;
}

#footer p {
color: #fff;
font-size: 0.7em;
margin: 0px 0px 0px 0px;
padding: 11px 22px 11px 22px;
}

#footer p a { text-decoration: underline; color: #fff; font-weight: normal; }
#footer p a:link  { color: #ff9a24; }
#footer p a:visited { color: #ff9a24; }
#footer p a:active { color: #ff9a24; }
#footer p a:hover { color: #ffcd5e; }

/* CLEARFIX from http://www.webtoolkit.info/css-clearfix.html */

.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}

.clearfix {display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }

/* HORIZONTAL RULES */

hr { text-align: right; width: 100%; height: 1px; color: #76899a; border: none; margin: 10px 0px 10px 0px; padding: 0px; } /* For Internet Explorer */

html>body hr { margin: 15px 0px 15px 0px; padding: 0px; width: 100%; height: 1px; background-color: #76899a; border: none; } /* For Gecko-based browsers */

html>body hr { margin: 15px 0px 15px 0px; padding: 0px; width: 100%; height: 1px; background-color: #76899a; border: 0px dashed #76899a; } /* For Opera and Gecko-based browsers */


/* ============ UNUSED SO FAR - MAY COME IN HANDY ============ */


.textbox { width: 105px; }

.sup { font-size: 60%; vertical-align: super; }
.clear { clear: both; }
.left { text-align: left; }
.right { text-align: right; }
.totop { float: right; }

.image-left { float: left; margin: 10px 10px 10px 0px; }
.image-right { float: right; margin: 10px 0px 10px 10px; }

table {
margin: 10px 0px 10px 0px;
padding: 0px 0px 0px 0px;
background-color: transparent;
}

table h1 { color: #5e4780; font-size: 0.9em; font-weight: bold; margin: 0px; padding: 5px 0px 5px 0px; }
table p { font-size: 0.9em; margin: 0px; padding: 2px 0px 2px 0px; }

.outline { border: 1px solid #cac3d7; }
.outline td { background-color: #eee8f7; }

th {
padding: 1px 5px 1px 5px;
background-color: #e6dcf6;
text-align: left;
}

td {
padding: 1px 5px 1px 5px;
background-color: transparent;
text-align: left;
}

/* lightbox stuff */

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; color: black;}
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;} 
#overlay img{ border: none; }

#overlay{ background-image: url(../img/overlay.png); }

* html #overlay{
	background-color: #333;
	back\ground-color: transparent;
	background-image: url(../img/blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../img/overlay.png", sizingMethod="scale");
	}
	
/* forum */
.forum table {
    width: 100%;
}

#djangoForumThreadPosts td p {
    width: 500px;
    overflow: hidden;
}

.forum th {
    background-color: #581414;
}

.forum label {
    display: block;
    float: left;
    width: 80px;
}

.photos label {
    display: block;
    float: left;
    width: 100px;
}

.gallery-photo {
    display: inline;
    margin: 10px;
}