@charset "utf-8";
/* CSS Document */

/***
* body: Set the background color for the entire website.
***/
body {
	background-color:#0088ee;
}

/***
* p: Set the font, style, size, text alignment, and color of all paragraphs on the website.
***/
p {
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	font-size:12pt;
	text-align:left;
	color:#FFFFFF;
}

/***
* head1: Not used in index.html. 01/10/22
***/
head1 {
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	font-weight:bold;
	font-size:16pt;
	text-align:left;
	color:#FFFFFF;
	height:24pt;
}

/***
* head2: Not used in index.html. 01/10/22
***/
head2 {
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	font-weight:bold;
	font-size:12pt;
	text-align:left;
	color:#FFFFFF;
	height:20pt;
}

/***
* head3: Not used in index.html. 01/10/22
*/
head3 {
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	font-weight:bold;
	font-size: 12pt;
	text-align:left;
	color:#FFFFFF;
	height:16pt;
}

/***
* #container: Selects the element with the id="container", sets width, position, padding, margin.Used
* in index.html to define parameters associated with div tags.
*/
#container {
	width:720px;
	position:relative;
	padding:0% 0;
	margin:0 auto;
}

/***
* #header: Selects the element with the id="header", sets float, position, width, height. Used in index.html
* with div tags to define parameters of header graphic divisions. 
*/
#header {
	float: left;
	position: relative;
	width: 720px;
	height:148px;
}

/***
* #photoheader: 
***/
#photoheader {
	height: 24px;
	width: 720px;
	font-size: 18pt;
	text-align: center;
	border: 1px, white;
}

/***
* #menu: Selects the element with the id="menu", sets position, width, height, float. Used in index.html with 
* div tag to define the top level site navigation menu.
***/
#menu {
	position:relative;
	width:720px;
	height:36px;
	float: left;
}

/***
* #mainNavList: Selects the element with the id="mainNavList", sets width, height, display, float. Used in index.html
* with nav tag to define the main navigation menu of the website.
***/
#mainNavList {
	width: 100%;
	height: 100%;
	display: inline-table;
	float: left;
}

/***
* .dropDownList: Selects elements with the class="dropDownList", sets all display parameters. Used in index.html with ul tag
* to define unordered lists.
***/
	#mainNavList .dropDownList {
		display: none;
		position: absolute;
		top: 35px;            /* Offsets list down from main anchor */
		left: 0px;
		width: 100%;
		list-style-type: none;
		margin: 0;
		border: solid 1px;
		z-index: 5;
		padding: 0px 0px 4px 0px;
	}

/***
* li: Define the display parameters for each li list element in dropdown lists on the website home page. 
***/
#mainNavList .dropDownList li {
	display:inline;
	margin: 0;
	font-family:Arial, Helvetica, sans-serif; 
}

/***
* a: Define the display parameters for each a anchor in dropdown lists on the website home page. 
*/
	#mainNavList .dropDownList li a {
		color: #000;
		height: 100%; /* 18px; 07/13/21 */
		padding: 4px 0px 4px 0px; /* 07/13/21 4px 0px 4 px 0px*/
		font-size: 16px;
		border: solid 1px #99FFFF; /* 99FFFF */
		background-color: #99FFFF; 
		width: 120px;
	}

/***
* a: hover: Defines the color change to a list element when the cursor hovers over it.
***/
#mainNavList .dropDownList li a:hover {
	border:solid 1px #3350CC;
}

#mainListMember {
	list-style-type: none;
	margin: 0;
	float: left;
	background-color: #99FFFF; /* #99FFFF #0094ff*/
	padding: 0;
}

#mainListMember li {
	font-family:Arial, Helvetica, sans-serif;
	font-size:32px;
	color:#EEE; 
	display:inline; 
	float:left;
	position:relative;
}

#mainListMember li a {
	float:left;
	color:#000;
	text-align:center;
	font-size:18px;
	height:36px;    /* 28px 07/13/21 */
	padding-top:4px; /* 16px 07/13/21 */
	/* padding-bottom: 4px; 07/13/21 */
	line-height:16px;
	width:120px;
	text-decoration:none;
}

#mainListMember li a:hover {
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#FFF;
	text-decoration:none;
	background:#3350CC;
}

#mainListMember li:hover .dropDownList {
	display:block;
	background:#99FFFF;
}

	#mainListMember li:hover .noDropDown {
		display: block;
		background: #0088CC;
	}

/***
* #mainBody: Selects the items with the id="mainBody", sets all display parameters.
***/
#mainBody {
	width:720px;
	height: 600px;
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	font-size:12pt;
	text-align:left;
	float: left;
	color:#FFFFFF;
}

#overflowMain {
	position:relative;
	width:720px;
	height:500px;
	overflow:auto;
	float: left;
}

#noOverflowMain {
	position:relative;
	width:720px;
	height:500px;
	float: left;
}

#footerLeft {
	float: left;
	position: relative;
	width: 260px;
	height: 120px;
	background-color: #0088ee; 
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	font-size: 12pt;
	font-weight: bold;
	text-align: left;
	float: left;
	color: #FFFFFF;
}

#footerMiddle {
	float:left;
	position:relative;
	width:240px;
	height:120px; 
	background-color:#0088ee;
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	font-size:12pt;
	font-weight:bold;
	text-align:left;
	float: left;
	color:#FFFFFF;
}

#footerRight {
	float:left;
	position:relative;
	width:220px;
	height:120px;
	background-color:#0088ee;
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	font-size:12pt;
	font-weight:bold;
	text-align:right;
	float: left;
	color:#FFFFFF;
}

/***
Declarations for formatting buttons
***/
#buttonC {
	width: 100px;
	margin-left: auto;
	margin-right: auto;
}
/***
* Declarations for formatting home page biographical data about E-Board members
***/
#dataBox {
	float: left;
	width: 540px;
	height: 250px;
}

#photoBox {
	float:left;
	width:180px;
	height:250px;
}

#bioBox {
	float:left;
	width:700px;
	height:150px;
}

table {
	width: 700px;
}

/****
* Styles for displaying Event Calendar data elements
***/
#td1 {
	width: 80px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14pt;
	font-weight:bold;
	text-align:left;
	color:#FFFFFF;
}

#td2 {
	width: 100px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14pt;
	font-weight:bold;
	text-align:left;
	color:#FFFFFF;
}

#td3 {
	width: 100px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14pt;
	font-weight:bold;
	text-align:left;
	color:#FFFFFF;
}

#td4 {
	width: 220px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14pt;
	font-weight:bold;
	text-align:left;
	color:#FFFFFF;
}

#td5 {
	width: 200px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14pt;
	font-weight:bold;
	text-align:left;
	color:#FFFFFF;
}

/***
* Styles for displaying Dive Calendar data elements
***/
#td6_0 {
	width: 720px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14pt;
	font-weight: bold;
	text-align: center;
	vertical-align: top;
	color: #0088ee;
	background-color: #FFFFFF;
	border: 10px, solid, black;
}

#td6 {
	width: 140px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:bold;
	text-align:left;
	vertical-align:top;
	text-decoration:underline;
	color:#0088ee;
	background-color:#FFFFFF;
}

#td7 {
	width: 200px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:bold;
	text-align:left;
	vertical-align:top;
	text-decoration:underline;
	color:#0088ee;
	background-color:#FFFFFF;
}

#td8 {
	width: 30px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:bold;
	text-align:left;
	vertical-align:top;
	text-decoration:underline;
	color:#0088ee;
	background-color:#FFFFFF;
}

#td9 {
	width: 100px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:bold;
	text-align:left;
	vertical-align:top;
	text-decoration:underline;
	color:#0088ee;
	background-color:#FFFFFF;
}

#td10 {
	width: 180px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:bold;
	text-align:left;
	vertical-align:top;
	text-decoration:underline;
	color:#0088ee;
	background-color:#FFFFFF;
}

#td11 {
	width: 30px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:bold;
	text-align:left;
	vertical-align:top;
	text-decoration:underline;
	color:#0088ee;
	background-color:#FFFFFF;
}

#td6a {
	width: 200px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:normal;
	text-align:center;
	vertical-align:top;
	color:#FFFFFF;
}

#td7a {
	width: 200px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:normal;
	text-align:left;
	vertical-align:top;
	color:#FFFFFF;
}

#td8a {
	width: 30px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:normal;
	text-align:left;
	vertical-align:top;
	color:#FFFFFF;
}

#td9a {
	width: 100px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:normal;
	text-align:left;
	vertical-align:top;
	color:#FFFFFF;
}

#td10a {
	width: 180px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:normal;
	text-align:left;
	vertical-align:top;
	color:#FFFFFF;
}

#td11a {
	width: 30px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight:normal;
	text-align:center;
	vertical-align:top;
	color:#FFFFFF;
}