/*
	colors
	Methanol Green: 00A594;
	Mint Blue: 336699;
*/
body
	{
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		color:#336699;
		font-family:Arial, Helvetica, sans-serif;
		background-image:url(/media/gradient.jpg);
		background-position:top left;
		background-repeat:repeat;
	/*	*/
	}
a
	{
		color:#00A594;
	}
h2
	{
		color:#336699;
	}
.calHeading
	{
		color:#336699;
		font-size:1.3em;
		font-weight:900;
	}
.calSubHeading
	{
		font-size:0.8em;
		color:#336699;
	}
.monthHeading
	{
		color:#ffffff;
		background-color:#00A594;
		font-family:"Trebuchet MS", Verdana, Arial, sans-serif;
		font-size:1.1em;
		text-align:center;
	}
/*
	Begin Top Banner styles
*/
/*
	Begin Top Nav styles
*/
#topMenus
	{
		background-color:#00A594;
/* 		width:765px;  */
 		font-size:8pt;
		font-weight:600;
		color:#ffffff;
		line-height:20px;
	}
#topBanner
	{
		background-color:#ffffff;
	}

/*
	Begin Content Styles
*/
#bodySection
	{
		width:100%;
		float:left;
		height:100%;
	}
/*
	Begin Left Nav Styles
*/
#leftMenus
	{
		padding:0 0 0 8px;
		/*width:165px;*/
 		float:left;
		background-color:#00A594;    
		height:100%;
  	}
/*
	Begin Center Content

*/
#contentSection
	{
		float:left;
		z-index:2;
		/*  width:600px;
 		background-image:url(/media/frontPage/topCollage.jpg);
		 
		background-position:top left;
		background-repeat:no-repeat;
		
		padding:100px 75px 0 0px;*/
  	}
#contentDiv
	{
		/*float:left;
		 width:600px;*/
		padding:0px 20px 0 20px;
		z-index:2;

   	}
/*
	Begin Bottom Styles
*/
#footer
	{
		/*  float:left;  */
		color:#ffffff;
		font-family:Georgia,arial, helvetica;
		font-size:12pt;
		background-color:#00A594;
		text-align:center;
		/* width:765px;*/
 	}
.footerLink
	{
		color:#ffffff;
		font-weight:600;
		text-decoration:none;
		font-size:12pt;
	}
/* FORM */
.lbl
	{
		font-weight:bolder;
	}
.asterisk
	{
		color:#ff0000;
		vertical-align:text-top;
		font-size:0.9em;
		text-decoration:none;
	}
.frmInstruction
	{
		text-align:center;
		font-size:0.8em;
	}

/* end form */
/* top menus */
/* change to 800 */
#topMenuSections
	{
		width:770px;
 /*		width:1000px; */
		height:25px;
	}
#tLeft
	{
 		width:160px;
 		float:left;
	}
#tMenus
	{
/*		width:650px;		font-size:1.0em; */
		width:600px; 
		font-size:0.95em;
		letter-spacing:0.0em;
 		float:left;
		margin:0px 0px 0px 0px;
  	}
#tTranslations
	{
/*		width:150px; 		font-size:1.1em;*/
		width:100px; 
		font-size:0.85em;
 		float:right;
		text-align:right;
		margin:0px 10px 0px 10px;
		padding:0px 00px 0px 10px;
		letter-spacing:0.2em;
	}
#frmLng
	{
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
	}
.lngFrm
	{
		font-size:0.9em;
		margin:0.2em 0px 0.2em 0px;
	}
.heading3
	{
		text-align:center;
		margin:0px 0px 0px 0px;
		padding:0px 0px 0px 0px;
		font-size:2.5em;
		letter-spacing:0.4em;
		color:#00A594;
 	}
/* header */
#logoDiv
	{
 		width:126px;
	}
#addrDiv
	{
 		width: 400px;
		font-size:1.0em;
		padding:0.0em 0px 0em 0px;
		color:#00A594;
	}
.hAddr
	{
		width:220px;
		text-align:center;
		font-size:0.8em;
	}
.subHead3
	{
		font-size:1.2em;
		font-weight:600;
	}
h2.whoWeAre
	{
		color:#00A594;
		padding:0px 0px;
		margin:0px 0px;
		text-align:left;
	}
.whoWeAreB
	{
		color:#369;
		font-weight:bolder;
	}
	
/* end header */
a.topMenusNav, a.topMenusNav:visited, a.topMenusNav:active
	{	
		color:#fff;
		text-decoration:none;
		padding:0px 5px 0px 5px;
		font-size:1.1em;
	}	
a.topMenusNav:hover
	{
		color:#000080;
		text-decoration:none;
	}
a.leftMenusNav, a.leftMenusNav:visited, a.leftMenusNav:active
	{	
		color:#fff;
		text-decoration:none;
 		margin:6px 8px 6px 8px;
		padding:10px 0px 0px 0px;
  		font-size:1.1em;
		line-height:1.4em;
  	}	
a.leftMenusNav:hover
	{
		color:#000080;
		text-decoration:none;
	}
	
 /* end top menus */
 .beltLink
 	{
		color:#336699;
		text-decoration:none;
		text-align:left;
	}
 /* stepCarousel */
 .stepcarousel{
position: relative; /*leave this value alone*/
border: 0px solid navy;
overflow: scroll; /*leave this value alone*/
width: 650px;
height: 200px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 15px; /*margin around each panel*/
width: 100px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
font-size:0.8em;
}

/* begin navigation */
 /*** ESSENTIAL STYLES ***/
/**/
.sf-menu, .sf-menu * {
	margin:			0;
 	padding:		0; 
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em;  
}  
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
	z-index:99;
}
.sf-menu a {
	border-left:	1px solid #00A594;
	border-bottom:		1px solid #369;
	padding: 		.75em 1em;
	text-decoration:none;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#13a;
}
.sf-menu li {
	background:		#00A594;
}
.sf-menu li li {
	background:		#00A594;
}
.sf-menu li li li {
	background:		#00A594;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:		#00A594;
	color:#fff;
	outline:		0;
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px;  
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('/media/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('/media/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}
/*** adding sf-vertical in addition to sf-menu creates a vertical menu ***/
.sf-vertical, .sf-vertical li {
	width:	10em;
}
/* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */
.sf-vertical li:hover ul,
.sf-vertical li.sfHover ul {
	left:	10em; /* match ul width */
	top:	0;
}

/*** alter arrow directions ***/
.sf-vertical .sf-sub-indicator { background-position: -10px 0; } /* IE6 gets solid image only */
.sf-vertical a > .sf-sub-indicator { background-position: 0 0; } /* use translucent arrow for modern browsers*/

/* hover arrow direction for modern browsers*/
.sf-vertical a:focus > .sf-sub-indicator,
.sf-vertical a:hover > .sf-sub-indicator,
.sf-vertical a:active > .sf-sub-indicator,
.sf-vertical li:hover > a > .sf-sub-indicator,
.sf-vertical li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}