/* Reset all styles ********************** */
* { margin: 0; padding: 0; } 

body {
background-color: #333;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

p, li, h1, h2, h3 {
font-family: Georgia, "Times New Roman", Times, serif;
}

p {
font-size: 10pt;
color: #333;
line-height: 14pt;
margin: 0px 0px 10px 0px;
}

a:link, a:visited, .hilite {
	color: #BD4D28;
	text-decoration: none;
}

a:hover {
color: #72BACF;
text-decoration: none;
}

li {
font-size: 10pt;
color: #333;
}

li.selected a:link, li.selected a:visited, li.selected .hilite {
color: #333;
}

h1 {
font-size: 12pt;
color: #333;
line-height: 16pt;
margin: 0px 0px 10px 0px;
color: #72BACF;
}

h2 {
font-size: 11pt;
color: #333;
line-height: 14pt;
margin: 0px 0px 10px 0px;
color: #72BACF;
}

p.footer {
font-family: Tahoma, Arial, Verdana, sans-serif; font-size: 11px;
color: #666;
}

p img {
float: right;
margin: 3px 0px 5px 10px;
}

#page {
margin: 0 auto;
width: 980px;
}

#branding {
padding: 20px 0px 20px 0px;
width: 980px;
height: 71px;
float: left;
}

div#mainNav {
width: 100px;
float: left;
padding: 2px 0px 0px 25px;
}

ul#pageList {
margin: 0;
padding: 0;
width: 100px;
list-style: none;
}

ul#pageList li {
display: block;
float: left;
margin: 0;
padding: 0;
width: 100px;
height: 28px;
}

ul#pageList li a {
display: block;
width: 100px;
height: 18px;
float: left;
cursor: pointer;
}

div#home {
float: left;
width: 640px;
margin: 0px 0px 0px 44px;
}

div#secondCol {
float: left;
width: 100px;
padding: 0px 0px 0px 35px;
}

ul#binderList {
list-style: none;
}

ul#binderList li {
float: left;
clear: both;
position: relative;
margin: 0;
padding: 0;
padding: 0px 0px 8px 0px;
width: 100px;
}

div#thirdCol {
float: left;
width: 160px;
padding: 0px 0px 0px 35px;
}

ul#assetList {
list-style: none;
}

ul#assetList li {
float: left;
clear: both;
position: relative;
margin: 0;
padding: 0;
padding: 0px 0px 8px 0px;
width: 160px;
}

.asterisk {
width: 10px;
height: 10px;
position: absolute;
left: -12px;
top: 4px;
}

#paperTop {
width: 980px;
height: 20px;
float: left;
background: #333 url(gfx/paper3_top.png) no-repeat top left;
}

#contentWrapper {
width: 980px;
float: left;
background: #333 url(gfx/paper3_middle.png) repeat-y top left;
padding: 6px 0px 0px 0px;
}

#content {
width: 980px;
float: left;
}

#paperBottom {
width: 980px;
height: 50px;
float: left;
}

div#fourthCol {
float: left;
width: 480px;
padding: 0px 0px 0px 20px;
}

div#assetArea {
float: left;
width: 480px;
padding: 0px 0px 10px 0px;
}

div#textArea {
float: left;
width: 480px;
padding: 0px 0px 0px 0px;
}

div#articleCol {
float: left;
width: 500px;
padding: 0px 0px 0px 120px;
}

div#descCol {
float: left;
width: 286px;
padding: 0px 0px 0px 35px;
}

div#videoCol {
float: left;
width: 480px;
padding: 0px 0px 0px 20px;
}

img.title {
margin: 0px 0px 10px 0px;
}

#footer {
width: 960px;
height: 80px;
float: left;
padding: 5px 10px 10px 10px;
}









/*
P.I.E. FLOAT CLEARING
See http://www.positioniseverything.net/easyclearing.html 

DYSKE:
Use this on the container block, not in the content block.
You can apply multiple classes to an element by separating them with a space.
E.g. class="clearfix anotherClass"
clearfix must come first.
*/

.clearfix:after {
content: ".";
clear: both;
height: 0;
visibility: hidden;
display: block;
}

.clearfix {
display: inline-block; /* Fixes IE/Mac */
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */		

