

/* !!! THIS img CSS IS REQUIRED TO MAKE PNG-TRANSPARENCY WORK IN MSIE !!! */
/* !!! REQUIRES pngFix.htc FILE TO BE LOCATED IN THE WEBSITE ROOT !!! */
/* !!! pngFix.htc SOURCE FROM http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html */
img
{	behavior: url("/pngFix.htc");}

body
{
	background-color: #E8EBF4;
	margin: 0px;
}

body, table, td
{
	font-family: Arial, Helvetica, Geneva, sans-serif;
	color: #000000;
	font-size: 10pt;
	font-weight: normal;
	font-style: normal;
	letter-spacing: normal;
	word-spacing: normal;
	text-transform: none;
	padding: 0px;
	margin: 0px;
}

table, td
{
	border: 0px none black;
	border-collapse: collapse;
}

h1
{
	margin: 0;
	padding: 0;
	border: none;
	color: #A10C11;
	font-size: 14pt;
	font-weight: bold;
}

h2
{
	margin: 15px 0 5px 0;
	border: 1px none pink;
	padding: 0;
	color: #001B6C;
	font-size: 12pt;
	font-weight: bold;
	font-style: italic;
}

h3
{
	margin-bottom: 0;
	border: none;
	padding: 0;
	color: #001B6C;
	font-size: 10pt;
	font-weight: bold;
	font-style: italic;
}

p
{
	margin: 0 0 12px 0;
}



/* *** a:focus? */
/*	**********************************************************************
	******************** LINK PSEUDO-CLASSES *****************************
	**********************************************************************
	Notes:
	A)	There are two ways to build a:link (& related) values if you're going to use in a class.
		1) If you'll be using the class directly in the <A HREF> tag, use this format:
			a.ClassName:link, a.ClassName:visited
			{	color: #000000; text-decoration: underline;}
		2) If you'll be using the class in a bounding object (e.g. - <td> or <div>),
			and not directly in the <A HREF> tag, use this format:
			.ClassName a:link, .ClassName a:visited
			{	color: #000000; text-decoration: underline;}
	B)	If you combine the pclass definitions (e.g. - "a:link, a:visited {}"),
		some browsers will only apply the definition to the first pclass or the last pclass in the list;
		for that reason, always set each pclass definition in its own code block
	C)	Some (usually older) browsers are very picky about the order that the pclasses are listed,
		so always remember to "LoVe/HAte your links";
		i.e. - list the pclasses in this order: link, visited, hover, active
	D)	If you don't use the :link as a preface to the :hover & :active pclasses,
		then some browsers will also apply the style to non-href <a> tags (i.e. - anchors - <a name="">);
		Note that this chaining of pclasses is only supported in CSS2, not CSS1.
	Example list:
	- USE:			a:link, a:visited, a:link:focus, a:visited:focus, a:link:hover, a:visited:hover, a:link:active, a:visited:active
	- DON'T USE:	a:hover, a:active 
*/
a{}		/* *** NOTE: We cannot use the generic "a" object here, because it will also be applied to <A NAME=""> tags. */
a:link
{
	text-decoration: underline;
	color:	#5D72B1;
}
a:visited
{
	text-decoration: underline;
	color:	#5D72B1;
}
a:link:hover, a:visited:hover
{
	text-decoration: underline;
	color: #000000;
}
a:link:active, a:visited:active
{
	text-decoration: underline;
	color: #ff0000;
}	

		
ul
{
	/* *** padding-left: 0; */
	/* *** margin-top: 0; */
	/* *** margin-left: 15px; */
	/*margin-left: 1.3em;*/
	border: 1px none black;
}
/*
li
{
	margin-left: 0;
	padding-left: 0;
	border: 1px solid red;
}
*/


/* **************************************************************** */
/* *** GENERAL CONTAINERS */
/* **************************************************************** */

/* *** This is a single container for the entire page *** */
#Page_Container{}	/* SEE BELOW */

/* *** The page header panel *** */
#Page_Header{}	/* SEE BELOW */

/* *** The main content panel *** */
#Page_Content{}	/* SEE BELOW */

/* *** The main nav panel *** */
#Page_Nav{}	/* SEE BELOW */
#Page_NavList{}	/* SEE BELOW */

/* *** The page footer panel *** */
#Page_Footer{}	/* SEE BELOW */


/* **************************************************************** */
/* *** GENERAL LISTS */
/* **************************************************************** */
.GenList
{	/* *** UL *** */
    margin: 0 auto;
	border: 1px none white;
	border-top: 2px dashed #2E709F;
	padding: 0;
}
	.GenList_Item
	{	/* *** LI *** */
		margin: 0;
		border-bottom: 2px dashed #2E709F;
		padding: 5px 0 20px 0;
		padding-top: 5px;
		padding-bottom: 20px;
		list-style-type: none;
	}


/* **************************************************************** */
/* *** HOME PAGE ITEMS */
/* **************************************************************** */
#Home_Page_Container{}
#Home_Page_Header{}
#Home_Page_Nav{}
#Home_Page_Content{}
#Home_Page_Footer{}


/* **************************************************************** */
/* *** SITE-SPECIFIC ITEMS */
/* **************************************************************** */

#Page_Container
{
	position: relative;
	width: 760px;
	margin: 0 auto;
	padding: 0;
	border: 1px none red;
}

#Page_Header
{
	width: 718px;	/* 760px - (left padding @ 21px) - (right padding @ 21px) */
	height: 151px;	/* 171px - (top padding @ 10px) - (bottom padding @ 10px) */
	margin: 10px auto 5px;
	padding: 10px 21px;
	background: #E8EBF4 url(images/hdr-bg.gif) no-repeat;
}
#Page_Nav
{
	width: 740px;	/* 760px - (left padding @ 10px) - (right padding @ 10px) */
	height: 20px;	/* 26px - (top padding @ 3px) - (bottom padding @ 3px) */
	margin: 0 auto;
	padding: 3px 10px;
	background: #D1D7E9 url(images/nav-bg.gif) no-repeat;
	font-weight: bold;
}
	#Page_NavList
	{
		width: 740px;
		height: 20px;
		margin: 0;
		padding: 0;
		white-space: nowrap;
		list-style-type: none;
	}
		#Page_NavList li
		{
			float: left;
			width: 148px;
			margin: 0;
			padding: 0;
			text-align: center;
		}
		#Page_NavList a
		{
			display: block;
			width: 100%;
			height: 18px;	/* 20px - (top padding @ 2px) */
			margin: 0;
			padding: 2px 0 0 0;
			color: #000000;
			text-decoration: none;
		}
		#Page_NavList a:link{}
		#Page_NavList a:visited{}
		#Page_NavList a:link:hover, #Page_NavList a:visited:hover
		{
			background: #FFF27D;
			color: #001554;
		}
		#Page_NavList a:link:active, #Page_NavList a:visited:active
		{
			background: #FFF27D;
			color: #ff0000;
		}

#Page_Content, #Home_Page_Content
{
	margin: 0;
	padding: 0 21px;
	background: #ffffff url(images/content-bg.gif) repeat;
}
	#Home_Page_Content
	{
		margin-top: 5px;
		padding: 0 21px;
	}
#Page_Content_Top, #Page_Content_Btm
{
	width: 100%;
	height: 10px;
	margin: 0;
	padding: 0;
	background: #ffffff;
	font-size:1px; /* ensure minimum height */
}
#Page_Content_Top
{
	margin-top: 5px;
	background: url(images/content-bg-top.gif)
}
#Page_Content_Btm
{
	margin-bottom: 10px;
	background: url(images/content-bg-btm.gif)
}

#Page_Title
{
	margin-bottom: 20px;
}



/* **************************************************************** */
/* *** DROPDOWN MENUS */
/* **************************************************************** */

#DropDownContainer
{
	position: absolute;
	z-index: 100;
	margin-top: 3px;
/*	border: 1px solid #001554;*/
	/* padding: 2px 4px 1px 4px; */
	background: #D1D7E9;
	font-family: Arial, Helvetica, Geneva, sans-serif;
}
	#DropDownContainer a
	{
		display: block;		/* *** These display & width settings is required in IE6 when forcing the drop down container to be wider than the text */
		width: 100%;
		background: #D1D7E9;
		padding: 1px 4px;
		color: #000000;
		text-decoration: none;
		padding-bottom: 2px;
	}
	#DropDownContainer a:link{}
	#DropDownContainer a:visited{}
	#DropDownContainer a:link:hover, #DropDownContainer a:visited:hover
	{
		background: #FFF27D;
		color: #001554;
	}
	#DropDownContainer a:link:active, #DropDownContainer a:visited:active
	{
		background: #FFF27D;
		color: #ff0000;
	}



/* **************************************************************** */
/* *** FOOTER */
/* **************************************************************** */
#Page_Footer
{
	clear: both;
/*	width: 760px;*/
	margin:  40px auto 0;
	background: #ffffff;
}
	#Page_Footer_DonationText
	{
		clear: both;
		width: 660px;
		margin: 0 auto 30px;
		border: 1px solid #001554;
		padding: 4px;
		background: #D1D7E9;
		/*color: #2A5FAA;*/
		color: #001554;
		text-align: center;
		font-size: 9px;
		font-weight: bold;
	}
#Page_Footer_Interior
{
	width: 430px;
	margin: 0 auto;
	padding: 0 10px 20px;
	background: #ffffff;
    color: #000000;
	font-family: Arial, Helvetica, Geneva, sans-serif;
	text-align: center;
    font-size: 8pt;
    font-weight: normal;
    font-style: normal;
	white-space: nowrap;
}
#FooterLogo
{
	float: left;
}
#Page_Footer_Txt
{
	margin-top: 7px;
}
#FooterTxt1
{
	margin: 1px 1px 9px 1px;
}
#FooterLine1
{
	padding-bottom: 4px;
	border-bottom: solid 2px #000000;
}
#FooterTxt2
{
	margin: 9px 1px 1px 1px;
}
#FooterLine2
{
	padding-top: 3px;
	border-top: solid 2px #000000;
}
#FooterTxt3
{
	margin: 1px 1px 1px 1px;
}
#FooterLine3
{
}
.TODO
{
	border: 1px solid black;
	margin: 10px;
	padding: 10px;
	background: yellow;
	color: red;
}
.TODO_CNF
{
	background: yellow;
	color: red;
}
.xmlprint
{
	width: 75%;
	border: 1px solid black;
	margin: 10px auto;
}



/* **************************************************************** */
/* *** ERROR-HANDLING DISPLAY ITEMS (cRESULT) */
/* **************************************************************** */
.ResultText
{
	margin: 0 0 15px 0;
	border: 1px solid #001554;
	padding: 5px;
	background: #E8EBF4;
	color: #001B6C;
	font-weight: bold;
}
	#ResultText_Fail
	{
		color: #ff0000;
	}
	#ResultText_Success{}
	#ResultText_All{}
	.ResultText ul
	{
		font-weight: normal;
	}


/* **************************************************************** */
/* *** CLIENT-SPECIFIC ITEMS */
/* **************************************************************** */

#Hdr_Logo
{
	margin: 0 2px 0 0;
	padding: 0;
	border: none;
}
.Page_Header_Photo
{
	margin: 0 0 0 5px;
	padding: 0;
	border: none;
}

.FAQ_Question{}

#EcuadorLinks li
{
	margin-bottom: 15px;
}
	.EcuadorLinksItem{}

#CostBreakdown
{
	margin: 40px auto 25px auto;
	border: none;
}

.CostBreakdown_Label
{
	border: 1px solid black;
	border-left: none;
	padding: 2px 5px 2px 2px;
	text-align: left;
	font-size: 11pt;
}

.CostBreakdown_Value
{
	border: 1px solid black;
	border-right: none;
	padding: 2px 2px 2px 5px;
	text-align: right;
	font-size: 11pt;
	font-family: "Courier New", Courier, monospace;
}

.Bio
{
	width: 340px;
	margin: 0;
	outline: 1px none green;
	padding: 0;
}
	.Bio_Right
	{
		float: right;
	}
	.Bio_Left
	{
		float: left;
	}
	.Bio_Top{margin-bottom: 20px;}
	.Bio_Bottom{}
	.Bio_Name
	{
		margin: 0 0 10px;
	}
	.Bio_Photo
	{
		width: 200px;
		height: 211px;
		float: right;
		margin: 0 0 10px 10px;
	}

#Contact_Info
{
	float: right;
	margin: -15px 0 15px 0;				/* Couldn't find cause of table being bumped down 15px, so forced it here */
	border: 1px none black;
	border-collapse: collapse;
	padding: 0;
}
	#Contact_Info td
	{
		border: 1px none black;
		border-collapse: collapse;
		padding: 0;
	}
	#Contact_EmailAddrsList
	{
		list-style-type: none;
		margin: 0;
		padding: 0;
	}
		#Contact_EmailAddrsList li
		{
			margin-bottom: 5px;
		}

#LetterBox
{
	width: 680px;
	margin: 0 auto 15px;
	border: 4px double black;
	padding: 10px;
}

.PhotoLeft
{
	float: left;
	margin: 0 10px 10px 0;
	border: none;
	padding: 0;
}

.PhotoRight
{
	float: right;
	margin: 0 0 10px 10px;
	border: none;
	padding: 0;
}

#WelcomeHome
{
	height: 320px; 	/* *** 345px -25px (top padding) = 320px */
	/* margin: 0 0 20px 0; */
	margin: 0 -21px 20px -21px;
	padding: 25px 18px 0 365px;
	background: url(http://www.ECHOecuador.org/images/home-content-top-bg.jpg) top left no-repeat;
	color: #001B6C;
	font-size: 10.5pt;
	font-weight: bold;
/*
	margin: 0 -21px 20px -21px;
	padding: 25px 23px 0 375px;
	font-style: italic;
*/
}
	#WelcomeHome h1
	{
		text-align: center;
	}
	
.Action_Panel
{
	float: right;
	width: 265px;
	margin: 0 0 10px 15px;
	border: 1px solid #001554;
	padding: 5px;
}
	.Action_Panel h3
	{
		margin: -5px -5px 5px -5px;
		padding: 2px 0;
		background: #001554;
		text-align: center;
		color: #E8EBF4;
		font-style: normal;
	}
	.Action_Panel form
	{
		margin: 0;
	/*
		display: table;
		margin: 0 auto;
		border: 1px solid red;
	*/
	}
	#Newsletter_Panel_Subscribe{}
	#Newsletter_Panel_Unsubscribe, #Donate_Panel_ByMail
	{
		clear: right;
		margin-bottom: 25px;
	}
	#Donate_Panel_Online, #Donate_Panel_ByMail
	{
		text-align: center;
	}
	#Donate_Panel_Online input, #Donate_Panel_Online select
	{
		margin: 4px 0 8px 0;
		vertical-align: middle;
	}
