/*
OPEF style sheet for Hatch PTO Website
Copyright 2008 Huan Cassioppi Tran. All Rights Reserved.
February 10, 2008
*/
sup {
	text-transform:lowercase;
}
h1, h2, p, ul, ol {
	font-family:verdana, helvetica, cursive;
	font-size:small;
	color:#000;
}
ul {
	margin:0 1em;
	padding:0 2em;
}
h1, h2 {
	font-weight:bold;
	text-align:left;
	padding:0;
}
h1 {
	text-transform:uppercase;
	margin:0;
}
h2 {
	margin:1em 0 0 1em;
}
p {
	font-weight:normal;
	text-align:justify;
	margin:0 1em 1em;
}
span.fl {
  text-transform:uppercase;
  font-size:200%;
	color: #009900;
  line-height:1em;
  float:left;
  margin:0 5px 0 0;
  padding:0;
  overflow:hidden;
}
span.fw {
  text-transform:uppercase;
  font-size:100%;
}
.small {
	font-size:x-small;
  margin: 0.5em 0 0.5em 1em;
}
/* LAYOUT */
img.scaled {
	width:100%;
}
div {
	margin:0;
	padding:0;
}
#menu {
  position:absolute; 
  display:block; 
  top:1em;
  left:1em; 
  margin:0;
  padding:0;
  width:18%;
}

#sponlogo {margin-top:1em; padding:0; position:relative; float:left; width:47%;}
#sponlogo a.p1, #sponlogo a.p1:visited {display:block; text-decoration:none; top:0; left:0; border:0; margin-bottom:2px;}
#sponlogo img {border:none; margin-bottom:1px;}
#sponlogo a:hover {text-decoration:none; background-color:#ccc; color:#000;}
#sponlogo a .large {display:block; position:absolute; top:0; left:0; width:0; height:0;}
#sponlogo a:hover .large {display:block; position:absolute; left:12em; width:auto; height:auto; border:10px solid #fff;}

#sponlogor {margin-top:1em; padding:0; position:relative; float:right; width:47%;}
#sponlogor a.p1, #sponlogor a.p1:visited {display:block; text-decoration:none; top:0; left:0; border:0; margin-bottom:2px;}
#sponlogor img {border:none; margin-bottom:1px;}
#sponlogor a:hover {text-decoration:none; background-color:#ccc; color:#000;}
#sponlogor a .large {display:block; position:absolute; top:0; left:0; width:0; height:0;}
#sponlogor a:hover .large {display:block; position:absolute; left:6em; width:auto; height:auto; border:10px solid #fff;}

.pinbg {
  padding:0;
  margin:0;
  background:#ccc;
  border:2px solid #eee;
  position:relative;
  top:5px;
  left:5px;
}
.pinbg1 {
  padding:0;
  margin:0;
  background:#999;
  border:2px solid #aaa;
  position:relative;
  top:-5px;
  left:-5px;
}
.pin {
  padding:0;
  margin:0;
  background:#fff;
  border-top:1px solid #ccc;
  border-left:1px solid #ccc;
  border-right:1px solid #808080;
  border-bottom:1px solid #808080;
  position:relative;
  top:-5px;
  left:-5px;
}
.pin p {
	text-align:center;
}
.content {
  margin:0;
  padding:0;
  float:right;
  width:80%;
}
.mastheadfeature {
  margin-left:1em;
	width:20%;
  float:right;
}
.masthead {
  margin:0;
  width:60%;
  float:right; 
}
.navbar {
  float:right;
  width:100%;
}
.navbuttons {
  float:right;
  width:100%;
}
.navtext {
  text-align:center;
  text-transform:uppercase;
	margin:0;
	padding:0;
}
.footer {
  margin:1em 0;
  float:right;
  width:100%;
}
/* UNIQUE ELEMENTS */
.col {
  width:35%;
  float:right;
  border:1px solid #ccc;
  margin-left:1em;
	margin-bottom:2px;
}
.alert {
  border:2px dotted #009900;
  padding:2px;
	margin:1em 0;
}
/* COLOR SCHEME */
.comp {
	color:#fff;
	background:#0000ff;
	text-align:center;
	margin:0 0 1em;
}
.highlight1 {
	background:#ccccff;
  text-align:center;
  margin:0 0 1em;
}
a:link {
  color:#009900;
  text-decoration:none;
}
a:visited {
  color:#009900;
  text-decoration:none;
}
a:hover {
  color:#0000ff;
  text-decoration:underline;
}
.navbar {
  background-color:#009900;
}
.navtext {
  color:#009900;
}
.navbuttons a:link {
  color:#000;
  text-decoration:none;
}
.navbuttons a:visited {
  color:#000;
  text-decoration:none;
}
.navbuttons a:hover {
  color:#009900;
  text-decoration:none;
}
.footer {
  border-top:1px solid #ccccff;
}