/* ============================================================
    CSS STYLES FOR THE MCC PORTAL
    Software
    v1.0, 3/17/2009
   ============================================================
   Change Log
   ------------------------------------------------------------
   Date        Who       Notes
   ------------------------------------------------------------
   06/17/2008  RHarris   Initial Imp.  
   ============================================================
*/ 

/* (@import url(../style2.css); */
html
{	
   height:100%;
}
body
{
	background-color: #848e93;
    margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5 browsers. The text is then set to the left aligned default in the #container selector */
	font-family:  Trebuchet MS, Helvetica, Arial;
	font-size: 10pt;
	color: #3d5e6b;
	margin: 0px;
}


form, body, #WrapperTable {
	height:100%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	border: none;
	
}

.TopMenuContainer
{
	padding-right: 5px;
	padding-left: 5px;
}
.BodyTable
{
	background-image: url(../images/mccback_1044.jpg);
    background-position:center;
    background-repeat: repeat-y;	
    padding: 0;
}

.FooterRow
{
	height: 0px;
}
.FooterTable
{

	background:  url(../images/mccfooter.jpg) no-repeat bottom center;
	padding: 15px 0px 12px 10px; 
	color: #2C5060; /*# 989845; */
	font-weight: bold;
	font-family: Arial; 
	font-size:  1.0em;  
	line-height: 1em;  
}

.FooterTable2
{
	background: url(../images/mccfooter.jpg) no-repeat bottom center; 
	padding: 0px 0px 15px 10px; 
	color: #2C5060; /*# 989845; */
	font-weight: bold;
	font-family: Arial; 
	font-size:  1.0em;  
	line-height: 1em;  
}

.NormalText
{
	font-family: "trebuchet MS", Times New Roman,Tahoma, Arial;
	font-size: 11pt;
	color: #333333;
}

.NormalBold
{
	font-family:  Trebuchet MS, Helvetica, Arial;
	font-size: 12pt;
	color: #575757;
	font-weight: bold; 
}

.ErrorMessage
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: red;

}

H1
{ 
	font-family: Arial;
	font-size: 14pt;
	color: #989845;
	/* color: #4d759a; */
}

H2
{ 
    font-family: Verdana, Helvetica, sans-serif;
	font-size: 12pt;
	color: white;
	background-color: #556b8f;
	margin-bottom: 0;
	padding-left: 10px;
	padding-top: 5px;
	padding-bottom: 5px; 
}

A
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #7f0000;
	text-decoration: none;
	font-weight: bold; 
}

A:Hover
{
	text-decoration:  none;
}

.MainPageContainer 
{
	
	background-color: Transparent;
	margin-left: 1px;
	height: 100%;
	width: 1044px;  /* using 20px less than a full 1024px width allows for browser chrome and avoids a horizontal scroll bar */
} 

/* Tips for absolutely positioned sidebars with header and footer:
1. Absolutely positioned (AP) elements must be given a top and side value, either right or left. (As a default, if no top value is given, the AP element will begin directly after the last element in the source order of the page. This means, if the sidebars are first element in the #container in the document's source order, they will appear at the top of the #container even without being given a top value. However, if they are moved later in the source order for any reason, they'll need a top value to appear where you desire.
2. Absolutely positioned (AP) elements are taken out of the flow of the document. This means the elements around them don't know they exist and don't account for them when taking up their proper space on the page. Thus, an AP div should only be used as a side column if you are sure the middle #mainContent div will always contain the most content. If either sidebar were to contain more content, that sidebar would run over the bottom of the parent div, and in this case the footer as well, and the sidebar would not appear to be contained.
3. If the above mentioned requirements are met, absolutely positioned sidebars can be an easy way to control the source order of the document.
4. If the source order is changed, the top value should be equal to the height of the header since this will cause the columns to visually meet the header.
*/

.MccMasterPage #MainBodyContainer 
{
	padding: 10px 0 0 0;
} 

.ContainerHeader 
{
	height: 146px; 
	background-image: url(../images/mccTopBanner.jpg);
    background-position:  center top;
    background-repeat: no-repeat;
    vertical-align: top;
} 

.ContainerTable
{
	height: 100%;
	margin: 0 0 0 0;
	width: 100%;
	vertical-align: text-top;
}
.ContainerLeftCol
{
	/*background-image: url(../images/lftbackReg.gif);
	background-repeat: repeat-y;
	background-position: left;    */
	vertical-align: text-top;
	width: 220px; 
	padding: 0 0 0 0;
	height: 100%;

}

.ContainerRightCol
{
	padding-left: 3px;
	margin:  0 0 0 0;
	vertical-align: text-top;
}

.ContainerFooter
{
}

.ContentPaneCenter
{
	padding: 0;  
}
.ContentPaneRight
{
	padding: 0;  
	width: 250px; 
	padding-left: 3px; 
}


/* =========================================================

    Design elements used to display modules

============================================================
   Change Log
------------------------------------------------------------
   Date        Who       Notes
------------------------------------------------------------
   08/09/2008  RHarris   Initial Imp.  
============================================================ */

.heading_container,.heading_right_top,.heading_bottom,.heading_bottom span{background:url(../images/bg_headingGTG.png) no-repeat;position:relative;_height:1px} 
.heading_right_top{background-position:0  -70px;height:5px;width:5px;float:right;overflow:hidden}
.heading_container{background-color:#7AA4DD;margin-top:6px;padding:0;clear:both}
.heading_container h2{padding:5px 8px 4px 8px;margin:0;position:relative}
.bucket_container{background:url(../images/bg_bucket_alt.png) repeat-x 0 -92px;min-height:1px;_height:1px;position:relative}
.bucket_top{border-left:2px solid #9fbde5;border-right:2px solid #9fbde5;background:url(../images/bg_bucket.png) no-repeat;height:10px}
.bucket_top span{background:url(../images/bg_bucket.png) no-repeat right -10px;width:10px;height:10px;float:right;overflow:hidden}
.bucket_content{border-left:2px solid #9fbde5;border-right:2px solid #9fbde5;min-height:1px;_height:1px;position:relative;padding:0 10px}
.bucket_bottom{background:url(../images/bg_bucket.png) no-repeat 0 -22px;height:10px;margin-bottom:4px}
.bucket_bottom span{background:url(../images/bg_bucket.png) no-repeat right -34px;width:12px;height:10px;float:right;overflow:hidden} 

/* Used to display the heading of each module */
.ModuleTitleHeader
{
	text-align: left;
	font-family: Arial, Helvetica;
	font-size: 14px;
	font-weight: bold; 
	color: white;
	padding: 0px;
	padding-left: 10px; 
	margin: 0px;
}

/* Used to display the label for data entry fields on modules */
.SubHead
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #000000;
	font-weight: bold; 
}

/* Used in modules, like the anouncements module */
.ItemTitle
{
    font-size: 14px;
	color: #666666;
	text-decoration : none;
	font-weight: bold; 
	font-style: italic;
}

/* Used for links and button text in edit pages of modules */
.CommandButton     {
    font-family: Verdana, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: normal;
    color: #006600;
}
    
/* hyperlink style for buttons and link buttons used in the portal admin pages */
A.CommandButton:link {
    text-decoration:  none;
    color: #006600;
}

A.CommandButton:visited  {
    text-decoration:    none;
}

A.CommandButton:active   {
    text-decoration:    none;
}

A.CommandButton:hover    {
	color: #009900;
	text-decoration: underline;
}

.MccMasterPage #MainBodyContainer
{

}

/* =========================================================

    Design elements for pop ups called from java script
    We should break this off into another file

============================================================
   Change Log
------------------------------------------------------------
   Date        Who       Notes
------------------------------------------------------------
   06/17/2008  RHarris   Initial Imp.  
============================================================ */

/* text style used for help text when user clicks ? next to label */
.HelpPopup
{
  border-right: black 1px solid;
  padding-right: 2px;
  border-top: black 1px solid;
  padding-left: 2px;
  font-weight: normal;
  font-size: 11px;
  padding-bottom: 2px;
  border-left: black 1px solid;
  color: black;
  padding-top: 2px;
  border-bottom: black 1px solid;
  font-family: Tahoma, Arial, Helvetica;
  background-color: #ffff99; 
}												

/* text style used for error message when data entered in control is invalid*/
.ErrorPopup
{
  border-right: black 1px solid;
  padding-right: 2px;
  border-top: black 1px solid;
  padding-left: 2px;
  font-weight: normal;
  font-size: 11px;
  padding-bottom: 2px;
  border-left: black 1px solid;
  color: black;
  padding-top: 2px;
  border-bottom: black 1px solid;
  font-family: Tahoma, Arial, Helvetica;
  background-color: #ffff99; 
}


/* =========================================================

    Design elements small boxes.  Can only be used
    for a box that has a height smaler then the size of
    the images (1000px).

    Note that image's must conform to "Body" background color.

============================================================
   Change Log
------------------------------------------------------------
   Date        Who       Notes
------------------------------------------------------------
   06/17/2008  RHarris   Initial Imp.  
============================================================ */
/* Show only to IE PC \*/
* html .boxhead h2 {height: 1%;} /* For IE 5 PC */

/* FlashBannerBox Background - white background  */
.FlashBannerBox { background: url(../images/sbbodywht-r.jpg) no-repeat bottom right; margin: 0 10px 0 0;padding: 0 0px 0 0;width: inherit;	}
.FlashBannerBox .BoxHeader { background: url(../images/sbheadwht-r.jpg) no-repeat top right;margin: 0;padding: 0;text-align: center;}
.FlashBannerBox .BoxHeader h1 { background: url(../images/sbheadwht-l.jpg) no-repeat top left; margin: 0; padding: 4px 5px 5px 5px;}
.FlashBannerBox .BoxBody {background: url(../images/sbbodywht-l.jpg) no-repeat bottom left; margin: 0 5px 0 0px; padding: 1px 5px 10px 10px;}

/* white background  */
.RightBox1 { background: url(../images/sbbodywht-r.jpg) no-repeat bottom right;margin: 0 10px 5px 0;padding: 0 0px 0 0;width: inherit;}
.RightBox1 .BoxHeader { background: url(../images/sbheadwht-r.jpg) no-repeat top right;margin: 0;padding: 0;text-align: center;}
.RightBox1 .BoxHeader h1 { background: url(../images/sbheadwht-l.jpg) no-repeat top left; margin: 0; padding: 5px 5px 0px 5px; font-family: Arial;font-size: 14pt;color: #7f7f7f; font-weight: bold;}
.RightBox1 .BoxBody {background: url(../images/sbbodywht-l.jpg) no-repeat bottom left; margin: 0 5px 0 0px; padding: 1px 10px 10px 10px;}

/* Green background  */
.RightBox2 { background: url(../images/sbbodygrn-r.jpg) no-repeat bottom right;margin: 0 10px 5px 0;padding: 0 0px 0 0;width: inherit;}
.RightBox2 .BoxHeader { background: url(../images/sbheadgrn-r.jpg) no-repeat top right;margin: 0;padding: 0;text-align: center;}
.RightBox2 .BoxHeader h1 { background: url(../images/sbheadgrn-l.jpg) no-repeat top left; margin: 0; padding: 5px 5px 0px 5px; font-family: Arial;font-size: 14pt;color: #7f7f7f; font-weight: bold;}
.RightBox2 .BoxBody {background: url(../images/sbbodygrn-l.jpg) no-repeat bottom left; margin: 0 5px 0 0px; padding: 1px 10px 10px 10px;}

/* Dark Green background  */
.RightBox3 { background: url(../images/sbbodyDKgrn-r.jpg) no-repeat bottom right;margin: 0 10px 5px 0;padding: 0 0px 0 0;width: inherit;}
.RightBox3 .BoxHeader { background: url(../images/sbheadDKgrn-r.jpg) no-repeat top right;margin: 0;padding: 0;text-align: center;}
.RightBox3 .BoxHeader h1 { background: url(../images/sbheadDKgrn-l.jpg) no-repeat top left; margin: 0; padding: 5px 5px 0px 5px; font-family: Arial;font-size: 14pt;color: #7f7f7f; font-weight: bold;}
.RightBox3 .BoxBody {background: url(../images/sbbodyDKgrn-l.jpg) no-repeat bottom left; margin: 0 5px 0 0px; padding: 1px 10px 10px 10px;}


/* =========================================================

    Design elements large boxes.  A box that has an undetermined heigh.
    
    Note that image's must conform to "Body" background color.

============================================================
   Change Log
------------------------------------------------------------
   Date        Who       Notes
------------------------------------------------------------
   06/17/2008  RHarris   Initial Imp.  
============================================================ */
/* White */
.LongBox1 { background: url(../images/sbbody-mid-wht-r.jpg) repeat-y right;margin: 0 10px 5px 0;padding: 0 0px 0 0;width: inherit;}
.LongBox1 .BoxHeader { background: url(../images/sbheadwht-r.jpg) no-repeat top right;margin: 0;padding: 0;text-align: center;}
.LongBox1 .BoxHeader h1 { background: url(../images/sbheadwht-l.jpg) no-repeat top left; margin: 0; padding: 5px 5px 0px 5px; font-family: Arial;font-size: 14pt;color: #7f7f7f; font-weight: bold;}
.LongBox1 .LongBoxBody { background: url(../images/sbbody-mid-wht-l.jpg) repeat-y left; margin: 0 15px 0 0px; padding: 1px 0px 10px 10px; text-align: left; }
.LongBox1 .LongBoxFooter{ background: url(../images/sbbody-bot-wht-r.jpg) no-repeat bottom right; margin: 0; padding: 0; text-align: left; }
.LongBox1 .LongBoxFooter h1 { background: url(../images/sbbody-bot-wht-l.jpg) no-repeat bottom left; margin: 0; padding: 5px 0px 0px 0px;}

/* Dark Green */
.LongBox2 { background: url(../images/sbbody-mid-DKGRN-r.jpg) repeat-y right;margin: 0 10px 5px 0;padding: 0 0px 0 0;width: inherit;}
.LongBox2 .BoxHeader { background: url(../images/sbheadDKgrn-r.jpg) no-repeat top right;margin: 0;padding: 0;text-align: center;}
.LongBox2 .BoxHeader h1 { background: url(../images/sbheadDKgrn-l.jpg) no-repeat top left; margin: 0; padding: 5px 5px 0px 5px; font-family: Arial;font-size: 14pt;color: #7f7f7f; font-weight: bold;}
.LongBox2 .LongBoxBody { background: url(../images/sbbody-mid-DKGRN-l.jpg) repeat-y left; margin: 0 15px 0 0px; padding: 1px 0px 10px 10px; text-align: left; }
.LongBox2 .LongBoxFooter{ background: url(../images/sbbody-bot-DKGRN-r.jpg) no-repeat bottom right; margin: 0; padding: 0; text-align: left; }
.LongBox2 .LongBoxFooter h1 { background: url(../images/sbbody-bot-DKGRN-l.jpg) no-repeat bottom left; margin: 0; padding: 5px 0px 0px 0px;}
	
/* Green */
.LongBox3 { background: url(../images/sbbody-mid-GRN-r.jpg) repeat-y right;margin: 0 10px 5px 0;padding: 0 0px 0 0;width: inherit;}
.LongBox3 .BoxHeader { background: url(../images/sbheadgrn-r.jpg) no-repeat top right;margin: 0;padding: 0;text-align: center;}
.LongBox3 .BoxHeader h1 { background: url(../images/sbheadgrn-l.jpg) no-repeat top left; margin: 0; padding: 5px 5px 0px 5px; font-family: Arial;font-size: 14pt;color: #7f7f7f; font-weight: bold;}
.LongBox3 .LongBoxBody { background: url(../images/sbbody-mid-GRN-l.jpg) repeat-y left; margin: 0 15px 0 0px; padding: 1px 0px 10px 10px; text-align: left; }
.LongBox3 .LongBoxFooter{ background: url(../images/sbbody-bot-GRN-r.jpg) no-repeat bottom right; margin: 0; padding: 0; text-align: left; }
.LongBox3 .LongBoxFooter h1 { background: url(../images/sbbody-bot-GRN-l.jpg) no-repeat bottom left; margin: 0; padding: 5px 0px 0px 0px;}


/* =========================================================

    Design elements Large boxes - Use this style when you 
    need a box that has an undertermined height.

    Note that image's must conform to "Body" background color.

============================================================
   Change Log
------------------------------------------------------------
   Date        Who       Notes
------------------------------------------------------------
   06/17/2008  RHarris   Initial Imp.  
============================================================ */
/* Blue Box with tab */
.TabBox1{background: url(../images/green-sbheader-r.png) no-repeat top right; margin: 0 10px 0 0; 	padding: 0 0 0 0;	width: inherit;}

.TabBox1 .LongBoxHead {
    float:left; 
    background: url(../images/green-sbTab-l.png) no-repeat top left;
    width:100%;
    font-family: Arial;
	font-size: 10pt;
	font-weight: bold;
	color: white;
    line-height:normal;
    padding: 0;
    margin: 0;
}

.TabBox1 .LongBoxHead ul {
    margin:0;
    padding: 0px 0px 0px 10px;
    list-style:none;
}

.TabBox1 .LongBoxHead li {
    background:url(../images/green-sbTab-r.png) no-repeat right top;
    float:left;
    margin:0;
    padding: 10px 15px 15px 0px;
}
    
.TabBox1 .LongBoxBody {
	border-left: 1px solid #999946;
    background-image: url(../images/green-sbody-mid-r.png);
	background-position: right 60px;
	background-repeat: no-repeat ;  
	margin: 0px 0px 0px 0px;
	padding: 1px 10px 10px  10px;
	text-align: left;

}

.TabBox1 .LongBoxFooter
{
	background: url(../images/green-sbbody-bot-l2.png) no-repeat bottom left; 
	margin: 0 0px 0 0;
	padding: 0 0 0 0;
	text-align: left;
}
.TabBox1 .LongBoxFooter h1 
{
	background: url(../images/green-sbbody-bot-r.png) no-repeat bottom right;
	margin: 0;
	padding: 14px 0px 0px 0px;
}


/* =========================================================

    Design elements for data entry pages, same as long box
    but allows you to have a different look and feel for
    data entry pages.  
    See membership.master for use of this set of classes

============================================================
   Change Log
------------------------------------------------------------
   Date        Who       Notes
------------------------------------------------------------
   06/17/2008  RHarris   Initial Imp.  
============================================================ */
.DataEntryBox 
{
	/* background: url(../images/sbbody-mid-r.jpg) repeat-y right;  */
	margin: 0;
	width: inherit;
	text-align: left;
	vertical-align: top;
	
}

.DataEntryBoxHead {
   /* background: url(../images/sbheadwht-r.gif) no-repeat top right; */
	margin: 0;
	padding: 0;
	text-align: center;
}
.DataEntryBoxHead h1 {
	/* background: url(../images/sbheadwht-l.gif) no-repeat top left;  */
	margin: 0;
	padding: 0;
    font-family: Arial;
	font-size: 14pt;
	color: #989845;
}

.DataEntryBoxBody {
	/* background: url(../images/sbbody-mid-l.jpg) repeat-y left; */
	margin: 0 15px 0 0px;
	padding: 1px 0px 10px 10px;
	font-family: "trebuchet MS", Times New Roman,Tahoma, Arial;
	font-size: 11pt;
	color: #333333;
}

/* =========================================================

    Design elements used for data Grids

============================================================
   Change Log
------------------------------------------------------------
   Date        Who       Notes
------------------------------------------------------------
   06/17/2008  RHarris   Initial Imp.  
============================================================ */
.DataGrid
{
    width: 95%;
	font-family: "trebuchet MS", Times New Roman,Tahoma, Arial;
	font-size: 10pt;
	color: #333333;
	GridLines: None;

}

.DataGridHead
{
	font-family:"trebuchet MS", Times New Roman,Tahoma, Arial;
	font-size: 11pt;
	color: #000000;
}

.DataGridItem
{
 border-bottom: solid .5px;
}


.StoreSearchBox{
	background: url(../images/SearchBG.jpg) no-repeat;
	margin: 0;
	padding: 0;
	text-align: left;
}

.DataGridItemAlt
{
}

.DataGridFooter
{
}

/* =========================================================

    Design elements used for data Grids

============================================================
   Change Log
------------------------------------------------------------
   Date        Who       Notes
------------------------------------------------------------
   06/17/2008  RHarris   Initial Imp.  
============================================================ */
/* Style for the outer DIV */


.EditTabMenu-container
{
	width: 100%;
	background-color: #556b8f;
	padding-left: 10px;
	padding-top: 5px;
	padding-bottom: 5px; 
    text-align: left;
    border: none;
}

/* Style for the list item li */
.EditTabMenu-Leaf
{
}

/* Style for the link button */
.EditTabMenu-Link
{
    color: White; /* #327DAA; */
	font-family: Arial;
    font-size: 12pt;
    text-align:center;
    font-weight: normal; 
    cursor:pointer; 
	padding: 5px 5px 5px 5px;
	text-decoration: none;
}

.EditTabMenu-Link:Hover
{
    color: #2f5467;
    background-color: White;
}

/* Style for the active link button */
.EditTabMenu-SelectedLink
{
	background-color: #b3c5b3; 
    color: White; /* #327DAA; */
	font-family: Arial;
    font-size: 12pt;
    text-align:center;
    font-weight: normal; 
    cursor:pointer; 
	padding: 5px 5px 5px 5px;
	text-decoration: none;
}

.EditTabMenu-SelectedLink:Hover
{ 
	color: #2f5467;
	background-color: White;
}