/* == Basic styles == */

body {
  background: #FFE6E6;
  margin: 0px;
  color: #444444;
  font-family: verdana, helvetica, sans-serif;
  text-align: center;
}

body, p, td, tr, th, li { font-size: small; }
h1 , h2 , h3 , h4 { margin: 0; }
h1 { font-size: x-large; font-weight: normal; }
h2 { font-size: large; font-weight: bold; margin: 0.3em 0 0.5em 0; }
h3 { font-size: medium; font-weight: normal; color: #805; margin: 0.3em 0 0.5em 0; }
h4 { font-size: small; font-weight: normal; }



ul { list-style-image: url(/images/icons/bullet_green.png); padding-left: 25px; margin: 0.5em 0 1em 0; }
li { padding: 0.2em 0; }

small { font-size: x-small; }

a:link, a:visited  { background: transparent; color: #0077DD; }
a:hover            { color: #FFFFFF; background: #0077DD; }

a.plain:hover { background: transparent }

label { font-size: x-small; }

img { border: 0px }

form {
  padding: 0;
  margin: 0;
  border: 0;
}

input, select, textarea {
  font-size: x-small;
  font-family: verdana, arial, helvetica, sans-serif;
}

.faint {
  color: #AAAAAA;
}


/* == Overall layout == */

.centered-in-page {
  margin: 0 auto 0 auto;
  min-width: 500px;
  width: 760px;
  text-align: left;
}

#page {
  margin-top: 0;
  background: #FFFFFF;
  border: solid 3px white;
}

#page-container {
  margin: 0 auto 0 auto;
  width: 800px;
  background: #FFE6E6 url(/images/bg-shadow.png) top repeat-y;
}

#page-bottom {
  background: #FFE6E6 url(/images/bg-shadow-bottom.png) no-repeat top;
}

#top_bar {
  background: #2874CA;
  /*background: #91BBE9;*/
  border-bottom: solid 3px #FFFFFF;
  color: #EEEEEE;
  font-size: small;
  vertical-align: baseline;
  padding: 5px 0 5px 0;
}

#top_bar .link_spacer {
  color: yellow;
}

#top_bar .block-logo {
  vertical-align: middle;
  padding-right: 10px;
}

#top_bar a:link, #top_bar a:visited {
  color: #FFFFFF;
}

#account_status {
  float: right;
  text-align: right;
}

img#landing-header { margin: 1em; }

#section-bar {
  padding: 5px;
  margin: 0;
  min-height: 35px;
  border-bottom: solid 2px #EEEEEE;
}

#section-bar .tiny-logo {
  margin-right: 10px;
  margin-bottom: 5px;
  float: right;
}

#section-bar a:link, #section-bar a:visited {
  color: #EE389C;
}
#section-bar a:hover {
  background-color: #EE389C;
  color: #FFFFFF;
}

#page-bar {
  background: #F6F6F6;
  padding: 5px;
  margin: 0;
  border-bottom: solid 2px #EEEEEE;
}

#page-bar.with-logo {
  background: #F6F6F6 url(/images/page-bar-logo.png) no-repeat right;
  padding-top: 10px;
}

h1#page-heading {
  font-weight: bold;
  padding: 0:
  margin: 0;
}

.secure h1#page-heading {
  background: url(/images/ssl.png) no-repeat left;
  padding-left: 25px;
}

#page-actions {
  float: right;
  padding: 0 5px;
  margin: 0;
  font-size: small;
}

#page_nav {
  font-size: small;
  font-weight: normal;
  text-align: center;
  border-bottom: solid 1px #E6FFD9;
  padding: 0.3em 0;
}

#body {
  clear: both;
  min-height: 450px;
  padding: 0;
  margin: 0;
}


#content { margin: 0 5px; padding-top: 5px; padding-bottom: 35px; }


#bottom_link_bar {
  clear: both;
  text-align: center;
  background: #F6F6F6;
  border-top: solid 2px #EEEEEE;
  margin-top: 3em;
  padding-top: 0.5em;
  padding-bottom: 20px;
  font-size: x-small;
}

span.link_spacer { color: #66CC33; }

div.spacer { clear: both; height: 0.3em; min-height: 0.3em; }
div.clear { clear: both; height: 0px; }


/* == Main page body == */

span.buttons { font-size: x-small; font-weight: normal; font-style: normal; padding-top: 0.5em; }
span.buttons a:link, span.buttons a:visited { margin: 0 0.2em; padding: 0 0.2em; color: #0077DD; text-decoration: none; }
span.buttons a:hover { background: #0066CC; color: #FFFFFF; }
span.buttons span.link_spacer { color: transparent; }

/* == Sections == */

div.section { margin: 0 0 1em 0; padding: 0; }
div.section p { margin-top: 0 }

div.section h2 {
  margin: 0.3em 0 0.3em 0;
  color: #66CC33;
}


/* == Content layout devices == */

div.sidebar {
  vertical-align: top;
  float:left;
  width: 245px;
  min-width: 245px;
}

div.notsidebar {
  vertical-align: top;
  float: right;
  width: 495px;
  min-width: 495px;
  max-width: 495px;
}

div.right_column {
  vertical-align: top;
  padding: 0;
  float:right;
  width: 371px;
  min-width: 371px;
  max-width: 371px;
}

div.left_column {
  vertical-align: top;
  padding: 0;
  float: left;
  width: 371px;
  min-width: 371px;
  max-width: 371px;
}


/* == Growth and charts == */

table.growth { border: solid 1px #CCCCCC; border-collapse: collapse; font-size: x-small; margin-top: 0.5em; }
table.growth th { text-align: left; }
table.growth tr { border-top: solid 1px #CCCCCC; }
table.growth td { border-left: solid 1px #CCCCCC; padding: 0 0.3em 0 0.3em; }
table.growth td.buttons { border-left: none; }

img.chart {
  background: url(/images/chartbg.png) top left repeat-x;
  display: block;
  width: 370px;
  height: 300px;
  margin: 0.5em 0;
  padding-bottom: 0.3em;
}


/* == Photos == */

div.thumbnail {
  text-align: center;
  float: left;
  width: 185px;
  margin-top: 0.5em;
}

div.grid div.thumbnail {
  min-height: 195px;
}

div.thumb_info {
  font-size: x-small;
}

img.thumbnail {
  display: inline;
  border: solid 3px #000000;
}

div.medium {
  text-align: center;
}
img.medium {
  display: inline;
  border: solid 4px #000000;
  margin-top: 0.5em;
}

img.tiny {
  margin-top: 1px;
}

.photonav img.tiny {
  width: 45px; height: 45px;
}

.currentphoto { display: inline }
.currentphoto img.tiny {
  filter:alpha(opacity=35);-moz-opacity:.35;opacity:.35;
  border-top: solid 2px black;
}

div.quota_total {
  vertical-align: center;
  overflow: hidden;
  height: 1.4em;
  width: 150px;
  background: #FFFFFF;
  border: solid 1px #CCCCCC;
}

div.quota_digits {
  width: 150px;
  text-align: center;
}

div.quota_used {
  float: left;
  color: black;
  height: 50px;
  background: #66CC33;
  overflow: visible;
}


/* == Posts == */

div.diary_entry {
  margin-bottom: 10px;
}

div.diary_entry ul { list-style: disc; marker-offset: auto; margin: auto; padding: auto; }

div.diary_entry_heading {
  font-weight: bold;
}

div.diary_entry_time {
  font-size: x-small;
  font-style: italic;
  color: #AAAAAA;
  margin-bottom: 0.5em;
}

div.comments {
  font-size: x-small;
  color: #888888;
}

div.comment_author {
  margin-top: 0.5em;
  padding-top: 0.5em;
  border-top: solid 1px #E6FFD9;
  font-style: italic;
  font-size: x-small;
}


/* == Live editing == */
img.progress { display: none; margin: 0 0 0 0.5em; }

/* == Demarcated forms == */

div.live_form, div.form { padding: 0.3em 0.5em 0.5em 0.5em; margin: 0.5em 0; text-align: left; background: white }
div.live_form p, div.form p { margin: 0 0 0.3em 0; padding: 0 }
div.live_form legend, div.form legend { font-size: x-small; font-weight: bold; }
div.live_form fieldset, div.form fieldset { border: solid 1px #DDDDDD; margin: 0.3em 0 0.3em 0; padding-left: 0.5em }

div.form_heading { font-size: small; font-weight: bold; margin: 0 0 0.5em 0; }

div.form, div.live_form { border: solid 4px #DDDDDD; }

div.floating {
  z-index: 999999;
  position: absolute;
}

/* == Form errors and messages == */

.notice, .errors {
  padding: 1em;
  margin: 0;
}

.errors {
  color: #222222;
  background: #FFDDCC;
}

.notice {
  background: #DDFFCC;
}

.errors li, .notice li {
  font-size: medium;
  font-weight: bold;
  margin-top: 0;
  margin-left: 20px;
}

.errors li {
  color: #CC0000;
  list-style: url(/images/icons/error.png);
}

.notice li {
  color: #45901F;
  list-style: url(/images/icons/information.png);
}

div.fieldWithErrors {
  display: inline;
  padding: 0;
  margin: 0;
}

div.fieldWithErrors input, div.fieldWithErrors textarea {
  background: #FFFFCC;
}

div.formError {
  padding-left: 20px;
  color: #660000;
  font-weight: bolder;
}

.icon-link {
  whitespace: nowrap;
}

tr.odd { background: #EFEFEF; }

#banner { text-align: center; background: #F6F6F6; }

/* == Page specifics == */

table#features { border-collapse: collapse; width: 100% }
table#features tr { border-bottom: solid 1px #DDDDDD; }
table#features tr.plain { border-bottom: 0; }
table#features th, table#features td { vertical-align: top; font-size: x-small; text-align: center; }
table#features td { border-left: solid 1px #DDDDDD; width: 20%; background: lightyellow }
table#features th.feature { text-align: left; border-left: 0 }
table#features td.feature { text-align: left; border-left: 0; width: auto;}


/* == Promo pages == */

div.promo_section { text-align: center; margin: 0 140px 20px 140px; clear: both; }
div.promo_section ul { text-align: left }

div#body_top {
}

img.tour_screenshot {
  border: solid 3px #cccccc;
  padding: 3px;
  margin-bottom: 2em;
}