/*
--------------------
WARNING!
Copyright Progress Systems Limited.
Explicit permission is required to copy or use any documents from this website
--------------------



--------------------
TEMPLATE: PERCEPTION
--------------------
GENERAL PRINCIPLES
-------------------- 
1. use margin:auto to horizontally center a div inside another div for mozilla
2. place page-wide styles (e.g. button styles) at the top of the CSS document or their properties are overwritten further down the page.
3. specify a width for layers that fade using DHTML, otherwise they don't fade gradually.
4. to position child layers, specify "relative" for the parent layer, and "absolute" for the child layers
5. the dynamic height of absolute layers is ignored, so subsequent layers will often position behind the absolute layer

---------------------------------------------------------------------
TEST MATRIX (Y=WORKS OK)
-------------------W2K-------XP--------VISTA-----OS9-------OSX-------
IE<=4                                  .                             
IE5                                    .                             
IE6                 Y                  .
IE7                          Y         Y
IE8
OPERA9                                 Y
SAFARI3                                Y         .
CHROME1                                Y
FIREFOX2                     Y         
FIREFOX3                               Y
NETSCAPE7                    Y         .
---------------------------------------------------------------------
*/
 

/* HTML TAG RE-DEFINITIONS */
body{ font-family: Arial, Verdana, Geneva, sans-serif;font-size: 11px; line-height:130%; !important /* IE LINE HEIGHT USED FOR IE9 AND MOZILLA 5.0 */color:#333333; background-color: #FFF; background-repeat:repeat-x; background-image: url(images/bkgd_gradient.gif);}
* {margin:0; padding:0;}
html {}
a {color:#2C71A9; font-size:12px; text-decoration:none;border: none; outline: 0;
-webkit-transition: all 0.1s linear; /*safari and chrome */
-moz-transition: all 0.1s linear; /* firefox */
-o-transition: all 0.1s linear; /* opera */}
a:hover {text-decoration:none; color:darkOrange;}
a:active, a:selected { 
    border: none;
    outline: none;
}

hr {margin: 20px 0px 10px 0px; border: 0px; border-top: 1px dotted #CCCCCC; border-bottom: 1px dotted #FFFFFF; display:none;}
strong {font-weight:bold;}
iframe {border: 1px dotted #C2CAD1; width:100%; font-family: Arial, Verdana, Geneva, sans-serif; font-size: 11px; color:#333333; height: 300px;}
iframe.spotlightnew {border: 1px dotted #CCCC99; width: 200px; font-family: Arial, Verdana, Geneva, sans-serif; font-size: 11px; color:#333333; height: 100px;}
td.membership {color:#ffffff; padding:7px;}
img {border: none;}
object, embed { outline: 0;}
input::-moz-focus-inner { border: 0; } /*Clicking down on an input type=image can produce a dotted outline (Does this in Firefox 3.6.8 but not Firefox 4).This removes it*/
tr#TemplateRow1 {display:none;}
p {margin-bottom: 10px; font-size: 12px; color: #465b6e; line-height:18px;  }
acronym {cursor: help; border-bottom: 1px dashed #cccccc; color: #cccccc; font-weight:bold;}
td {font-size: 12px; padding: 6px 0 0 0;}
td.bodytext {padding: 7px;}
td p {padding: 0 7px;}
font {font-size: 12px;}
em, small {color: #384930;}
small a {color: #3E8CCC; font-size:11px;}
small a:hover {color:darkOrange;}
form {margin-top: 20px;}

/* HEADINGS */
h1 {font: bold 16px Arial, Verdana, Arial, Helvetica, sans-serif; padding-bottom: 5px; color: #69C;}
h2 {border-bottom: 1px dashed #ddd; font-size:13px; color:#2C71A9; margin-bottom: 15px; padding-bottom:5px;}
h3 {font-size:12px; padding-bottom: 5px; color: darkOrange; }
h4 {font: bold 16px  Arial, Verdana, Helvetica, sans-serif; color: #e7ff00; padding-bottom: 15px;}
h5 {font: 12px Arial, Verdana, Helvetica, sans-serif; color: #999999; padding-bottom: 15px;}
h6 {font: 9px Arial, Verdana, Helvetica, sans-serif; padding-bottom: 15px;}


/* COMMONLY USED CLASSES */
.required {font: bold 11px Arial, Verdana, Helvetica, sans-serif; color: #CC0000;}
.informational {font:11px Arial, Verdana,, Helvetica, sans-serif; color: #699;}
.largeFont {font-size:14px; color:#3E8CCC; font-weight: bold;}
.lighttext {color: #999999;}
.smallfont{font:9px Arial, Verdana, Helvetica, sans-serif; color: #999999;}


/* BUTTONS */
.button_search {background-image:url(../../templates/current/images/button_submit_bkgd.gif); background-repeat:repeat-x; height: 23px; width: 78px; padding: 0px; padding-left: 5px; border: 0px; margin: 0px; color:#FFFFFF; font-weight:bold; cursor:pointer;}
.button_submit { background: #6db3f2; /* Old browsers */
background: -moz-linear-gradient(top,  #6db3f2 0%, #54a3ee 50%, #3690f0 51%, #1e69de 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6db3f2), color-stop(50%,#54a3ee), color-stop(51%,#3690f0), color-stop(100%,#1e69de)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%); /* IE10+ */
background: linear-gradient(top,  #6db3f2 0%,#54a3ee 50%,#3690f0 51%,#1e69de 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2', endColorstr='#1e69de',GradientType=0 ); /* IE6-9 */
border: 0px;  color:#fff; font-weight:bold; cursor:pointer; width: 130px; height:25px; }

.button_cancel { background: #aebcbf; /* Old browsers */
background: -moz-linear-gradient(top,  #aebcbf 0%, #6e7774 50%, #0a0e0a 51%, #0a0809 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#aebcbf), color-stop(50%,#6e7774), color-stop(51%,#0a0e0a), color-stop(100%,#0a0809)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* IE10+ */
background: linear-gradient(top,  #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aebcbf', endColorstr='#0a0809',GradientType=0 ); /* IE6-9 */
border: 0px;  color:#fff; font-weight:bold; cursor:pointer; width: 130px; height:25px; }

.button_other { background: #feccb1; /* Old browsers */
background: -moz-linear-gradient(top,  #feccb1 0%, #f17432 50%, #ea5507 51%, #fb955e 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#feccb1), color-stop(50%,#f17432), color-stop(51%,#ea5507), color-stop(100%,#fb955e)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #feccb1 0%,#f17432 50%,#ea5507 51%,#fb955e 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #feccb1 0%,#f17432 50%,#ea5507 51%,#fb955e 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #feccb1 0%,#f17432 50%,#ea5507 51%,#fb955e 100%); /* IE10+ */
background: linear-gradient(top,  #feccb1 0%,#f17432 50%,#ea5507 51%,#fb955e 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feccb1', endColorstr='#fb955e',GradientType=0 ); /* IE6-9 */
border: 0px;  color:#fff; font-weight:bold; cursor:pointer; width: 130px; height:25px; float:right; }
.button_editor{ border:1px solid #F6F6EA;}
.tabletitleprint {float: right; width: 100px;}


/* FORM FIELDS */
input,select {height: auto; color: #000; font-size: 12px; font-family: Arial, Verdana, Geneva, sans-serif; vertical-align: middle;margin-right: 2px; margin-left: 2px;}
select {}
.input_normal {width: 180px; border: 1px #C2CAD1 dotted; font-size: 12px; font-family: Arial, Verdana, Geneva, sans-serif; color: #465B6E; padding:4px; height: auto; margin-bottom: 5px;}
.input_long {width: 370px; border: 1px #C2CAD1 dotted font-size: 12px; font-family: Arial, Verdana, Geneva, sans-serif; color: #465B6E; padding:3px; height: 18px;}
.input_short {width: 110px; border: 1px #C2CAD1 dotted; font-size: 12px; font-family: Arial, Verdana, Geneva, sans-serif; height: 21px; padding: 3px; color: #465B6E; height: auto;}
.input_shorter {width: 60px; border: 1px #C2CAD1 dotted; font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif; color: #465B6E; padding:4px; height:auto;}
.input_multiline {width: 180px; height: 100px; border: 1px #C2CAD1 dotted; font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif; color: #000; color: #465B6E; padding:3px;}
.input_multiLarge {width: 280px; height: 160px; border: 1px #C2CAD1 dotted; font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif; color: #000;}
.input_nosize {border: 1px dotted #C2CAD1; color: #465B6E;; font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif; padding:3px; height: 22px; margin-bottom: 3px;}
.input_2char {width: 20px; border: 1px dotted #C2CAD1; color: #465B6E; font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif; padding:4px; height: auto;}
.input_3char {width: 30px; border: 1px dotted #C2CAD1; color: #465B6E; font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif; padding:4px; height: auto;}
.input_4char {width: 40px; border: 1px dotted #C2CAD1; color: #465B6E; font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif; padding:4px; height: auto;}
.input_search {height:13px; width: 90px; font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif;}
.input_invisible {border: 0px solid; color: #666666; font: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; background-color: transparent; height: 18px; vertical-align: middle}
.input_editor_title {font-size:16px; color:#3E8CCC; font-family: Arial, Verdana, Geneva, sans-serif; border: 1px #C2CAD1 dotted; width: 300px;}
.input_editor_subtitle {font-size:12px; color:#3E8CCC; font-family: Arial, Verdana, Geneva, sans-serif; border: 1px #C2CAD1 dotted; width: 300px;}
.input_webteller {width: 120px; border: 1px #CCCCCC solid; font-size: 13px; font-family: Arial, Verdana, Geneva, sans-serif; height: 14px; font-weight: bold; color: #000; text-align: right; padding: 2px;}


/* TABLES */
/*.tabletitle {margin: 0px; padding-top: 3px; padding-bottom: 5px; padding-left: 3px; padding-right: 3px;  /*background-image:url(../../templates/current/images/button_other_bkgd.gif); background-repeat: repeat; border: 1px solid #7fb4de; color:#FFFFFF; font-weight:bold; font-size: 11px;}*/

.tableform {border-top: 1px dotted #C2CAD1; border-bottom: 1px dotted #C2CAD1; background-color:#FFFFFF; margin-top: 4px; MARGIN-BOTTOM: 20px; border-collapse: collapse; font-family: Arial, Verdana, Geneva, sans-serif; font-size: 11px; color:#333333; width: 100%;}
.tableform img { padding: 0 3px;}
.tableform tr{ background: #F9FBFC;}
.tableform thead {color: #465b6e; font-size: 9px; font-style: italic;}
.tableform thead td, .tableform thead td {background-color:#EBF0F4;}
.tableform tfoot {color: #828277; font-size: 10px;}
.tableform tfoot td {background-color:#E5E5DA; font-size: 10px;}
.tableform .dayColour{background-color:#E2E2D7;}
.tableform td { background-color:#F9FBFC; /*border-bottom: 1px dashed #DDDDDD; border-right: 1px dashed #DDDDDD; border-bottom: 1px dashed #DDDDDD;*/ font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif; color: #465B6E; padding: 5px 5px 5px 15px; }
.pagecontent_members .tableform td {}
.tableform table td { padding: 10px; background-color: #F9FBFC;}
.tablegrid { background-color:#FFFFFF; margin-top: 10px; border-collapse: collapse;  border-spacing: 0px; !important font-family: Arial, Verdana, Geneva, sans-serif; font-size: 11px; color:#333333;MARGIN-BOTTOM: 20px;}
.tablegrid thead {color: #465B6E; font-weight: bold; line-height: 40px;}
.tablegrid thead td {background-color:#ebf0f4; font-size: 11px; font-family: Arial, Verdana, Geneva, sans-serif; padding:0 20px;}
.tablegrid td {padding: 7px 20px; border-top: 1px dashed #c2cad1; border-bottom: 1px dashed #c2cad1; font-size: 12px; color:#465b6e; }
.tabledetailed {border: 1px dotted #a3c1db; background-color:#FFFFFF; margin-top: 4px; border-collapse: collapse; font-family: Arial, Verdana, Geneva, sans-serif; font-size: 10px; color:#333333; margin-bottom: 4px;}
.tabledetailed thead {color: #999999; font-weight: bold;}
.tabledetailed thead td, .tabledetailed thead td {background-color:#FFFFFF; font-size: 10px; font-family: Arial, Verdana, Geneva, sans-serif;}
.tabledetailed td {padding: 1px; border-right: 1px dotted #b5d0e8; border-bottom: 1px dotted #b5d0e8; font-size: 10px; vertical-align: top;}
.tabledetailed strong {font-size: 10px;}
.table_calendar {}
.tablerow_main tr {background-color:#000000;}
.tablerow_alt td {background-color:#FFFFEE;}
.tablerow_over td {background-color:#FFFFCC;}


/* FORM ARCHIVE */

.tableprint { margin-left: 378px;}


/*PIN MANAGER-----------------------------------------*/
.tabletitle { padding-right: 15px; width: auto; padding:5px 6px 5px 5px;  color:#FFF; font-weight:bold; font-size: 11px; background-color: #4a98d7; /*background-image: url(../../images/essentials/pinform_title_right.gif); /* background-repeat:no-repeat; background-position:right;*/}
/*.tabletitleLeft { padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:5px;    background-image:url(../../images/essentials/pinform_title_left.gif); background-position:left; background-repeat:no-repeat;}*/
.tableformPin {background-color: #dddddd;font-family: Arial, Verdana, Geneva, sans-serif;}
.tableformPinMain { padding-left: 15px; padding-top: 3px; background-color: #E6E6E6;}
.tableformLeft{ padding-left: 15px; background-color: #f3eeee; }
.tableformPinIconsL{ padding-left: 0px; background-color: #F3F3F3; vertical-align:middle; text-align: left; border-bottom: 1px solid #E6E6E6;}
.tableformPinIconsL li { padding-bottom: 1px; display: block; list-style:none; padding-left: 0px; padding-right: 0px; text-align: left; white-space: nowrap;  height: 28px; float: left;  }
.tableformPinReg { padding-left: 15px; padding-bottom: 3px; padding-top: 3px; background-color: #E2ECF5;}
.tableformPinMembersC { padding-left: 15px; padding-top: 3px; padding-bottom: 3px; background-color: #C3D5E3; background-image:url(../../images/essentials/member_corner.gif); background-repeat:no-repeat; background-position:right top; }
.tableformPinMembers { padding-left: 15px; padding-top: 3px; padding-bottom: 3px; background-color: #C3D5E3;}


/* FONT CLASSES FOR PIN MANAGER FORM */
.fontRed {font:Arial, Helvetica, sans-serif; font-weight:bold; font-size: 11px; color:#F00;}
.fontBlue {font:Arial, Helvetica, sans-serif; font-weight:bold; font-size: 11px; color:#069; vertical-align: middle; }
.fontBlue a {font:Arial, Helvetica, sans-serif; font-weight:bold; font-size: 11px; color:#09F; text-decoration: underline;}
.fontBold { font: bold 11px Arial, Verdana, Helvetica, sans-serif; }
.fontGreen { font:Arial, Helvetica, sans-serif; font-weight:bold; font-size: 11px; color:#393; }


/* ESTATEMENTS TABLE LAYOUT - WIDE */
.tablewrap_multiple { width: 94%; height: 50%;  border: solid 1px #333; height: auto; }
.tabletitle_multiple { position: relative; width: 94%; clear:both; color: #069; font-weight: bold; font-size: 11px; padding-left: 3px; padding-top: 5px; padding-bottom: 5px; /*background-image: url(../../images/essentials/automated_bkgd.jpg);*/  background-color: #E6F2FF; border-top: solid 1px #C4E1FF; border-left: solid 1px #C4E1FF; border-right: solid 1px #C4E1FF; border-bottom: dotted 1px #D6D6D6; border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px;  behavior: url(templates/current/PIE.htc);/**/}
.tablewrap_single { width: 94%; border: solid 1px #333; height: auto;}
.tabletitle_single { position: relative; width: 94%; clear:both; color: #666; font-weight: bold; font-size: 11px; padding-left: 3px; padding-top: 5px; padding-bottom: 5px;  background-color: #F0E6EF; /*background-image:url(../../images/essentials/requested_bkgd.jpg);*/ border-top: solid 1px #D0ACCD; border-left: solid 1px #D0ACCD; border-right: solid 1px #D0ACCD; border-bottom: dotted 1px #D0ACCD; border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px;  behavior: url(templates/current/PIE.htc);/**/ }
.tableform2 { margin-bottom: 15px; padding-left: 0px; padding-right: 0px; background-color: #F9F9F9;  border-left: solid 1px #D6D6D6; border-right: solid 1px #D6D6D6; border-bottom: solid 1px #D6D6D6; }
.dropmenu_top { position: relative; width: 93%; height: 20px; margin-left: 0px; padding-left: 10px; margin-right: 5px; padding-top: 5px; padding-bottom: 0px; font-size: 12px; border: solid 1px #E6E6E6; text-align: right; background-image: url(../../images/essentials/estatements_bkgd.gif);  border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px;  behavior: url(templates/current/PIE.htc);}
.pdf_download {  position: relative; float: left; clear: right; height:30px; width: 60%;  padding-right: 5px; padding-left: 0px; padding-top: 5px; padding-bottom: 15px; margin-right: 0px; margin-left: 5px; margin-bottom: 20px; font-size: 11px; /*background-image: url(../../images/essentials/acrobat_download_bkgd.gif); border: solid 1px #E6E6E6;  border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px;  behavior: url(templates/current/PIE.htc);*/}
.pdf_image { position: relative; float: right; height: 30px; width: 140px; margin-right: 20px; }
.rowseparator {border-bottom: dotted 1px #CCC; height: 15px;}
.required_green { font-weight:bold; color:#393;}
.yeartitle{color: #333; }
.error_notfound { border: solid 1px #0F0; }


/* VOLUNTEER AREA ROSTER */
#volCalendar table {border:none;}
#volCalendar thead td {background-color: #F2F2E7; border:1px solid #ffffff; border-collapse:collapse; padding:2px}
#volCalendar td {background-color: #F7F7f2; border-bottom:1px solid #FFFFFF; border-collapse:collapse;}
#volCalendar td span {display: block; height: 100%; width: 0px; padding: 0px; margin: 0px;}
#volCalendar td a {text-decoration: none; display: block;}
#volCalendar .weekDayName {background-color: #F2F2E7;}


/* PASSWORD STRENGTH INDICATOR */
#passwordStrength {height:10px; display:block; float:left;}
.strength1 {width:15px; background-color:#cccccc;}
.strength2 {width:30px; background-color:#ff0000;}
.strength3 {width:60px; background-color:#ff5f5f;}
.strength4 {width:90px; background-color:#56e500;}
.strength5 {width:120px; background-color:#4dcd00;}
.strength6 {width:150px; background-color:#399800;}


/* IMAGE VISIBILITY (OPTIONAL) */
#img_masthead {} 
#img_login { margin-left: -21px;} 
#img_youthzone {} 
#img_newsheadlines { padding: 15px 0 0 12px; border:0px;}
#img_modules { padding: 15px 0 0px 20px; border:0px;} 
#modulelinks_contentpage img { padding: 15px 0 5px 0px; border:0px;}
#img_progresslogo {}


/* OFFICE AREA ITEMS */
#tblFonts img,select {vertical-align: middle;}
#tblCtrls img {vertical-align: middle;}
#tblXtraCtrls img {vertical-align: middle;}

/*---------------------------*/


/* MAIN OUTER CONTAINER LAYER */
#main {text-align: center; width:100%; } 


/* PAGE CONTENT LAYER */
#pageContent{position: relative; width:890px; height:100%; text-align: left; margin: auto;  border-bottom: none;}
html>body 
#pageContent{}


/*PAGE INNER CONTENT*//* THIS IS USED IN ORDER TO EXTEND THE BACKGROUND COLOUR THE HEIGHT OF THE PAGE FOR ALL BROWZERS ACCEPT IE */
#pageInnerContent { position: relative; width:890px; height:100%; behavior: url(templates/current/PIE.htc); background: #ffffff; /*padding-bottom: 10px;*/}
#pageInnerContent:after {clear:both;content:".";display:block;height:0pt; visibility:hidden;}


/* MASTHEAD FACILITIES*/
#facilities {width:700px; height: 20px; padding-bottom:4px; position:absolute; left: 180px; top: 20px; z-index: 100;}
#facilities ul {margin: 0px; padding: 1px;}
#facilities li {display: block; float: right; padding-left:2px; padding-right: 2px;}
#facilities a {font-size: 11px; color:#FFF; text-decoration: none; display: block; vertical-align:bottom; font-family: verdana; line-height: 17px;
-webkit-transition: all 0s linear; /*safari and chrome */
-moz-transition: all 0s linear; /* firefox */
-o-transition: all 0s linear; /* opera */}}
#facilities a:hover {color:yellow; text-decoration: none;}
#facilities .divider {padding-left: 7px; margin-left: 4px; background:url(../../templates/current/images/divider.gif); background-position:left; background-repeat:no-repeat; line-height: 20px;}
#facilities #helpmenu {position:absolute; top:20px; left:533px; text-align:left; visibility:hidden; background: #6d8298; filter: alpha(opacity=100); opacity: 1; -khtml-opacity: 1; -moz-opacity:100%; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);}
#facilities #helpmenu li {background:none; display:list-item; list-style: none; width:160px; padding:0 8px; border-bottom: 1px dotted #ffffff;}
#facilities #helpmenu li:hover {background: #5d738a;}
#facilities #helpmenu a {padding:5px 0 5px 0; color:#ffffff;}
#facilities #helpmenu a:hover {text-decoration:none; color:#00d8ff;}


/*Social Networking Icons Facilities*/
#SocialNet{ z-index: 10; position: absolute; top: 95px; left: 570px;  width: 180px; height: 100px;  /*border: 1px solid #F00;*/ }
#SocialNetTxt { display: none; position: relative; float: left; color: #fff; font-size: 11px; width: 70px; /*border: 1px solid #0C0;*/}
#SocialNetIcons { position: relative; float: right; width: 100px; height: 100px;  top: -4px; right: 2px; /*border: 1px solid #0CF;*/ }
#SocialNetIcons img { list-style-image:none; /*border: 1px solid #FF0;*/ }
#SocialNetIcons a { display: inline; }


/* MASTHEAD */
#masthead {position: relative; width:100%;  height: 115px; overflow: hidden; background: url(../../templates/current/images/masthead_bgr.gif) repeat-x; }
#masthead .logo {position: absolute; top: 0px; left: 0px;}
#masthead #announcements {position: absolute; top: 0px; left: 380px; width: 350px; height: 44px; overflow: hidden; text-align: right; top: 18px; padding-right: 10px; font-size: 13px; font-weight: bold; color: #3E8CCC; line-height: 20px; /* filter: alpha(opacity=0); -moz-opacity:0%; */ }
#masthead #announcements a {color: white; font-family: Times; font-size: 16px; font-style: italic;}
#masthead #announcements a:hover {text-decoration:underline; color:#0099FF;}
#masthead .area_title {position: absolute; top: 42px; left: 490px; width: 350px; height: 44px; padding: 20px; text-align: right; font-size: 13px; font-weight: bold; color: #ffffff;}


/* BYLINE (TEL/FAX/DATE BAR) */
#byline {display: none; position: relative; overflow: hidden; color: #999999; height: 20px; width: auto;}
#byline .contactdetails {position: absolute; top: 0px; left: 0px; padding-left: 10px;}
#byline .contactdetails strong {color: #FF9900;}
#byline .currentdate {position: absolute; top: 0x; left: 400px; width: 350px; padding-right: 10px; text-align: right; color:#fff;}
#byline_members {height: 20px; margin-bottom: 6px; overflow: hidden; color: #FFFFFF; margin-top: -26px; float:right; padding-right: 20px; }
#byline_members .contactdetails {float: left; padding-right: 10px;}
#byline_members .currentdate {float: right; padding-right: 12px;}


/* LAYOUT AREA (MAIN MENU/SUBMENU/MODULES/LOGIN/CONTENT) */
#layoutarea {margin:0 auto; position: relative; width: 900px; text-align:left; /*background:url(../../templates/current/images/layoutarea_bgr.gif) repeat-x;*/}


/* MAIN NAVIGATION MENU */
#mainmenu { height: 28px; margin: auto; overflow: visible; text-align: center;}
html>body #mainmenu {background:url(../../templates/current/images/mainmenu_bgr.gif) repeat-x; float: left; height: auto; padding-bottom: 10px; padding-top: 5px; overflow: hidden;width: 100%;} /*ONLY WAY TO GET UL BACKGROUND IMAGE TO DISPLAY IN IE5/IE6 WAS TO SPECIFY HEIGHT AND OVERFLOW ABOVE. THIS 
LINE CORRECTS THAT FOR ALL OTHER BROWSERS*/


/*#mainmenu ul li {text-align: left; white-space: nowrap; padding: 0 20px 0 0; height: 51px; float: left; display: block;}  /*LIST ITEM WIDTH SPECIFIED DYNAMICALLY
#mainmenu ul li#section2 {  width: 130px; border-bottom: 5px solid #2b7ebe;}
#mainmenu ul li#section2 a {  width: 130px;}
#mainmenu ul li#section2 a:hover { height: 24px; color: #63d5f3; border-bottom: 5px solid #63d5f3;}
#mainmenu ul li#section3 { width: 110px; border-bottom: 5px solid #2b7ebe;}
#mainmenu ul li#section3 a {  width: 110px;}
#mainmenu ul li#section3 a:hover { height: 24px; color: #c7f30e; border-bottom: 5px solid #c4de57;}
#mainmenu ul li#section6 { width: 100px; border-bottom: 5px solid #2b7ebe;}
#mainmenu ul li#section6 a {  width: 100px;}
#mainmenu ul li#section6 a:hover { height: 24px; color: #ffae00; border-bottom: 5px solid #f79819;}
#mainmenu ul li#section7 { width: 45px; border-bottom: 5px solid #2b7ebe;}
#mainmenu ul li#section7 a {  width: 65px;}
#mainmenu ul li#section7 a:hover { height: 24px; color: #ffe800; border-bottom: 5px solid #edda19;}
#mainmenu ul li.first {display:none;}
#mainmenu ul li#section70 {border-bottom: 5px solid #2B7EBE; width: 50px;}
#mainmenu ul li#section70 a {  width: 50px;}
#mainmenu ul li#section70 a:hover { height: 24px; color: #ffe800; border-bottom: 5px solid #ffe800;}*/ 

/*#mainmenu ul li {text-align: left; white-space: nowrap; width:auto; height: 30px; float: left; display: block;}  /*LIST ITEM WIDTH SPECIFIED DYNAMICALLY
#mainmenu ul li#section2 {  width: auto; border-bottom: 3px solid; margin-right:1px; }
#mainmenu ul li#section2 a { height:22px;  width: auto; padding-right: 10px; padding-left:10px; color: #ffffff;}
#mainmenu ul li#section2 a:hover { height:22px;  width: auto; color: #fff; padding-top: 8px; }

#mainmenu ul li#section3 { width: auto; border-bottom: 3px solid; margin-right:1px;  }
#mainmenu ul li#section3 a {height:22px;  width: auto; padding-right: 10px; padding-left:10px; color: #ffffff;}
#mainmenu ul li#section3 a:hover {  height:22px;  width: auto; color: #fff; padding-top: 8px;}

#mainmenu ul li#section6 {  width: auto; border-bottom: 3px solid; margin-right:1px; }
#mainmenu ul li#section6 a { height:22px;  width: auto; padding-right: 10px; padding-left:10px; color: #ffffff;}
#mainmenu ul li#section6 a:hover {   height:22px;  width: auto; color: #fff; padding-top: 8px;}

#mainmenu ul li#section7 { width: auto; border-bottom: 3px solid; margin-right:1px; }
#mainmenu ul li#section7 a {  height:22px;  width: auto; padding-right: 10px; padding-left:10px; color: #ffffff;}
#mainmenu ul li#section7 a:hover { height:22px;  width: auto; color: #fff; padding-top: 8px;}

#mainmenu ul li.first {display:none;}

#mainmenu ul li#section70 { width: auto; border-bottom: 3px solid; margin-right:1px;}
#mainmenu ul li#section70 a {  height:22px;  width: auto; padding-right: 10px; padding-left:10px; color: #ffffff;}
#mainmenu ul li#section70 a:hover { height:22px;  width: auto; color: #fff; padding-top: 8px;}

#mainmenu a { text-align: center; font-size: 12px; font-weight: bold; padding-top: 6px;  width: 100%; color:#FFFFFF; text-decoration: none; display: block; text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.1); border: none; outline:none;}
#mainmenu .lastSection {background: none; padding:none;}

#mainmenu ul li ul li {padding:0;}

 POP-OUT MENUS - NEED TO OVERRIDE SOME OF THE STYLES IN THE MAINMENU
#mainmenu li#section3 .popoutmenu {z-index: 4; margin-top: 9px; text-align: left; position: absolute; visibility:hidden; top: 34px;  -moz-box-shadow:0px 0px 5px rgba(0, 0, 0, 0.2); -webkit-box-shadow:0px 0px 5px rgba(0, 0, 0, 0.2);box-shadow:0px 0px 5px rgba(0, 0, 0, 0.2);}
#mainmenu li#section3 .popoutmenu li {text-align: left; white-space: normal; float:none; height: auto; background:none; display:list-item; list-style: none; border-bottom: 1px dotted #b4de62; font-weight: normal; width:auto;}
html>body #mainmenu .popoutmenu li {width: 400%;} /*WIDTH ABOVE SET TO 400% FOR IE5/IE6. THIS LINE CORRECTS THE WIDTH FOR ALL OTHER BROWSERS
#mainmenu li#section3 .popoutmenu li  a {color: #FFFFFF; display: block; font-family: verdana; font-size: 11px;  height:26px; font-style: normal; font-weight: normal; line-height: 26px; padding: 0px 0 0px 7px; text-align: left; text-decoration: none; width: auto; border-bottom:none;}
#mainmenu li#section3 .popoutmenu li a:hover{text-decoration:none; color:yellow; line-height: 26px; height:26px;  text-decoration:none; border-bottom:none; border-top:none; width: auto;} 
#mainmenu li#section3.section_selected .popoutmenu li.page_selected a {color:yellow;}*/

#mainmenu ul li {text-align: left; white-space: nowrap; width:auto; height: 30px; float: left; display: block;/* behavior: url(templates/current/PIE.htc); LIST ITEM WIDTH SPECIFIED DYNAMICALLY*/}
#mainmenu ul li {  width: auto; border-bottom: 3px solid; margin-right:1px; }
#mainmenu ul li a { height:22px;  width: auto; padding-right: 10px; padding-left:10px;}
#mainmenu ul li a:hover { height:22px;  width: auto; padding-top: 8px;}

#mainmenu ul li.first {display:none;}

#mainmenu a { text-align: center; font-size: 12px; font-weight: bold; padding-top: 6px;  width: 100%; color:#FFFFFF; text-decoration: none; display: block; text-shadow: 0px -1px 0 rgba(0, 0, 0, 0.1); border: none; outline:none;}
#mainmenu .lastSection {background: none; padding:none;}

#mainmenu ul li ul li {padding:0;}
/* POP-OUT MENUS - NEED TO OVERRIDE SOME OF THE STYLES IN THE MAINMENU*/
#mainmenu li .popoutmenu {z-index: 4; margin-top: 0px; text-align: left; position: absolute; visibility:hidden; -moz-box-shadow:0px 0px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow:0px 0px 5px rgba(0, 0, 0, 0.1); box-shadow:0px 0px 5px rgba(0, 0, 0, 0.1); background: #A8D657;}
#mainmenu li .popoutmenu li {text-align: left; height: auto; background:none; display:block; border-bottom: 1px dotted #c0ee6f; font-weight: normal; width:223px; background:#A8D657; }
html>body #mainmenu .popoutmenu li {} /*WIDTH ABOVE SET TO 400% FOR IE5/IE6. THIS LINE CORRECTS THE WIDTH FOR ALL OTHER BROWSERS*/
#mainmenu li .popoutmenu li  a {color: #FFFFFF; text-shadow: -1px 0 0 rgba(0, 0, 0, 0.1); display: block; font-family: verdana; font-size: 11px;  height:26px; font-style: normal; font-weight: normal; line-height: 26px; padding: 0px 0 0px 7px; text-align: left; text-decoration: none; width: auto; border-bottom:none; -webkit-transition: all 0s linear; /*safari and chrome */-moz-transition: all 0s linear; /* firefox */-o-transition: all 0s linear; /* opera */}
#mainmenu li .popoutmenu li a:hover{text-decoration:none; color:#fff7a4; line-height: 26px; height:auto; text-shadow: -1px 0 0 rgba(0, 0, 0, 0.1); border-bottom:none; border-top:none; width: auto; padding-top:0px;} 
#mainmenu li .popoutmenu li.page_selected a {text-decoration:none; color:#fff7a4; line-height: 26px; height:auto; text-shadow: -1px 0 0 rgba(0, 0, 0, 0.1); border-bottom:none; border-top:none; width: auto; padding-top:0px;} 





/* TEXT CONTENT & NAVIGATION CONTAINER */
#contentarea {position: relative; float: right; width: 660px; min-height: 480px;  margin-right: 10px; background: url(../../templates/current/images/contentarea_bgr1.jpg) repeat-x #FFFFFF; padding: 30px 20px 40px; color: #4F6577;}
#contentarea .pagetitle {height: 20px; text-align:left; vertical-align: middle; margin-bottom: 10px; padding: 0px; color: #3E8CCC; font-size: 16px; font-weight: bold; /*background:url(../../templates/current/images/pagetitle_bkgd.gif)top left: no-repeat;*/}
#contentarea .pagecontent {padding: 0px; text-align:left;}
#contentarea ul {font-size: 12px; margin-bottom: 13px; padding-left: 28px;}
#contentarea ol {padding-left: 28px; margin-bottom: 10px;}
#contentarea li {display:list-item; padding: 5px;}
#contentarea a {text-decoration: underline;}
#contentarea .pagetitle_members {height: 30px; vertical-align: middle; color: #3E8CCC; font-size: 16px; font-weight: bold;  /*background:url(../../templates/current/images/pagetitle_bkgd.gif)top left no-repeat;*/ }
#contentarea .pagecontent_members { position: relative; margin-bottom: 15px; min-height:300px;  color: #4f6577; }
#contentarea .pagecontent_members p {font-size:11px; padding-bottom: 20px;}
#contentarea .pagetitle_image {float: right; background-repeat:no-repeat; height:50px; width: 100px;}
#contentarea .information_layer {position:absolute; left: 365px; visibility:hidden; text-align: left;}
#contentarea .information_layer td {font-size: 9px; border: none;}

#memberscontentarea {position: relative; float: right;  } !important /* This is needed for the precision template to allow the submenu to display correctly under the memebrmenu*/


/* DIRECTOR AREA */
.directors_content {float: left; width: 65%;}
.directors_fullwidthcontent {float: left; width: 100%;}
.directors_sidebar {float: right; width: 30%; border-left: 1px dotted #DDDDDD; text-align:center;}


/* FLASH / ANNOUNCEMENTS / CUSTOM AREA ACTIVATED */
#flashcontainer_custom { margin-left: auto; margin-right: auto; clear: both; width: 758px; text-align: center; height: 225px;/*border: solid 1px #F00;*/}
#flash_area { float: left;  width: 580px; height: 220px;  border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(templates/current/PIE.htc); border: solid 1px #E6E6E6;/**/ }
#flash_area_custom { float: right; width: 175px; height: 224px;/* border: solid 1px #C6E2FF;background-color:#D7EBFF;*/  background-image:url(images/custom_flash.jpg); background-repeat: no-repeat; }
#mini_flashcontainer { width: 200px; height: 200px; float: left; display: none; }
/* FLASH / ANNOUNCEMENTS CONTAINERS */
#flashcontainer {  margin-right: auto; clear: both; width: 890px; text-align: center; height: 242px; margin-bottom:-2px;}
#announcements_content {margin-top: 5px; margin-bottom: 5px; padding: 5px; background-color: #EEEEEE; border: 1px solid #DDDDDD; height: 20px; overflow: visible; width: 746px; filter: alpha(opacity=0); -moz-opacity:0%;}
#announcements_content_dynamic { position: absolute; left:592px; float: left; height: 187px; width: 297px; background: #ffffff url(../../templates/current/images/contentarea_bgr.jpg) repeat-x; padding-top:8px;  }
#announcements_content_dynamic h1 {display:none;}
#announcements_content_dynamic img {padding-top:15px; padding-left: 5px;}
#announcements_login { height: 20px; width: 470px; background-image:url(images/announce_login_icon.jpg); background-repeat:no-repeat; background-color:#FFF; padding-top:4px; overflow: visible;  filter: alpha(opacity=0); -moz-opacity:0%;}
#announcements_login a {padding-left:23px;  font-size: 11px; font-weight: normal; color:#F90; text-decoration: none;}
#announcements_login a:hover {text-decoration: underline;}
#announcements_members {margin-bottom: 11px; padding: 0px; background-image:url(images/announce_login_icon.jpg); background-repeat:no-repeat; background-color:#FFF; padding-top:4px;/*border: 1px dashed #EEEEEE;*/ height: 30px; overflow: visible; width: 300px; filter: alpha(opacity=0); -moz-opacity:0%;}
#announcements_members a {padding-left:23px; font-size: 11px; font-weight: normal; color:#F90; text-decoration: none;}

#altAnnouncement { position: relative; top: 70px; padding:3px; font-size:11px; background-color:#f0f5f7; border: 1px solid #edf4f6; border-radius: 7px; -webkit-border-radius:7px; -khtml-border-radius: 7px; -moz-border-radius: 7px;  behavior: url(templates/current/PIE.htc);}


/* RIGHT CONTAINER/ MODULELINKS/ NEWSHEADLINES/ LOGINAREA*/
#layoutDivide { height: 100%; }
#sidebar {float:left; clear:left;}


/* SUBMENU (CONTENT PAGES ONLY) */
#submenu { padding: 30px 0 10px; width: 190px; float: left; background: url(../../templates/current/images/submenu_bgr.jpg) repeat-x #f4f6fa;  }
#submenu .title_subsections {font: bold 16px Arial, Verdana, Helvetica, sans-serif; color: #F99404; padding-bottom: 3px; padding-left: 15px; text-shadow: 1px 0 1px #FFFFFF;}
#submenu ul {padding-left: 10px;}
#submenu li {list-style-type: none; margin-left: 5px;margin-top: 5px; padding-left: 15px; padding-top: 5px; background:url(../../templates/current/images/bullet_greenarrow.gif) no-repeat; background-position: 0px 8px;}
#submenu a {color: #2C71A9; font-style: normal; text-decoration:none; display: block;  line-height: 16px; margin-left: 5px;}
#submenu a:hover {text-decoration:none; color:darkOrange;}


/* SUBMENU (YOUTHZONE SIDE MENU) */
#submenu_youth {margin-top: 2px; margin-bottom: 5px; padding: 5px; width: 160px; border-right: 1px dotted #CCCCCC; background-image:url(../../templates/current/images/sidebar_bkgd.gif); background-repeat: no-repeat;}
#submenu_youth .title_subsections {font: bold 15px Arial, Verdana, Helvetica, sans-serif; color: #F99404;}
#submenu_youth li {list-style-type: none; padding-top: 5px; padding-left: 15px; background:url(../../templates/current/images/bullet_greenarrow.gif) no-repeat; background-position: 0px 8px;}
#submenu_youth a {color: #666666;}
#submenu_youth a:hover {text-decoration:underline; color:#0099FF;}


/* NAVIGATION SELECTED ITEMS 
#mainmenu li#section70.section_selected a {height: 22px; color: #ffe800;  }
#mainmenu li#section2.section_selected a {height: 22px;color: #7cccff;  }
#mainmenu li#section3.section_selected a {height: 22px; color: #a8d657;  }
#mainmenu li#section6.section_selected a {height: 22px; color: #f3b363;  }
#mainmenu li#section7.section_selected a {height: 22px; color: #ff7171; }*/

/* NAVIGATION SELECTED ITEMS */
#mainmenu li.section_selected a {color: #FFFFFF; padding-top:8px;}
#mainmenu li.section_selected a:hover {color: #FFFFFF; padding-top:8px;}


#mainmenu ul li#section3.page_selected a {color:yellow; background-color: #99ca3a; border-bottom:none;}
#submenu li.subitem_selected {font-weight: bold; font-famliy: Arial, sans-serif; font-size:12px; padding: 5px 5px 0 15px;}
#submenu li.subitem_selected a {color:darkOrange; text-decoration: none;}


/* MEMBER AREA */
#membermenu {width: 100%; float: left; width: 190px; padding-bottom:20px; background: #f4f6fa; /* Old browsers */
background: -moz-linear-gradient(top,  #f4f6fa 0%, #fff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f4f6fa), color-stop(100%,#fff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* IE10+ */
background: linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f6fa', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ }
#membermenu ul { width: 100%;  padding-top:22px; border-bottom: 1px solid white; background:url(../../templates/current/images/contentarea_bgr.jpg) repeat-x top; }
#membermenu li {list-style-type: none; height: auto; line-height: 16px; padding:5px 0;}
#membermenu li a {margin-left: 10px; display: block;  padding: 5px 0 5px 0;}
#membermenu .last {font-weight: bold;}
.memo {border: 1px solid #CCCCCC; width: 130px; padding: 2px; position: absolute; top: 5px; left: 770px;}
#membermenu li a:hover {color:#2C71A9;}
#membermenu li:hover {background:#c7d2e3;}
#membermenu li strong {color: #2C71A9; font-size: 12px; font-weight: normal; margin-left: 10px; display: block;  padding: 5px 0 5px 0;}
#membermenu ul li ul {display: none; background: none; padding-top:0px;}
#membermenu ul li ul li {list-style-type: none; padding: 0px 5px 0px 6px; display: block; border-bottom: 1px dotted #FFFFFF; background: #f9FBFC; }
/*#adminmenu ul li:hover a{color:darkOrange;}*/
#membermenu ul li ul li a { display:block; color: #6c9eca;  padding: 5px 0;}
#membermenu ul li ul li:hover {color: #2c71a9; text-decoration:none; background-color: #f3f5f9;}
#membermenu ul li ul li:hover a{color:red;}
#membermenu ul li ul li a{color:#6c9ed8;}
#membermenu ul li ul li:hover a{color:#2c71a9;}
#membermenu .expanded {display: inline-block;}





/* SUBMENU (MEMBERS AREA) */
#submenu_members { width: 100%; float: left; width: 190px; padding-bottom:20px; background: #f4f6fa; /* Old browsers */
background: -moz-linear-gradient(top,  #f4f6fa 0%, #fff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f4f6fa), color-stop(100%,#fff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* IE10+ */
background: linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f6fa', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */  border-top: 1px solid #5EA6E3;}
#submenu_members ul {padding-left: 0px; margin-bottom: 0px; border-bottom: 1px solid #5EA6E3;}
#submenu_members li {list-style-type: none; padding: 4px; }
#submenu_members li ul {}
#submenu_members li ul li a{display:block;}
#submenu_members a {color: #2C71A9; padding-left:5px; font-size:11px;}
#submenu_members .title_subsections {font-weight: bold; padding: 5px 5px 5px 10px; color:#465B6E;}


/* SUBMENU (DIRECTORS AREA) */
#directorsAreaPage #submenu_members {position:absolute; left:-182px; top:200px; width: 160px; margin-bottom: 10px; margin-right: 10px; border-top: 2px solid #5EA6E3; background-color: #E4EFF8;}

/* SUBMENU (USER AREA) */
#userAreaPage #submenu_members {position:absolute; left:-183px; top:175px; width: 160px; margin-bottom: 10px; margin-right: 10px; border-top: 2px solid #5EA6E3; background-color: #E4EFF8;}


/* SUBMENU (USERS AREA) */
#submenu_users {float: left; width: 160px; margin-bottom: 10px; margin-right: 10px; border-top: 2px solid #5EA6E3; background-color: #E4EFF8;}
#submenu_users li {list-style-type: none; padding: 4px; border-bottom: 1px solid #5EA6E3;}
#submenu_users a {color: #666666;}


/* SUBMENU (DIRECTORS AREA) */
#submenu_directors {float: left; width: 160px; margin-bottom: 10px; margin-right: 10px; border-top: 2px solid #5EA6E3; background-color: #E4EFF8;}
#submenu_directors li {list-style-type: none; padding: 4px; border-bottom: 1px solid #5EA6E3;}
#submenu_directors a {color: #666666;}


/* SUBMENU (YOUTHZONE AREA) */
#submenu_volunteers{float: left; width: 160px; margin-bottom: 10px; margin-right: 10px; border-top: 2px solid #5EA6E3; background-color: #E4EFF8;}
#submenu_volunteers li {list-style-type: none; padding: 4px; border-bottom: 1px solid #5EA6E3;}
#submenu_volunteers a {color: #666666;}


/* OFFICE AREA NAVIGATION */
#adminmenu {width: 100%; float: left; width: 190px; padding-bottom:20px; background: #f4f6fa; /* Old browsers */
background: -moz-linear-gradient(top,  #f4f6fa 0%, #fff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f4f6fa), color-stop(100%,#fff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* IE10+ */
background: linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f6fa', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */   }
#adminmenu strong {font-size:12px; color: #465B6E;}
#adminmenu ul { width: 100%;  padding-top:22px; background:url(../../templates/current/images/contentarea_bgr.jpg) repeat-x top; }
#adminmenu li {list-style-type: none; height: auto; line-height: 16px; padding:5px 0;}
#adminmenu li a {margin-left: 10px; display: block;  padding: 5px 0 5px 0;}
#adminmenu .last {font-weight: bold;}
.memo {border: 1px solid #CCCCCC; width: 130px; padding: 2px; position: absolute; top: 5px; left: 770px;}
#adminmenu li a:hover {color:#2C71A9;}
#adminmenu li:hover {background:#c7d2e3;}
#adminmenu li strong {color: #2C71A9; font-size: 12px; font-weight: normal; margin-left: 10px; display: block;  padding: 5px 0 5px 0;}
#adminmenu ul li ul {display: none; background: none; padding-top:0px;}
#adminmenu ul li ul li {list-style-type: none; padding: 0px 5px 0px 6px; display: block; background: #f9FBFC; }
/*#adminmenu ul li:hover a{color:darkOrange;}*/
#adminmenu ul li ul li a { display:block; color: #6c9eca;  padding: 5px 0;}
#adminmenu ul li ul li:hover {color: #2c71a9; text-decoration:none; background-color: #f3f5f9;}
#adminmenu ul li ul li:hover a{color:red;}
#adminmenu ul li ul li a{color:#6c9ed8;}
#adminmenu ul li ul li:hover a{color:#2c71a9;}
#adminmenu .expanded {display: inline-block;}
 


/* TOOLS & RESOURCES SECTION (MODULE LINKS) */
#modulelinks {background: #ffffff url(../../templates/current/images/contentarea_bgr.jpg) repeat-x; height: 187px;  float:left;width: 296px; padding-top:8px; }
#modulelinks ul {background: url(../../templates/current/images/ul_background.gif) repeat-x; width: 272px; margin-left: 20px; padding-top: 25px; margin-top: -3px;}
#modulelinks li { list-style-type: none; padding-top: 4px; padding-left: 10px; background:url(../../templates/current/images/bullet_greenarrow.gif) no-repeat; background-position: 0px 8px; font-size: 15px; margin-left: 10px; }
#modulelinks a {color: #3E8CCC;  font-size: 13px; font-style: normal; line-height: 14px; padding-left: 10px;}
#modulelinks a:hover {text-decoration:none; color:darkOrange;}
#modulelinks_contentpage {text-align:left;  width: 170px; padding: 5px 5px 10px 15px; background: #f4f6fa;}
#modulelinks_contentpage li {list-style-type: none; padding: 0 0 0 20px; background:url(../../templates/current/images/bullet_greenarrow.gif) no-repeat; background-position: 0px 8px;}
#modulelinks_contentpage li a {color: #2C71A9; font-style: normal; text-decoration: none; display:block; padding: 5px 0;}
#modulelinks_contentpage li a:hover {text-decoration:none; color:darkOrange; }


/* NEWS HEADLINES */
#newsheadlines { float: left; height: 187px; width: 296px; background: #ffffff url(../../templates/current/images/contentarea_bgr.jpg) repeat-x; padding-top:8px;}
#newsheadlines h3 {color: #ff6900; font-size: 14px; font-style: normal;}
#newsheadlines a {text-decoration: none;color: #5a6973;}
#newsheadlines a:hover {text-decoration: underline;}
#newsheadlines_contentpage { background: #f4f6fa; /* Old browsers */
background: -moz-linear-gradient(top,  #f4f6fa 0%, #fff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f4f6fa), color-stop(100%,#fff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* IE10+ */
background: linear-gradient(top,  #f4f6fa 0%,#fff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f6fa', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */width: 190px; min-height: 120px; overflow: hidden; padding-bottom: 50px; }
#newsheadlines_contentpage h3 {color:#3E8CCC; font-size: 13px;}
#newsheadlines_contentpage a {text-decoration: none; color: #4F6577;}
#newsheadlines_contentpage a:hover {text-decoration: underline; color: #3E8CCC;}
#newsheadlines #news_content {background: url(../../templates/current/images/ul_background.gif) repeat-x; width: 262px; margin-left: 12px; padding-top: 25px; filter: alpha(opacity=0); -moz-opacity:0%; padding-left: 10px; margin-top: -3px;}
#newsheadlines_contentpage #news_content {width: 165px; position: relative; filter: alpha(opacity=0); -moz-opacity:0%; padding: 10px 0 0 15px;}
#newsheadlines .newslinks a {color: #009933; font-weight: bold;}
#newsheadlines_contentpage .newslinks a {color: #009933; font-weight: bold;}


/* NEWS HEADLINES STATIC */
.newsArticleDate { padding-left:21px; padding-right:20px; font-size: 10px;  }
.newsArticleText { padding-left:21px; padding-right:20px; padding-bottom: 0px; font-size: 9px;   }
.newsArticleLink { text-align: right; padding-left:21px; color: #F00; text-decoration: underline;text-transform: uppercase;/* */ padding-right:20px; font-size: 9px;  }
.newsArticleLink p { color: #20368c;}
.newsArticleLink a {color: #20368c; font-size: 9px; text-decoration: underline; }


/*QUICK LINKS*/
#quick_links { position:absolute; top: 327px; left: 258px;  width: 243px; height: 140px;  margin-top: 60px; /*border: 1px solid #F00;*/ background-image: url(images/title_quick_links_homepage_bkgd.jpg); background-repeat: no-repeat; }
#quick_links li {margin-left: 15px; padding-left: 15px;list-style-type: none; padding-top: 5px;  background:url(../../templates/current/images/bullet_greenarrow.gif) no-repeat; background-position: 0px 8px;}
#quick_links a { text-decoration: underline #666666;}
#quick_links a:hover {text-decoration: underline; color: #063;}


/* LOGIN / YOUTHZONE / LIVE CHAT LAYER / CUSTOM BUTTON ---- * ABSOLUTE POSITIONING*/
/*#loginarea { /*position: absolute; top: 310px; left: 510px; float: right; width: 31%; height: 260px; padding-right: 3px; padding-left: 5px; text-align: right;/*border-left: 1px dotted #999999;}*/ /*USED WHEN CUSTOM BUTTON IS ACTIVATED */
/* LOGIN / YOUTHZONE / LIVE CHAT LAYER  */
#loginarea {left: 501px; position: absolute;top: -61px;  }/*USED WHEN CUSTOM BUTTON IS DE-ACTIVATED */
#loginarea img {margin-right:4px;}
#loginarea_contentpage {left: 501px;position: absolute;top: -61px;}
#loginarea_contentpage img {margin-right:4px;}
#loginarea a:hover {border: 4px;}  


/* HOMEPAGE SPOTLIGHTS*/
#spotlight1 {position: relative; width:296px; float: left; clear: left; background: #ffffff; height: 177px;   /*border: 1px solid  #00F;*/}
#spotlight1 h4 {color:#ff6900; border-top: 3px solid #d0dce9; padding-top: 5px; padding-left: 10px;}
#spotlight1 p {color:#596872; font-size:11px; padding-left: 25px; width: 150px; line-height: 16px;}
#spotlight3 img {padding-right:0px;}

#spotlight2 {position: relative; width:296px; float: left; background: #ffffff; height: 177px;  /*border: 1px solid #0F0;*/}
#spotlight2 h4 {border-top: 3px solid #D0DCE9; color: #FF6900; padding-left: 10px; padding-top: 5px;}
#spotlight2 p {color:#596872; font-size:11px; padding-left: 20px; width: 150px; line-height: 16px;}

#spotlight3 {position: relative; width:297px; float: left; background: #ffffff; height: 177px;  /*border: 1px solid #F00;*/}
#spotlight3 h4 {border-top: 3px solid #D0DCE9; color: #FF6900; padding-left: 10px; padding-top: 5px;}
#spotlight3 p {color:#596872; font-size:11px; padding-left: 15px; width: 150px; line-height: 16px;}
#spotlight3 img {padding-right:10px;}

#spotlight1 .spotlight_title { height: 25px;  padding: 10px 5px 5px 20px;} /*BACKGROUND IMAGE SPECIFIED DYNAMICALLY*/
#spotlight2 .spotlight_title { height: 25px;  padding: 10px 10px 5px 15px;} /*BACKGROUND IMAGE SPECIFIED DYNAMICALLY*/
#spotlight3 .spotlight_title { height: 25px;  padding: 10px 20px 5px 10px;} /*BACKGROUND IMAGE SPECIFIED DYNAMICALLY*/
.spotlight_container { position: relative; height: 135px; padding-left: 5px; padding-right: 15px; padding-top: 5px; background-color: #FFF; background: right no-repeat; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(templates/current/PIE.htc); /*border: 1px solid #F00; */}
.spotlight_text { position: absolute; width:45%; height: 140px; top:0px; left:0px; padding-left: 15px; color: #FFFFFF; /*border: solid 1px #00F; */ }
.spotlight_image_upload { width: 80px; height: 80px; float:right; margin-bottom:10px;   /*border: solid 1px #93F; */}
.spotlight_link { position: absolute; bottom: 10px; left: 5px; height: 14px; width: 235px; padding-left: 5px;  /*border: solid 1px #0C0; */}
.spotlight_link a { font-family: Georgia, "Times New Roman", Times, serif; color: #3E8CCC; font-size: 11px; font-style:italic;}
.spotlight_link a:hover {color: darkOrange;}

/* CONTENT SPOTLIGHTS*/
#contSpotContainer{position: relative; float: right;width: 580px;height: 100px; top: auto;}
#spotLight4{float: left; width: 181px; height: 95px; background-image: url(images/onlineLoan_contentpage.jpg); background-repeat: no-repeat; padding-top: 45px; padding-left: 10px; }
#spotLight5{float: left;  width: 181px; height: 95px; background-image: url(images/mabs_contentpage.jpg); background-repeat: no-repeat;  padding-top: 45px; padding-left: 10px;}
#spotLight6{float: right; width: 181px; height: 95px; background-image: url(images/news_contentpage.jpg); background-repeat: no-repeat;  padding-top: 45px; padding-left: 10px;}


/* FOOTER */
#pagefooter { position: relative; width: 892px; height: 43px; margin-left: auto; margin-right: auto; margin-bottom: 5px; padding-top: 0px; padding-left: 0px;  clear: both; background-color:#fff; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(templates/current/PIE.htc); }
#pagefooterIndex { position: relative; width: 892px; height: 36px; margin: 0px auto 5px; padding-top: 0px; padding-left: 0px;  clear: both;  behavior: url(templates/current/PIE.htc); background:  url(../../templates/current/images/footer_bgr.jpg) no-repeat; height:45px;}
#pagefooterPublic { position: relative; width: 892px; height: 36px; margin: 0px auto 5px; padding-top: 0px; padding-left: 0px;  clear: both;  behavior: url(templates/current/PIE.htc); background:  url(../../templates/current/images/footer_bgr.jpg) no-repeat; height:45px; }
#pagefooterOther { position: relative; width: 892px; height: 36px; margin: 0px auto 5px; padding-top: 0px; padding-left: 0px;  clear: both;  behavior: url(templates/current/PIE.htc); background:  url(../../templates/current/images/footer_bgr.jpg) no-repeat; height:45px; color: #fff; padding-top: 13px; text-align: center;}
#pagefooterOther a {font-size:11px;}
.ProgressLogo { position: relative; float: right; padding-right: 15px; top:-15px; /*border: solid 1px #F00;*/ }
#footerDetails{ float: left; width: 86%; padding-top: 5px; margin-left: 30px; text-align: left; color: #ffffff; text-decoration: none; font-size:11px; /*border: 1px solid #0FF;*/}
#fsrnTextOff{ float: left;  color: #666; text-decoration: none; font-size:10px; text-align: left; padding-left: 10x;}
#pagefooterAlternative{ float: left; width: 750px; margin-left: 20px; margin-right: auto; padding-top: 0px; padding-left: 10px; text-align: left; font-size: 11px; color: #ffffff;  clear: both; /*border: solid 1px #F00;*/ }
#fsrnTextAlternative{float: left; color: #fff; text-decoration: none; font-size:11px; text-align: left; padding-left: 0px; }
html>body #pagefooter {} /*LONG CONTENT AREAS EXPAND OVER THE FOOTER GRAPHIC IN IE5/IE6. ONLY SHOW BACKGROUND IMAGE IN OTHER BROWSERS */


/*Social Networking Icons Footer*/
#SocialNetFooter{ display: none; position: relative; float: left; z-index: 10; width: 170px; height: auto; top: 0px; left: 0px;  border: 1px solid #F00; /**/ }
#SocialNetTxt { position: relative; float: left; color:#333; font-size: 11px; width: 70px; /*border: 1px solid #0C0;*/}
#SocialNetIcons { position: relative; float:left; width: 100px; height:auto; top: -4px; right: 2px; /*border: 1px solid #0CF;*/ }
#SocialNetIcons img { list-style-image:none; /*border: 1px solid #FF0;*/ }
#SocialNetIcons a { display: inline; }


/*SITEMAP CONTAINER AND NAVIGATION */
#siteMap { display: none; position: relative; width: 782px; height: 140px; margin-left: auto; margin-right: auto; padding: 0px; clear: both; background-color: #c6d1db; text-align:center; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(templates/current/PIE.htc);  }
#siteMapMenu { position: relative; width: 776px; height: 100%; margin-left: auto; margin-right: auto; white-space: nowrap; padding-bottom: 1px; height: 28px; display: block; text-align:center; font-weight: bold; }
#siteMapMenu li {text-align: left; white-space: nowrap; padding-bottom: 1px; padding-left:11px; padding-right: 11px; height: 28px; float: left; display: block; }
#siteMapMenu li a{ font-size: 11px; color: #0054A4;}
#siteMapMenu li ul a{ font-size: 9px; font-weight: bold; color: #999;}


/*LOGIN AREA ROUNDED CORNERS CROSS BROWZER COMPATABLE - CHANGES NOT NECESSAERY---------------------------------------------------------------------*/
.announcementsContainer{width: 100%; padding-top:0px; float:left;}	
.curvedBox {width:100%; margin-top: -15px;}
.curvedBox .r1, .curvedBox .r2, .curvedBox .r3, .curvedBox .r4 {background-color: #F0F0F0;display:block;overflow:hidden;height:1px;font-size:1px;}
.curvedBox .r2, .curvedBox .r3, .curvedBox .r4 {border-width:0 1px;border-left:1px solid #F0F0F0;border-right:1px solid #F0F0F0;}
.curvedBox .r1 {margin:0 6px; display: none;}
.curvedBox .r2 {margin:0 3px; display: none;}
.curvedBox .r3 {margin:0 2px; display: none;}
.curvedBox .r4 {margin:0 1px;height:2px; display: none;}
.curvedBox .content{background:#F0F0F0; border-left:1px solid #F0F0F0; border-right:1px solid #F0F0F0 ;padding:5px;}


/* GRAPHIC ICONS BELOW LOGIN AREA ----------------------------------------------------------------------------------------------------------------*/
.Lost_bkgd {background-image: url("../../images/essentials/lost_pin_bkgd.jpg"); background-position: right center; background-repeat: no-repeat; float: left; height: 37px; margin-top: 40px; padding-left: 40px;padding-top: 8px;text-align: left; width: 250px;}
.register {background-image: url("../../images/essentials/reg_pin_mem_log_bkgd.jpg"); background-position: right center; background-repeat: no-repeat; float: right; font-size: 10px;  height: 37px; margin-top:40px; padding-left: 60px; padding-top: 8px; text-align: left; width: 250px; margin-right: 50px;}
.security {background-image: url("../../images/essentials/security_mem_log_bkgd.jpg"); background-position: right center; background-repeat: no-repeat; font-size: 10px; height: 37px; margin-top: 10px; padding-left: 40px;padding-top: 8px; text-align: left; width: 250px; float: right; margin-right: 50px;}
.problems {background-image: url("../../images/essentials/problem_mem_log_bkgd.jpg"); background-position: right center; background-repeat: no-repeat; float: left; font-size: 10px; height: 37px; margin-top: 10px; padding-left: 40px;padding-top: 8px; text-align: left; width: 250px;}
.browzer {
	background-image: url(../../images/essentials/browzer_info_bkgd.jpg);
	width: 250px; float:left; background-repeat: no-repeat; background-position: right; height: 37px;text-align: left; padding-left: 60px; padding-top: 8px; font-size: 10px; margin-top: 10px;}
.memLogLinksCont{
	height:250px; margin-top: 190px; width:100%; background-position: left; background-repeat: no-repeat; /*border: 1px solid #F00;*/
}


/*PIN SECURITY CHECK - CHANGES NOT NECESSAERY V4.1 - 6 DIGIT--------------------------------------------------------------------------------*/
.mainContainerbkgd {background-color:#F0F0F0; width: auto; height: auto; text-align:right;}
.mainContainer {float: left; background-color:#F9FBFC; width: 100%; height:auto; text-align:right;/*margin-right: 205px;*/ margin-right:5px; border-bottom: 1px dotted #C2CAD1; border-top: 1px dotted #C2CAD1;}
.memContainer{}
.alert {border-left: 1px dotted #CCCCCC; float: right; height: 155px; margin-left: 15px; margin-top: 3px; width: 200px;}

.memContText {padding-bottom: 20px; padding-top:10px;}
.memberNumberTxt {float:left;font-weight:bold; padding-left: 150px; padding-top: 7px;}
.securityPasswordTxt {float:left;font-weight:bold; padding-left: 140px; padding-top: 7px;}

.memNumForm {padding-bottom: 0px; padding-right:0px;}
.secPassForm {padding-bottom:10px; padding-right:0px;}

.secPassBut {padding-bottom: 25px; padding-top: 10px; padding-bottom:40px;}


/*PIN SECURITY CHECK - CHANGES NOT NECESSAERY V4.1 - 6 DIGIT - SECURITY CHECK----------------------------------------------------------------*/
.mainContainerbkgdPin {background-color:#F0F0F0; width: auto; height: auto; text-align:right;}
.mainContainerPin {background-color:#F0F0F0;width: auto;height: auto;text-align:right;margin-right: 170px;padding-right:5px;border-right-style:dotted;border-right-width: 1px;border-right-color: #CCC;}

.pinContText {/*padding-bottom: 20px; padding-top:10px;*/}
.pinNumberTxt {float:left;font-weight:bold; padding-left: 142px;}
.dobPasswordTxt {float:left;font-weight:bold; padding-left: 140px;}

.memContainer{}
.dobContainer {}

.pinNumForm {padding-bottom: 0px; padding-right:0px;}
.inPassBut {padding-bottom: 10px}


/*PIN SECURITY CHECK - CHANGES NOT NECESSAERY V4.1 / 6 DIGIT PIN --------------------------------------------------------------------*/
.mainContbkgdSec2 {background-color:#F0F0F0; width: auto; height: auto; text-align:right;}
.mainContSec2{ background-color:#F0F0F0;width: auto;height: auto;text-align:right;margin-right: 170px;padding-right:5px;border-right-style:dotted;border-right-width: 1px;border-right-color: #CCC;}
.secContainer2{}
.secPassTxt2{float:left;font-weight:bold; padding-left: 170px; padding-bottom: 5px; padding-top: 2px; }
.secPassField2{padding-bottom: 0px; padding-right:0px; padding-bottom: 5px;}


/*PIN SECURITY CHECK - CHANGES NOT NECESSAERY V3.4 / 3 DIGIT PIN RANDOM---------------------------------------------------------------------*/
.mainContbkgdPin2 {overflow: hidden; width: 100%; height: 100%; background-color:#F0F0F0; }
.mainContPin2 {overflow: hidden; width: 100%; height: 100% ;text-align:right; margin-right: 50px; padding-top: 10px; background-color:#F0F0F0;  border-right-style:dotted; border-right-width: 1px; border-right-color: #CCC; }
.infoCont { position: relative; top: 25px; left:-370px; font-size:9px; color: #000; border: #999 solid 1px; background-color:#D8D8D8; padding-left:5px; float: right; width: 54%; height: 10px;  clear: both; height: auto; margin-top: 0px; border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px;  behavior: url(templates/current/PIE.htc);}

.memContainer2{}
.pinContainer2{}
.dobContainer2{}

.memNumberTxt2{float: left; padding-bottom: 5px;  width: 48%; height: 20px; }
.pinNumberTxt2 {float: left; padding-bottom: 5px;   width: 48%; height: 20px; }
.dobPassTxt2 {float: left; padding-bottom: 5px;  width: 48%; height: 20px; }

.memNumField2{float: right; padding-bottom: 5px; text-align: left; width: 52%; height: 20px;}
.pinNumField2 {float: right; padding-bottom: 5px; text-align: left; width: 52%; height: 20px;}
.dobField2 {float: right; padding-bottom: 5px; text-align: left; width: 52%; height: 20px;}

.logPassBut2 {float: right; width: 100%; margin-right: 185px;}


/* 3 DIGIT PIN RANDOM - SECURITY CHECK ----------------------------------------------------*/
.mainContbkgdRand3 { background-color:#F0F0F0; padding-top: 10px; width: auto; height: auto;  text-align:right; /*border: solid 1px #F00;*/}
.mainContRand3 {text-align:right; margin-right: 80px; padding-right:5px; padding-top: 25px;/*border: solid 1px #0F0;*/ background-color:#F9FBFC; width: 450px; height:auto; text-align:right;/*margin-right: 205px;*/ margin-right:5px; padding-bottom:30px;}

.dobContRand3 {}

.rand3PinTxt{float: left; padding-left: 155px; padding-top: 2px;}
.dobInputTxtRand3 {float: left; padding-left: 155px; padding-top: 2px;}

.pinNumFormRand3 { height: auto; padding-top: 5px; padding-right: 5px; /*border: solid 1px #F00;*/}
.pinPassButRand3 {padding-bottom: 10px; padding-top:10px;}


/*NEW RANDOM 3 DIGIT PIN---------------------------------------------------------------------------*/
.mainContbkgd3 { float: left; background-color:#F9FBFC; width: 100%; height:auto; text-align:right;/*margin-right: 205px;*/ margin-right:5px; border-bottom: 1px dotted #C2CAD1; border-top: 1px dotted #C2CAD1;}
.insertRandomPin3 {}
.dobForm3 {padding-bottom:10px; padding-right:0px;}


/*DIRECTORS AREA LOGIN-------------------------------------------------------------------------------*/
#pageInContOff{ position: relative; width:782px; height:100%; padding-top: 5px;  background-color: #FFF;border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc); /*padding-bottom: 10px;*/}
#pageInContOff:after {clear:both;content:".";display:block;height:0pt; visibility:hidden;}
#pagefooterOff { position: relative; width: 782px; height: 20px; top: -15px;  margin-left: auto; margin-right: auto; margin-bottom: 5px; clear: both; text-align: center; font-size:11px; background-color:#fff; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc);}
#pagefooterOff a { color: #69C; font-size:10px;}

.officeLogCont{position: relative; width: 100%; height: 250px; padding-top: 10px; padding-bottom: 10px; background-color:#F9FBFC; border-bottom: 1px dotted #C2CAD1; border-top: 1px dotted #C2CAD1;}
.officeTxtAlertCont{ float: right; width: 0%; height: 100%;}
.officeLogContInner{ position: relative; width: 100%;  height: 100%;}


/*DIRECTORS AREA LOGIN-------------------------------------------------------------------------------*/
#pageInContDir{ position: relative; width:782px; height:100%; padding-top: 10px; padding-bottom: 5px;   background-color: #FFF;  border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc); /*padding-bottom: 10px;*/}
#pageInContDir :after {clear:both;content:".";display:block;height:0pt; visibility:hidden;}
#pagefooterDir { position: relative; width: 782px; height: 20px; top: -20px;  margin-left: auto; margin-right: auto; margin-bottom: 5px; clear: both; text-align: center; font-size:11px; background-color:#fff; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc);}
#pagefooterDir a { color: #69C; font-size:10px;}

.directLogCont{position: relative; width: 100%; height: 200px; padding-top: 10px; padding-bottom: 10px; background-color:#F0F0F0;}
.dirTxtAlertCont{ float: right; width: 0%; height: 100%;}
.dirLogContInner{ position: relative; width: 100%;  height: 100%;}


/*GRAPHIC INFORMATION BOXES BELOW DIRECTORS LOGIN------------------------------*/
.dirInfoCont{ position: relative; width: 80%; height: 110px; padding-top: 10px; }
.dirInfoSect1{ float: left; width: 5%; height: 25px;}
.dirInfoSect2{ float: left; width: 5%; height: 25px;}

.dirInfoTxt1{ float: right; width: 94%; height: 25px; }
.dirInfoTxt2{ float: right; width: 94%; height: 25px;}


/*USER AREA LOGIN-------------------------------------------------------------------------------------*/
#pageInContUser{ position: relative; width:782px; height:100%; padding-top: 10px; padding-bottom: 5px;   background-color: #FFF; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc); /*padding-bottom: 10px;*/}
#pageInContUser :after {clear:both;content:".";display:block;height:0pt; visibility:hidden;}
#pagefooterUser {position: relative; width: 782px; height: 20px; top: -20px;  margin-left: auto; margin-right: auto; margin-bottom: 5px; clear: both; text-align: center; font-size:11px; background-color:#fff; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc);}
#pagefooterUser a {}

.userLogCont{position: relative; width: 100%; height: 200px; padding-top: 10px; padding-bottom: 10px; background-color:#F0F0F0;}
.userTxtAlertCont{float: right; width: 0%; height: 100%;}
.userLogContInner{position: relative; width: 100%;  height: 100%;}


/*REPRESENTATIVES AREA LOGIN------------------------------------------------------------*/
#pageInContRep{ position: relative; width:782px; height:100%; padding-top: 10px; padding-bottom: 5px;   background-color: #FFF; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc); /*padding-bottom: 10px;*/}
#pageInContRep :after {clear:both;content:".";display:block;height:0pt; visibility:hidden;}
#pagefooterRep {position: relative; width: 782px; height: 20px; top: -120px;  margin-left: auto; margin-right: auto; margin-bottom: 5px; clear: both; text-align: center; font-size:11px; background-color:#fff; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc);}
#pagefooterRep a { color: #FFF;}

.repLogCont{position: relative; width: 100%; height: 200px; padding-top: 10px; padding-bottom: 10px; background-color:#F0F0F0;}
.repTxtAlertCont{float: right; width: 0%; height: 100%;}
.repLogContInner{position: relative; width: 100%;  height: 100%;}


/*VOLUNTEERS AREA LOGIN------------------------------------------------------------*/
#pageInContVol{ position: relative; width:782px; height:100%; padding-top: 10px; padding-bottom: 5px;  background-color: #FFF; border: solid 1px #FFF; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc); /*padding-bottom: 10px;*/}
#pageInContVol :after {clear:both;content:".";display:block;height:0pt; visibility:hidden;}
#pagefooterVol {position: relative; width: 782px; height: 20px; top: -20px;  margin-left: auto; margin-right: auto; margin-bottom: 5px; clear: both; text-align: center; font-size:11px; background-color:#fff; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc);}
#pagefooterVol a { color: #FFF;}

.volLogCont{position: relative; width: 100%; height: 200px; padding-top: 10px; padding-bottom: 10px; background-color:#F0F0F0;}
.volTxtAlertCont{float: right; width: 0%; height: 100%;}
.volLogContInner{position: relative; width: 100%;  height: 100%;}


/*WEBTELLER AREA LOGIN --------------------------------------------------------------*/
#pageInContWeb{ position: relative; width:782px; height:100%; padding-top: 10px; padding-bottom: 5px;   background-color: #FFF; border: solid 1px #FFF; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc); /*padding-bottom: 10px;*/}
#pageInContWeb :after {clear:both;content:".";display:block;height:0pt; visibility:hidden;}
#pagefooterWeb {position: relative; width: 782px; height: 20px; top: -20px;  margin-left: auto; margin-right: auto; margin-bottom: 5px; clear: both; text-align: center; font-size:11px; background-color:#fff; border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px;  behavior: url(../templates/current/PIE.htc);}
#pagefooterWeb a { color: #FFF;}

.webLogCont{position: relative; width: 100%; height: 200px; padding-top: 10px; padding-bottom: 10px; background-color:#F0F0F0;}
.webTxtAlertCont{ float: right; width: 0%; height: 100%;}
.webLogContInner{ position: relative; width: 100%;  height: 100%;}


/*LOST YOUR PIN---------------------------------------------------------------------------*/
.lostPinCont { position: relative; width: 100%; height: 80px; padding-top: 10px; padding-bottom: 5px;  padding-bottom: 10px; background-color:#F0F0F0;}
.lostPinTxtAlertCont{float: right; width: 0%; height: 100%;}
.lostPinContInner{ position: relative; width: 100%;  height: 100%;}
.lostPinTxt{ padding-left: 10px; padding-bottom: 5px; }


/* UNIVERSAL LOGIN CODE----------------------------------------------------------------*/
.userTxt{ float: left; width: 38%; height: 20px; padding-top: 5px; text-align: right;}
.passwordTxt{ float: left; width: 38%; height: 20px; padding-top: 10px; text-align: right;}
.emailTxt{float: left; width: 38%; height: 20px; padding-top: 5px; text-align: right;}
.enterCode{ position: relative; top: 30px; float: left; width: 38%; padding: 3px; text-align: right;}

.userInputShort{ float:right; width: 59%; height: 20px; padding: 3px;}
.passwordInputShort{ float: right; width: 59%; height: 20px; padding: 3px;}
.emailInput{float: right; width: 59%; height: 20px; padding: 3px; }
.enterCodeInputShort{float: right; width: 59%; height: 40px; padding: 3px; padding-bottom: 5px; }

.captchaGraphic{ float: right; width:59%; height: 80px; padding-top: 10px;   }

.logButtin{float: right; width: 59%; text-align: left; padding: 3px;}


/*HORIZONTAL RULE------------------------------------*/
#horzRule { width: 94%; height: 5px; padding-bottom: 0px; background-color:#EEE; border-top: dotted 1px #CCC; border-bottom: dotted 1px #CCC; }


/* REMOVE SKYPE INJECTED MARKUP (Only works sometimes) -------------------------------------*/
span.skype_pnh_container { display: none !important; }
span.skype_pnh_print_container { display: none !important; }
