/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.#.com/
   TEMPLATE NAME:  NAME OF COMAPNY
   DATE:           Mar-28th-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #eeeeee url(/images/bodybg.gif) repeat-x;} 

/*
 * These two classes affect form submition messages 
 * i.e. user gives bad data, error message is styled 
 * with the .error class.  Change the colors to match
 * the site's color scheme.
 */
.error { font-weight:bold;color:Red; }
.success { font-weight:bold;color:Green; }


.line { border: none; border-bottom: 1px solid #4e5b28; height: 0px; margin: 0 auto }
.clear { clear: both; }


/* ----------Centered Container Or the Layout--------------------- */

#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 970px;
} 


/* --------------LABELS BUTTONS & FORMS-----------*/
 
label {
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #777;
}
 
.form, textarea {
width: 20em;
border: 1px solid #777;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
padding: 2px;
margin-bottom: 20px;
}
 
#main input[type="submit"], #main input[type="button"], .button{background: url(/images/buttonbggreen.gif) repeat-x;padding: 10px;color: #fff;border: 0px;font:bold 10pt tahoma, arial, sans-serif; text-decoration: none;}
#main input:hover[type="submit"], #main input:hover[type="button"], .button:hover{background: url(/images/buttonbggreenhover.gif) repeat-x;padding: 10px;color: #fff;border: 0px;font:bold 10pt tahoma, arial, sans-serif;}


/* --------------HEADER------------- */

#header {
height: 114px;
}


/* --------------LOGO IN HEADER *always use this*------------- */

.logolink, #swap { width: 602px; height: 114px;}
.logolink { background-image: url('/images/logo.gif'); background-repeat: no-repeat;}
.logolink a { float: left;  }
 
#swap { background-image: url(/images/logo.gif); }
 
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


/* --------------TOPNAV------------- */

#topnav {height: 36px;z-index:800;
}

#topnav ul { margin: 0px; padding-top: 7px; text-align: right;z-index:800;}

#topnav ul li {
display: inline;
list-style-type: none;
z-index:800;
position: relative;
padding: 0px;
background: url(/images/divider.gif) no-repeat top right;
}

#topnav ul li a {
color: #58595b;
text-decoration: none;
padding: 0px 15px 17px 15px;
font: bold 10pt Arial, Sans-Serif;
}

#topnav ul li a:hover { background: url(/images/hover.png) no-repeat bottom center ;}


/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
background: url(/images/mainbg.gif) repeat-y;}

#main .content {padding: 55px 0px 20px 65px;margin: 0px;min-height: 300px;height: auto;width: 500px;
float: left;color: #58595b; font: 10pt Arial, Sans-Serif;}

#main .address{width: 326px;padding: 0px;float: right;background: url(/images/addressbg.gif) no-repeat top left;height: auto;}
#main .address p{font: 11pt Arial, Sans-Serif!important;line-height:20px!important;padding: 120px 0px 0px 70px;}


#main h1 {color: #9c7e0f;font: 14pt Arial, Sans-Serif!important;margin-bottom: 20px;}

#main p {color: #58595b; font: 10pt Arial, Sans-Serif;margin-bottom: 20px;}

#main a {color: #58595b; text-decoration: underline;}
#main a:hover {text-decoration: none;}

#main .content ul{padding: 5px 20px 20px 0px; list-style-type:disc; }
#main .content ul li{padding: 0px 0px 10px 15px;font: 10pt arial, sans-serif;background: url(/images/bullet.gif) no-repeat top left; list-style-type:none;}



#mission {margin: 0 auto;z-index: 1;}
#mission .index{background: url(/images/mission_home.jpg) no-repeat;width: 970px;height: 184px;}
#mission .who{background: url(/images/mission_who.jpg) no-repeat;width: 970px;height: 184px;}
#mission .what{background: url(/images/mission_what.jpg) no-repeat;width: 970px;height: 184px;}
#mission .how{background: url(/images/mission_how.jpg) no-repeat;width: 970px;height: 184px;}
#mission .why{background: url(/images/mission_why.jpg) no-repeat;width: 970px;height: 184px;}

.gold {background: url(/images/arrows.gif) no-repeat left;color: #9c7e0f!important;font: 14pt Arial, Sans-Serif!important;padding-left: 25px;text-decoration: none!important}

/* --------------FOOTER------------- */

#footer, .push { 
clear: both;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
height: 100px;
height: auto;
}

#footer .content { margin: 0 auto; position: relative; width: 970px;background: url(/images/footerbg.gif) no-repeat top center;text-align: right;}
#footer .content p{ color: #bbb5b4; font: 8pt Arial, Sans-Serif;padding: 10px 20px 0px 0px;}


/* --------------TABLES------------- */

.plain{	 border-collapse:collapse; padding: 0px;width: 500px;}