
/* BASK web site styles for html elements using only CSS layout */


body {
	margin: 0;
	font-size: 62.5%; /* brings standard font size to 1em=10px */
	padding:0 0 0 0;
	border: 0px;
	font-family: Arial, Helvetica, sans-serif;	
/*	background: #eee;*/
  	background:#666 url('bg_body.gif') repeat 0 0;
	}


#page {
	width: 883px;
	margin: 0;
	}

#page1 {
	width: 880px;
	margin: 0;
	background:#fff;
	float: left;
	padding: 0px;
  	border:solid #444;
  	border-width:0 3px 3px 0;
	font-size: 1em;
	}

/* =Header
----------------------------------------------- */

#header {
	background: #044476 url('bg_nav.gif');
	float: left;
	height: 100px;
	width: 880px;
	}


#logo {
	float: left;
	padding: 12px 0px 12px 0px;
	width: 180px;
/*	position: fixed;*/
}

#banner {
	float: right;
	height: 100px;
	width: 700px;
	padding: 0px;
	margin: 0px;
	
}


/* =Content
----------------------------------------------- */


#content{
	
	float: left;
	width: 880px;
	margin: 0;
	background-color: white;
	background: url('bg_nav.gif') repeat-y;
}


#main {
	float: right;
	width: 640px;
	vertical-align: top;
	font-family: Arial,Helvetica,sans-serif; 
	color: black; 
	font-size: 1.2em;
	line-height: 1.8em;
	padding:20px 30px 10px 30px;
	background: white;
	}

#nav {
	float: left;
	width: 180px;
	padding: 0px;
	margin: 0;
	font-family: Arial, Helvetica,sans-serif; 
	color: white; 
	font-size: 1.3em;
/*	position: fixed;*/
	border: 0;
	padding: 0px 0px 20px 0px;
		}



#footer {
	clear: left;
	float: left;
	width:880px;
	
	}

#footer p {
	margin-top: 60px;
	color: #707070;
	font-size: 1.3em;
	font-weight: 600;
	text-align: center;
}

#footer hr {
  display:none;
	}

#footer-nav {
	float:left;
	padding: 0px;
	height:100px;
	width: 180px;
	background: url('bg_nav.gif');
		}

#footer-main {
	float: right;
	width: 700px;
	height:100px;
	padding: 0px;
	margin: 0px;
	background: white url('bg_footer.gif');
	}


/* =Main and Menu
----------------------------------------------- */


#main p {
	font-family: Arial ,Helvetica,sans-serif; 
	color: black; 
/*	font-size: 1.2em;
	line-height: 1.8em; original*/
	font-size: 1.2em;  
	line-height: 1.5em;
}

#main a {text-decoration:none;
		 font-weight: bold;}

#main a:link {color:navy;}
#main a:visited {color:navy;}
#main a:focus {color:navy;}
#main a:hover {color:#F1A629;}
#main a:active {color:#F1A629;}

a img {border:0 !important;} 

.menu {
	line-height: 1.4em;
	list-style-position: outside;
	text-align: left;
	margin: 0;
	padding: 10px 0px 10px 20px;
}



/* =General settings
----------------------------------------------- */


h1 {font-family: Arial, Helvetica,sans-serif ;
	font-size: 2em;color: navy;
	font-variant: small-caps;
	margin: 15px 0px 25px 25px;
}

h2 {font-family: Arial, Helvetica,sans-serif ;
	font-size: 1.4em;   
	margin: 15px 0px 5px 0px;
}

h3 {font-family: Arial, Helvetica,sans-serif ;
	font-size: 1.2em;   
	margin: 15px 0px 5px 0px;
}

h4 {font-family: Arial, Helvetica,sans-serif ;
	font-size: 1.2em;   
	margin: 10px 0px 0px 0px;
}

.title {margin: 0px 0px 5px 0px;
	padding: 1px 10px 1px 10px;
	background-color:#E7573B;
	background-color:#EB714D;
	color: white;
}


p {font-family:Arial, Helvetica,sans-serif; 
	color:black; font-size: 1.3em; 
	line-height:2em;
}

.emph {font-style: italic;}
.bold {font-weight: bold;}
.warning {
	color: red;
	font-weight: bold;}
.tiny {font-style: italic;
	font-size:0.8em;}


.center {text-align:center;}
.left {text-align:left;} 
.right {text-align:right;} 


.top {vertical-align:top;}
.bottom {vertical-align:bottom;}
.middle {vertical-align:middle;}

.img_left {float: left; margin-right: 20px; margin-bottom: 15px; border: 1px solid #616161;}
.img_right {float: right; margin-left: 20px; margin-bottom: 15px; border: 1px solid #616161;}
.img_center {text-align:center;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;} 
.img_center img { border: 1px solid #616161;}

#surfing .img_left, #enviro-marine .img_left 
	{border: 0;}

#surfing .img_right, #surfing-kayaks .img_right, #surfing-rules .img_right, 
#surfing-instruction .img_right, #surfing-locations .img_right, #surfing-links .img_right,#enviro-marine .img_right, #novice_patch .img_right  
	{border: 0;}



.icon {vertical-align:middle; 
	padding-right: 4px;}	

.icon_text {float: left; 
	padding-right: 10px;}	



#news {
	float: right;width:auto;
	border: 1px solid black;
	padding: 0;
	margin: 0px 10px 20px 30px;
	background-color: #eee;
}
#main #news ul {
	padding: 1px 5px 5px 5px;
	line-height: 1.3em;
	text-align:left; margin:0;
}

#main #news ul li {
	font-size: 1.1em; color: black; font-weight: bold;
	padding: 5px 5px 5px 5px;
	line-height: 1.3em;
	list-style-type:none;
	list-style-position:outside;
	text-align:left; margin:0;
}

#news a {text-decoration:none;}
#news a:link {color:navy;}
#news a:visited {color:navy;}
#news a:focus {color:navy;}
#news a:hover {color:#F1A629;}
#news a:active {color:#F1A629;}  




/* =Added recently
----------------------------------------------- */

#main dt {
	font-size: 1.1em; line-height:1.5em;
	font-weight:bold;}
	

#main dt.normal {
	font-weight:normal;}

#faq #main p {
	font-size: 1.1em; line-height:1.5em;}

#faq #main li {
	list-style-type: disc;
	font-size: 1.1em;}

#directions p {
	font-size: 1.1em; line-height:1.5em;}

#info-membership #main li {
	list-style-type: disc;
	font-size: 1.1em;}

#surfing #main li {
	list-style-type: disc;
	font-size: 1.1em;}

#surfing-kayaks #main li {
	list-style-type: disc;
	font-size: 1.1em;}

#main ul li {
	list-style-type: disc;
	font-size: 1.1em;}

#main ol li {
	list-style-type: decimal;
	font-size: 1.1em;}	

#main p.letter {
	font-family:"Comic Sans Ms",Arial,Helvetica,sans-serif; 
	font-size:1.1em;
	line-height:1.5em;
	border: 1px navy solid;
	padding: 10px 15px 10px 15px;
	margin: 0px 10px 20px 10px;
	background-color: #eee;
}



#articles-trips #main p, #articles-technical #main p, #articles-other #main p {
	font-family: Arial,Helvetica,sans-serif; 
	font-size: 1.1em;
	line-height: 1.2em;}

#articles-trips #main li, #articles-technical #main li, #articles-other #main li {
	font-family: Arial,Helvetica,sans-serif; 
	font-size: 1.1em;
	line-height: 1.3em;
	padding: 8px 0px 0px 0px;
	}

pre {
	font-family:"Comic Sans Ms", Arial,Helvetica,sans-serif; 
	font-size:1.3em;
	line-height:1.8em;}

.clear_left {
	clear:left;}

.clear_right {
	clear:right;}

.clear_both {
	clear:both;}

p.opener{
	font-weight: bold;
	}
p.opener:first-letter {
	font-size: 3em;
	color: green;
	}

#enviro-offlimits #main li, #enviro-links #main li  {
	font-family: Arial,Helvetica,sans-serif; 
	font-size: 1.1em;
	line-height: 1.3em;
	padding: 8px 0px 0px 0px;
	}
#enviro-offlimits #main h2 a , #enviro-marine #main h2 a {
	text-decoration:none;}

#enviro-offlimits #main h2 a , #enviro-marine #main h2 a:hover {
	color:black;}

#enviro-links #main li li  {
	font-size:100%;}

#info-library #main li {
	font-family: Arial,Helvetica,sans-serif; 
	font-size: 1.1em;
	line-height: 1.3em;
	padding: 8px 0px 0px 0px;
	}

#info-events table {
	table-layout: fixed;
	border-collapse:collapse;
	margin:5px 40px 30px 5px;
	}

#info-events table td{
	padding:4px 10px 4px 6px;
	border:1px solid navy;
	}
	
#info-events table td.leader{
	background-color:#e0e0e0;
	font-weight:bold;}


/*****MEMEBERS ONLY PAGE  ******/
#left_column {
	float: left;
	width: 300px;
	vertical-align: top;
	padding:0px 20px 0px 0px;
	background: white;}

#left_column p{
	font-family: Arial,Helvetica,sans-serif; 
	color: black; 
	font-size: 1.1em;
	line-height: 1.4;
	}

#right_column {
	float: right;
	width: 310px;
	vertical-align: top;
	padding:0px 0px 0px 10px;
	background: white;
	}

#right_column p{
	font-family: Arial,Helvetica,sans-serif; 
	color: black; 
	font-size: 1.1em;
	line-height: 1.4;
	}

#members h1 {margin: 0px 0px 20px 25px;
}

/**CHECK IF THIS DID SOMETHING BAD **/
#members #main ul li, #members #main ol li  {
	line-height:1.4em;}

#members p{
	font-family: Arial,Helvetica,sans-serif; 
	color: black; 
	font-size: 1.1em;
	line-height: 1.4;
	}

#members #main p.newsltr{
	margin:0px;
	word-spacing:1.3em;
	background-color:#FFE7C6;}

#members #footer p{
	font-size:1.3em;
	color: #707070;}

/*****THIS IS USED BY THE OLD OFFICERS.HTML TABLE  ******/

#members table.officers {
	table-layout: fixed;
	border-collapse:collapse;
	margin:5px 20px 20px 5px;
	width: 550px;}

#members table.officers td{
	padding:5px 15px 5px 5px;
	border:1px solid navy;
	width: 33%;}

/*******************************************/

/*****THIS IS USED BY THE NEW OFFICERS.PHP TABLE  ******/
#members table.phpofficers {
	width:640px;
	cellspacing:0; 
	margin:0 0 20px 0;}

#members table.phpofficers td {
	width:25%;}
	
table.officers_info {
	height:220px; 
	cellspacing:0; 
	border:1px solid navy;}

table.officers_info td {
	vertical-align:top; 
	text-align:center; 
	font-size: 1em; 
	line-height:1.4em;}
	
table.officers_info img {
	border-right: 2px solid; 
	border-bottom : 3px solid; 
	border-color: grey;}

/*******************************************/
	
#members table.officers-hist {
	float: left;
	table-layout: fixed;
	border-collapse:collapse;
	margin:5px 20px 20px 5px;
	width: 270px;}

#members table.officers-hist caption{
	font-weight:bold;
	font-size:1.3em;}

#members table.officers-hist td{
	padding:4px 4px 4px 4px;
	border:1px solid navy;
	width: 50%;}
	
#members table.skills-grads {
	float: left;
	table-layout: fixed;
	border-collapse:collapse;
	margin:5px 40px 30px 5px;
	width: 150px;}

#members table.skills-grads caption{
	font-weight:bold;
	font-size:1.3em;}

#members table.skills-grads td{
	padding:4px 4px 4px 4px;
	border:1px solid navy;
	width: 100%;}
	
#members table.skills-grads td.leader{
	background-color:#e0e0e0;
	font-weight:bold;}

#members table.paddles {
	table-layout: fixed;
	border-collapse:collapse;
	border:1px solid navy;
	margin:5px 20px 20px 5px;
	width: 635px;}

#members table.paddles td{
	padding:5px 15px 5px 5px;
	border:1px solid navy;
	width: auto;}
	
#members table.events {
	border-collapse:collapse;
	border:1px solid navy;
	margin:5px 20px 20px 5px;
	width: 635px;}

#members table.events td{
	padding:5px 15px 5px 5px;
	border:1px solid navy;
	width: auto;}


#clinic-forms{
	float: left;
	width: 320px;
	border: 1px solid #648DC7;
	padding: 5px;
	margin: 10px 10px 30px 30px;
	background-color: #eee;}

/* For the legend on the php calendar on mopage.php */

#main table.legend {
	line-height:1.3em; }

/*****FORMS******/

#members-help form {
	width: 550px;
	border: 3px outset #648DC7;
	padding: 5px 10px 5px 10px;
	margin: 40px 20px 50px 20px;
	background-color: #eee;
	}

#members-help input {
	margin-left:130px;
	margin-bottom: 5px;
	}

#members-help .personal label{
	position: absolute;
	font-weight:bold;
	}
/*****Event registration FORMS******/
#event-registration form{
	width: 550px;
	border: 3px outset #648DC7;
	padding: 5px 10px 5px 10px;
	margin: 40px 20px 50px 20px;
	background-color: #eee;
	}

#event-registration input {
	margin-left:130px;
	margin-bottom: 7px;
	}

#event-registration label{
	position: absolute;
	font-weight:bold;
	}

#event-registration select{
	margin-left:130px;
	margin-bottom: 7px;
	}	

#event-registration textarea {
	margin-left:130px;
	margin-bottom: 7px;
	}	
		
#event-registration input+input{
	margin-left:20px;
	margin-bottom: 7px;
	}		

#event-registration input+input+input{
	margin-left:20px;
	margin-bottom: 7px;
	}			
.legend table {
	line-height:1.5em;}