@charset "utf-8";
/* Theme Created for The Berkeley Project */
/* By Gordon Mei - gordeon@gmail.com*/
/* July 2006 and August 23, 2006 */
/* Stripes of Spirit */

/* Last Update: February 27, 2008 */

body{
	background: #eee;
	margin: 0;
	padding: 0;
	text-align:center;
	font-family: georgia, "lucida grande", verdana, arial, helvetica, sans-serif;
	color: #38230e;
	border-top: 8px solid #ffcc00; 
	border-bottom: 8px solid #ffcc00;
}

a:link, a:visited {
	color: #268ccd;
	text-decoration: none;
	}
a:hover {
	color: #cc9933;
	text-decoration: underline;
	}

img {border: 0;}

/* ------------------------------------------------------------
	layout and content divs
------------------------------------------------------------ */

#mothercontainer{
	width:100%;
	border-top:1px solid #ccc;
	border-bottom:1px solid #aaa;
}

#container{
	background-color: #fff;
	width: 780px;
	margin: auto;
	padding:0;
	text-align:left;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	overflow:hidden;
}

#header{
	width: 100%;
	height: 94px;
	padding: 0px;
	background: #fff url(headerbkgd.png) no-repeat top left;
}

#blockquote{
	clear:both;
	padding:9px 30px 9px 30px;
	font: normal 8pt georgia, "lucida grande", verdana, "lucida sans",arial, helvetica, sans-serif;
}

#contentsignup{
	clear:both;
	padding:9px 3px 9px 3px;
	font: normal 10pt georgia, "lucida grande", verdana, "lucida sans",arial, helvetica, sans-serif;
	line-height: 1.4em;
}

#content{
	clear:both;
	padding:9px 90px 30px 90px;
	font: normal 9pt georgia, "lucida grande", verdana, "lucida sans",arial, helvetica, sans-serif;
	line-height: 1.4em;
}

#content a{
	font: normal 9pt georgia, "lucida grande", verdana, "lucida sans",arial, helvetica, sans-serif;
	text-decoration: underline;
}

#content a:hover{
	font: normal 9pt georgia, "lucida grande", verdana, "lucida sans",arial, helvetica, sans-serif;
	text-decoration: none;
}

#content img{
	padding:2px;
	border:1px solid #ccc;
}

#footer{
	clear:both;
	width: 100%;
	background-color:#efefef;
	padding: 30px 0 9px 0;
	text-align: center;
	border-top: 1px solid #aaa;
	font: normal 8pt georgia, "lucida grande", verdana, "lucida sans",arial, helvetica, sans-serif;
}

#footer a:hover{
	text-decoration: none;
}

/* ------------------------------------------------------------
	signup columns for two-panel layout (ex. fall 2006)
------------------------------------------------------------ */

.panellefttwin {float:left; background-color:#f8f8fb; border:1px solid #cccccc; height:220px; width:280px; padding:5px 9px 0 9px;}

.panelrighttwin {float:right; background-color:#f8f8fb; border:1px solid #cccccc; height:220px; width:280px; padding:5px 8px 0 8px; margin-left: 2px;}

.panelleftbuttontwin {clear:both; float:left; text-align:center; height:55px; width:50%;}
.panelleftbuttontwin img {border:0; color:#fff;}
.panelleftbuttontwin a {border:0; color:#fff;}

.panelrightbuttontwin {float:right; text-align:center; height:55px; width:50%;}
.panelrightbuttontwin img {border:0; color:#fff;}
.panelrightbuttontwin a {border:0; color:#fff;}

/* ------------------------------------------------------------
	signup columns for three-panel layout (ex. spring 2007)
------------------------------------------------------------ */

.panelleft {float:left; background-color:#f8f8fb; border:1px solid #cccccc; height:380px; width:177px; padding:5px 9px 0 9px; margin:0;}

.panelright {float:right; background-color:#f8f8fb; border:1px solid #cccccc; height:380px; width:177px; padding:5px 9px 0 9px; margin:0;}

.panelcenter {margin-left:auto; margin-right:auto; background-color:#f8f8fb; border:1px solid #cccccc; height:380px; width:177px; padding:5px 9px 0 9px;}

.panelleftbuttons {float:left; background-color:#fff; border:0px solid #cccccc; height:auto; width:177px; padding:5px 9px 0 9px;}

.panelrightbuttons {float:right; background-color:#fff; border:0px solid #cccccc; height:auto; width:177px; padding:5px 9px 0 9px;}

.panelcenterbuttons {margin-left:auto; margin-right:auto; background-color:#fff; border:0px solid #cccccc; height:auto; width:177px; padding:5px 9px 0 9px;}

/* ------------------------------------------------------------
	navigation columns
------------------------------------------------------------ */

#center1{
	margin: auto 4px;
}

#right1, #right2, #right3{
	float: right;
	width: 127px;
}

#left1, #left2, #left3{
	float:left;
	width: 127px;
}

#left1, #left3, #right2{
	background-color: #da9708;
}

#left2, #right3, #right1{
	background-color: #5ca0bb;
}

#center2, #center3{
	margin: auto 129px;
}

.oj {background:#d7990c url(bkgdgolden.gif) repeat-x; height:122px;}
.water {background:#5ca0bb url(bkgdseamist.gif) repeat-x; height:122px;}

div.ojtext {position:absolute; margin-bottom:0; margin-top:100px; margin-left:auto; margin-right:auto; width:127px; text-align:center;}

div.ojtext a:link {color:#efcd41; text-decoration:none; font:bold 10pt georgia, "lucida grande", verdana, "lucida sans", arial, helvetica, sans-serif;}

div.ojtext a:visited {color:#efcd41; text-decoration:none; font:bold 10pt georgia, "lucida grande", verdana, "lucida sans", arial, helvetica, sans-serif;}

div.ojtext a:hover {color:#fff; text-decoration:underline; font:bold 10pt georgia, "lucida grande", verdana, "lucida sans", arial, helvetica, sans-serif;}

div.footer a:link, a:visited, {
	color: #268ccd;
	text-decoration: underline;
	font:normal 8pt georgia, "lucida grande", verdana, "lucida sans", arial, helvetica, sans-serif;}
}

/* ------------------------------------------------------------
	headers, tables, and formatting
------------------------------------------------------------ */

hr {background-color:#eee; color:#eee; border:0; margin:0; padding:0; height:1px;}

.hrule {background-color:#eee; color:#eee; border:0; margin:7px 0 7px 0; padding:0; height:1px;}

h1 {font-family: "century gothic", "segoe ui", futura, "helvetica neue", geneva, tahoma, sans-serif; 
	font-size:18pt; 
	letter-spacing: -1px; 
	color:#999999; 
	margin: 0 0 4px 0;}

.h1link {font-family: "century gothic", "segoe ui", futura, "helvetica neue", geneva, tahoma, sans-serif; 
	font-size:18pt; 
	letter-spacing: -1px; 
	font-weight:bold; 
	margin: 0 0 4px 0;}

h2 {font-family: "century gothic", "segoe ui", futura, "helvetica neue", geneva, tahoma, sans-serif; 
	font-size:13pt; 
	letter-spacing: -1px; 
	color:#999999; 
	margin: 0 0 4px 0;}

.h2link {font-family: "century gothic", "segoe ui", futura, "helvetica neue", geneva, tahoma, sans-serif; 
	font-size:13pt; 
	letter-spacing: -1px; 
	font-weight:bold; 
	margin: 0 0 4px 0;}

/* h2link is a temporary class until I figure out why links within h2 don't inherit the parent formatting */

h3 {font-family: "century gothic", "segoe ui", futura, "helvetica neue", geneva, tahoma, sans-serif; 
	font-size:10pt; 
	letter-spacing: 1px; 
	color:#999999; 
	padding:0 0 2px 0; 
	margin: 0; 
	text-transform: uppercase;}

h4 {text-transform: uppercase; font-size:10pt;}
h5 {text-transform: uppercase; font-size:9pt; letter-spacing:1px; color:#777777;}
h6 {text-transform: uppercase; font-size:9pt; letter-spacing:1px; margin:0; padding:0 0 2px 0; color:#555555;}

.tableheader{text-transform: uppercase; font-size:8pt; letter-spacing:1px; text-decoration:underline;}

sup {padding:0; margin:0; color:#ff6666;}

pre {font-family: monaco, consolas, courier new;}

blockquote, pre {padding: 0.25em 40px;}
blockquote {
	font: italic 1em Georgia, Times New Roman, serif;
	background: url(quotemarkleft.png) 10px 0.75em no-repeat;
	margin: 0;}

#contactstable th {
	text-align: left;
	padding: 6px 6px 6px 12px;
	background-color: transparent;
	border: 0;
}

#contactstable td {
	padding: 6px 20px 6px 12px;
	background-color: transparent;
	border: 0;
	text-align: left;
}

/* Added by James Lin */

#eventtable th {
	padding: 3px 35px 3px 30px;
}

#eventtable td {
	padding: 3px 35px 3px 30px;
}

#groupform {width:597px;}

#groupform td {
 	padding:0;
	font-size:8pt;
	width:90px;
	text-align:center;
}

/* End of James' addition */

.formtextfieldnarrow {width:90px;}
.formselectnarrow {width:65px;}

#calendar table {
 	padding:0;
	margin:0;
	border: 1px dashed #ccc;
	background-color:#eeeeee;
	font-family: "century gothic", verdana, georgia;
	font-size:13pt;
	letter-spacing: -1px;
	color:#999999;
	text-align:center;
}

#calendar td {
	margin:0;
	border: 1px solid #ccc;
	width:74px;
	text-align:center;
	color:#111111;
}

#calendar th {
 	padding:9px 5px 9px 5px;
	font-size:15pt;
}

.calendarday {
 	padding:1px;
	font-size:10pt;
}

.calendayofweek {
 	padding:1px;
	font-size:10pt;
}

.calensquare{
 	padding:25px 5px 25px 5px;
	font-size:10pt;
	height: 50px;
}

/* Calendar Blue */

.calendeventblue {
 	padding:2px;
	font-size:10pt;
	background:#7bb8c7; 
	color:#fff;
}

.calensqeventblue {
 	padding:25px 5px 25px 5px;
	font-size:10pt;
	height: 50px;
	background:#c6dad6; 
	color:#245c6a;
}

/* Calendar Gold */

.calendeventgold {
 	padding:2px;
	font-size:10pt;
	background:#d1b85b; 
	color:#fff;
}

.calensqeventgold {
 	padding:25px 5px 25px 5px;
	font-size:10pt;
	height: 50px;
	background:#e3dab3; 
	color:#7b630f;
}

/* Calendar Green */

.calendeventgreen {
 	padding:2px;
	font-size:10pt;
	background:#98bd72; 
	color:#fff;
}

.calensqeventgreen {
 	padding:25px 5px 25px 5px;
	font-size:10pt;
	height: 50px;
	background:#cfdcba; 
	color:#42591d;
}

/* Calendar Deadline Gray */

.calendeadline{
 	padding:2px;
	font-size:10pt;
	background-color: #dbdbc1;
}

.calensqdeadline{
 	padding:25px 5px 25px 5px;
	font-size:10pt;
	height: 50px;
	background-color: #dbdbcb;
}

#siteslist{
	text-align:left;
}

#siteslist table{
 	padding:0;
	margin:0;
	border: 1px solid #ccc;
	font-family: georgia, serif;
	font-size:9pt;
	color:#999;
	text-align:center;
}

#sitelist tr, td, th {
	margin:0;
	border: 1px solid #ccc;
	text-align:center;
	color: #111111;
	background-color: #eee;
}

.siteheaderblue {background:#7bb8c7; color:#fff;}
.sitesubheaderblue {background:#c6dad6; color:#245c6a;}

.siteheadergold {background:#d1b85b; color:#fff;}
.sitesubheadergold {background:#e3dab3; color:#7b630f;}

.siteheadergreen {background:#98bd72; color:#fff;}
.sitesubheadergreen {background:#cfdcba; color:#42591d;}

.sitedescrip {text-align:left;}

.warningmessage {clear:both; border:1px dashed #ccc; width:100%; padding:5px;}

#servicelist tr, td, th {
	padding:2px 5px 2px 5px;
	text-align: left;
}

.searchdiv {margin-left:auto; margin-right:auto; text-align:center; width:100%; padding-top:25px; padding-bottom:3px;}

/* login pages */

.logindiv {margin-left:auto; margin-right:auto; text-align:center; width:100%; padding-top:25px; padding-bottom:3px;}

.loginlabel {text-align:right; border:0; background-color:#fff}
.loginfield {text-align:left; border:0; background-color:#fff}
.loginbutton {text-align:right; float:right; border:0; background-color:#fff}

/* top login links bar */

.toploginbar {position:absolute; top:0; right:20px; width:auto; border:1px solid #ccc; height:auto; font:normal 8pt georgia,serif; background:#fff; padding:2px;}

/* toggle tabs */

#tabnav {border-bottom:1px solid #fff; margin:0; padding-bottom:0px; padding-left:10px; margin-bottom:15px;}
#tabnav ul, #tabnav li {display:inline; list-style-type:none; margin:0; padding:0;}	
#tabnav a {background:#e8ebf0; border:1px solid #ccc; border-bottom:1px solid #e8ebf0; color:#666; float:left; font-size:9pt; margin-right:8px; padding:2px 10px 2px 10px;}
#tabnav span {float:left; font-size:12px; margin-right:8px; padding:2px 10px 2px 10px;}
#tabnav .active a {background:#fff; border-bottom:1px solid #fff;}
#tabnav a:hover {color:#111;}
#tabsubnav {border-bottom:1px solid #ccc; margin:0; padding-bottom:32px; padding-left:15px; margin-bottom:15px;}
#tabsubnav ul, #tabsubnav li{display:inline; list-style-type:none; margin:0; padding:0;}	
#tabsubnav a,#tabsubnav span {color:#666; float:left; font-size:9pt; margin-top:7px; margin-right:8px; padding:2px 5px 3px 5px;}
#tabsubnav .active a {background:#eef8fe;}
#tabsubnav a:hover {background:#eef8fe;}

.welcome {
	margin: 0 10px 0 0;
	padding: 10px 0 10px 0;
	border-top:1px solid #ccc;
	clear:both;
	}
.welcome p {
	margin: 0 0 10px 0;
	}
.welcome ul {
	margin: 0;
	padding: 0 0 10px 20px;
	}
.welcome ul li {
	margin: 5px 0 0 5px;
	padding: 0;
	}
	
small {
	color:#aaa;
	font-style: italic;
	}

/* ------------------------------------------------------------
	form elements
------------------------------------------------------------ */

form {padding:0; margin:0;}

input {font-size:10pt; font-family:georgia,lucida grande,lucida sans,sans-serif; border-top:2px solid #aaccff; border-left:1px solid #aaccff; border-right:1px solid #aaccff; border-bottom:1px solid #aaccff; color:#38230e;}


input[type="submit"]:focus {cursor:pointer; border-color:#99cc99;}
input[type="submit"]:active {background-color:#eee;}
input[type="submit"][disabled] {border-color:#ccc; color:#333; background-color:#eee;}

input[type="reset"]:focus {cursor:pointer; border-color:#d06060;}
input[type="reset"]:active {background-color:#eee}
input[type="reset"][disabled] {border-color:#ccc; color:#333; background-color:#eee}

input[type="submit"]:hover {background-color:#f0fde2; cursor:pointer; border-color:#eeeeee;}
input[type="reset"]:hover {background-color:#ffcccc; cursor:pointer; border-color:#eeeeee;}

input[type="text"]:hover, input[type="password"]:hover, textarea:hover, select:hover {background-color:#f3eec8}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus {background-color:#efefef}

textarea {font-size:10pt; font-family:georgia,"lucida grande","lucida sans",sans-serif; border-top:2px solid #aaccff; border-left:1px solid #aaccff; border-right:1px solid #aaccff; border-bottom:1px solid #aaccff; color:#38230e;}

select {font-size:9pt; font-family:georgia,"lucida grande","lucida sans",sans-serif; height:auto; color:#38230e;}

.buttonsubmit {background:#f0fde2; color:#000000; letter-spacing:1px; font-size:12pt; font-family:georgia,"lucida grande","lucida sans",sans-serif; text-decoration:none; border:3px double #d5deb1; cursor:pointer; padding:3px; height:auto; width:auto;}

.buttonreset {background:#ffcccc; color:#000000; letter-spacing:1px; font-size:12pt; font-family:georgia,"lucida grande","lucida sans",sans-serif; text-decoration:none; border:3px double #ffaaaa; cursor:pointer; padding:3px; height:auto; width:auto;}

.formcheckbox {border:0px;}
.formtextfield {width:290px;}
.formtextarea {width:290px;}
.formselect {width:170px;}

.requiredfield {color:#b30000;}