html {
height:100%; /*Works to hold footer to bottom of screen*/
margin: 0;
padding: 0;
}
body {
font:20px arial, helvetica, sans-serif;
color:white;
font-weight:bold;
height:100%; /*Works to hold footer to the bottom of the screen*/
margin: 0;
padding: 0;
background-color:#000;
background-image:URL(../2graphics/dplite.jpg);
background-attachment:fixed;
background-repeat:repeat;
}
p {
font:16px arial, helvetica, sans-serif;
font-weight:bold;
margin:0px 25px 0px 25px;
padding:0px;
text-align:justify;
}
p.center {
font:20px arial, helvetica, sans-serif;
font-weight:bold;
text-align:center;
}
p.adobe {
font:14px arial, helvetica, sans-serif;
font-weight:bold;
text-align:center;
}
/*Used for header text*/
p.title {
font:42px arial, helvetica, sans-serif;
font-weight:bold;
text-align:left;
text-decoration:none;
color:#9C0419;
}
/*Used for text shadows in header text*/
p.titleshadow{
font:42px arial, helvetica, sans-serif;
font-weight:bold;
text-align:left;
text-decoration:none;
color:black;
}
/*Used for text in content div heading*/
p.contentheading{
margin:0px 0px 0px 0px;
font:30px arial,helvetica,sans-serif;
font-weight:bold;
color:white;
text-align:center;
}
p.contentheading2line{
margin:6px 0px 0px 0px;
font:30px arial,helvetica,sans-serif;
font-weight:bold;
color:white;
text-align:center;
line-height:1;
}
/*Used for text shadows in content div heading*/
p.contentheadingshadow{
margin:0px 0px 0px 0px;
font:30px arial,helvetica,sans-serif;
font-weight:bold;
color:black;
text-align:center;
}
p.contentheadingshadow2line{
margin:-20px 0px 0px 0px;
font:30px arial,helvetica,sans-serif;
font-weight:bold;
color:black;
text-align:center;
line-height:1;
}
p.img {
text-align:center;
}
/*Just used to as an easy way to find proper red color, since I don't remember*/
p.red {
color:#9C0419;
}
p.redcenter {
color:#9C0419;
text-align:center;
}
a:link {
color:white;
font-style: italic;
text-decoration:underline;
}
a:visited {
color:white;
font-style: italic;
text-decoration:underline;
}
a:hover {
color:#9C0419;
text-decoration:underline;
}
/*Used to keep text in header from being blue or underlined as a link.*/
a:link.title{
color:#9C0419;
text-decoration:none;
}
a:link.titleshadow{
color:#000000;
text-decoration:none;
}
/*Used to keep text in header from being purple after being visited.*/
a:visited.title{
color:#9C0419;
text-decoration:none;
}
a:visited.titleshadow{
color:black;
text-decoration:none;
}
a:link.contentheading, a:visited.contentheading{
color:white;
text-decoration:underline;
}
a:link.contentheadingshadow, a:visited.contentheadingshadow{
color:black;
text-decoration:underline;
}
img {
position:relative;
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
border:none;
}
img.float-left {
float:left;
padding:20px 10px 10px 0px;
margin:0px 0px 0px 0px;
border:none;
}
img.float-right {
float:right;
padding:20px 0px 10px 10px;
margin:0px 0px 0px 0px;
border:none;
}
img.left { /*Used for left img in header*/
position:relative;
margin:0% 0% 0% 0%;
border:none;
}
ul {
display: inline; /* Prevents "stepdown" */
}
li {
list-style-type:square;
font:16px arial, helvetica, sans-serif;
font-weight:bold;
margin:1em 25px 0px 25px;
padding:0px;
text-align:justify;
display: inline; /* Prevents "stepdown" */
}
ul.shr {
display:block;
list-style-type:square;
}
li.shr {
list-style-type:square;
font:16px arial, helvetica, sans-serif;
font-weight:bold;
margin:1em 25px 0px 25px;
padding:0px;
text-align:justify;
display: block;
}
/*Used to format data from queries in pages with tables*/
table {
position:relative;
border-collapse: collapse;
width:90%;
margin-left:auto;
margin-right:auto;
border:none;
}
table.contacts {
position:relative;
border-collapse: collapse;
width:70%;
margin-left:auto;
margin-right:auto;
}
table.rig {
top:-50px;
border: 4px black solid;
}
/*formats table headers*/
th {
border: 2px black solid;
font:20px arial,helvetica,sans-serif;
font-weight:bold;
text-align:center;
color:white;
}
/*Formats headers on Members individual specs page*/
th.rig {
font:20px arial,helvetica,sans-serif;
font-weight:bold;
border: 4px black solid;
padding:5px 5px 5px 5px;
text-align:center;
}
tr.hide {
visibility: hidden;
}
/*formats table cells*/
td {
border: 2px black solid;
margin:2px 2px 2px 2px;
font:16px arial,helvetica,sans-serif;
font-weight:bold;
text-align:left;
color:white;
}
td.center {
text-align:center;
border: none;
}
/*formats table cells on Members individual specs page*/
td.rig {
border: 4px black solid;
padding:5px 5px 5px 5px;
}
/*contains all divs of the header*/
#headercontainer {
width: 70%;
height: auto;
margin: 0px,0px,0px,152px;
}
/*formats header div*/
#header {
position:absolute;
top:0%;
left:152px;
width:70%;
height:18%;
background-color:#0C0596;
background-image:none;
border-style:solid;
border-color:#9C0419;
border-width:5px 5px 5px 5px;
z-index:10;
display: inline;
}
/*formats div holding logo on left side of header*/
#leftheader {
position:absolute;
top: 1.25%;
left:;
width:10%;
text-align:left;
display: inline;
}
/*positions first line of title text in header*/
#shr {
position:absolute;
width:80%;
top:1%;
left:14%;
text-align:center;
display: inline;
}
/*positions shadow for first line of title text in header*/
#shrshadow{
position:absolute;
width:80%;
top:1.4%;
left:14.4%;
text-align:center;
display: inline;
}
/*positions second line of title text in header*/
#club {
position:absolute;
width:80%;
top:50%;
left:32%;
text-align:center;
display: inline;
}
/*positions shadow for second line of title text in header*/
#clubshadow{
position:absolute;
width:80%;
top:50.4%;
left:32.4%;
text-align:center;
display: inline;
}
/*formats div holding img on left side of header*/
#rightheader {
position: absolute;
top:1.25%;
left:85.5%;
width:10%;
text-align:right;
display: inline;
}
/*Holds what else? the main content of the page.*/
#content {
position:absolute;
width:70%;
top:18%;
left:152px;
min-height:1000px;
height:auto;
*html height:600px;
color:white;
padding:0px 0px 30px 0px;
background-color:#c0c0c0;
background-image:URL(../2graphics/dpdark.jpg);
background-attachment:fixed;
background-repeat:repeat;
border-width:0px 5px 5px 5px;
border-color:#9C0419;
border-style:solid;
}
#contentfaq {
position:absolute;
width:70%;
margin-top:0px;
left:152px;
min-height:600px;
height:auto;
* html height: 600px;
color:#ffffff;
border-style:solid;
border-color:#9C0419;
border-width:5px 5px 5px 5px;
padding:50px 0px 30px 0px;
background-color:#c0c0c0;
background-image:URL(../2graphics/dpdark.jpg);
background-attachment:fixed;
background-repeat:repeat;
}
#contenttribute {
background-color:#000;
}
/*Positions the heading text of the content section*/
.contentheading {
position:relative;
width:100%;
top:-17px;
left:0%;
}
/*Positions the shadow of the heading text of the content section*/
.contentheadingshadow{
position:relative;
width:100%;
top:2.5px;
left:.2%;
}
.contentheading2line{
position:relative;
width:100%;
top:-17px;
left:0%;
}
.contentheadingshadow2line{
position:relative;
width:100%;
top:2.5px;
left:.2%;
}
/*Positions the heading text of the content section if it is linked*/
.contentheadinglink {
position:relative;
width:100%;
top:50px;
left:0%;
}
/*Positions the shadow of the heading text of the content section if it is linked*/
.contentheadingshadowlink{
position:relative;
width:100%;
top:50px;
left:.2%;
}
#table{
position:relative;
width:100%;
height:auto;
}
#contenttext{
position:relative;
width:100%;
top:0px;
height:auto;
z-index:2;
}
#adobe {
position:relative;
width:100%;
top:0px;
left:0%;
font:14px arial, helvetica, sans-serif;
}
/*formatting for an invisible footer that never moves from the bottom of the page*/
#footer {
position:fixed;
height:25px;
width:71%;
right:25px;
left: 152px;
bottom: 0px !important;
bottom: -1px;
text-align:center;
background-color:#ffffff;
background-image:URL(../2graphics/dplite.jpg);
background-position:36px 47px;
border-style:solid;
border-color:#9C0419;
border-width:5px 0px 0px 0px;
z-index:10;
}
/*Div which holds all the navigation buttons for the page+the logos under them*/
#navigation {
position:absolute;
top:0px;
left:6px;
}
/************************************ Start Navigation Buttons for the Main Navigation Menu*************************/
/*Thanks to dynamicdrive.com for these wonderful buttons! I have modified them, but wouldn't have been able to make them without considerable effort.*/
a.boldbuttons{
background: transparent url(../2graphics/roundedge-red-left.gif) no-repeat top left;
display:block;
float: left;
font: bold 13px Arial; /* Change 13px as desired */
line-height: 22px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 30px) */
height: 30px; /* Height of button background height */
padding-left: 8px; /* Width of left menu image */
text-decoration: none;
}
a:link.boldbuttons, a:visited.boldbuttons, a:hover.boldbuttons, a:active.boldbuttons{
color:white; /*button text color for all these functions of "a"*/
}
a.boldbuttons span{
background: transparent url(../2graphics/roundedge-red-right.gif) no-repeat top right;
display: block;
padding: 4px 10px 4px 2px; /*Set 10px to be equal or greater than'padding-left' value above*/
width:120px;
}
a:hover.boldbuttons{ /* Hover state CSS. Change color for text to change on mouse rollover */
color:#0C0596;
}
a.boldbuttonscurrent{ /*Having a separate class enables the current button on each page to be formatted differently... in this case... with a grey button.*/
background: transparent url(../2graphics/roundedge-grey-left.gif) no-repeat top left;
display:block;
float: left;
font: bold 13px Arial; /* Change 13px as desired */
line-height: 22px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 30px) */
height: 30px; /* Height of button background height */
padding-left: 8px; /* Width of left menu image */
text-decoration: none;
}
a:link.boldbuttonscurrent, a:visited.boldbuttonscurrent,a:hover.boldbuttonscurrent, a:active.boldbuttonscurrent{
color:#9C0419; /*button text color for "current" button. Just insert "current" after a: class="boldbuttons" in html or php to change color of active page button.*/
}
a.boldbuttonscurrent span{
background: transparent url(../2graphics/roundedge-grey-right.gif) no-repeat top right;
display: block;
padding: 4px 10px 4px 2px; /*Set 10px to be equal or greater than'padding-left' value above*/
width:120px;
}
a:hover.boldbuttonscurrent{ /* Hover state CSS for current active page button only*/
color:#0C0596;
}
.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
width: 100%;
}
/************************************End Navigation Buttons for the Main Navigation Menu*************************/
/*div used to hold the images below the navigation buttons on left side of page*/
#navimg{
position:absolute;
top:420px;
left:0px;
width:120px;
}
/*****************Accordion Menu for the Newsletter & Trails Pages***************************/
.arrowlistmenu{
/*******for newsletter page 1st column of buttons*********/
position:relative;
display:block;
width: 120px; /*width of accordion menu*/
left:20%;
line-height:22px;
height:30px;
padding-top:4px;
background-color:black;
background-image:URL(2graphics/dpdark.jpg);
background-attachment:fixed;
}
.arrowlistmenu2{
/*******for newsletter page 2nd column of buttons*********/
position:relative;
display:block;
top:-35px;
width: 120px; /*width of accordion menu*/
left:40%;
line-height:22px;
height:30px;
padding-top:4px;
background-color:black;
background-image:URL(2graphics/dpdark.jpg);
background-attachment:fixed;
}
.arrowlistmenu3{
/*******for newsletter page 3rd column of buttons*********/
position:relative;
display:block;
top:-70px;
width: 120px; /*width of accordion menu*/
left:60%;
line-height:22px;
height:30px;
padding-top:4px;
background-color:black;
background-image:URL(2graphics/dpdark.jpg);
background-attachment:fixed;
}
.arrowlistmenu4{/*******for trails page centered buttons*********/
position:relative;
display:block;
top:-35px;
width: 200px; /*width of accordion menu*/
left:40%;
line-height:22px;
height:30px;
padding-top:4px;
background-color:black;
background-image:URL(2graphics/dpdark.jpg);
background-attachment:fixed;
}
.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: bold 14px Arial;
color: white;
background: transparent URL(../2graphics/roundedge-red2.gif) no-repeat top left;
padding: 4px 0px 0px 40px;
text-transform: uppercase;
line-height: 22px;
height:30px;
cursor: hand;
cursor: pointer;
}
.arrowlistmenu2 .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: bold 14px Arial;
color: white;
background: transparent URL(../2graphics/roundedge-red2.gif) no-repeat top left;
margin-bottom: 10px; /*bottom spacing between header and rest of content*/
padding: 4px 0px 0px 40px;
text-transform: uppercase;
line-height: 22px;
height:30px;
cursor: hand;
cursor: pointer;
}
.arrowlistmenu3 .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: bold 14px Arial;
color: white;
background: transparent URL(../2graphics/roundedge-red2.gif) no-repeat top left;
margin-bottom: 10px; /*bottom spacing between header and rest of content*/
padding: 4px 0px 0px 40px;
text-transform: uppercase;
line-height: 22px;
height:30px;
cursor: hand;
cursor: pointer;
}
.arrowlistmenu4 .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: bold 14px Arial;
color: white;
background: transparent URL(../2graphics/red200.gif) no-repeat top left;
margin-bottom: 10px; /*bottom spacing between header and rest of content*/
padding: 4px 0px 0px 40px;
text-transform: uppercase;
line-height: 22px;
height:30px;
cursor: hand;
cursor: pointer;
}
a:hover.menuheader{
color: #0C0596;
}
a:hover.arrowlistmenu{
color: #0C0596;
}
a:hover.arrowlistmenu2{
color: #0C0596;
}
a:hover.arrowlistmenu3{
color: #0C0596;
}
a:hover.arrowlistmenu4{
color: #0C0596;
}
.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background:transparent url(../2graphics/roundedge-grey.gif) no-repeat top left;
color:#9C0419;
padding-left: 40px;
}
.arrowlistmenu2 .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background:transparent url(../2graphics/roundedge-grey.gif) no-repeat top left;
color:#9C0419;
padding-left: 40px;
}
.arrowlistmenu3 .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background:transparent url(../2graphics/roundedge-grey.gif) no-repeat top left;
color:#9C0419;
padding-left: 40px;
}
.arrowlistmenu4 .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background:transparent url(../2graphics/grey200.gif) no-repeat top left;
color:#9C0419;
padding-left: 40px;
}
.arrowlistmenu .openheader a:hover{
color:#0C0596;
left:-40px;
}
.arrowlistmenu2 .openheader a:hover{
color:#0C0596;
text-align:center;
}
.arrowlistmenu3 .openheader a:hover{
color:#0C0596;
left:-40px;
}
.arrowlistmenu4 .openheader a:hover{
color:#0C0596;
text-align:center;
}
a:link.categoryitems,a:hover.categoryitems,a:visited.categoryitems
{text-align:center}
.arrowlistmenu .arrowlistmenu2 .arrowlistmenu3 ul{ /*CSS for UL of each sub menu*/
margin: 0;
padding: 0;
left:-40px;
margin-bottom: 0px; /*bottom spacing between each UL and rest of content*/
}
.arrowlistmenu4 ul{ /*CSS for UL of each sub menu*/
margin: 0;
padding: 0;
left:-40px;
margin-bottom: 0px; /*bottom spacing between each UL and rest of content*/
}
.arrowlistmenu .arrowlistmenu2 .arrowlistmenu3 ul li{
padding-bottom: 0px; /*bottom spacing between menu items*/
left:-40px;
}
.arrowlistmenu4 ul li{
padding-bottom: 0px; /*bottom spacing between menu items*/
left:-40px;
}
.arrowlistmenu .arrowlistmenu2 .arrowlistmenu3 arrowlistmenu4 ul li a{
color:#ffffff;
background:#F3F3F3 URL(2graphics/dpdark.jpg) attachment:fixed;
display: block;
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #0C0596;
font-size: 90%;
}
.arrowlistmenu .arrowlistmenu2 .arrowlistmenu3 .arrowlistmenu4 ul li a:visited{
color:#ffffff;
left:-40px;
background:#F3F3F3 URL(2graphics/dpdark.jpg) attachment:fixed;
}
.arrowlistmenu ul li a:hover{ /*hover state CSS*/
left:-40px;
color:#0C0596;
background:#F3F3F3 URL(2graphics/dpdark.jpg) attachment:fixed;
}
.arrowlistmenu2 ul li a:hover{ /*hover state CSS*/
left:-40px;
color:#0C0596;
background:#F3F3F3 URL(2graphics/dpdark.jpg) attachment:fixed;
}
.arrowlistmenu3 ul li a:hover{ /*hover state CSS*/
left:-40px;
color:#0C0596;
background:#F3F3F3 URL(2graphics/dpdark.jpg) attachment:fixed;
}
.arrowlistmenu4 ul li a:hover{ /*hover state CSS*/
left:-40px;
color:#0C0596;
background:#F3F3F3 URL(2graphics/dpdark.jpg) attachment:fixed;
}
/*****************End of the Accordion Menu for the Newsletter Page***************************/
/******************Beginning of changes for Trails Page*************************************/
.arrowlistmenu4 {
width:240px;
}