/* CSS Document */
.body { background-color: #f0f0f0; }

.link {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #717171;
}
.heading {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #3366CC;
	font-weight: bold;
}
.content {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #717171;
}
.readmore {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #26156b;
}
.contentcopy {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #717171;
	font-style: normal;
	font-weight: normal;
}
/*

This classes will give same result like #MyMenu is giving

.menustyle
{
	background-image:url("images/button_on.jpg");
	background-repeat: no-repeat; 
	text-align:center;
	font-family:Verdana;
	font-size:8pt;
	text-decoration:none;
	color:White;
	height:41px;
	width:77px;
	vertical-align:middle;
}
.menustyle a
{
	background-color: transparent ! important; 
 the reason we use !important is to override the images we just set in

item, selected items and hover for the "anchor class like a:visted, a:hover etc" 

display: block; 

}
.menustyleover
{
	background-image:url("images/button_over.jpg");
	background-repeat: no-repeat; 
	text-align:center;
	font-family:Verdana;
	font-size:8pt;
	text-decoration:none;
	color:White;
	height:41px;
	width:77px;
}
*/

.submenuitem
{
	
	background-color:#133886;
	text-align:left;
	text-indent:5px;
	font-family:Verdana;
	font-size:8pt;
	text-decoration:none;
	color:White;
	height:17px;
	width:100px;
}
.submenuitemover
{
	
	background-color:#2971c5;
	text-align:left;
	text-indent:5px;
	font-family:Verdana;
	font-size:8pt;
	text-decoration:none;
	color:White;
	height:17px;
	width:100px;
}

#MyMenu{ 

/* Lets leave it blank */

}

#MyMenu .Item

{ 

/* CSS class for non-selected Menu Item */

background-image: url(images/button_on.jpg); 
background-repeat: no-repeat; 
text-align:center;
font-family:Verdana;
font-size:8pt;
text-decoration:none;
color:White;
height:41px;
width:77px;
vertical-align:middle;
	

}

#MyMenu .SelectedItem, #MyMenu .HoverItem

{ 

/* CSS class for hovering and selected Menu Item 
i am using same image for hover and selected item,

we can use different ones also */

	background-image: url(images/button_over.jpg); 
	background-repeat: no-repeat; 
	text-align:center;
	font-family:Verdana;
	font-size:8pt;
	text-decoration:none;
	color:White;
	height:41px;
	width:77px;

}

/* CSS classes for standard Links for #MyMenu  DIV */

#MyMenu a, #MyMenu a:visited

{

background-color: transparent ! important; 
/* the reason we use !important is to override the images we just set in

item, selected items and hover for the "anchor class like a:visted, a:hover etc" */

display: block; 
}

#MyMenu a:hover, #MyMenu a:active, #MyMenu a:focus

{

background-color: transparent ! important; 
/* the reason we use !important is to override the images we just set in

item, selected items and hover "anchor class like a:visted, a:hover etc" */

display: block; 
}