/* CSS Document */

/* Pretty Stuff
================================== */

/* Zero down margin and paddin on all elements */
* {
  margin: 0;
  padding: 0;
}

body {
	font: 60%/1.6 "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Verdana, sans-serif;
	/*background-color:#d4d4d4;*/
	background:#FFF9F4;
	
}

h1 {
  font-size: 2.6em;
  font-weight: bold;
  border-bottom:1px solid #000;
}

h2 {
  font-size: 2.0em;
  font-weight: normal;
}

p, li {
  font-size: 1.4em;
 }

.manager {
  font-size: 2.6em;
  font-weight: bold;
 
}


h1, h2, p {
  margin: 1em 0;
}


#heading {
	height:50px;
	background-color:#b0b0b0;
	background-image:url(images/);
	background-repeat:no-repeat;
}

	

#branding {
  height: 150px;
  background-color:#b0b0b0;
  background: #FFF url(images/wf_header.jpg) no-repeat right top;

 }

#heading p {
	color: #FFF;
	width:20em;
	float:right;
	font-weight:bolder;
	
}

#mainNav {
  list-style: none;
  /*background-color:#999999;*/
  
}

#secondaryContent {
  /*background-color:#999999;*/
}

#secondaryContent h2 {
  font-size: 2.0em;
  margin: 0;
  color:#FFF;
}

#secondaryContent p {
  font-size: 1.4em;
}



/* The Core Technique
================================= */

body {
  text-align: center; 
  min-width: 780px;
}

#wrapper {
  width: 780px; 
  margin: 0 auto; 
  text-align: left;
  background: #fff url(images/wf_faux.gif) repeat-y left top; 
}

#mainNav { 
  width: 160px; 
  float: left; 
}

#content { 
  width:600px; 
  float: right; 
}

#mainContent { 
  width: 450px; 
  margin: 0; 
  float: left; 
}

#mainContent h4 {
	font-size:1.5em;
	color:#063;
}

#secondaryContent { 
  width: 130px;
  display: inline; /* :KLUDGE: Fixes IE double margin float bug */
  float: right; 
} 

#footer { 
  clear: both;
  background-color: #426600;
  color:#FFFFFF;
  text-align:center;
  padding: 1px 20px; 
} 

#footer a:link, a:visited {
	color:#FC6;
	text-decoration:none;
	font-weight:bold;
}

#footer a:hover {
	color:#FFF;
	/*text-decoration:underline;*/
	background: url(images/wf_footerbg.gif) repeat-x left bottom;
}
.image {
	float:right;
	border:1px solid #060;
	margin:0 1em;
}
.adobeicon {
	border:none;
}
/* Add some padding
================================== */

#mainNav, #secondaryContent {
  padding-top: 20px;
  padding-bottom: 20px;
  
}

/*#mainNav *, #secondaryContent * {
  padding-left: 20px;
  padding-right: 20px;
}*/

#mainNav * *, #secondaryContent * * {
  padding-left: 0;
  padding-right: 0;
}

/*CSS for Side Bar Navigaiton 
======================================================*/
 #mainContent ul {
	margin-left:25px;
	/*padding:0;*/
	/*list-style-type:none;*/
}
 
 #mainContent ul li {
	/*background:url(images/bullet1.gif) no-repeat 0 25%;*/
	margin-left:30px;
	line-height:30px;
	
}

#mainContent ul li ul li {
	font-size:100%;
	line-height:30px;
}

.face {
	font-weight:bold;
}


 
 
 
 
 
 
/* #mainContent ul {
	margin:0;
	padding:0;
	list-style-type:none;
}
 
 #mainContent ul li {
	background:url(images/bullet1.gif) no-repeat 0 25%;
	padding-left:20px;
}*/

.face {
	font-weight:bold;
}

#mainNav ul {
  margin-left: 5px;
  padding: 0;
  list-style-type: none;
}

#mainNav li {
  display: inline:  /* :KLUDGE: Removes large gaps in IE/Win */
}

 

#mainNav a {
  display: block;
  width: 150px;
  height: 29px;
  line-height: 29px;
  color: #000;
  font-weight:bold;
  text-decoration: none;
  background: #94B8E9 url(images/wf_rollover.gif) no-repeat left bottom;
  text-indent: 25px;
  text-transform: uppercase;
  border:1px solid #000;
}

#mainNav a:hover {
  background-color: #369;
  background-position: right bottom;
  color: #fff;
}

#mainNav .first a {
  height: 30px;
  line-height:30px;
}

/*#mainNav, #secondaryContent p {
	color:#FFF;
}*/

.box {
	border:1px solid #FC6;
	background:#FFF;
	color:#000;
	margin:0.5em 0.5em;
	padding:0.2em 0.4em;
	font-size:1.2em;
	
}
#mainNav .box a {
  display: inline;
  width: auto;
  height:auto;
  line-height: normal;
  color:  #900;
  font-weight: normal;
  text-decoration: underline;
  background: none;
  /*text-indent:  25px;*/
  text-transform:none;
  border: none;
}
	
#mainNav .box a:hover {
  background-color: #FC6;
  /*background-position:  right bottom;*/
  color: #900;
 }

.moved {
	margin:0.5em 0.5em;
}

.movedcolor {
	color:#900;
	font-weight:bold;
	
}

/*.box p {
	margin:0;
	padding:0;
	color:#000;
	
}*/

#home #mainNav a.mark,
#about_us #mainNav a.mark,
#membership #mainNav a.mark,
#savings #mainNav a.mark,
#loans #mainNav a.mark,
#get_involved #mainNav a.mark,
#annual_report #mainNav a.mark, 
#useful_links #mainNav a.mark, 
#contact_us #mainNav a.mark,
#jobs #mainNav a.mark {
	background-position:right bottom;
	color:#fff;
	/*cursor:default; //This will be useful when using only CSS for positional Awareness*/
}
/* End of CSS Navigation for Side Bar
====================================================================*/

/* CSS for horizontal Navigation
=============================================*/

#wrapper  ul#horNav {
  margin: 0;
  padding: 0;
  float: left;
  width: 780px;
  background: #B0B0B0 url(images/horNavBg1.gif) repeat-x;
  list-style-type: none;
  text-transform: uppercase;
}

#wrapper  ul#horNav li {
  float: left;
}


#wrapper  ul#horNav a {
  padding: 0 2em;
  line-height: 2.1em;
  background: url(images/horNavBorder.gif) repeat-y left top;
  text-decoration: none;
  color: #000;
  font-weight:bold;
  float: left;
  display: block;
}


#wrapper  ul#horNav a:hover {
  color: #FFF;
}


#wrapper  ul#horNav .first a {
  background: none;
}

/* End of CSS for horizontal Navigation 
====================================================================*/

/* CSS for Form on contact Page
=====================================================================*/

form {
  font-size: 1.4em;
  width: 30em;
}


/* fieldset styling */
fieldset {
  margin: 1em 0; /*  space out the fieldsets a little*/
  padding: 1em;
  border : 1px solid #ccc;
  background:#F8F8F8;
}

/* legend styling */
legend {
  font-weight: bold;
}


/* style for  labels */
label {
  display: block;
  font-size:1em;
}

/* style for required labels */
label .required {
  font-size: 0.75em;
  color:#760000;
}

input {
  width: 200px;
}

input.submit {
	width:auto;
	/*background-image:#336699 url(images/button.jpg) no-repeat;*/
	background-color:#369;
	color:#FFF;
	border:1px outset #CCC;
}

input.radio, input.checkbox  {
  width: auto;
}

/* style form elements on focus */
input:focus, textarea:focus {
  background: #ffc;
}

input.radio {
  float: left;
  margin-right: 1em;
}

textarea {
  width: 300px;
  height: 100px;
}

/* Hack to make sure the floated radio buttons
   sit next to the labels correctly in IE/Mac*/

/* This is the style I want IE/Mac to see */
input.radio + label {
  text-indent: 2em;
}

/* Using the commented backslash filter, I'm resetting
   the above rule for everything other than IE5/Mac \*/
input.radio + label {
  text-indent: 0;
}

/* End the hack */


=========================================================================*/

/* CSS for Table on Loans Policy Page
===================================================================*/
table {
	border-collapse:collapse;
	/*border:1px solid # #060;*/
	width:100%;
	
}

tr {
	background-color: #FFF9F4;
}

th, td {
	padding:0.8em 1em;
	border:1px solid #060;
	font-size:1.4em;
}

caption {
	font-size:1.4em;
	font-weight:bold;
	margin:1em 0;
	color:#060;
}