/* 'deep gray sea' stylesheet, site default */

/* global styles */
body {font-family: Arial, Helvetica, sans-serif; 
  color: #fff;
  background: #fff;
  padding:0px;
  margin:0 0 0 0;}

#extra1 {position: relative;
  height:100px;
  width: 100%;
  bottom: 0;
  left: 0;
  background: #030303 url(images/zfishtail.jpg) no-repeat left bottom;
  margin: 75px 0 0 0;} /* bottom border with fish tail */

p, h2, h3, h4, h5, ul, li, div, span {color: #000;}

/* page titles */
h1 {color: #B10042;
  letter-spacing: .1em;
  margin: 0;
  padding: 0 0 5px 0;}

/* page icons */
#thispageicon {position: absolute; 
  top: 318px; 
  left: 75px;}
#thispageicon span {display: block;
  width: 32px;
  height: 32px;
  border: 1px solid #0D2D40;}
.icon32link span {display: block;
  width: 32px;
  height: 32px;
  float: left;
  margin: 0 8px 5px 0;
  padding: 0;
  border: 1px solid #0D2D40;}
.homeicon {background-image: url(images/fish2.jpg);}
.sitesicon {background-image: url(images/manatee.jpg);}
.designicon {background-image: url(images/plankton.jpg);}
.familyicon {background-image: url(images/fish.jpg);}
.musicicon {background-image: url(images/fishmouth.jpg);}
.faithicon {background-image: url(images/turtle2.jpg);}
.influencesicon {background-image: url(images/frog.jpg);}
.deepgrayseaicon32 {background-image: url(images/fish2.jpg);}
.uahanaiicon32 {background-image: url(images/uahanaiicon2.jpg);}
.candleicon32 {background-image: url(images/candlepersonalityicon32.jpg);}
.privacyicon {background-image: url(images/turtle.jpg);}
.contacticon {background-image: url(images/seahorse.jpg);}

ul {list-style: none;
  margin: 0;
  padding: 0;}

a {color: #00197C; 
  text-decoration: none;
  position: relative;
  z-index: 10;
  letter-spacing: 0.1em;}
  
a:hover {text-decoration: underline;}

li a img, h5 a img, #thispageicon img {display: inline;
  border: 1px solid #0D2D40;
  padding: 0;
  vertical-align: text-bottom;
  margin: 3px 10px 0px 0px;}

/* gray sea picture and masthead titles */
#siteheader {position: relative;
  top: 0;
  left: 0;
  height: 270px;
  background:   url(images/zmasthead2.jpg) #060906 no-repeat; 
  clear: both;}
#m2 {
  color: #5E6262;
  letter-spacing: .2em;
  margin: 0; 
  padding: 0;
  position:absolute;
  right: 50px;
  top: 165px;}
.wordgray {color: #436579;} /* 425265 3B576E */
#svp {
  color: #5E6262;
  letter-spacing: .3em;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 200px;
  right: 50px;}


/* menu links */
#cleanlink {color: #B10042;} /* active link */
.activelink {color: #B10042;
  text-decoration: none;}

/* main menu beneath gray sea picture */
#mainmenu {padding: 0px 5px;
  margin: 0;
  background:#000000;
  vertical-align: text-bottom;
  line-height: 25px;}
#mainmenuheader {display: none;}
#mainmenulinks {margin: 0;
  padding: 0;}
#mainmenulinks li{ display: inline;
  padding: 0 10px;}
#mainmenulinks li a {color: #aaa; border: 0;}
#mainmenulinks li a.activelink {color: white; border: 0;}
#mainmenulinks li a span {display: none; border: 0;}

/* personality menu - site stylings and animal picture */
#personalitymenu {padding: 75px 50px 190px 30px;
  margin: 0;
  line-height: 28px;
  vertical-align: middle;
  float: right;}
#personalitylogo {background:   url(images/zfish2.jpg) transparent no-repeat;
  height: 190px;
  width: 190px;}
#personalityheader {margin: 5px 0 3px 0;
  padding: 0 0 0 50px;}
#personalitymenulinks {margin: 0;
  padding: 0 0 0 50px;}
#personalitymenulinks li a {padding: 24px 0;}
#personalitymenulinks li a img {
  width: 24px;
  height: 24px;
  margin: 0 8px 5px 0;
  padding: 0;
  border: 1px solid #0D2D40;
  vertical-align: middle;}
.persiconthis {color: #B10042;}
#deepgrayseaicon24 {background-image: url(images/fish24.jpg);}
#uahanaiicon24 {background-image: url(images/uahanaiicon.jpg);}
#candleicon24 {background-image: url(images/candlepersonalityicon24.jpg);}


/* text size menu  */
#textsizemenu {padding: 0;
  margin: 0 70px 0 0;
  line-height: 1.25em;
  vertical-align: top;
  position: absolute;
  top: 300px;
  right: 40px;}
#textsizeheader {margin: 5px 0 5px 0;}
#textsizemenulinks {margin: 0;
  padding: 0;
  vertical-align: top;}
#textsizemenulinks li{display: inline;}
#textsizemenulinks li a {margin: 0 4px 2px 0;
  background-color: #fff;
  color: #0D2D40;
  border: 1px solid #0D2D40;
  height: 24px;
  width: 24px;
  float: left;
  text-align: center;
  vertical-align: top;}
#smtextlink {background: url(images/smaicon.gif);}
#smtextlink.texticonthis {background: url(images/smaiconthis.gif);}
#medtextlink {background: url(images/mmaicon.gif);}
#medtextlink.texticonthis {background: url(images/mmaiconthis.gif);}
#lgtextlink {background: url(images/lmaicon.gif);}
#lgtextlink.texticonthis {background: url(images/lmaiconthis.gif);}

/* shameless amazon marketing */
#amazon {border: 1px dotted #aaa;
  margin: 30px 30px 15px 15px;
  width: 145px;
  vertical-align: middle;
  position: absolute;
  top: 700px;
  right: 35px;
  text-align: center;} 
#amheader {font-weight: bold;
  margin: 10px 15px;}
#ampixdiv {margin: 0 15px;}
#ampixdiv img {margin: auto;
  border: 1px solid #0D2D40;
  z-index: 10;
  display: block;}
#amtitlediv {margin: 2px 15px;}
#amauthdiv {margin: 0 15px;}
#amblurb {margin: 5px 15px 15px 15px;}

/* Baha'i Prayer of the day */
#prayer {border: 1px dotted #aaa;
  margin: 0 15px 15px 0;
  width: 156px;
  vertical-align: middle;
  position: relative;
  background-color: #fff;
  float: left;}
#prheader {font-weight: bold;
  margin: 10px 15px 0 15px;
  text-align: center;}
#prdate {font-style: italic;
  margin: 0 15px 10px 15px;
  text-align: center;}
#prpixdiv {margin: 0 15px;}
#prlink {}
#prpix {margin: 0 0 0 22px;
  border: 1px solid #0D2D40;
  z-index: 10;
  display: block;}
#prtitlediv {margin: 2px 15px 15px 15px;
  text-align: center;}


/* things we don't show in this personality */
#menufooter, #homemenufooter, #homeemblem, #skipnav, .hideme, #pagedesc {display: none;}

/* page footer */
#footer {margin: 20px 10px 10px 10px;
  text-align: center;
  clear: both;}
#subfooterlinks {position: relative;
  padding: 2px 0 5px 0;
  z-index: 10;}
#footerlinks li, #subfooterlinks li{display: inline;}
#footerlinks li a {white-space: nowrap !important;
  padding: 25px 0;}
#footerlinks li a img {
  width: 32px !important;
  height: 32px !important;
  margin: 0 8px 5px 0;
  padding: 0;
  border: 1px solid #0D2D40;
  vertical-align: middle;}
.footsep {padding: 0 10px;}
#nextlink img {position: relative;
  left: 5px;}

/* rss link */
#rsslink {color: #fff;
  background-color: #EC793C;
  font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-weight: bold;
  padding: 1px 2px !important;
  font-size: 10px;
  letter-spacing: 0.1em;
  border: 1px solid #a73500;}
  
/* begin content styles */
#content {padding: 35px 125px 20px 125px;}
#content h5, #hello h5 {margin: 15px 0 2px 0;
  padding: 0 0 0 1px;}
#content .more, #hello, #newstuff, .morenoclear {clear: left;
  padding: 0;
  margin: 0 150px 15px 0;}
.morenoclear {clear: none;}
  
#content .more p, #hello p, .morenoclear p {margin: 0 0 15px 0;}
#content .more p.tight {margin: 0; padding: 0;}
#content .more img, #newstuff img {border: 1px solid #0D2D40;
  z-index: 10;
  float: left;
  margin: 0 10px 5px 0;}
.more pre {font-family: "Courier New", Courier, monospace; 
  color: #000;
  background: #eee;
  padding: 15px;
  line-height: 1.3em;
  margin-left: -60px;
  z-index: 10;}
	
#content .more h3.largebreak {padding-top: 2em;}

#content .more img.nobr {float: none;}
#content ul.bullets {list-style: circle outside none;
  margin: 10px 10px 10px 30px;}  

#newstuff {padding: 6px 10px 10px 10px;
  border: 1px dotted #aaa;}
#newstuff h3 {margin: 0 0 10px 0; padding: 0;}
#newstuff h5, #newstuff p {margin: 0 0 2px 0; padding: 0;}

.date {font-style: italic;
  padding-right: 1em;
  color: #909090;}

/* home page personality menu */
#homepers {clear: left;
  padding: 0;
  margin: 20px 150px 15px 0;}
#homepers p {margin: 0 0 5px 0; padding: 0;}
#homepers li{clear: left;}

/* popup screen viewer window */
#popupbody {font-family: Arial, Helvetica, sans-serif; 
  color: #B10042;
  background: #909090;
  padding:0px;
  margin:8px;}
#popupheader {margin: 0 8px;
  float: right;
  text-align: right;}
#popupm2 {color: #555;
  letter-spacing: .1em;
  margin: 0; 
  padding: 0;}
#popupsvp {color: #555;
  letter-spacing: .3em;
  margin: 0;
  padding: 0;
  position: relative;
  top: -3px;}
#popupbody a {color: #ddd; padding: 2px;}
#popupbody a.popupcurrentpagelink { background-color: #fff; color: #555;}
#popuptitle {  margin: 14px 0 0 10px; color: #555;}
#popuppager {position: relative; left: 30%; margin: 5px 0; clear: both;}
#popuppager li {display: inline; padding: 0 3px;}
#closeme {padding-left: 10px;}
.popuppagelink { color: #aaa;}
#popupimg {border: 1px solid #0D2D40; padding: 0; margin: 0;}

/* ride the honu */
#honu {cursor: pointer;
display: inline;
  border: 1px solid #0D2D40;
  padding: 0;
  vertical-align: text-bottom;
  margin: 3px 10px 0px 0px;
  float: left;}

/* security level */
#security {float: left;
  width: 190px;
  border: 1px solid #0D2D40;
  margin: 20px 20px 10px 0;
  background-color: #eee;
  text-align: center;}
#secheader {text-align: center;
  color: #B10042;
  font-size: 135%;
  letter-spacing: 0.1em;
  font-weight: bold;
  margin: 10px 0;}
#seccolor {margin: auto;
  width: 130px !important;
  height: 130px !important;
  border: 1px solid #0D2D40;
  background-color: #fff0f5;}
#seccolorname {text-align: center;
  font-size: 110%;
  font-weight: bold;
  letter-spacing: 0.1em;
  margin: 10px;}
#secrec {text-align: center;
  margin: 10px 10px 0 10px;
  font-weight: bold;
  font-style: italic;}  
#seccomment {text-align: center;
  margin: 5px 10px 20px 10px;}
 
/* site contact form */
#contactForm {background-color: #eee;
  border: 1px solid #aaa;
  padding: 10px;
  position: relative; 
  left: -50px;}
#contactForm div {margin: 5px 0 0 0; 
  position: relative;
  height: 30px;}
#contactForm #emailcomments {height: 110px;}
#contactForm div label {}
#contactForm div input, #contactForm div textarea {position: absolute;
  left: 125px;
  top: 0px;}
#contactForm #Engage {left: 125px;}
#contactForm #clear {left: 190px;}