body {font: arial; color: #000000; margin: 0px; padding: 0px; background: url(/images/bg.jpg) top repeat-x #a6afb6; text-align: center}

.red {color: #5e0016}
.blue {color: #003366}
.ltblue {color: #f0f4f7}
.gray {color: #6e6e6e}
.quotegray {color: #999999} 
.mdgray {color: #b9b6b6} 
.ltgray {color: #f5f5f5} 

.clearboth {clear:both;}
.space2 {clear:both; height:2px; width:2px}
.space5 {clear:both; height:5px; width:5px}
.space10 {clear:both; height:10px; width:10px}
.space15 {clear:both; height:15px; width:15px}
.space20 {clear:both; height:20px; width:20px}
.space30 {clear:both; height:30px; width:30px}
.space40 {clear:both; height:40px; width:40px}

.top10 {margin: 10px 0px 0px 0px}
.top20 {margin: 20px 0px 0px 0px}
.top30 {margin: 30px 0px 0px 0px}
.bot10 {margin: 0px 0px 10px 0px}
.bot20 {margin: 0px 0px 20px 0px}
.bot30 {margin: 0px 0px 30px 0px}
.top30bot10 {margin: 30px 0px 10px 0px}

.nospace {margin: 0px}

img {border:0px;}
td {vertical-align: top;}
a, a:hover {color: #003366; font-weight: bold}
a {text-decoration: none;}
a:hover {text-decoration: underline}


form {margin: 0px; padding: 0px;}
form label {display: block; width: 100px; float: left; margin: 8px 0px 0px 0px; text-align: left; padding: 0px; font: normal 11px/16px verdana}
form fieldset {border: 0px; margin: 0px; clear: both}
label.field {display: block; width: 150px; float: left; margin: 8px 5px 0px 0px; text-align: left; padding: 0px; font: normal 11px/16px verdana}
.fieldinput {width:150px; margin:4px 0px 0px 0px; font: 9px verdana; border: 1px solid #cccccc}
label.wide {display: block; width: 550px; float: left; margin-bottom: 10px; text-align: left; padding-left: 10px;}
input.check {width: 15px; display: block; float: left; margin-bottom: 5px; border: 0px}
input.radio {border: 0px}
input, select, textarea, .multi {width:auto; margin:4px 0px 0px 0px; font: 9px verdana; border: 1px solid #cccccc}
input, select, textarea, .multi {font-weight: normal; color: #999999; background: #ffffff; padding: 2px}
input, select, textarea, {height: 19px}
.multi {height: auto}
.bgo {background: #003366; font: bold 9px verdana; color: #ffffff; padding: 0px 2px 0px 2px; height: 20px}
textarea {overflow: auto;}


/* CONTAINERS */
#topbannercontainer, #mainnav, #contentcontainer, #footercontainer {margin: 0 auto}
#visit, #visitarabic, # logo, #quotecontainer, #footercontainer {padding: 0px; margin: 0px; vertical-align: top}

#topbannercontainer {background: #ffffff; width: 824px; height: 308px; padding: 0px}
#banner {float: left; text-align: left; margin: 0px; padding: 10px; width: 432px}
* html #banner {width: 452px}
#toolscontainer {float: right; margin: 0px; padding: 10px 10px 10px 0px; width: 362px; text-align: left}
* html #toolscontainer {width: 372px}

#visit {text-align: right; font: normal 10px verdana; color: #6e6e6e; height: 39px}
#visit a, #visit a:hover {color: #6e6e6e; font: bold 18px verdana}
#visit a {text-decoration: none;}
#visit a:hover {text-decoration: underline}

#visitarabic {text-align: right; font: normal 10px verdana; color: #6e6e6e; height: 39px}
#visitarabic a, #visitarabic a:hover {color: #6e6e6e; font: bold 10px verdana}
#visitarabic a {text-decoration: none;}
#visitarabic a:hover {text-decoration: underline}

#logo {height: 72px}

#quotecontainer {width: 362px; height: 177px; background: #f0f4f7}
#quote {padding: 15px 15px 5px 15px; font: normal 14px arial; color: #666666; text-align: left}
#author {padding: 0px 15px 0px 15px; font: normal 10px verdana; color: #666666; text-align: right}

#mainnav {background: #ffffff; width: 824px; height: 164px; padding: 0px; text-align: left}

#contentcontainer {width: 824px; padding: 0px; background: #f0f4f7; border-top: 10px solid #ffffff; border-bottom: 10px solid #ffffff}

#footercontainer {background: #6e6e6e; width: 824px; height: 100px; clear:both}
#footer {text-align: left; padding: 20px; font: normal 9px verdana; color: #ffffff}
#footer a {text-decoration: underline;  color: #ffffff; font-weight: normal}
#footer a:hover	{text-decoration: none; color: #ffffff; font-weight: normal}



/* TOP NAVIGATION */
#nav {padding: 0px; margin: 0px; list-style: none; line-height: 1;}
#nav ul {padding: 0px; margin: 0px; list-style: none; line-height: 1;}
#nav li { /* all list items */float: left}

#nav a, #nav a:hover {display: block}


/* second-level lists */
#nav li ul, * html #nav li ul {position: absolute; background: #6e6e6e; width: 164px; border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; left: -999em}
#nav li ul a, #nav li ul a:hover {display: block; padding: 5px; color: #ffffff; text-align: left; text-decoration: none; font-weight: bold; border-bottom: 1px solid #ffffff; width: 154px; border-right: 0px; font: 10px arial; font-weight: bold}
* html #nav li ul a, * html #nav li ul a:hover {width: 164px}
#nav li ul a {background: #b9b6b6}
#nav li ul a:hover {color: #ffffff; background: #6e6e6e;}

/* third-and-above-level lists */
#nav li ul ul {margin-left: 164px; margin-top: -1.9em;}
#nav li:hover ul ul, #nav li.sfhover ul ul {left: -999em;}
#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul { /* lists nested under hovered list items */left: auto;}



/* LEFT NAVIGATION */
.subnav ul {font: 10px/14px verdana; list-style: none; margin: 0px; border-bottom: 10px solid #ffffff;  padding: 0px; text-align: left}
.subnav li {display: block; margin: 0px; padding: 0px; border-bottom: 1px solid #ffffff;}
.subnav a {text-decoration: none; background: #b9b6b6;}
.subnav a span, .subnav a:hover span {color: #ffffff; padding: 10px; font-weight: normal;}
.subnav #current a span {color: #ffffff; padding: 10px; font-weight: bold;}
.subnav a span {display: block; background: #b9b6b6; float:none;}
.subnav a:hover span, .subnav #current a, .subnav #current a span {background: #6e6e6e}
.subnav a:hover {text-decoration: none; background: #6e6e6e;}
.subnav #current a:hover, .subnav #current a:hover span {background: #6e6e6e}



/* COLUMNS */
#col1, #colhome1 {float: left; text-align: left; margin: 0px}
#col2, #colhome3 {float: right; text-align: left; margin: 0px}

#col1 {padding: 20px; width: 574px; background: #f5f5f5; border-right: 10px solid #ffffff}
* html #col1 {width: 614px}
#col2 {padding: 0px; width: 200px}

#col1, #col1 p {font: 12px/18px arial}
#col1 p {margin: 0px 0px 20px 0px}
#col1 ul {margin-top: 0px; margin-bottom: 15px; margin-left: 0px; padding-left: 0px; padding-top: 0px; font: 12px/18px arial; list-style:none}
#col1 ul li {font: 12px/18px arial; padding: 0 0 0 15px; margin-bottom: 5px; background-image: url(/images/bullet.gif); background-repeat: no-repeat; background-position: 0 .2em}
#col1 ul li ul {margin-top: 10px; margin-bottom: 0px; margin-left: 0px; padding-left: 0px; padding-top: 0px; font: 12px/18px arial; list-style:none}
#col1 ol {margin-top: 0px; margin-bottom: 15px; margin-left: 20px; padding-left: 0px; padding-top: 0px; font: 12px/18px arial}
#col1 ol li {font: 12px/18px arial; padding: 0; margin-bottom: 5px; background-image:none}

#colhomecontainer {width: 574px; margin: 0px; padding: 0px}
#colhome1, #colhome2, #colhome3 {width: 178px; padding: 0px; font: normal 10px/16px verdana}
#colhome2 {margin: 0px 20px 0px 20px; float: left; text-align: left;}


.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
/* End hide from IE-mac */



/* CONTENT */
h2, h3 {color: #5e0016; text-transform: capitalize}
h1, h4, h5 {color: #000000}
h1 {font: bold 30px/34px arial; margin: 0px 0px 20px 0px}
h2 {font: bold 20px/24px arial; margin: 10px 0px 20px 0px}
h3 {font: bold 16px/20px arial; margin: 10px 0px 20px 0px}
h4 {font: normal 18px/22px arial; margin: 0px;}
h5 {font: bold 18px/22px arial; margin: 0px 0px 10px 0px}
h6 {font: bold 13px/16px arial; margin: 0px 0px 10px 0px; color: #5e0016}
h5.smaller {font: bold 16px/20px arial; margin: 0px 0px 10px 0px}

.pic {border: 5px solid #ffffff; margin: 0px 0px 10px 0px; padding: 0px}


#signupbox, #donatebox, #endorsebox {width: 200px; height: 190px; border-bottom: 10px solid #ffffff}
#signupbox {background: url(/images/bg_signup.jpg)}
#donatebox {background: url(/images/bg_donate.jpg)}
#endorsebox {background: url(/images/bg_endorse.jpg)}
.boxtext {padding: 20px; font: 10px/16px verdana; font-weight: normal}
.boxtext p {margin: 0px 0px 10px 0px}


#breadcrumb {font: bold 9px/13px verdana; margin: 0px 0px 30px 0px; padding: 0px}
.backtotop {font: normal 9px/13px verdana; margin: 30px 0px 0px 0px; padding: 0px}
#breadcrumb a, #breadcrumb a:hover, .backtotop a, .backtotop a:hover {color: #003366; font-weight: normal}
#breadcrumb a, .backtotop a  {text-decoration: none;}
#breadcrumb a:hover, .backtotop a:hover  {text-decoration: underline}

.date {font: normal 9px/13px verdana; font-style: italic}



/* TABLES */
.data table {margin: 0px; padding: 0px; border: 0px;}
.data th {font: bold 10px verdana; color: #000000; background: #c7d6c7; padding: 2px; text-align: left; vertical-align: bottom; text-transform: uppercase; border: 1px solid #ffffff}
.data td, .data td.merge, .data td.indent {font: normal 10px verdana; color: #000000; text-align: left; vertical-align: top; border: 1px solid #ffffff}
.data td {background: #f0f4f0; padding: 2px; }
.data td.merge {background: #ffffff; padding: 2px;}
.data td.indent {background: #f0f4f0; padding: 2px 2px 2px 10px; }

.data td a, .data th a {text-decoration: none; font-weight: bold}
.data td a:hover, .data th a:hover {text-decoration: underline; font-weight: bold}
.data td a {color: #006171}
.data td a:hover {color: #006171}
.data th a {color: #000000}
.data th a:hover {color: #000000;}

.basic table {margin: 0px; padding: 0px; border: 0px;}
.basic th, .basic td {color: #000000; padding: 2px; text-align: left}
.basic th {font: bold 11px/16px verdana; background: #c7d6c7; vertical-align: bottom; }
.basic td {font: normal 11px/16px verdana; vertical-align: top;}

.data td a, .data th a {text-decoration: none; font-weight: bold}
.data td a:hover, .data th a:hover {text-decoration: underline; font-weight: bold}
.data td a {color: #006171}
.data td a:hover {color: #006171}
.data th a {color: #000000}
.data th a:hover {color: #000000;}



.left {text-align:left !important;}
.right {text-align:right !important;}
.center {text-align:center !important;}
.bottom {vertical-align:bottom !important;}
.middle {vertical-align:middle !important;}