/* muddlerstyle.css */

body {
	background-image: url("gradiantgrey.gif");
	background-repeat: repeat-y;
	}
	
h1 {
	color: maroon;
	font-family: Freestyle Script;
	font-size: 50px ;
	}
	
h2 {
	color: maroon;
	font-family: Freestyle Script;
	font-size: 40px ;
	}

h3 {
	color: maroon;
	font-family: Freestyle Script;
	font-size: 30px ;
	text-align: center;
	}

a {
	color: maroon;
	}
	
a:visited {
	color: black;
	}
	
a:hover {
	color: white;
	background-color: black;
	} 
	
p1 {
	text-align: center;
	color: maroon;
	font-family: Freestyle Script;
	font-size: 30px ;
	}
	
#all {
		border: 3px groove maroon;
		width: 1000px;
		height: 1000px;
		position: absolute;
		left: 0px;
		top: 0px;
		}

#head {
		text-align: center;
		width: 100%;
		background-image: url("tranquility.jpg");
		clear: both;
		}
		
#head2 {
		text-align: center;
		background-image: url("gradiantgrey.gif");
		}

#img {
		float: left;
		margin-right: 2%;
		}
		
#img2 {
		float: right;
		margin-left: 2%;
		} 
		
#img3 {
		float: left;
		}
	
#img4 {
		background-image: url("muddler6.gif");
		}
		
#body {
		text-align: center;
		padding-top: 1%;
		}
		
#body2 {
		text-align: justify;
		border-bottom: 2px groove maroon;
		float: left;
		width: 100%;
		min-height: 30px;
		padding-top: 1%;
		padding-bottom: 1%;
		clear: both;
		}
		
#left {
		display: inline;
		float: left;
		width: 21%;
		border: 3px groove maroon;
		overflow: auto; 
		max-height: 420px;
		min-height: 30em
		}
		
#right {
		float: left;
		width: 75%;
		border: 3px groove maroon;
		min-height: 30em;
		max-height: 420px;
		}
		
.target {
		position: relative;
		}
		
.content {
		position: relative;
		width: 21%;
		}
		
.content ul {
		position: relative;
		left: 20%;
		width: 80%;
		}
		
#menu {
		position: relative;
		width: 20%;
		}
		
#menu li {
		list-style-type: none;
		margin-left: -2em;
		text-align: center;
		}
		
#menu a {
		text-decoration: none;
		color: maroon;
		display: block;
		border: 3px gray outset;
		background-color: gray;
		}
		
#menu a:visited {
		color:black;
		}
		
#menu a:hover {
		border: 3px gray inset;
		}
		
#menu3 ul {
		margin-left: -2.5;
		text-align: center;
		width: 96%;
		float: left;
		clear: both;
		}
		
#menu3 li {
		list-style-type: none;
		float: left;
		width: 32%;
		text-align: center;
		}
		
#menu3 a {
		text-decoration: none;
		color: maroon;
		display: block;
		border: 3px gray outset;
		background-color: gray;
		}
		
#menu3 a:visited {
		color:black;
		}
		
#menu3 a:hover {
		border: 3px gray inset;
		}
		
#menu4 ul {
		margin-left: -2.5;
		text-align: center;
		width: 96%;
		float: left;
		clear: both;
		}
		
#menu4 li {
		list-style-type: none;
		float: left;
		width: 24%;
		text-align: center;
		}
		
#menu4 a {
		text-decoration: none;
		color: maroon;
		display: block;
		border: 3px gray outset;
		background-color: gray;
		}
		
#menu4 a:visited {
		color:black;
		}
		
#menu4 a:hover {
		border: 3px gray inset;
		}
		
#menu5 ul {
		margin-left: -2.5;
		text-align: center;
		width: 96%;
		float: left;
		clear: both;
		}
		
#menu5 li {
		list-style-type: none;
		float: left;
		width: 19%;
		text-align: center;
		}
		
#menu5 a {
		text-decoration: none;
		color: maroon;
		display: block;
		border: 3px gray outset;
		background-color: gray;
		}
		
#menu5 a:visited {
		color:black;
		}
		
#menu5 a:hover {
		border: 3px gray inset;
		}

#nav, #nav ul {
		padding: 0;
		margin-left: 0em;
		list-style: none;
		}
		
#nav li {	
		float: left;
		width: 10em;
		list-style-type: none;
		
		}
		
#nav li li {
		float: left;
		width: 10em;
		list-style-type: none;
		
		}
		
#nav li li li {
		float: left;
		width: 10em;
		list-style-type: none;
		}
		
#nav a {
		display: block;
		width: 10em;
		}

#nav li ul {
        display: none;
		}
		
#nav li ul ul {
		margin-left: 0em;
		}
		
#nav li:hover >ul{
		display: block;
		}
		
#nav li:hover > ul ul, #nav li:hover > ul ul ul, #nav li:hover > ul ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul, #nav li.sfhover ul ul ul ul {
		left: -999em;
		}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover  ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul, #nav li li li li.sfhover ul {
		left: auto;
		}					

#footer{
		text-align: center;
		margin-top: 0px;
		color: maroon;
		}