/* Note: the issues that occur here with the widths of bkgs & borders in FireFox
    could most likely have been avoided by not messing with the original width settings
    and I messed around with the original bkg colours when learning the menu.
    please see original snapsis menu files for examples. 
    
Note: most of the comments here are for learning and archival purposes.
remember to erase when preping for publication.
*/
/* this is in place to allow resizable text. not working yet */
body, tr, td
{
    font-family: Verdana, Arial, Helvetica, Sans-Serif;
    font-size:12px;
}
/*  
============================
NavMenu styles start here 
============================
*/
.TabList {
    font-size:11px;
}

/* this is used to make sure the main nav drops down OVER the sub nav
    This is also used to make sure it is positioned correctly over the bkg bar */
#navHContainer {
    position: relative;   
    /*left:400px;
    top:110px;
    display:block;
    width:600px;*/
    z-index:2;
}
/*  This is also used to make sure the main nav is positioned 
correctly over the bkg bar */
#navHContainer2 {
    position: absolute;
    top: -12px;
}
#nav ul {
    padding:0;
    margin:0;
    list-style:none;
    float:left;
    width:auto;
    background-color:#5f6775;
}

#nav li {
  position: relative;
  float:left;
  line-height : 1.25em; /* turn off to get default spacing */
  /* the width was changed from 9em. getting space btwn cause of border around #nav a,
and cause #nav a is not as wide */
  width: 125px;
  list-style: none;
}

#nav li ul { /* second-level lists */
	position : absolute;
	left: -999em;
	width:13em; /*sets bkg width of the ul */
    background-color:#5f6775; /* blue */
    /* border around outside of subnav list. 
    removal gives ie smallvisual overlap if #nav li ul a 
    has a full border on it. keeping shows bkg of FF overlaping the border.
    Chose to ditch it.*/
}

/* block colour behind all links, parent and child, & link colour 
    putting a border here puts a border around every link, including the sub nav
*/
#nav a {
    font-size:1.05em;
    font-family: Arial, Sans-Serif;
	display:block;
    text-decoration:none;
    /* controls alignment of link text within (even subnav)*/
    text-align:center;
    font-weight:bold;
    /* controls width of items in the main nav bar*/
    width:125px;
    padding :3px 0 3px 0;
    color:#ffffff;
    background-color:Transparent;
}
/* using this style forces all main dropdown nav menus in FF to 
take a set width but doesn't auto adjust in FF. this doesn't show in IE.  */
#nav li li a {
    width:12em; 
}
/* my addition to style the subnav. 
  & Partially fixes the FF extension of the border of #nav a beyond the bkg colour of #nav li ul
    by adding the bkg color here as well */
#nav li ul a {
    text-align:left;
    padding-left:15px;
    padding-right:7px;
    background-color:#5f6775; /*green width=auto and 100% didn't work*/
}
/* controls the hover state of the links (appears to be main links & subnav links) */
#nav li a:hover {
  /*background-color: #970329;*/
  text-decoration:underline;
}
/* the above controls the hover state of the links. this controls only for the FF extension error
on the rollover by adding the bkg colour to rollover state. */
#nav li ul a:hover {
    background-color:#5f6775;
}
/* ==============*********IMPT********
this extends the 125px width set by #nav a (& also affects the width 
of the sub menu) to whatever we need for only the dropdown nav.
if we specified only the id for the largest dd (#nav54)instead 
of just #nav, that would only affect that one width. Works in FF and IE.
=================*/
html>body #nav ul.Level1 a {
    width:18em;
}
/* the SelectedTab class was being overridden by the default.css file. I changed the the menu declaration
so that it replaced the SelectedTab class with the class "SelectedTab2", to get the selected tab to 
change in appearance */
#nav ul li.SelectedTab2 a{
    color:#ffffff;
}
#nav .DisabledTab {
    color:#ccc;
}
/* no need to change these hover classes 
unless you need more than 4 levels */
#nav li:hover ul ul,
#nav li:hover ul ul ul,
#nav li:hover ul ul ul ul,
#nav li.iehover ul ul,
#nav li.iehover ul ul ul,
#nav li.iehover ul ul ul ul{
  left: -999em;
}

#nav li:hover ul, 
#nav li.iehover ul {
	top: 1.6em;
	left:0;
}
#nav li li:hover ul,
#nav li li li:hover ul,
#nav li li.iehover ul,  
#nav li li li.iehover ul {
	top: 0;
	left:12.8em;
}
/*
================================
subnav styles for psp skin
================================
*/

#subnav ul {
    padding:0;
    margin:0;
    list-style:none;
    float:left;
    width:12.5em;
    background-color:#c20336;
}

#subnav li {
  position: relative;
  float:left;
  line-height : 1.25em;
  width: 12em;
  list-style: none;
}

#subnav li ul { /* second-level lists */
	position : absolute;
	left: -999em;
    background-color:blue; /*#c20336*/
  	margin:-1.9em 0 0 13em; /* this is what moves the 3rd nav left */
	border:1px solid #c20336;
}

#subnav li ul ul { /* third-and-above-level lists */
	left: -999em;
    background-color:#c20336;
  	border:1px solid #c20336;
}

#subnav a {
    font-size:1.0em;
	display:block;
	width: 12em;/********/
    text-decoration:none;
    font-weight:bold;
    margin:1px 0px 1px 2px;
    padding: 2px 2px 2px 6px;
    border:1px solid #c20336;
    color:#ffffff;
    background-color:#c20336; /* helps w FF empty border extension*/
}
#subnav li a:hover {
  background-color: #970329;
  border:1px solid #970329;
  color:#ffffff;
}
#subnav li a.SelectedTab {
    font-weight:bold;
    background-color: #970329;
    color:#ffffff;
}
#subnav .DisabledTab {
    color:#ccc;
}
/*no need to change these hover classes unless you need more than 4 levels */
#subnav li:hover ul ul,
#subnav li:hover ul ul ul,
#subnav li:hover ul ul ul ul,
#subnav li.iehover ul ul,
#subnav li.iehover ul ul ul,
#subnav li.iehover ul ul ul ul{
  left: -999em;
}

#subnav li:hover ul, 
#subnav li li:hover ul, 
#subnav li li li:hover ul, 
#subnav li.iehover ul, 
#subnav li li.iehover ul, 
#subnav li li li.iehover ul {
	left: auto;
}

/*
#subnavContainerBorder {
    background-color:white;
    padding:2px;
    border:1px solid #333;
    height:5em;
}*/
#subnavContainer, #subnavContainer2, #subnavContainer3, #subnavContainer4, #subnavContainer5 {
   /*border:1px solid #333;*/
   background-color:#c20336;
   width:145px;
   vertical-align:top;
   padding:5px 5px 5px 2px;
   text-align: left;
   font-family: Arial, Sans-Serif;
}
/*manually set height for FF in this hack as it doesn't auto expand in the browser.
  this also throws any modules on the side out of wack if the nav expands below the div
  As I'll need to set this manually, will need to duplicate the #subnavcontainer
  style (as above) to diff names and change the height of the different 
  html>body #subnavcontainer(#) below to get different heights.
*/
html>body #subnavContainer {
    height: 15em;
}
html>body #subnavContainer2 {
    height: 17em;
}
html>body #subnavContainer3 {
    height: 20em;
}

/*======================*/
#subnavContainer ul.level0 li {
    /*border-bottom: 2px solid black;
    padding-right:0px;*/
}

/*
================================
top nav menu styles
================================
*/

#topHmenuContainer {
   /* position: relative;  */ 
    /*z-index:2;*/
}
/*  This is also used to make sure the main nav is positioned 
correctly over the bkg bar */
#topHmenuContainer2 {
    /*position: absolute;
    top: -12px;*/
}
#topHmenu ul {
    padding:0;
    margin:0;
    list-style:none;
    /* if there is an issue with the whole bar being to far right, check this */
    float:right;
    width:auto;
    height:auto;
}

#topHmenu li {
  position: relative;
  float:left;
  line-height : 1.00em;
  /* controls width of items in the main nav bar*/
  width: auto;
  list-style: none;
}

#topHmenu a {
    font-size:11px;
    font-family: Arial, Sans-Serif;
	display:block;
    text-decoration:none;
    /* controls alignment of link text within */
    text-align:right;
    /*font-weight:bold;*/
    /* controls width of items in the main nav bar*/
    width:auto;
    padding :3px 5px 3px 5px;
    color:#ffffff;
    background-color:Transparent;
}
/* controls the hover state of the links (appears to be main links & subnav links) */
#topHmenu li a:hover {
  text-decoration:underline;
}

/* 
================================
Skin styles for DotNetNuke
================================
*/   

.pagemaster {
	width: 100%;
	height: 100%;
	background-color: #cccccc;
}
.skinmaster {
	height: 100%;
	background-color: #ffffff;
	border-right: #a3a3a3 1px solid; 
	border-top: #a3a3a3 1px solid; 
	border-left: #a3a3a3 1px solid; 
	border-bottom: #a3a3a3 1px solid; 
	moz-border-radius-bottomleft: 15px; 
	moz-border-radius-bottomright: 15px; 
	moz-border-radius-topleft: 3px; 
	moz-border-radius-topright: 3px; 
}
.skinheader {

}
.skinheaderRight 
{
  	background-image: url(img/rightheader1.jpg);
	background-repeat: no-repeat;
	height: 142px;  
}
.skingradient {
	background-color: #5f6775;
	height:27px;
	border: 1 solid #000;
}
.footerend {
    background-color: #4a4b52;
    height:24px;
}
.controlpanel {
	width: 100%;
	background-color: #cccccc;
}
.toppane {
	width: 100%;
	background-color: transparent;
}
.leftpane {
	width: 175px;
	background-color: transparent;
	padding-left: 6px;
	padding-right: 4px;
	padding-top: 6px;
}
.contentpane {
	width: 100%;
	background-color: transparent;
	padding-left: 6px;
	padding-right: 4px;
	padding-top: 6px;
}
.rightpane {
	width: 175px;
	background-color: transparent;
	padding-left: 6px;
	padding-right: 4px;
	padding-top: 6px;
}
.bottompane {
	width: 100%;
	background-color: transparent;
	padding-left: 6px;
	padding-right: 4px;
	padding-top: 6px;
}
.footerpane {
	width: 100%;
	background-color: #5f6775;
	padding-left: 6px;
	padding-right: 4px;
	padding-top: 6px;
}
.StandardButton {
  background: #7994cb none; 
  color: #ffffff;
  font-family: verdana, sans-serif; 
  font-size: 11px;
  font-weight: normal;
}

/* ==============================
 Style for the following Skin Items (You can change the css class
associated with these objects in the skin.xml file)
- SkinItems -  Login and Register links, Breadcrumb, Copyright, Date,
- Help, Hostname, Privacy, Terms, Search
================================== */
.SkinItem, .breadcrumbtext {
    color: #ffffff;
    font-family: Arial, Sans-Serif; /* was on tahoma, arial; but didn't like it */
    font-weight: normal;
    font-size: 11px;
    /* didn't do anything */
    padding-bottom: 5px;
}
A.SkinItem:link, A.SkinItem:visited, A.SkinItem:active, A.SkinItem:hover {
    color: #ffffff;
    font-family: Arial, Sans-Serif;
    font-weight: normal;
    font-size: 11px;
}
.SkinItem2 {
    color: #000000;
    font-family: Tahoma, Arial;
    font-weight: bold;
    font-size: 9px;
    padding:0px;
    margin:0px;
}
.SkinItem3 {
    color: #ffffff;
    font-family: Tahoma, Arial;
    font-weight: bold;
    font-size: 9px;
    padding:2px;
    margin:0px;
}
A.SkinItem3:link, A.SkinItem3:visited, A.SkinItem3:active, A.SkinItem3:hover {
    color: #ffffff;
    font-family: Tahoma, Arial;
    font-weight: bold;
    font-size: 9px;
    padding:2px;
    margin:0px;
}
/*  ====================== */
.TreeViewMenu {
	width: 175px;
	background-color: #dfe5f2;
	border-right: #7994cb 1px solid; 
	border-top: #7994cb 1px solid; 
	border-left: #7994cb 1px solid; 
	border-bottom: #7994cb 1px solid; 
	moz-border-radius-bottomleft: 15px; 
	moz-border-radius-bottomright: 15px; 
	moz-border-radius-topleft: 3px; 
	moz-border-radius-topright: 3px;
}
.TreeViewMenu_Header {
	background-image: url(gradient_LtBlue.jpg);
}


/*=====================
sets style of titles in module containers
=======================*/
.Head {
   font-family: Verdana, Tahoma, Arial, Helvetica;
   font-size:  13px;
   font-weight: Bold;
   color: #5f6775;
}
.containermaster3_psp .Head  {
   font-family: Verdana, Tahoma, Arial, Helvetica;
   font-size:  13px;
   font-weight: Bold;
   color: #5f6775;
}
.containerrow_b_psp .Head {
    color:#ffffff;/* #c10435 */
}
/*=====================
admin content pane titles and control panel text
=======================*/
.SubHead {
    color:#970329;/* #c10435 */
}
.containermaster_psp .SubHead {
    color:#ee0000;/* #c10435 */
}
/*=====================
default text style used for the main content text 
(ex. used in text/html module)
=======================*/
.Normal{
    color: #000000;
    font-family: Verdana, Arial, Helvetica;
    font-size: 12px;
}
.containermaster_psp tr, .containermaster_psp td {
    color: #000000;
}
.containermaster2_psp .Normal{
    color: #ffffff;
}
/*========================
used to change the text in the poll module to white
==========================*/
.containermaster2_psp .NormalBold {
    color: #ffffff;
}
/* ==============================
text style used for textboxes in the admin and edit pages
================================= */
.NormalRed {
    color: #F00;
    font-weight: bold;
}
.NormalBold {
    font-weight: bold;
}
/* =======================
 HTML Tag Styles 
=========================== */
H1, H2, H3, H4, H5, H6 {
    font-family: Verdana, Arial, Helvetica, Sans-Serif;
}

H1 {
    font-size: 17px;
    font-weight: bold;
    color: #5f6775;
}

H2 {
    font-size: 15px;
    font-weight: bold;
    color: #5f6775;
    margin: 0;
    padding: 0;
}

H3 {
    font-size: 110%;
    font-weight: bold;
    color: #5f6775;
    margin: 0;
    padding: 0;
}

H4 {
    font-size: 110%;
    font-weight: bold;
    text-decoration:underline;
    color: #000000;
}

H5 {
    font-size: 100%;
    font-weight: normal;
    text-decoration:underline;
    color: #5f6775;
}
H6 {
    font-size: 80%;
    font-weight: normal;
    color: #CCC;
}
p {
    margin-top:0;
}
.containermaster3_psp h4 {
    color: #000000;
}
/* styles for announcements module */
.announcementsHead {
    color:#5f6775;
    font-weight: Bold;
    font-size:105%;
}
.announcementsDate {
    color:#5f6775;
    font-weight: normal;
    font-size:100%;
}
/* ==============
Styles for the main text and images within the Text/HTML module
to be used with FCK editor 
================= */
.CommandButton {
    font: 100% Tahoma, Arial, Helvetica, Sans-Serif;
}
.imageleftside img {
   /* the above will affect only an image w/in a block of text of this class.
    the border below will also automatically be applied */
    border: 1px solid #000;
    margin-right: 15px;
    margin-bottom: 20px;
    float: left;
}
.imagerightside img
{
    border: 1px solid #000;
    margin-left: 15px;
    margin-bottom: 20px;
    float: right;
}
.imageleftsidecaption
{
    font-size: 90%;
    font-style: italic;
    float: left;
    margin-right: 15px;
    margin-bottom: 15px;
}
.imageleftsidecaption img
{
    border: 2px solid #000;
    margin-bottom: 5px;
}
.imagerightsidecaption
{
    font-size: 90%;
    font-style: italic;
    float: right;
    margin-left: 15px;
    margin-bottom: 15px;
}
.imagerightsidecaption img
{
    border: 2px solid #000;
    margin-bottom: 5px;
}
.clear {
    /* this clears the float created by any previous class so 
    it doesn't affect anything that is using this class */
    clear: both;
}
table.tdcentre td {
    text-align:center;
}
/*styles the different lists in the text/html module */