/*
CSS for Mode Contractors site
*/
body {
  padding: 0;
  margin: 0;
  background: #cccccc url(images/graybrck.jpg) ;
  width: 100%;
  display: table;
}

#wrapper {
	height:900px;
	width: 900px;
	margin-right: auto;
	margin-left: auto;
	border: thin ridge #6600FF;
	background:#ffffff
}
#header {
	height: 145px;
	width: 100%;
}

#body {
	font-family:"Century Gothic";
	padding: 15px;
	float: none;
	background-position: center;
}
#menu {
	float: left;
	width: 200px;
	height: 200px;
	border: thin solid #e6d6ff;
	background-color: #efe6ff;
}
#menu a {
		text-decoration:none
				}
h1{padding: 10px; font-family:"Century Gothic"; color:#4a08ad}

h2{padding: 10px; font-family:"Century Gothic"; color:#4a08ad}

h3{padding: 10px; font-family:"Century Gothic"; color:#4a08ad}

p{padding: 15px; font-family:"Century Gothic"; color:#4a08ad}

li{font-family:"Century Gothic"; color:#4a08ad; list-style-type: none;}

#navigation {
	height: 100%;
	width: 810px;}
a:link {color: #4a08ad ;}

a:visited {color: #9966FF}

a:hover {text-decoration: none;
			color: white;
			background-color: #b565e9;
			}
a:active {color: #AAAAFF;
			background-color: #380474;
			}
#content {
height:665px;
	width: 620px;
	float: left;
}

#footer {
	clear: both;
	height: 100px;
	width: 100%;
}			
			
legend {
	font-family: "Century Gothic";
	font-weight:bold;
	font-size: 16px;
	color: #3300CC;
}
#quote label {
	font-family: "Century Gothic";
	color: #0000CC;
	width: 90px;
	float: left;
	margin-bottom: 20px;
	}

.formelement {
	font-family: "Century Gothic";
	font-size: 12px;
	background-color: #CCCCFF;
	margin-bottom: 20px;
}
#text {
	font-family: "Century Gothic";
	color: #4a08ad;
	float: right;
	width: 420px;
	height: 400px;
}
.image {padding: 15px;
}
.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
	position: fixed;
	background-color: lightyellow;
	padding: 5px;
	border: 1px dashed gray;
	visibility: hidden;
	color: black;
	text-decoration: none;
	left: 500px;
	}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */

}