@import "base.css";

.column-left {
	float: left;
	width: 423px;
	margin: 0px 13px 10px 8px;
	padding: 0px;
	outline: 0px dotted #00f;
	display: inline;
}

.column-right {
	float: left;
	width: 509px;
	padding: 0px;
	margin: 180px 7px 10px 0px;
	outline: 0px dotted #f00;
	display: inline;
}

h3 {
	font: 10px Arial, Helvetica, sans-serif;
	color: #5b5836;
	border-top: 1px solid #dfdbd6;
	text-transform: uppercase;
	padding: 5px;
	letter-spacing: 5px;
	margin: 20px 0px 10px 0px;
}

h4 {
	font: 24px "Times New Roman", Times, serif;
	color: #9c745b;
	margin: 0px 0px 10px 0px;
}

p.home-description {
	font: 14px Arial, Helvetica, sans-serif;
	color: #000;
	margin: 0px 0px 30px 0px;
}



#frames {
	width: 960px;
	outline:0px dashed #f00;
	height: 600px;
	padding: 0;
	margin:  0;
	overflow: hidden;
	position: relative;
}

#frame_showcase {
	width: 960px;
	height: 600px;
	outline: 0px dashed #f00;
	background-color: #fff;
}

#frame_sustainability {
	width: 960px;
	height: 600px;
	outline: 0px dashed #f00;
	background-color: #fff;
}

#frame_upcoming-events {
	width: 960px;
	height: 600px;
	outline: 0px dashed #f00;
	background-color: #fff;
}

p.callout {
	margin: 38px 0px 0px 445px;
	position:absolute;
	width: 509px;
	color:#5b5836;
	z-index: 11;
}

#controls {
	position: absolute;
	left: 700px;
	top: 200px;
}

#forward {
	position: absolute;
	left: 920px;
	top: 180px;
	background-image:url(../imgs/controls_bg.gif);
	background-repeat: no-repeat;
	background-position: -17px 0px;
	height: 0px;
	width: 17px;
	padding-top: 17px;
	overflow: hidden;
	z-index: 10;
	outline: 0px;
}

a#pause {
	position: absolute;
	left: 900px;
	top: 180px;
	background-image:url(../imgs/controls_bg.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	height:0px;
	width: 17px;
	padding-top: 17px;
	overflow: hidden;
	z-index:10;
	outline: 0px;
}

a#pause:hover {
	background-position: 0px -17px;
}

a#forward:hover {
	background-position: -17px -17px;
}