/********************************************************************
* Author:   Andrew Connick
* Date:     09/08/06
********************************************************************/

/* Page style ******************************************************/

* { 
	margin: 0;
	padding: 0;
}

body { background-color: #F8F8FF; }

body, table, input, textarea, option, select { 
	font-size: 11px; 
	font-family: verdana, sans-serif;
	color: #404040;
}

/* Page layout 	****************************************************/

#wrapper { 
	width: 1000px; 
	margin: 0 auto 10px auto;
	padding-bottom: 50px;
	background-color: white;
	min-height: 900px; /* improve in-loading */
	border: 1px solid #E0E0E0;
}

#header {
	height: 110px;
	position: relative;
	background-image: url("images/headerbg.png");
	background-repeat: repeat-x;
}

#menu {
	background-color: #D8D8E0;
	height: 27px;
	position: relative;
}

#sideNav {
	float: left;
	margin: 15px 0 0 10px;
	width: 190px;
	padding-right: 10px;
	border-right: 2px solid #D0D0D0;
}
* html #sideNav { margin-left: 5px }

#content {
	float: left;
	width: 760px;
	min-height: 400px;
	margin: 5px 0 0 10px;
}

#footer {
	clear: both;
	background-color: #505060;
	margin-top: 10px;
	padding: 10px 0;
}

#leftContent {
	clear: both;
	float: left;
	width: 62%;
	margin-top: 10px;
}

#rightContent {
	float: right;
	margin: 10px 0;
	width: 35%;
	background-color: #F0F0F0;
	border: 1px solid #E8E8E8;
	padding: 5px;
}

#popup {
	background-color: white;
	background-image: none;
	padding: 20px;
}

#footerToolbar {
	position: fixed;
	bottom: 0;
	right: 0;
	height: 27px;
	background-color: #F0F0F0;
	border-top: 1px solid #909090;
	border-left: 1px solid #909090;
	float: right; 			/* for IE6 and ipad*/
}

/* Element Styles **************************************************/

h1, h2 {
	font-weight: bold;
	font-family: "Times New Roman", serif;
	color: #606040;
}

h1 { font-size: 20px; }
h2 { font-size: 16px; }
h3 { font-size: 11px; }

a { text-decoration: none; color: #0060A0; /* was #5050A0 #3030F0 */ }
a:hover { text-decoration: underline; }

img { border-width: 0; }

input[type='radio'] { margin-left: 5px;  } 

textarea { width: 600px; } /* prevent overflow on large text size */

textarea, select, input[type='text'], input[type='password']  { border: solid 1px #B0B0B0; }

table { font-size: 100%; } /* fix IE quirks mode (Google cache) */

td { padding: 2px 2px 2px 0; }
th { padding: 2px 2px 2px 0; }

form td { padding-left: 5px; }

/* General styles **************************************************/

.left { float: left; }
.right { float: right; }
.right2 { text-align: right; }
.clear { clear: both; }
.bold {	font-weight: bold; }
.altColour { background-color: #CCFFFF; }       /* alternating list background */

.padTop5 { padding-top: 5px; }
.padTop25 { padding-top: 25px; }
.padTopLeft10 { padding-top: 10px; padding-left: 10px; }
.padTop10Left30 { padding-top: 10px; padding-left: 30px; }
.padLeft10 { padding-left: 10px; }
.padLeft20 { padding-left: 20px; }
.padLeft100 { padding-left: 100px; }
.pad10 { padding: 10px; }
.pad15 { padding: 15px; }
.pad18 { padding: 18px; }
.pad20 { padding: 20px; }
.pad25 { padding: 25px; }
.padRight40 { padding-right: 40px; }
.padRight20 { padding-right: 20px; }
.padV15 { padding-top: 15px; padding-bottom: 15px; }
.hidden { display: none; }
.pointer { cursor: pointer; }

.para {	padding-top: 10px; }

.right3 { 
	float: right;
	margin: 10px;
}

.right4 { 
	float: right;
	margin-top: 10px; 
	margin-right: 10px; 
}

.right5 { 
	float: right;
	margin-top: 10px; 
}

.break {
	clear: both;
	border-top: 3px solid #F07010; /* orange */
	margin-bottom: 5px;
}

/* Header styles ***************************************************/

#header .logo {
	position: absolute;
	top: 20px;
	left: 8px;	
}

#header h1 {
	padding: 20px 0 0 75px;
	font-family: verdana, sans-serif;
	font-size: 22px;
	font-style: italic;
	color: #1050A0;
}

#header h2 {
	padding: 0 0 0 75px;
	font-family: verdana, sans-serif;
	font-size: 15px;
	font-style: italic;
	color: #F66104;
}

#banner {
	position: absolute;
	top: 8px;
	right: 15px;
	height: 90px;
	width: 720px;
}

/* Top menu style **************************************************/

#menu ul { list-style: none; }

#menu li {
	float: left;
	position: relative;
	width: 110px;
	text-align: center;
	background-color: #D8D8E0;
}

#menu li p {
	margin: 5px 0 0 0;
	border-right: 1px solid #A0A0A0;
	line-height: 1.5em;
}

#menu li a { 
	display: block;
}

#menu li ul a { 
	margin-top: 5px;
	padding: 7px 0 7px 0; 
}

#menu a:hover {
	text-decoration: none;
	background-color: #808080;
	color: #000000;
}

#menu li ul {
	display: none;
	position: absolute;
	top: 20px;
	left: 0;
	list-style: none;
}

#menu li:hover ul, #menu li.over ul { display: block; z-index: 10000; }

#searchTerm { 
	position: absolute;
	border: 1px solid #D0D0D0;
	height: 15px;
	width: 150px;
	top: 5px;
	right: 24px;
	padding: 1px;
}

#searchButton {
	position: absolute;
	top: 5px;
	right: 6px;
}

/* Side menu style *************************************************/

#sideNav p { padding-top: 7px; }

#sideNav li {
	list-style-type: none;
	padding-top: 5px;
}

#sideNav .voteItems { line-height: 2em; }

#sideNav .bestPic { 
	margin-left: 5px; 
	border: 1px solid #D0D0D0;
}

#sideNav .adv { 
	padding: 10px; 
}

#sideNav .logo { 
	padding: 0 0 25px 25px; 
}


/* Home/list styles ************************************************/

.sumContent { padding: 0 5px 10px 5px; }

.sumContent h2 { padding-bottom: 5px; }

.sumPara {
	padding-bottom: 15px; 
	line-height: 1.3em;
}

.sumArrowLeft { padding: 0 0 5px 0; }
.sumArrowRight { float: right; margin: 0 10px 0 10px; }


/* Content styles **************************************************/

#content p { line-height: 1.3em; }

#content h1 {
	margin: 10px 0 0 5px;
	border-bottom: 2px solid #D0D0D0;
	padding-bottom: 5px;
}

#content h1 a { 
	font-size: 16px; 
	padding-top: 3px;
}

#content .pagePrint { 
	float: right;
	margin: -6px 20px 0 0;
	font-size: 16px;
}

#content .toolBar {
	float: right;
	margin: 17px 0 0 20px;
}

#content .toolBar a {
	padding: 0 10px;
	border-left: 1px solid #A0A0A0;
}

#artInfTable { 
	margin: 15px 0 0 5px; 
	border-bottom: 1px solid #D0D0D0;
}

#artInfTable td { padding-right: 5px; }

#picture .pic { 
	margin: 20px 0 5px 25px;
	border: solid #D0D0D0 2px;
	padding: 10px;
}

#picture td { padding: 0 0 5px 25px; }

#choosePic {
	margin: 10px;
	width: 760px;
}

#choosePic td { padding: 0 30px 10px 0; }

.articleTable th { padding: 5px; }
.articleTable td { padding: 5px; }

.formBox, #formBox { 
	background-color: #FFFFC0; 
	border: solid 1px #B0B0B0;
	padding: 5px;
	margin-top: 15px;
}

.leftBox {
	float: left;
	background-color: #FFFFC0; 
	border: solid 1px #606060;
	margin-top: 20px;
	margin-right: 20px;
}

.smallPicBox { 
	border: solid 1px #606060;
	width: 70px;
	height: 50px;
	padding: 5px;
	text-align: center;
	background-color: #9CC09C;
	font-size: 10px;
}


/* Help text styles */

.help {
/*	float: right;
	margin-right: 20px; */
	position: relative;
}

.help:hover {	
	border: none;			  /* IE fix */
	text-decoration: none; 
}

.help .hide {
	font-size: 150%;
	font-weight: bold;
	padding: 0 5px 0 5px;
	color: #0000C0;
	background-color: #D0D0D0;
}

.help .show, .help .show2, .help .show3, .show4 { display: none; }

.help:hover .show, .help:hover .show2, .help:hover .show3, .help:hover .show4 {
	display: block;
	position: absolute;
/*	top: 20px; */
	left: -260px;
	background-color: white;
	color: black;
	width: 250px;
	border: solid 1px black;
	padding: 2px;
	padding-bottom: 10px;
}

.help:hover .show { top: 20px; }
.help:hover .show2 { top: -20px; }
.help:hover .show3 { bottom: 0; }
.help:hover .show4 { bottom: 25px; }

/* Site map styles */

#siteMap h2 { font-size: 130%; margin: 10px 0 0 10px; }
#siteMap ul { margin-top: 10px; }
#siteMap li { margin: 0 0 5px 30px; }

/* Special styles */

.rightImg2, .rightImg3, .artImg { 
	float: right;
	border: 1px solid #D0D0D0;
}

.rightImg2 { margin: 10px 0 5px 10px; }
.rightImg3 { margin: 2px 0 10px 10px; }

.artImg { 
	margin: 10px 0 5px 10px; 
	padding: 5px 20px; 
}


.tableHead {
	background-color: #E0E0E0;
	padding: 5px 0;
	font-weight: bold;
}

#paging {
	position: relative; /* for centering paging text */
	height: 30px;
	margin: 5px 0;
	border: 1px solid #0000FF;
	padding: 7px;
}

#paging p {
	position: absolute;
	top: 12px;
	left: 300px;
}

#ticker {
	border-bottom: 2px solid #D0D0D0;
	margin-top: 10px;
	height: 30px;
	font-weight: bold;
}

#ticker img { padding-left: 20px; } 

.redDot { 
	color: red; 
	font-size: 200%;
}

.choosePic { 
	width: 80px;
	height: 80px;
	text-align: center;
	font-size: 80%;
}

#artText {
	padding: 10px;
	line-height: 1.3em;
}

/* Comment *********************************************************/

.commentContent { margin: 0 10px 20px 10px; }

.commentContent p, .commentBl p { padding-top: 10px; }

#addComment { margin: 10px; }

#addComment textarea {
	margin: 5px 0;
	width: 700px;
}

/* Diary ***********************************************************/

.diaryContent {
	padding: 5px 5px 10px 7px;
}

.diaryInf { 
	float: left;
	margin: 10px 20px 5px 2px;
	padding: 10px;
	border: solid 3px #D0D0D0;
}

.diaryContent p { padding: 10px 5px 0 5px; }

.diaryComment {
	clear: both;
	margin: 10px 20px 0 5px; 
	border-top: solid 2px #D0D0D0;
	padding-top: 2px;
}

.diaryComment .right { padding-right: 5px; }

.diaryComment p { margin: 5px 0 0 0; padding: 0; }

.addDiaryCommentRqs { padding: 5px; }

.addDiaryComment {
	margin: 2px 0 0 5px; 
	display: none;
}

.addDiaryComment textarea { width: 700px; }

.galleryRhHead { 
	font-size: 130%;
	padding-right: 30px;
}

#upload { height: 250px; }
#upload ul { margin: 10px 0 0 15px; }
#waitMsg {
	margin: 45px;
	padding: 10px;
	border: 1px solid #606060;
}

#calendar { margin: 10px; }
#calendar td { 
	padding: 7px 20px 7px 10px;
	border-bottom: 2px solid #F0F0F0;
}

#contactList { margin: 10px 0 0 20px; }
#contactList td { 
	padding: 5px 40px 5px 0; 
	border-bottom: 2px solid #F0F0F0;
}

#tide {
	height: 230px;
	width: 58em;
	overflow: auto;
	border: 1px solid #A0A0A0;
}

#tide td {
	border: 1px solid #A0A0A0;
	padding: 7px 1em 7px 1em;
}

#tideSummary td { padding: 0; }

#applet { margin: 5px 0 10px 0; }

#picturePaging {
	float: right;
	width: 130px;
	margin-top: 120px;
	border: solid 2px #D0D0D0;
	padding-bottom: 5px;
}

#picturePaging a {
	margin: 10px;
	font-weight: bold;
	font-size: 50px;
}

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

#picturePaging p { text-align: center; }

#editMode {
	float: right;
	font-weight: bold;
	font-size: 120%;
	padding: 14px 5px 0 0;
}

#fullEdit { margin: 5px 0 0 10px; }

#fullEdit textarea {
	margin: 0 0 5px 0;
	width: 730px;
}

#recentItems li { 
	margin: 5px 0 0 35px;
	padding-left: 5px;
	min-height: 23px;		/* IE7 fix */
}

* html #recentItems li, * html #recentItemsSum li { 	 /* IE fix */
	margin: 15px 0 0 20px; 
	padding-left: 20px;
}

#recentItems a, #recentItemsSum a { vertical-align: 40%; }

#recentItems .rule {
	margin: 10px 150px 15px 0;
	border-top: 5px solid #E0E0E0;
	min-height: 0;
	list-style-type: none;
}

#recentItemsSum li { 
	margin-left: 30px;
	padding: 5px 0 0 4px;
	line-height: 1.2em; /* amended 24/01/11, was 1em */
	min-height: 23px;		/* IE7 fix */
}

#recentItemsSum .rule {
	margin: 5px 50px 0 0;
	border-top: 5px solid #E0E0E0;
	min-height: 0;
	list-style-type: none;
}

#editPic img {
	float: left;
	margin-left: 105px;
	border: solid 1px #606060;
	padding: 5px;
}

/* rotate picture form */
#editPic form {
	float: left;
	border: solid 1px #606060;
	padding: 10px;
	margin: 20px 0 0 40px;
}

#editPic input { padding: 5px 7px 0 3px; }

#onlineUserList {
	max-height: 600px;
	overflow: auto;
	padding: 5px 5px 15px 15px;
}

#onlineUserList ul {
	list-style: inside url("images/icons/usr.gif");
}

#onlineUserList li { padding-top: 5px; }

/* imitate window header bar on inline popups */
.popupHeader {
	display: block;
	background-color: #9090B0;
	padding: 5px;
	color: white;
	text-align: right;
	font-weight: bold;
}

#instantMsg {
	display: none;
	padding-bottom: 15px;
	border-bottom: 10px solid #9090B0;
}

#instantMsgWin {
	height: 300px;
	overflow: auto;
}

#instantMsgTxt { padding-bottom: 20px; }

#instantMsgTxt p, #instantMsgAdmin p { 
	padding: 5px 0 0 40px;
	text-indent: -35px;
}

#instantMsgTxt a {
	padding: 0;
	font-weight: bold;
	vertical-align: bottom;
}

#instantMsgTxt .me  { color: #808080; }
#instantMsgTxt .me a { color: #505050; }

#instantMsgWelcome {
	display: none;
	padding: 0 5px;
	color: #808080;
}

#instantMsg textarea {
	width: 290px;
	height: 50px;
	border: none;
	border-top: solid 3px #9090B0;
	padding: 5px;
	overflow: auto;
}

#instantMsgAdmin form {
	width: 300px;
	margin-top: 20px;
	border: 1px solid #808080;
	padding: 20px;
}

#instantMsgAdmin label { vertical-align: 70%; }

#formatHelp img { margin-left: 20px; }

#formatHelpButton {
	display: block; 
	margin: 10px; 
	padding: 8px; 
	width: 35px; 
	color: white; 
	background-color: #000080; 
	text-decoration: none;
}

#socialBookmark {
	float: right;
	margin-bottom: 10px;
	border: 1px solid #D0D0D0;
	padding: 10px;
}

#socialBookmark h3 { margin-bottom: 5px; }
#socialBookmark a { padding-right: 10px; }

#slideShow {
	margin: 10px 0 20px 60px;
	border: 1px solid #D0D0D0;
	padding: 5px 0 10px 20px;
	width: 590px;
}

#slideShow h2 { margin-bottom: 10px }

#slideShow1, #slideShow2 { 
	display: block;
	text-decoration: none;
	height: 360px;
	background-color: #F0F0E0;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}

#slideShowIn { 
	width: 560px;
	border: 2px solid #909090;
}

#slideShowCtl { 
	border-top: 2px solid #C0C0C0;
	height: 18px;
	padding: 5px 0 0 10px;
}

#slideShowCtl a {
	margin-left: 5px;
	border: 1px solid #404070;
	padding: 2px 2px 0 2px;
	background-color: #D0D0E0;
}

#slideShowCtl a:hover {
	text-decoration: none;
	background-color: #9090D0;
}

#forecast, #map {
	margin: 5px 10px 0 10px;
	padding: 2px 10px 0 0;
	font-weight: bold;
}

#forecast iframe, #map iframe {
	margin-left: 8px;
	width: 700px;
	height: 300px;
	border: none;
}

#map iframe { margin: 5px 0 20px 8px }

#articleAdv {
	clear: right;
	float: right;
	padding-left: 15px;
	margin: 15px 0 10px 0;
}

#articleListAdv {
	padding: 0 0 10px 30px;
}

#articleStats {
	clear: right;
	float: right;
	margin: 5px 0 10px 15px;
	border: 2px solid #816689;
}

#articleStats th {
	padding: 5px 3px;
	color: white;
	background-color: #816689;
	text-align: left;
}

#articleStats td { 
	padding: 5px 3px;
	border-bottom: 1px solid #E0E0E0; 
	background-color: #F8FFCB; 
}

#userStatsHead { clear: both; }

#userStatsHead h3 {
	float: left;
	font-size: 15px;
	font-weight: bold;
}

#userStatsHead div {
	float: left;
	margin-left: 15px;
	border: 2px solid #C0C0C0;
	padding: 2px 0;
	background-color: #F0F0FF;
}

#userStatsHead a {
	padding: 0 8px;
	color: #505050; 
	font-weight: bold;
}

#userStatsHead a:hover { 
	background-color: #D0D0C0;
	text-decoration: none;
}

#userStats {
	clear: both;
	overflow: auto; 
}

#userStats a { 
	color: #505050; 
}

#userStats table {
	margin-top: 5px;
	border: 2px solid #816689;
	border-collapse: collapse;
}

#userStats td, #userStats th {
	padding: 7px 1px; 
	text-align: center; 
	border: solid 1px #E0E0E0;
}

#userStats .pad { padding: 7px 10px; }

#userStats td { background-color: #F8FFCB; }
#userStats th { background-color: #EAFF59; }

#userStats .firstCol { 
	text-align: left;
	color: white;
	font-weight: bold;
	background-color: #816689;
}

#userStats .firstCol a { 
	color: white;
	font-weight: bold;
}

#userStats .lastCol, #userStats .foot { 
	font-weight: bold;
	background-color: #C8E8FF;
	border: solid 1px #A0A0A0;
}


/* Footer **********************************************************/

#footer a {
	color: white;
	padding: 0 22px;
	border-right: 1px solid white;
	text-align: center;
}

#footer .right { border: none; }

#footerToolbar .item {
	padding: 0 20px;
	border-right: 1px solid #909090;
}

#footerPopup {
	display: none;
	position: absolute;
	bottom: 27px;
	right: 0;
	width: 300px;
	border: solid 1px #9090B0;
	background-color: white;
}

