﻿/* Global Resets */

/* This positions each element into three columns Left Side, Right Side and what I call Content (middle) */


#content {


	margin: 0;
	padding-left:225px;
	padding-right:225px;
	min-width:750px;
	min-height:99%;
	
	}


#content h3 {
		border-bottom: 1px solid navy;
		font-family:Georgia;
		font-size:16pt;
		margin: 0;
		padding-bottom:1px;
		padding-top:5px;
		color:navy;
		text-align:left;
		clear:both;
		width: 90%;
}


#content h4 {
	text-align:left;
	width:	90%;
	padding: 5px;
	color:Navy;
	font-family:Georgia;
	border-bottom-color:navy;
	border-bottom-style:groove;
	border-bottom-width:2px;
	padding: 2px;
	margin: 2px;
    clear:both;

}

#content p {
	font-size:14pt;
}


/* this makes a two row list */
.tworow {clear:both;}

.tworow ul{
			font-size:14pt;
			color:maroon;
			list-style:none;
			padding:3px;
			margin-left:5px; 
			float: left;
  			width: 30em;
  			}
  			
.tworow li {
  	float: left;
  	width: 15em;
  	margin: 0;
  	padding: 0;
  	text-align:left;

}


/* this makes a 4 column list...how sweet is that  */

.fourrow{clear:both;}

.fourrow ul {
	font-size:12pt;
	color:maroon;
	list-style:none;
	padding:3px;
	margin-left:5px; 
	float: left;
  	width: 46em;
}
 
.fourrow li {
  	float: left;
  	width: 11em;
  	margin: 0;
  	padding: 0;
  	text-align:left;
} 
/* this defines the left side */

#leftside {
	
	position:absolute;
	width:180px;
	top: 3px;
	left: 0px;
	padding: 0px;
	padding-bottom:50px;
	border-color:black;
	border-style:groove;
	border-width:1px;
	background-color:#C6C796;
	margin:0;
	
}
#leftside h3 {
	
	font-family:Georgia;
	font-size:12pt;
	padding:2px;
	letter-spacing:1px;
	color:black;
	margin-left: auto;
	margin-right: auto;
	margin-top:2px;
	margin-bottom:0px;
	
	
	
	
	
}
#leftside ul {

	list-style-type:none;
	margin:0px;
	padding:0px;
	text-align:left;
	
  	
}

#leftside li {
  	
  color: white;
 /* float:left; /*this is whats making ff not work  */
  width:178px;
  font-size:85%;
  border-bottom-width: 0;
  
} 



#leftside li a:link {		
							display:block;
							border:1px solid black;
							background-color:#556B2F;
							color:white;
							padding: 0.1em 0 0.1em 0.4em;
							text-decoration:none;
							border-top-width: 0;

}

#leftside li a:visited {
							
							display:block;
							border:1px solid black;
							background-color:#556B2F;
							color:white;
							padding: 0.1em 0 0.1em 0.4em;
							text-decoration:none;
							border-top-width: 0;

}


#leftside li a:hover {		
							display:block;
							border:1px solid black;
							background-color:white;
							color:black ;
							padding: 0.1em 0 0.1em 0.4em;
							text-decoration:none;
							border-top-width: 0;

	
}
#leftside li a:active {
							
							display:block;
							border:1px solid black;
							background-color:#556B2F;
							color:white;
							padding: 0.1em 0 0.1em 0.4em;
							text-decoration:none;
							border-top-width: 0;

}
/* ____________________________________  */

#rightside {
	
	position:absolute;
	width: 225px;
	top:4px;
	right:1px;
	padding:1px;
	margin-right:1px;
	float:right;
	
}

#rightside h3 {
	
	font-family:Georgia;
	font-size:12pt;
	letter-spacing:1px;
	margin: 0;
	padding:2px;
	color:black;
	text-align:left;
	
}

#rightside ul {
	
	font-size:10pt;
	color:navy;
	list-style:none;
	padding:4px;
	margin-left:2px; 
	
}

#rightside li {
  	
   	margin: 0;
  	padding: 0;
   	width: 90%;
  } 

.framestuff {
	border: 0;
}

/* this is for nice blue glossy menus  */

.glossymenu{
list-style-type: none;
margin: 5px 0;
padding: 0;
width: 170px;
}

.glossymenu li a{
background: white url(../graphics/glossyback2.gif) repeat-x bottom left;
font: 12px georgia;
color: white;
display: block;
width: 100%;
padding: 3px 0;
padding-left: 10px;
text-decoration: none;

}


* html .glossymenu li a{ /*IE only. Actual menu width minus left padding of A element (10px) */
width: 160px;
}

.glossymenu li a:active{
color: white;
}

.glossymenu li a:visited{
color: white;
}

.glossymenu li a:hover{
background-image: url(../graphics/glossyback.gif);
color:white;
}

/*green buttons for left menu */

.greenbuttons{
list-style-type: none;
margin-left:auto;
margin-right:auto;
padding: 0;
width: 100%;
}

.greenbuttons li a{
background-color:#556B2F;
color: white;
display: block;
width: auto;
padding: 3px 0;
padding-left: 10px;
text-decoration: none;

}


* html .greenbuttons li a{ /*IE only. Actual menu width minus left padding of A element (10px) */
width: 100%;
}

.glossymenu li a:active{
color: white;
}

.greenbuttons li a:visited{
color: white;
}

.greenbuttons li a:hover{
background-image: url(../graphics/greenback.gif);
color: black;
}


/* This creates ad boxes with an image and definition  */

.adthumbnail {  position:relative;
				margin-left:auto;
				margin-right:auto;
				border:1px solid black;
				background-color:white;
				padding:5px;
				clear:both;
				width: 90%;
				margin-bottom:10px;
				margin-top:10px;
	}
.adthumbnail dl {
				position:absolute;
				right:10px;
				font-size: 80%;
				width:70%;
			}
.adthumbnail dt {
			font-weight: bold;
			font-family: Georgia, "Times New Roman", Times, serif;
}
.adthumbnail dd {
			
			color: #666666;
			font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
.adthumbnail img{
	
	position:absolute;
	top:5px;
	left:5px;
	height: 90px;
	width:130px;
	
}

.commonpicture img{
margin-left:auto;
margin-right:auto;
border: 1px thin black;
max-height: 100px;

}

.commonpicture a:link a:visited{
	color:black;
}

/* Photo Gallery Rules */

.photgallery {
	
    position:relative; 
    width:90%; 
    height:350px; 
    margin:20px auto 0 auto; 
    border:1px solid #aaa; 
    	
}

.photgallery img{
height:100px;
margin:5px;
	
	
}


/* These are my wrappers - MasterP is my oveall wrapper */
/* basic wrappers go after the headers  */

#MasterP    {
	position:relative;
	margin:0px;
	padding:0px;
	min-height: 100%;
	
}

#basicwrapper {position:relative;
				text-align:left;
				margin:0;
				padding-top:10px;
			
	}
/* this creates the two colum pages */
#bigleft {
	
	margin-right:250px;
	padding:10px;
	}
	
#bigleft h3 {
	font-family:Georgia;
	font-size:16pt;
	margin: 0;
	padding-bottom:1px;
	padding-top:5px;
	color:navy;
	border-bottom-color:navy;
	border-bottom-style:solid;
	border-bottom-width: 1px;
	text-align:left;
	clear:both;
	}

#twocolright {
	position:absolute;
	top:5px;
	right:10px;
	width:230px;
	padding: 10px;
	}


/* All Paragraphs will be in Times Roman and Black */

p		{
	color: black;
	font-family:"Times New Roman", Times, serif; 
	text-align:left;
	padding:5px;
	font-size:12pt;
	width:90%;
}

	
/* this is a 1 pixel high horizontal line in blue */
hr	{	color:blue; height: 1px; padding:1px; margin:2px}

H3.Niceh3 {
	
	font-family:Georgia;
	font-size:20pt;
	margin: 0;
	padding-bottom:1px;
	color:navy;
	border-bottom-color:navy;
	border-bottom-style:solid;
	border-bottom-width: 1px;
	text-align:left;
	}






/* This center and color a header Blue in Arial Type */
.bluehead { color:blue; 
			font-family:Arial, Helvetica, sans-serif;
			text-align: center;
			position:relative;
}
/* This is a blue box with yellow type */
.Backlit { 	background-color:blue; 
			color:yellow;
			font-family:Verdana;
			font-weight:200;
			text-align: center;
			position:relative;
}

/* This is my main header for each page */
.Pageheader {
	
	color: white;
	background-color:#556B2F;
	font-family:Georgia;
	font-size: 20pt;
	font-weight: bold;
	text-align: center;
	position: relative;
	top: 0px;
	width: 100%;
	padding: 0px;
	margin:0px;
}
.coolheader{
			height:60px;
			text-align:center;
			position:relative;
			width:	90%;
			margin-right:auto;
			margin-left:auto;
			padding: 3px;
			color:#FF2020;
			font-weight:800;
			font-size:30pt;
			font-family:"Goudy Stout";
			border-bottom-color:green;
			border-bottom-style:groove;
			border-bottom-width:3px;
			border-right-color:green;
			border-right-style:groove;
			border-right-width:3px;
			border-top-color:green;
			border-top-style:solid;
			border-top-width:1px;
			border-left-width:1px;
			border-left-color:green;
			border-left-style:groove;
			background-image:url('../Original/rcr/senic/Riverbirchswamp_web.jpg');
			}
/* this code makes a caption box with italic font for a div box that contains an image sample code is
<div class="caption">
  <p><img class="scaled" src="st-tropez.jpg" alt="St. Tropez">
  <p>Saint Tropez and its fort in the evening sun
</div>  */

div.caption {
  float: none;
  width: 55%;
  border: thin silver solid;
  margin-left: auto;
  margin-right: auto;
  padding: 3px;
  margin-bottom:5px;
}
div.caption p {
  margin-right: auto;
  margin-left: auto;
  text-align:center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
  padding:0px;
  width:90%;
  margin-top:5px;
	
}

/* Image properties are here */

img.scaled {
  width: 100%;

}

	IMG.leftpic {
		float:left;
		margin-top:3px;
		margin-right:12px;
		margin-bottom:3px;
	}
	IMG.rightpic {
		
		float:right;
		margin-top:3px;
		margin-left:12px;
		margin-bottom:3px;
	}

	IMG.centered {
    	display: block;
    	margin-left: auto;
    	margin-right: auto; 
    	margin-top:3px;
    	margin-bottom:3px;
    	width:80%;
}


/* These are Link Selectors */
a:link{
	color:blue;
}
a:hover {
	color:black;
	cursor:pointer;
	
	
}
a:visited {
	color:blue;
	      }



/*This makes a Blue to white box */

.bluebox 	{
	
	background-image:url('http://www.misslououtdoors.com/graphics/bluetowhite.gif');
	Margin-left:auto;
	margin-right:auto;
	width:135px;
	height:300px;
	border: 1px solid navy;
	text-align:left;
	color:yellow;
	font-weight:bold;
	font-family:"Times New Roman", Times, serif;
	margin-top:10px;
}



.adbox {
	padding: 2px 4px 2px 6px;
    margin-left: auto;
    margin-right: auto;
    width:90%;
    border: 1px solid black;
    background-color:#C6C796;
}
/* This is to created some buttons that look like NAV menus */
#favbuttons {
		width:145px;
		margin:0;
		padding:0;

	}
	
#favbuttons ul {
list-style:none;
margin:0;
padding:0;
}
#favbuttons li{	color: orange;
}

#favbuttons li a:visited {	font-size:90%;
							display:block;
							padding: 0.2em 0 0.2em 0.4em;
							border:1px solid black;
							background-color:#556B2F;
							color:white;
							text-decoration:none;
}
	
#favbuttons li a:link {		font-size:90%;
							display:block;
							padding: 0.2em 0 0.2em 0.4em;
							border:1px solid black;
							background-color:#556B2F;
							color:white;
							text-decoration:none;
}
	
#favbuttons li a:hover {background-color:white;
						color:#556B2F;
							
							
}

#HorizButtons {
		Font-size:28pt;
		text-align:center;
	}
	
#HorizButtons ul {
list-style:none;
margin:0;
padding:0;
}
#HorizButtons li{
	color: #0000FF;
	display:inline;
	margin: 0;
}

#HorizButtons li a:visited {
							padding:0px;
							background-color:white;
							color:navy;
							text-decoration:none;
}
	
#HorizButtons li a:link {
						    padding:0px;
							background-color:white;
							color:navy;
							text-decoration:none;
}
	
#HorizButtons li a:hover {
							background-color:#0033CC;							
							color:white;
}

#footer {

	width:100%;
	position:relative;
	bottom:-40px;
	height:50px;
	clear:both;
	text-align:center;	
}

* html #footer {/*only ie gets this style*/
\height:52px;/* for ie5 */
he\ight:50px;/* for ie6 */
}
#clearfooter{clear:both;height:40px;}/*needed to make room for footer*/ 
* html #centrecontent {height:1%;margin-bottom:12px}/* combat IE's 3 pixel jog */




