@charset "utf-8";
/* CSS Document */

body  {
	font-family: Arial, Helvetica, sans-serif;
	background: #FFF;
	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 */
	color: #000000;
}
#container { 
	width: 900px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFFFFF;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
} 
#header { 
	padding: 0;
	margin: 0;
} 
#leftbar {
	float: left; /* since this element is floated, a width must be given */
	width: 200px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	height: 386px;
	padding: 0; /* padding keeps the content of the div away from the edges */
	margin: 0;
	background: url(images/Go_Green_Sidebar.jpg) no-repeat;
}
#leftbar_text {
	padding: 35px 15px 0 15px;
}
#leftbar_text p {
	color: #FFF;
	font-size: 12px;
	font-weight: bold;
	line-height: 18px;
	margin-top: 0;
	margin-bottom: 6px;
}

/*Ramesh removed: 	height: 13px; */

/*
a[href="javascript:void(0);"] { font-size: larger; }
a[href="javascript:void(1);"] { font-size: larger; }
*/
#leftbar_text .login {
	width: 142px;
	font-size: 11px;
	color: #62626a;
}
#leftbar_text .check {
	font-size: 11px;
	color: #FFF;
	font-weight: bold;
}
#leftbar_text .phone {
	font-size: 14px;
	color: #FFF;
	font-weight: bold;
}
#leftbar_text .access {
	height: 130px;
	padding-top: 10px;
}
#rightbar {
	float: right; /* since this element is floated, a width must be given */
	width: 195px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
}
#rightbar_text {
	padding: 0 0px 0 20px; /* padding keeps the content of the div away from the edges */
	margin: 0;
	line-height: 16px;
}
#rightbar h1 {
	font-size: 14px;
	font-weight: bold;
	color: #004a40;
	margin-bottom: 3px;
	font-style: italic;
}
#rightbar p {
	font-size: 11px;
	margin-top: 0;
	padding-top: 0;
}
#mainContent { 
	margin: 0 190px 0 200px; /* the right and left margins on this div element creates the two outer columns on the sides of the page. No matter how much content the sidebar divs contain, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the sidebar spaces when the content in each sidebar ends. */
}
#mainContent_text { 
	padding: 0 25px 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}

/*Ramesh*/
#mainContent_admin { 
	margin: -20 0px 0 0px; /* the right and left margins on this div element creates the two outer columns on the sides of the page. No matter how much content the sidebar divs contain, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the sidebar spaces when the content in each sidebar ends. */
	text-align: left; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
}

/*Ramesh*/
#mainContent_text_admin { 
	padding: 0 0px 0 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}

/*Ramesh*/
input.hinted_text_field {
    color: gray; 
	background: #FFF;
}
input.unhinted_text_field
{
}

#mainContent .divider {
	float: right;
	height: 386px;
	width: 1px;
	border-right: 1px solid #626469;
}
#mainContent h1 { 
	font-size: 16px;
	font-weight: bold;
	color: #004a40;
	margin: 0;
	padding-bottom: 0;
} 
#mainContent h2 {
	color: #004a40;
	font-size: 12px;
	margin-top: 0;
	padding-top: 0;
}
#mainContent p, li {
	font-size: 12px;
	line-height: 17px;
}
#mainContent .subhead {
	font-size: 13px;
	color: #004a40;
	font-weight: bold;
}
#mainContent_services {
	margin: 0 190px 0 200px; /* the right and left margins on this div element creates the two outer columns on the sides of the page. No matter how much content the sidebar divs contain, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the sidebar spaces when the content in each sidebar ends. */
	background: url(images/bkg_our_services.jpg) no-repeat;	
}
#mainContent_text_services { 
	padding: 0 5px 0 12px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
#mainContent_services .divider {
	float: right;
	height: 386px;
	width: 1px;
	border-right: 1px solid #626469;
}
#mainContent_services h1 { 
	font-size: 16px;
	font-weight: bold;
	color: #004a40;
	margin: 0;
	padding-bottom: 0;
} 
#mainContent_services p, li {
	font-size: 12px;
	line-height: 17px;
}
#mainContent_services td .subhead {
	font-size: 14px;
	color: #004a40;
	font-weight: bold;
	font-style: italic;
}
#mainContent_services td p {
	font-size: 12px;
	line-height: 17px;
	padding: 0;
	margin: 6px;
}
#footer { 
	padding: 20px 0 0 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
} 
#footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font-size: 10px;
	text-align: center;
}
#footer .logos {
	border-top: 1px solid #626469;
	border-bottom: 1px solid #626469;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
	width: 100%;
}
#footer .nav {
	font-size: 11px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
	width: 100%;
}
#footer .nav a {
	color: #626469;
	text-decoration: none;
	margin: 0 5px;
}
#footer .nav a:hover {
	color: #004a40;
	text-decoration: none;
}

..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 */
	float: left;
}
.fltlft { /* this class can be used to float an element left in your page */ /* 2011-Mar-18 */
	float: left;
}
..clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
sup { 
	vertical-align: .8ex;
	font-size: 13px;
}
a:link {
  color: #004a40;
  text-decoration: underline;
}
a:visited {  
color: #004a40;
}
a:hover {
  color: #004a40;
}
a:active {
  color: #004a40;
}
/* start main nav buttons */
/* span tags are to replace <a> tags for
   current pages */
a.aboutus:link, a.aboutus:visited {
	display: block;
	height: 50px;
	width: 125px;
	background: url(images/About_Us_Green.jpg) no-repeat;
}
a.aboutus:hover {
	background: url(images/About_Us_Yellow.jpg) no-repeat;
}
..aboutus {
	background: url(images/About_Us_Yellow.jpg) no-repeat;
	display: block;
	height: 50px;
	width: 125px;
}

a.ourservices:link, a.ourservices:visited {
	background: url(images/Our_Services_Green.jpg) no-repeat;
	display: block;
	height: 50px;
	width: 123px;
}
a.ourservices:hover {
	background: url(images/Our_Services_Yellow.jpg) no-repeat;
}
..ourservices {
	background: url(images/Our_Services_Yellow.jpg) no-repeat;
	display: block;
	height: 50px;
	width: 123px;
}

a.usvsthem:link, a.usvsthem:visited {
    background: url(images/Us_Vs_Them_Green.jpg) no-repeat;
    display: block;
    height: 50px;
    width: 122px;
}

a.usvsthem:hover {
    background: url(images/Us_Vs_Them_Yellow.jpg) no-repeat;
}

..usvsthem {
    background: url(images/Us_Vs_Them_Yellow.jpg) no-repeat;
    display: block;
    height: 50px;
    width: 122px;
}

a.ourpartners:link, a.ourpartners:visited {
	background: url(images/Our_Partners_Green.jpg) no-repeat;
	display: block;
	height: 50px;
	width: 122px;
}
a.ourpartners:hover {
	background: url(images/Our_Partners_Yellow.jpg) no-repeat;
}
..ourpartners {
	background: url(images/Our_Partners_Yellow.jpg) no-repeat;
	display: block;
	height: 50px;
	width: 122px;
}

a.sustain:link, a.sustain:visited {
	background: url(images/Sustainability_Green.jpg) no-repeat;
	display: block;
	height: 50px;
	width: 126px;
}
a.sustain:hover {
	background: url(images/Sustainability_Yellow.jpg) no-repeat;
}
..sustain {
	background: url(images/Sustainability_Yellow.jpg) no-repeat;
	display: block;
	height: 50px;
	width: 126px;
}




/*********************Ramesh added******************************/

.line_for_footer {
	border: 2px solid #3994e7;
}

.NavBarBreadCrumb
{
}
.NavBarBreadCrumb P 
{
	padding: 4px;	
}

.NavBarBreadCrumb span 
{
	font-family:Tahoma;
	font-size: 12px; 
	color:gray;
	padding: 4px;	
}

.theme_header
{
	padding-bottom:16px;
}

.button_style
{
	font-family:Tahoma;
	font-size: 12px; 
	font-weight: bold;
	color:gray;
}

/* menu styles */

/* 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.AspNet-Menu 
{
    position: relative;
}


ul.AspNet-Menu, 
ul.AspNet-Menu ul
{
    margin: 0;
    padding: 0;
    display: block;

}

ul.AspNet-Menu li
{
    position: relative;
    list-style: none;
}

ul.AspNet-Menu li a,
ul.AspNet-Menu li span
{
    display: block;
    text-decoration: none;
}

ul.AspNet-Menu ul
{
    position: absolute;
    display: none;    
}

/* Add more rules here if your menus have more than three (3) tiers */
ul.AspNet-Menu li:hover ul ul,
ul.AspNet-Menu li:hover ul ul ul,
ul.AspNet-Menu li.AspNet-Menu-Hover ul ul,
ul.AspNet-Menu li.AspNet-Menu-Hover ul ul ul
{
    display: none;
}

/* Add more rules here if your menus have more than three (3) tiers */
ul.AspNet-Menu li:hover ul,
ul.AspNet-Menu li li:hover ul,
ul.AspNet-Menu li li li:hover ul,
ul.AspNet-Menu li.AspNet-Menu-Hover ul,
ul.AspNet-Menu li li.AspNet-Menu-Hover ul,
ul.AspNet-Menu li li li.AspNet-Menu-Hover ul
{
    display: block;
}


/* -------------------------------------------------------------------------- */
/* When the Menu control's Orientation property is Horizontal the adapter wraps the menu with DIV */
/* whose class is AspNet-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. */

.AspNet-Menu-Horizontal ul.AspNet-Menu li
{
    float: left;
}

.AspNet-Menu-Horizontal ul.AspNet-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 AspNet-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. */
 .AspNet-Menu-Vertical
{
    position:relative;
    top: 30px;
    left: 0;
    z-index: 300;
}

/* The menu adapter renders an unordered list (ul) in HTML for each tier in the menu. */
/* So, effectively says: style all tiers in the menu this way... */
 ul.AspNet-Menu, 
 ul.AspNet-Menu ul
{
    min-width:180px;
    /*width: expression("180px");*/
    width: 180px;
    font-family: Tahoma;
    font-size: 8pt;
}

/* 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. */
 ul.AspNet-Menu ul
{
    left: 177px;
    top: 3px;
}

/* 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. */
 ul.AspNet-Menu li
{
    background: url(bg-menu-example.png) repeat-x;
    margin:0 0 0 0;
}

/* 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). */
 ul.AspNet-Menu li a,
 ul.AspNet-Menu li span
{
    color: black;
    padding: 4px 2px 4px 8px;
    border-top: solid 1px #d9e7f2;
    border-right: solid 1px #c2ddf2;
    border-bottom: solid 1px #c2ddf2;
    border-left: solid 1px #d9e7f2;
    background: transparent url(arrow.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. */
 ul.AspNet-Menu li.AspNet-Menu-Leaf a,
 ul.AspNet-Menu li.AspNet-Menu-Leaf span
{
    background-image: none;
}

/* Not used presently.  This is here if you modify the menu adapter so it renders img tags, too. */
 ul.AspNet-Menu li a img
{
    border-style: none;
    vertical-align: middle;
}

/* 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 AspNet-Menu-Hover class when the cursor is over that li tag. */
/* See MenuAdapter.js (in the JavaScript folder). */
 ul.AspNet-Menu li:hover, 
 ul.AspNet-Menu li.AspNet-Menu-Hover
{
    background:#FFF;
}

/* 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. */
 ul.AspNet-Menu li a:hover,
 ul.AspNet-Menu li span.Asp-Menu-Hover
{
    color:#000;
    background: transparent url(arrow-active.png) right center no-repeat;
}

 ul.AspNet-Menu li.AspNet-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 AspNet-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. */

.AspNet-Menu-Horizontal
{
    width: 500px;
    z-index: 300;
}

/* 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. */
.AspNet-Menu-Horizontal ul.AspNet-Menu
{
    width: 900px;
}

/* 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. */
.AspNet-Menu-Horizontal ul.AspNet-Menu ul
{
    width: 130px;
    left: 3px;
    top: 2em;
}

/* Generally, you use this rule to set style properties that pertain to all menu items. */
/* One exception is the width set here.  We will override this width with a more specific rule (below) */
/* That sets the width for all menu items from the second tier downward in the menu. */
.AspNet-Menu-Horizontal ul.AspNet-Menu li
{
    /*Ramesh: Width of the menu item*/
    width:128px;
    text-align:center;
}

/* This rule can be used to set styles for the menu items in the second tier (and lower) in the menu. */
.AspNet-Menu-Horizontal ul.AspNet-Menu li li
{
    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. */
.AspNet-Menu-Horizontal ul.AspNet-Menu ul li
{
    min-width:180px;
    /*width: expression("180px");*/
    width: 180px;
}

/* Third tier menus have to be positioned differently than second (or top) tier menu items because */
/* they drop to the side, not below, their parent menu item. This is done by setting the last margin */
/* value (which is equal to margin-left) to a value that is slightly smaller than the WIDTH of the */
/* menu item. So, if you modify the rule above, then you should modify this (below) rule, too. */
.AspNet-Menu-Horizontal ul.AspNet-Menu li ul li ul
{
    margin: -1.8em 0 0 126px;
}