/* Stylesheet Dust Collection and Cyclone Research */
body {
    background: #FFF; /* white background */
    background-color: #f6f6cc;
/*    background: url("images/birds_right.jpg") /* 
/*    repeat-y rgb(255, 255, 255); */
    font: 0.75em Arial, Georgia, "Palatino Linotype", "Book Antiqua", Palatino, serif;
    margin: 0px; 
    padding: 5px; 
    color: #800000; /* Set default text as dark brown color */
    position: relative; 
    font-size: 14px; 
    font-size-adjust: none; 
    font-stretch: normal;
}
/* ~~ Element/tag selectors ~~ */
ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
    padding: 0;
    margin: 0;
}

p {
    font-size: 16px; 
  }

h1, h2, h3, h4, h5, h6, p {
    margin-top: 0;     /* prevent margins from escaping their container */
    padding-right: 10px; /* Padding the element sides gets rid of any box model math. */
    padding-left: 10px; 
}

/* Heading 1 */
 h1 {
  padding-left:0;
  font-size:30px;
  text-shadow: 4px 4px #cccccc; 
 } 

/* Heading 2 */
 h2 { 
  padding-left:0;
  font-size:20px;
 }

/* Heading 3 */
 h3 {
  padding-left:0;
   font-size:18px;
 }

/* Heading 4 */
 h4 { 
  padding-left:0;
   font-size:16px;
 }

/* Heading 5 */
 h5 {
  padding-left:0;
  font-size:14px;
 }
 
ol > li {
  list-style: upper-alpha;
  font-size:18px;
 }
ol > li > ol > li {
  list-style: decimal;
  font-size:16px;
 }
ol > li > ol > li > ol > li {
  list-style: lower-alpha;
  font-size:14px;
 }
ol > li > ol > li > ol > li > ol > li {
  list-style: lower-roman;
  font-size:12px;
 }  

li > p {
    font-size:16px;
    margin-top:10px;
    margin-bottom:10px;
  }

 
a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
    border: none;
}

/* Style links */
a:link {
    color: #42413C;
    text-decoration: underline; 
}
a:visited {
    color: #6E6C64;
    text-decoration: underline;
}
a:hover, a:active, a:focus { 
    text-decoration: none;
}

/* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
.container {
/*    background-image:url('project/images/menubackground.gif'); */
/*    background-repeat:repeat-x;  Repeat vertically only */
    min-width: 780px; /* going smaller than this width truncates off and loses material */
    max-width: 1500px; /* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
    width: 95%; /* this width is not needed if you set the .container's width to 100%. */
    margin:0 auto; /* center layout on page */
    background-color: #f6f6cc;
    overflow: hidden;
}

/* ~~ Header ~~ */
.header {
    background-color: #fda;
    border: 1px solid #800000;
    width: 99%;
    height: 60px;
    float: right;
    margin-bottom: 5px;
    padding: 0;
}

/* ~~ Set up special heading title spacing ~~ */
.header h1 { 
    margin-top:-1px;
    margin-left:15px;
    margin-bottom:0px;
}
.header h2 { 
    margin-top:-1px;
    margin-left:15px;
    margin-bottom:0px;
}

/* ~~ Set up table of contents ordered list type and sizing ~~ */
.tableofcontents {
    margin: 0px;
    padding: 0px;
}
.tableofcontents ul, ol, dl {
    padding: 0;
    margin: 0;
}
.tableofcontents ol > li {
  list-style: upper-alpha;
  font-size:14px;
 }
.tableofcontents ol > li > ol > li {
  list-style: decimal;
  font-size:13px;
 }
.tableofcontents ol > li > ol > li > ol > li {
  list-style: lower-alpha;
  font-size:12px;
 }
.tableofcontents ol > li > ol > li > ol > li > ol > li {
  list-style: lower-roman;
  font-size:11px;
 } 
.tableofcontents  ol { 
    padding: 0 15px 0 20px; /* this padding mirrors the right padding in the headings and paragraph rule above. */
}

.toc {
    font-size:14px;
}

.content {
    float: right;
/*    position:relative; */
    background-color: #FFFFFF;
    border: 1px solid #800000;
    width: 99%;
    margin: 0px;
    padding: 0px;
    text-align: justify;
    text-indent: 0;
}

/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol { 
    padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. */
}

/* This Sidebar Box sits on the right */
.sidebar1 {
    float: right;
    position: relative;
    width: 200px;
    background: #FFDDAA;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #800000;
    border-right-style: none;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #800000;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #800000;
    margin-bottom: 0px;
    margin-left: 1%;
    margin-top: 0px;
    margin-right: 0px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 10px;
    padding-left: 0px;
}

.information {
    padding-left: 25px;
/*    margin-right: 225px; */
}

/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.information ul, .information ol { 
    padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
}

.content_menu {
    background-color: #fdc;
}

/* ~~The footer ~~ */
.footer {
    position: relative;/* this gives IE6 hasLayout to properly clear */
    clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
    background-color: #fda;
    border: 1px solid #800000;
    font-size: 80%;
    width: 99%;
    float: right;
    margin:0 0 5px 0;
    padding-top: 10px;
}
.footer h2 {
    padding-left: 20px;
}


.byline {
    float: right;
    text-align: right;
    margin: -40px 3px 0 0; 
    font-size: 11px;
    font-style: italic;
}

/* ~~miscellaneous float/clear classes~~ */
.fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
    float: right;
    margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
    float: left;
    margin-right: 8px;
}
.clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
    clear:both;
}

/* Setup for centering text */
div.centr {
    text-align: center;
}
/* Center Text */
p.center {
    padding: 0px 5px; 
    text-align: center;
}
/* Setup for left and right alignment of pictures with a little side margin */
.align-right {
    margin: 0px 0px 5px 15px; 
    float: right;
}
.align-left {
    margin: 0px 15px 5px 0px; 
    float: left;
}
.align-center {
    margin: 0 auto; 
}

/* ~~ Miscellaneous float/clear classes ~~ */
.fltrt {  /* float an element right */
    margin-left: 8px; 
    float: right;
}

/* ~~ Text highlighting ~~ */
.red {
    color: #f00;
    font-weight: bold;
}

.green {
    color: green;
    font-weight: bold;
}

.blue {
    color: blue;
    font-weight: bold;
}

.indigo {
    color: indigo;
    font-style:italic;
    font-weight: bold;
}

/*---- CROSS BROWSER DROPDOWN MENU ----*/
ul#nav {margin: 0 0 0 10px;}
ul.drop a {
    display:block; 
    color: #fff; /* set text color to white */
    font-family: Verdana; 
    font-size: 14px; 
    text-decoration: none;
}
ul.drop, ul.drop li, ul.drop ul { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
    border: 1px solid #800000; /* set color of item boarders */
    background: rgb(255, 201, 173); /* Set color of menu item backgrounds */
    color: #fff;
}
ul.drop { 
    position: relative; 
    z-index: 597; 
    float: left; 
}
ul.drop li { 
    float: left; 
    line-height: 1.3em; 
    vertical-align: middle; 
/*    zoom: 1; */ 
    padding: 5px 10px; 
}
ul.drop li.hover, ul.drop li:hover { 
    position: relative; 
    z-index: 599; 
    cursor: default; 
    background: #800000; /* Change color of selected item backgrounds */
}
ul.drop ul { 
    visibility: hidden; 
    position: absolute; 
    top: 100%; 
    left: 0; 
    z-index: 598; 
    width: 195px; 
    background: #555; 
    border: 1px solid #fff; 
}
ul.drop ul li { 
    float: none; 
}
ul.drop ul ul { 
    top: -2px; 
    left: 100%; 
}
ul.drop li:hover > ul { 
    visibility: visible 
}