* { font-family: Verdana, Sans-Serif; color: white; }

body { background: #2c4345; font-size: 10pt; }

/* ANCHORS & LINKS */
a:link, a:visited { color: #e7f3ea; font-weight: normal; text-decoration: none; }
a:hover { color: #00968d; }

/* DIVIDER LAYERS */
div#Container { position: relative; width: 800px; margin: 30px auto; margin-bottom: 0px; padding: 0px; padding-top: 48px; background: url('images/logo-main.png') no-repeat center top; }
div#Content { color: white; }
div#Footer { height: 48px; margin-bottom: 10px; font-size: 8pt; text-align: center; color: #AAAAAA; }
div#Page { width: 600px; padding: 20px; margin: 0px auto; background: url('images/pageTop.png') no-repeat center top; }

/* LISTS */
ul#Navigation { list-style: none; padding: 0px; margin: 10px 0 20px 0; display: block; overflow: hidden; font-size: 13pt; height: 32px; text-transform: capitalize; text-align: center; }
ul#Navigation li { display: inline; }
ul#Navigation li a { padding: 10px 20px; text-decoration: none; }

/* HEADINGS */
h3#PageTitle { color: #e78d3c; text-align: center; font-weight: normal; }

/* THE ADDRESSBOOK LIKE CONTACT DETAILS */
table { color: white; font-size: 10pt; }
tr#Detail td  { padding-left: 10px; }
tr#Detail:hover td { background: url('images/contactUnderlay2.png'); }
tr#Detail td.Label  { padding-right: 10px; text-align: right; }
tr#Detail:hover td.Label { background: url('images/contactUnderlay.png') no-repeat; }

/* SLIDESHOW */
div#slideshow { position: relative; height: 400px; width: 200px; overflow: hidden; margin: 0px; padding: 0px; margin-top: 20px; margin-bottom: 20px; border: 1px solid white; }
div.fader { display: none; }
div#slideshow div.fader { display: block; }
div#slideshow div.text { color: white; font-size: 13pt; font-weight: bold; text-shadow: black 0px 2px 5px; text-align: center; z-index: 3; position: absolute; left: 0px; right: 0px; bottom: 20px; }
div#slideshow div.image { background-color: transparent; background-repeat: no-repeat; background-position: center center; position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; }

/* FLICK MENU */
ul#Flick { margin: 0px; list-style: none; width: 800px; height: 100px; overflow: hidden; padding: 0px; border: 1px solid white; background: url('images/background.png'); }
ul#Flick li { float: left; margin: 0px; display: block; overflow: hidden; }
ul#Flick li div#FlickSlide { height: 100px; width: 200px; cursor: hand; border-left: 1px solid white; }

div#FlickView { position: relative; margin: 0px; width: 800px; height: 395px; background: url('images/background.png'); border: 1px solid white; border-bottom: 0px solid transparent; }
div.FlickImage { position: absolute; margin: 0px; width: 800px; height: 395px; top: 0px; left: 0px; background-color: transparent; background-repeat: no-repeat; background-position: center center; display: none; }
div.FlickCaption { position: absolute; margin: 0px; width: 780px; height: 28px; background: url('images/caption.png'); bottom: 0px; left: 0px;  border-top: 1px solid white; font-size: 9pt; padding: 10px; display: none; }
div#FlickTitle { position: relative; margin: 0px; width: 800px; font-size: 13pt; font-weight: normal; color: #00968d; text-align: center; padding-top: 20px; padding-bottom: 5px; }

div#ToggleCaptions { position: absolute; width: 25px; height: 25px; right: 10px; bottom: 10px; background: url('images/captions.png') no-repeat center center; cursor: hand; }
div#Back { position: absolute; width: 25px; height: 25px; left: 10px; bottom: 10px; background: url('images/back.png') no-repeat center center; cursor: hand; }

/* ADMIN */
body.Admin { background: white; color: black; }
div#SiteInfo { position: absolute; left: 0px; bottom: 0px; height: 34px; right: 0px; color: white; background: #2c4345; border-top: 1px solid black; padding: 10px; }
div#AdminArea { position: absolute; left: 0px; bottom: 55px; right: 0px; top: 0px; padding: 20px; overflow: auto; }
div#Path { position: absolute; left: 0px; bottom: 55px; right: 0px; padding: 5px; overflow: auto; font-size: 9pt; background: #e6e6e6; border-top: 1px solid gray; z-index: 10; color: black; }
div#Path table tr td { color: black; }

div.Tool { text-align: center; color: black; margin: 20px; float: left; cursor: hand; }

div#PhotoEdit { position: absolute; left: 0px; bottom: 0px; right: 0px; top: 0px; padding: 20px; overflow: auto; background: #e6e6e6; color: black; overflow: auto; }
h3#PhotoEdit { color: #555555; font-weight: normal; margin: 10px; font-size: 13pt; }

div#ImageWell { position: absolute; left: 20px; bottom: 20px; width: 500px; top: 64px; border: 1px solid gray; overflow: auto; background: url('images/contactUnderlay2.png'); color: black; }
div#ImageWellImage.Image { position: absolute; left: 0px; bottom: 0px; right: 0px; top: 0px; background-color: transparent; background-repeat: no-repeat; background-position: center center; }

div#EditArea { position: absolute; left: 540px; right: 20px; top: 64px; bottom: 20px; font-size: 10pt; color: black; }

div#EditArea table tr td { color: black; padding: 5px; }
div#EditArea table tr td.Divider { color: black; padding: 0px; }
div#EditArea table tr td.Label { padding-right: 10px; }

a.Admin:link, a.Admin:visited { color: #000000; font-weight: normal; text-decoration: none; }
a.Admin:hover { color: #00968d; }

input, textarea, span#caption { color: black; }

/* APP API */
div#App { position: absolute; left: 0px; bottom: 0px; right: 0px; top: 0px; padding: 20px; overflow: auto; background: #e6e6e6; color: black; }
h3#App { color: #555555; font-weight: normal; margin: 10px; font-size: 13pt; }
div#App table tr td { color: black; padding: 5px; }
div#App table tr td.Divider { color: black; padding: 0px; }
div#App table tr td.Label { padding-right: 10px; }
