/* Style sheet for Shady Acres Campground */
/* Header is the part at the very top of the page with the title in it. */

#header { background: transparent;  margin:30px 0px 0px; height: 200px; padding: 10px; text-align: right; color: #ACE600; font-style: italic; font-family:"Arial Black", Arial, Helvetica, serif;}
#header h1 {font-size:220%; margin:0; padding:0}
#header h2 {font-size:170%; margin:0; padding:0;}

/* Content is the wide part with all the text and information in it. */
#content {padding: 0px 10px 0px 0px; float:none; margin-left:205px; background: transparent; }
#welcome h3 {font-size:130%; color: #14FF14; padding:0; margin:5px 0px 20px; text-align:right; }
#content h3 {font-size:130%; color: #009900; padding:0; margin:5px 0px; }
#content h4 {font-size: 110%; color: maroon; margin-bottom: -10px; padding: 0; }

/* sidebar is the narrow column on the left side of the page */
#sidebar { position: absolute; left:0; top: 280px; width: 170px; margin:0; padding:0px 5px; background: transparent;}
#sidebar h3 {}
#sidebar h4 {}
#sidebar ul {list-style-type: none; list-style-image:none;}
#sidebar ul {clear: both; margin: 0; padding:5px;}
#sidebar ul li {font-weight:bold; font-size:18px; margin:0; padding: 10px; }

/* footer is the part at the very bottom of the page */
#footer {clear:both; margin-top: 20px; float:right; padding-right:5px; width:80%; padding:10px; text-align:right; font-size:80%; font-weight: bold; text-transform:uppercase; line-height: 20px; border-top:1px solid #339900}
#footer ul {text-transform:uppercase; list-style-type: none; list-style-image:none; margin:0; }
#footer li {display: inline; margin:0; padding: 0px 10px; border-left:0.5px solid #006633; }
html, body {margin:0;padding:0;direction:ltr}
body {font-family:Verdana, Arial, Helvetica, Futura, sans-serif; font-size:1em; color:black; background-image: url(images/test1.jpg); background-attachment: scroll; background-position: top left; background-repeat: no-repeat; }
p img { padding: 0; max-width: 100%; }
/* using 'class="centered' is much better than using align="center", being much more futureproof (and valid) */
img.centered { display: block; margin-left: auto; margin-right: auto; }
img.right { padding: 4px; margin: 0 0 2px 7px; display: inline; }
img.left { padding: 4px; margin: 0 7px 2px 0; display: inline; }
.right { float: right; }
.left { float: left }
hr {max-width:100%; min-width:50%; height:1px}
img {border:0; font-size:60%; }
a img {border:0}

a {text-decoration:none}
a {color:#009900}
a:hover {color:#14FF14}

#benefits a {color:#009900}
#benefits a:visited {color:#009900}
#benefits a:hover {color:#14FF14}
#benefits {font-size:115%; font-weight:bold; }
#benefits li {list-style-image:url(images/ball1.gif);}

#eventslist h3 {text-align:left; color: blue; margin:20px 0px -10px 0px; padding:0}
ul {list-style:url(/images/diamond.gif) disc}
#calendar {margin-left:20px;}
dl {margin:0 0 0 .5em;font-size:98%}
dt {font-weight:600;padding-top:0.5em}

@media print {
body {background:white;font-size:10pt;margin:0}
#sidebar {display:none}
#header {height:100px}
#header h1 {font-size:150%; margin:0; padding:0}
#header h2 {font-size:120%; margin:0; padding:0;}
#content{margin-left:0;float:none;width:auto}
#footer {display:none}
}
