* /*Set's border, padding and margin to 0 for all values*/
{
padding: 0;
margin: 0;
}

img {
border: 0;
}

body, html {
height: 100%;
}

body {
background: #ccc url("img/bg_gradient1.jpg") top center repeat-x;
color: #162b35;
font-family: Arial, Tahoma, Verdana, Helvetica, sans-serif;
text-align: center; /*** Centers the design in old IE versions ***/
font-size: 80%;
}

.displayNone {
display: none;
}

.hidden {
visibility: hidden;
display: none;
}

p {padding: 7px 0 7px 0;}

a:link, a:visited {
color: #028978;
text-decoration: underline;
}
a:hover{
color: #0c9d8b;
text-decoration: none;
}

h1, h2, h3 {
font-weight: bold;
padding-bottom: 5px;
}
h1 {
font-size: 15px;
}
h2 {
font-size: 18px;
}
h3 {
font-size: 1.3em;
}
h4 {
font-size: 1.3em;
}
h5 {
font-size: 1.3em;
}
h6 {
font-size: 14px;
font-weight: bold;
color: #fff;
}
h1 a, #header h2{
color: #fff;
}
.clear { clear: both; }

.left { float: left; }
.right { float: right; }

/**************************
COLORS
**************************/

.gold {
color: #ba9501;
}

.burntorange {
color: #cc5600;
}

.gray, .gray a:link, .gray a:visited {
color:#e4e4e4
}

#wrap {
width:100%;
height:100%;
background: transparent url("img/bg_photo5.jpg") top center no-repeat;
margin:0 auto;
padding:0;
}

#topcontainer {
position: relative;
margin: 0 auto;
width: 850px;
height: 218px;
margin-bottom: 5px;
text-align: left;
padding:0 10px 0 10px;
}

#toplinks {
float:right;
font-size: 11px;
text-align:right;
margin-right:5px;
}

#toplinks a:link, #toplinks a:visited {
text-decoration: none;
}

#toplinks a:hover {
color: #0c9d8b;
text-decoration: underline;
}

#logo{
position: absolute;
top: 55px;
left: 12px;
width: 289px;
height: 125px;
}

#logo h1 a {
width: 289px;
height: 131px;
display: block;
text-decoration: none; 
}

#topnav {
position:absolute;
width:850px;
height: 22px;
top: 188px;
left:10px;
border-bottom: 8px #1c9485 solid;
}

/*style for IE*/		
* html #topnav {
left:0;
}

#mainContainer {
width: 850px;
margin: 0 auto; /*** Centers the design ***/
background: #fff url(img/main_bg1.gif) top center repeat-y; /*** This is our faux columns ***/
text-align: left; /*** Because we centered the text in body we have to move the text back to left aligning ***/
padding:0 10px 0 10px;
}

* html #mainContainer {
height: auto;  /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/
}

#calendarpage #mainContainer {
width: 850px;
margin: 0 auto;
background: #fff;
padding:0 10px 0 10px;
}

/**************************
HEADER
**************************/
#header {
background: #fff;
}

#rotating_promo {
	width: 850px;
	min-height: 274px;
	margin: 0 auto;
	padding: 0;
	}

.promophoto {
border: 2px #162b35 solid;
padding: 0;
}

.contentslide{
width: 850px;
height: 274px;
background-color: #fff;
}

.contentslide .contentdiv{
display: none;
}

.pagination{
height: 19px;
width: 830px; /*Width of pagination DIV. To equal that of Content Slider's width, take into account the later's left/right paddings!*/
margin: 0 auto 0 auto;
text-align: right;
background: transparent url("img/promobar_bg.gif") no-repeat;
padding: 3px 20px 0 0;
font-size: 10px;
font-family: Arial, Verdana;
border-bottom: 5px #fff solid;
}

* html .pagination{ /*Simplified box model hack to get IE5 to display width equal to that of Content Slider's*/
width: 850px; /*IE5 width*/
w\idth: 850px; /*IE6 width*/
}

.pagination a{
padding: 2px 2px 2px 4px;
text-decoration: none;
color: #fff;
background-color: #162b35;
}

.pagination a:hover, .pagination a.selected{
color: #fff;
background-color: #1c9485;
}

#pscroller1 {
width:850px;
height:22px;
background-color:#f6f2af;
margin:0 auto;
border-bottom:10px #fff solid;
padding-top:3px;
}
* html #pscroller1 {
height:35px;
border-bottom:5px #fff solid;
}

.adtickerclass {
padding:10px 0 0 0;
}

/**************************
CONTENT AND COLUMNS
**************************/
.outer {
padding-left: 165px;
}
* html .outer {
padding: 0 120px 0 0; /* Normally this shouldn't be in this hack, it should be in .outer, but because of IE7 I had to */
}

.outercal {
padding: 0;
}
* html .outercal {
padding: 0; /* Normally this shouldn't be in this hack, it should be in .outer, but because of IE7 I had to */
}

.inner {
width: 685px; /*** This width is for non-IE browsers. Mozilla makes this necessary. Be sure to check your layout in different browsers if you changes this value. Especially IE7 seems to create a horisontal scroll if this value is set too large ***/
padding-bottom: 321px;
}
* html .inner {
width: 100%;
}
/*** div.inner is wider than its container, div.outer, and so overlaps to the right, pushing
div.right into the proper position. IE expands div.outer instead, requiring a Tan hack to avoid
blowing the layout apart. IE gets the original 100% width as in the Livingstone layout.
***/

.innercal {
width: 850px; /*** This width is for non-IE browsers. Mozilla makes this necessary. Be sure to check your layout in different browsers if you changes this value. Especially IE7 seems to create a horisontal scroll if this value is set too large ***/
padding-bottom: 321px;
}
* html .innercal {
width: 850px;
}
/*** div.inner is wider than its container, div.outer, and so overlaps to the right, pushing
div.right into the proper position. IE expands div.outer instead, requiring a Tan hack to avoid
blowing the layout apart. IE gets the original 100% width as in the Livingstone layout.
***/

.float-wrap {
float: left;
width: 601px;
margin-left: -165px; /*** Same length as .outer padding-left but with negative value ***/
z-index:110;
}
* html .float-wrap {
margin-left:0;
}

.float-wrapcal {
width: 850px;
margin-left: 0; /*** Same length as .outer padding-left but with negative value ***/
}
* html .float-wrapcal {
/*** No need for hacking IE on this layout ***/
}

#content {
float: right;
width: 439px;
padding: 0;
}
* html #content {
position: relative;  /*** IE needs this  ***/
}

#search-results {
background-color:pink;
width:587px;
}

#calendarpage #content {
float: none;
margin: 0 auto;
width: 850px;
padding: 0;
}
* html #calendarpage #content {
position: relative;  /*** IE needs this  ***/
}

.contentWrap{
padding: 5px 20px 0 10px;
}
.contentWrap ol, .contentWrap ul {
margin: 3px 0 5px 35px;
}
.contentWrap li {
padding-bottom: 2px;
}

.contentWrap p{
line-height: 1.5em;
}

.breadcrumbs {
	font-size:90%;
	background: transparent;
	margin: 3px 0 8px 0;
	}

.center_separator {
width: 425px;
height: 7px;
background: transparent url(img/center_separator.gif) top left no-repeat;
}

.fullseparator {
width: 850px;
height: 7px;
background: transparent url(img/full_separator.gif) top left no-repeat;
}

.front-horiz-lg {
width: 571px;
height:109px;
padding:0;
margin: 0 0 10px 0;
border: 2px #ccc solid;
background: #ccc;
z-index:110;
}

.adnotice-main {
margin: 10px 0 3px 0;
color: #b3b3b3;
font-size: 11px;
z-index:110;
}

/**************************
MEMBER DIRECTORY
**************************/

.search {
float: left;
margin: 5px 0 10px 0;
}

search h2 {
margin: 0 0 2px 0;
}

.browse {
float: right;
padding-left: 0;
border-left: 0 #ccc solid;
margin: 20px 0 20px 0;
}

browse h2 {
margin: 0 0 2px 0;
}

.memberprofile {
clear: both;
position: relative;
width: 576px;
height: auto;
border: 2px #ccc solid;
background: #e4e4e4 url(img/memberprofile_bg.gif) top left repeat-x;
margin: 10px 0 10px 0;
}

.memberprofile h2.left{
font-size: 13px;
font-weight: bold;
margin: 3px 0 2px 4px;
}

.memberprofile h2.right{
font-size: 11px;
font-weight: bold;
margin: 4px 4px 2px 0;
}

.memberprofile address{
clear: left;
margin: 4px 0 4px 4px;
font-size: 11px;
font-style: normal;
}

.memberprofile address strong{
font-weight: bold;
}

.joindate {
float:right;
font-size: 11px;
font-weight: bold;
font-style:italic;
margin: 4px 4px 2px 0;
color:#555;
}

.linkinfo {
position: absolute;
right: 4px;
bottom: 4px;
font-size: 11px;
text-align: right;
}

/***temporary for compatibility purposes only ***/
.highlighted_memberprofile {
clear: both;
position: relative;
width: 576px;
height: auto;
border: 2px #ccc solid;
background: #e4e4e4 url(img/memberprofile_bg.gif) top left repeat-x;
margin: 10px 0 10px 0;
}

.highlighted_memberprofile h2.left{
font-size: 13px;
font-weight: bold;
margin: 3px 0 2px 4px;
}

.highlighted_memberprofile h2.right{
font-size: 11px;
font-weight: bold;
margin: 4px 4px 2px 0;
}

.highlighted_memberprofile address{
clear: left;
margin: 4px 0 4px 4px;
font-size: 11px;
font-style: normal;
}

.highlighted_memberprofile address strong{
font-weight: bold;
}

/**************************
CALENDAR TABLE
**************************/
#bigcalendar table {
	width: 100%;
	border: 1px #162b35 solid;
	background: #ebf3f1;
}
#bigcalendar td {
	font: 10px Arial, Verdana;
	border: 1px #162b35 solid;
}
#bigcalendar  th { font: bold 11px verdana, arial;
	 border: 1px #162b35 solid;
	 }
#bigcalendar  { margin: 0 auto; }
#bigcalendar  td {
	height: 100px;
	width: 124px;
	vertical-align:top;
	padding: 2px;
}

.off { background-color:#e4e4e4;}
.current { background-color: #fff;}

.date { font-size: 11px; color:#162b35; font-weight:bold;}

/**************************
LEFT COLUMN
**************************/
/*** div.left is in div.float-wrap, and when div.float-wrap is neg margined to the left,
div.left is carried over into the proper position.
***/
#left {
float: left;
width: 162px;
padding: 0;
font-size: 11px;
border: 0 blue dashed;
margin-bottom: 0;
}

* html #left {
position: relative;  /*** IE needs this  ***/
z-index:10;
}

#left p {
margin: 0 3px 0 3px;
}

.leftside_separator {
width: 162px;
height: 7px;
background: transparent url(img/leftside_separator.gif) top left no-repeat;
}

.leftside_header {
clear:left;
width: 154px;
margin: 7px 0 10px 0;
background: #162b35;
}

.leftside_header h6 {
margin: 0;
padding: 4px;
color:#fff;
}

.leftside_header h4 {
margin: 0;
padding: 4px;
color:#fff;
font-size:11px;
}

#left ul, #left ol {
width: 154px;
list-style: none;
margin: 5px 0 8px 0;
padding:0 0 4px 0;
border-bottom: 2px #eee solid;
}

#left li {
margin: 0 0 0 15px;
list-style-image: url("img/arrow_green.gif");
list-style-type: circle;
}

#left li a {
color: #016458;
text-decoration: underline;
}

/*************************
RIGHT COLUMN
**************************/
#right {
float: right;
width: 249px;
padding: 0;
border: 0 red dashed;
font-size: 12px;
}
* html #right {
position: relative;  /*** IE needs this  ***/
margin-right: -140px; /*** IE gets this margin. ***/
}

#right p {
margin: 0 9px 0 9px;
}

#right ul {
list-style: none;
margin: 0 9px 0 9px;
padding-bottom: 4px;
}
#right li {
margin-left: 15px;
font-size: 11px;
list-style-image: url("img/arrow_green.gif");
list-style-type: circle;
}
#right li a {
color: #016458;
text-decoration: underline;
}

.rightside_separator {
width: 249px;
height: 7px;
margin-bottom: 5px;
background: transparent url(img/rightside_separator.gif) top left no-repeat;
}

.adnotice-right {
float: right;
margin: 0 6px 0 0;
color: #b3b3b3;
font-size: 11px;
clear: right;
}

.front-horiz-sm {
width: 235px;
height: 89px;
margin: 5px 0 5px 5px;
border: 2px #ccc solid;
background: #eee;
z-index: 50;
clear: right;
}

.rightside_photo {
margin: 0 5px 0 5px;
}

.rightside_photocaption {
width: 239px;
margin: 0 5px 5px 5px;
background: #028978;
}

.rightside_photocaption h6 {
margin: 0;
padding: 4px;
}

#mini-calendar {
margin-top: 15px;
}

/*************************
RIGHT COLUMN #2
**************************/
#right2 {
float: right;
width: 1px;
padding: 0;
border: 0 red dashed;
font-size: 12px;
}
* html #right2 {
position: relative;  /*** IE needs this  ***/
margin-right: -140px; /*** IE gets this margin. ***/
}

/**************************
FOOTER
**************************/
#footer {
width: 850px;
height: 293px;
margin: 0 auto;
margin-top: -291px;
text-align: center;
color: #fff;
border-top: 5px #fff solid;
padding:0 10px 0 10px;
}

* html #footer {
margin-top: -306px;
}

/**************************
BOTTOM PROMOS
**************************/
#bottom_promos {
width: 850px;
height: 206px;
margin: 0 auto;
text-align: center;
background: #162b35;
color: #fff;
}

* html #bottom_promos {
width: 850px;
padding-left:15px;
}

.promobox {
float: left;
margin: 19px 0 0 25px; 
width: 249px;
padding-bottom: 15px;
text-align: left;
font-size: 12px;
line-height: 14px;
}

.promobox h3 {
font-size: 14px;
font-weight: bold;
color: #05a591;
}

.promobox h3 a {
color: #05a591;
text-decoration: none;
}

* html .promobox  {
position: relative;
margin-left: 18px;
}

.promobox ul {
list-style: none;
margin: 0 9px 0 9px;
padding-bottom: 4px;
}
.promobox li {
margin-left: 10px;
list-style-image: url("img/arrow_green2.gif");
list-style-type: circle;
}
.promobox li a {
color: #fff;
text-decoration: underline;
}

.promophoto-r {
float: right;
margin: 0 0 5px 10px;
border: 2px #e4e4e4 solid;
}

.bottom_separator {
width: 249px;
height: 7px;
margin-bottom: 11px;
background: transparent url(img/bottom_separator.gif) top left no-repeat;
}

/**************************
BOTTOM LINKS
**************************/
#bottom_links {
position: relative;
width: 850px;
height: 80px;
margin: 0 auto;
text-align: left;
background: #e0ece9 url(img/footer_logo2.gif) top left no-repeat;
font-size: 11px;
line-height: 13px;
}

#address {
position: absolute;
margin: 10px 0 0 154px;
color: #162b35;
}

#address a {
color: #017a6b;
}

#sitedeveloper {
float: right;
margin: 54px 15px 0 0;
color: #162b35;
}

#sitedeveloper a {
color: #017a6b;
}