﻿/* NEW MENU */
.clr
{
	clear:both;
}
#TopMenuContainer a {text-decoration: none;}
.HomeMenu, .HomeMenu a
{
  background: url(/shared/img/menu_home_bg_normal.gif) no-repeat center 0px;
  height:20px;
  width:41px;
  color:#ffffff;
  font-size:9pt;
  font-weight:bold;
  font-family:"Trebuchet MS", Verdana, Helvetica, sans-serif;
  text-decoration:none;
  padding: 4px 0px 0px 1px;
  float:left;
  cursor:pointer;
}

.HomeMenu:hover, .HomeMenu a:hover
{
  background: url(/shared/img/menu_home_bg_hover.gif) no-repeat center 0px;
}

.TopMenu, .TopMenu a
{
  float:left;
  background: url(/shared/img/menu_bg_normal.gif) repeat-x center 0px;
  height:20px;
  color:#ffffff;
  font-size:9pt;
  font-weight:bold;
  font-family:"Trebuchet MS", Verdana, Helvetica, sans-serif;
  text-decoration:none;
  padding: 4px 7px 0px 7px;
  margin-right:1px;
  cursor:pointer;
}

.TopMenu:hover, .TopMenu a:hover
{
  background: url(/shared/img/menu_bg_hover.gif) repeat-x center 0px;
}

/* END NEW MENU */

#SectionTemlateTrebuchet p, #SectionTemlateTrebuchet li, #SectionTemlateTrebuchet td
{
  font-size:9pt;
  font-family:"Trebuchet MS", Verdana, Helvetica, sans-serif;
  color:#54504d;
}

#SectionTemlateTrebuchet strong
{
	color:#000000;
}

.popupMasterBody
{
  background-color:#ffffff;
}

#popupLogo
{
  float:right; margin:10px;
}

#popupTopCloseWindow
{
   float:left;
   font-size:8pt;
	 font-family:arial;
	 margin:10px;
}

#popupCloseWindow
{
  text-align:left; padding-left:2px;
}

#BaseContainer
{
  width:100%; 
	text-align:center; 
	background-color:#d7d2cb;
}

#Header
{
  width:960px; 
  height:60px;
  margin: auto;
  background: url(/shared/img/banner_bg.png) no-repeat center 0px;
  padding:0px 10px 0px 10px;
}

#TopMenuContainer
{
  width:700px; 
  height:24px;
  float:left;
  margin-top:0px;
  padding-top:0px;
  margin-left:1px;
  display:block;
}

#LoginButton
{
  width:728px; height:19px; float:left;
  margin-bottom:5px;
  margin-top:5px;
  display:block;
  text-align:right;
  color:#666666;
  font-family:Trebuchet MS;
  font-size:8pt;
}

#LoginButton a
{
  text-decoration:none;
}

#WVlogo
{
  width:125px;
  height:50px;
  float:right;
  text-align:right;
  padding-top:0px;
  display:block;
  margin-top:5px;
}

img
{
  border:0px;
}

#MainContentContainer
{
  width:980px; 
  margin: auto;
  text-align:center;
  background: #ffffff url(/shared/img/content_top.png) no-repeat center top;
  margin-top:6px;
}

#InnerContentContainer
{
  width:725px; 
  text-align:left;
  background-color:#ffffff;
  margin: auto;
}

#MainContentContainerExternal
{
  width:740px; 
  margin: auto;
  text-align:center;
  background: #ffffff url(/shared/img/content_top.png) no-repeat center top;
  margin-top:6px;
}

#InnerContentContainerExternal
{
  width:725px; 
  text-align:left;
  background-color:#ffffff;
  margin: auto;
}

#BottomContentContainer
{
  width:980px; 
  margin: auto;
  height:10px;
  margin-bottom:20px;
  background: url(/shared/img/content_bottom.png) no-repeat center bottom;
}

#FooterContentContainer
{
  width:950px; 
  text-align:left;
  background-color:#ffffff;
  margin: auto;
  padding:0px 15px 0px 15px;
}

#FormMenuLink
{
  padding-top:30px;
  padding-left:8px;
  padding-bottom:5px;
  font-size:8pt;
  font-family:arial;
  color:#ccc1bc;
}

#FormFooterLink
{
  padding-top:3px;
  padding-left:8px;
  padding-bottom:3px;
  border-top: 1px #e2e1df solid; 
  font-size:8pt;
	font-family:arial;
	color:#ccc1bc;
}

#FormFooterLink a, #FormMenuLink a
{
  font-size:8pt;
	font-family:Trebuchet MS, Arial, Verdana;
}

#FormFooterDisclaimer
{
  padding-bottom:12px;
}

#FormFooterDisclaimer p
{
  color:#54504d;
  font-size:8pt;
	font-family:Trebuchet MS, Arial, Verdana;
	margin-bottom:0px;
	padding-left:8px;
}

body
{
	padding: 0px;
	margin: 0px;
	font-family: Arial, Helvetica, Sans-Serif;
	background-color:#d7d2cb;
}

p
{
}

h1, h2, h3
{
	color: #FF6600;
}

h3
{
	font-size: 1em;
	padding-bottom: 5px;
	font-weight: bold;
}


/* Links Start */
a
{
	color: #FF6600;
}

a:hover
{
	color: #FFA366;
}
/* Links End */

#MasterHeader
{
	padding: 0px;
	background-image: url('../img/HeaderbackGround.gif');
	background-position: left top;
	height: 60px;
}

#menu
{
	background-image: url('../img/home_menu_plain.gif');
	background-repeat: repeat-x;
	height: 20px;
	width: 100%;
}

#aspnetForm
{
	clear: both;
}

#leftContainer
{
	float: left;
	width: 200px;
	padding: 10px;
}

#rightContainer
{
	float: right;
	width: 200px;
	padding: 10px;
}

#centerContainer
{
	margin-right: 210px;
	margin-left: 210px;
	padding: 10px;
	float: left;
}

#footer
{
	font-family: Arial, Helvetica, sans-serif;
	color: #666666;
	background-color: #f1f1f1;
	padding: 5px;
	font-size: 8pt;
	border-top: solid 1px #ff6600;
	clear: both;
	height: 55px;
}

.noScriptWarning
{
	color: #005500;
	font-weight: bold;
}

.primaryBackground
{
	background-color: #FFF0E5;
}

.secondoryBackground
{
	background-color: #EDF3F7;
}

.secondoryBackground h3
{
	color: #898989;
}

.secondoryBackground a
{
	color: #818283;
}

.border
{
	border: solid 1px #ff6600;
}

.primaryBorder
{
	border: solid 1px #898989;
}

.secondaryBorder
{
	border: solid 1px #408cbf;
}

.noBorder
{
	border: none 0px;
}

.simpleContainer
{
	padding: 10px;
	margin-bottom: 10px;
}

.thinContainer
{
	padding: 5px;
	margin-bottom: 10px;
}

.veryThinContainer
{
	padding: 0px;
	margin-bottom: 10px;
}

.radioList label
{
	padding-right: 10px;
}

.left
{
	text-align: left;
}

.center
{
	text-align: center;
}

.right
{
	text-align: right;
}

.floatLeft
{
	float: left;
}

.floatRight
{
	float: right;
}

.floatClear
{
	clear: both;
	height: 1px;
	overflow: hidden;
	font-size: 1px;
}

caption
{
	color: #FF6600;
	text-align: left;
	padding-left: 3px;
	font-size: 1em;
	padding-bottom: 5px;
	font-weight: bold;
}

table.grid th
{
	color: #FF6600;
	text-align: left;
	padding: 3px;
}

table.grid td
{
	text-align: left;
	padding: 3px;
}


table.grid thead, table.grid tfoot
{
	background-color: #FFF0E5;
	font-weight: bold;
}

table.grid tbody th
{
	font-weight: normal;
}

table.grid tr.alternating
{
	background-color: #EDF3F7;
}


/* This style sheet is intended to contain RARELY CHANGED rules used when the Menu control adapter is enabled. */
/* These rules correspond to the "pure CSS menu" technique that have been evolving over the past several years. */ 
/* See WhitePaper.aspx for details. */

ul.Menu 
{
    position: relative;
}


ul.Menu, ul.Menu ul
{
    margin: 0px;
    padding: 0px;
    display: block;
}

ul.Menu li
{
    position: relative;
    list-style: none;
    padding: 0px;
    list-style-position: outside;
}

ul.Menu li a,
ul.Menu li span
{
    display: block;
    text-decoration: none;
}

ul.Menu ul
{
    position: absolute;
    display: none;    
}

/* Add more rules here if your menus have more than three (3) tiers */
ul.Menu li:hover ul ul,
ul.Menu li:hover ul ul ul,
ul.Menu li.Menu-Hover ul ul,
ul.Menu li.Menu-Hover ul ul ul
{
    display: none;
}

/* Add more rules here if your menus have more than three (3) tiers */
ul.Menu li:hover ul,
ul.Menu li li:hover ul,
ul.Menu li li li:hover ul,
ul.Menu li.Menu-Hover ul,
ul.Menu li li.Menu-Hover ul,
ul.Menu li li li.Menu-Hover ul
{
    display: block;
}


/* -------------------------------------------------------------------------- */
/* When the Menu control's Orientation property is Horizontal the adapter wraps the menu with DIV */
/* whose class is Menu-Horizontal. This allows us to force the top tier of the menu to layout */
/* horizontally, whereas all subsequent tiers of the menu lay out vertically. */

.Menu-Horizontal ul.Menu li
{
    float: left;
}

.Menu-Horizontal ul.Menu li li
{
    float: none;
}


/* This style sheet is intended to contain OFTEN CHANGED rules used when the Menu control adapter is enabled. */

/* When the Menu control's Orientation property is Vertical the adapter wraps the menu with DIV */
/* whose class is Menu-Vertical. */
/* Note that the example menu in this web site uses relative positioning to force the menu to occupy */
/* a specific place in the web page.  Your web site will likely use a different technique to position your */
/* menu.  So feel free to change all the properties found in this CSS rule if you clone this style sheet. */
/* There is nothing, per se, that is magical about these particular property value choices.  They happen to */
/* work well for the sample page used to demonstrate an adapted menu. */
.PrettyMenu .Menu-Vertical
{
    position:relative;
    top: 0px;
    left: 0px;
    z-index: 300;
}

/* This rule effectively says: style all tiers EXCEPT THE TOP TIER in the menu this way... */
/* In other words, this rule can be used to style the second and third tiers of the menu without impacting */
/* the topmost tier's appearance. */
.PrettyMenu ul.Menu ul
{
    width: 160px;
    font-family: Arial, Helvetica, Sans-Serif;
    font-size: 9pt;
    background: #F1F1F1;
    left: 160px;
    top: 3px;
    border:1px solid #999999;
}

/* The menu adapter generates a list item (li) in HTML for each menu item. */
/* Use this rule create the common appearance of each menu item. */
.PrettyMenu ul.Menu li
{
    background:#F1F1F1;
}

/* Within each menu item is a link or a span, depending on whether or not the MenuItem has defined it's */
/* NavigateUrl property. By setting a transparent background image here you can effectively layer two images */
/* in each menu item.  One comes from the CSS rule (above) governing the li tag that each menu item has. */
/* The second image comes from this rule (below). */
.PrettyMenu ul.Menu li a,
.PrettyMenu ul.Menu li span
{
    color: black;    
    padding: 0px 2px 0px 8px;
    margin: 0px;
}

.PrettyMenu ul.Menu li ul li a,
.PrettyMenu ul.Menu li ul li span
{
    color: black;    
    padding: 3px 2px 3px 3px;
    margin: 0px;
}

* html .PrettyMenu ul.Menu li ul li a
{
	padding-bottom: 0px;
}




.Menu-Vertical li.Menu-WithChildren a,
.Menu-Vertical li.Menu-WithChildren span
{
	background: transparent url(../img/arrowRight.png) right center no-repeat;
}

/* When a menu item contains no submenu items it is marked as a "leaf" and can be styled specially by this rule. */
.PrettyMenu ul.Menu li.Menu-Leaf a,
.PrettyMenu ul.Menu li.Menu-Leaf span
{
    background-image: none;
}

/* Not used presently.  This is here if you modify the menu adapter so it renders img tags, too. */
.PrettyMenu ul.Menu li a img, .PrettyMenu ul.Menu li span img
{
    border-style: none;
    vertical-align: middle;
    margin: 0px -2px 0px -8px;
}

/* When you hover over a menu item, this rule comes into play. */
/* Browsers that do not support the CSS hover pseudo-class, use JavaScript to dynamically change the */
/* menu item's li tag so it has the Menu-Hover class when the cursor is over that li tag. */
/* See MenuAdapter.js (in the JavaScript folder). */
.PrettyMenu ul.Menu li:hover, 
.PrettyMenu ul.Menu li.Menu-Hover
{
    
}

/* While you hover over a list item (li) you are also hovering over a link or span because */
/* the link or span covers the interior of the li.  So you can set some hover-related styles */
/* in the rule (above) for the li but set other hover-related styles in this (below) rule. */
.PrettyMenu ul.Menu li a:hover,
.PrettyMenu ul.Menu li span.Menu-Hover
{
    color: #FF6600;
}

.PrettyMenu ul.Menu li.Menu-Leaf a:hover
{
    background-image: none;
}


/* -------------------------------------------------------------------------- */
/* When the Menu control's Orientation property is Horizontal the adapter wraps the menu with DIV */
/* whose class is Menu-Horizontal. */
/* Note that the example menu in this web site uses absolute positioning to force the menu to occupy */
/* a specific place in the web page.  Your web site will likely use a different technique to position your */
/* menu.  So feel free to change all the properties found in this CSS rule if you clone this style sheet. */
/* There is nothing, per se, that is magical about these particular property value choices.  They happen to */
/* work well for the sample page used to demonstrate an adapted menu. */

.PrettyMenu .Menu-Horizontal
{
    position:relative;
    margin: 0px;
    z-index: 300;
    border-left: solid 1px #666666;
}

/* This rule controls the width of the top tier of the horizontal menu. */
/* BE SURE TO MAKE THIS WIDE ENOUGH to accomodate all of the top tier menu items that are lined */
/* up from left to right. In other words, this width needs to be the width of the individual */
/* top tier menu items multiplied by the number of items. */
.PrettyMenu .Menu-Horizontal ul.Menu
{
    width: 100%;
    background-repeat: repeat-x;    
    background-image: url('../img/home_menu_plain.gif');
    border: none;
}

/* This rule effectively says: style all tiers EXCEPT THE TOP TIER in the menu this way... */
/* In other words, this rule can be used to style the second and third tiers of the menu without impacting */
/* the topmost tier's appearance. */
/* Remember that only the topmost tier of the menu is horizontal.  The second and third tiers are vertical. */
/* So, they need a much smaller width than the top tier.  Effectively, the width specified here is simply */
/* the width of a single menu item in the second and their tiers. */
.PrettyMenu .Menu-Horizontal ul.Menu ul
{
    width: 160px;
    left: -1px;
    top: 20px;
}

/* This rule can be used to set styles for the menu items in the second tier (and lower) in the menu. */
.PrettyMenu .Menu-Horizontal ul.Menu li li
{
		width:100%;
		text-align:left;
}

/* This rule establishes the width of menu items below the top tier.  This allows the top tier menu items */
/* to be narrower, for example, than the sub-menu items. */
/* This value you set here should be slightly larger than the left margin value in the next rule. See */
/* its comment for more details. */
.PrettyMenu .Menu-Horizontal ul.Menu ul li
{
    width:100%;
}


/*This rule establishes the layout of a RadioButtonList is the RepeatDirection is Vertical and the RepeatLayout is Table. */
/*Stops the second line of text wrapping under the radio button. Please see green/Donate.aspx.cs for code changes required.*/
/*Future: Look at modifying YourGift.aspx*/
table.mylist input {
      display:block;
      float: left;
   }
   
table.mylist label {
      width: 600px;
      display:inline-block;
      float: left;
   }


