/* Font Families */

@import url(http://fonts.googleapis.com/css?family=Droid+Sans);
@import url(http://fonts.googleapis.com/css?family=Inconsolata);
@import url(http://fonts.googleapis.com/css?family=Play:bold);
@import url(http://fonts.googleapis.com/css?family=Quattrocento);
@import url(http://fonts.googleapis.com/css?family=Ubuntu:bold);

body {
  font-family: 'Droid Sans', Bitstream Vera Sans, Verdana, Helvetica, sans-serif;
}

h1, h2, h3, h4, h5, h6, .post-paginator {
  font-family: 'Play', Futura, Trebuchet MS, Bitstream Vera Sans, Helvetica, sans-serif;
  font-weight: bold;
}

code, pre, .code {
  font-family: 'Inconsolata', Bitstream Vera Sans Mono, Monaco, Lucida Mono, monospace;
}

/* Everything else */

#navbar-iframe {
 display: none !important;
}

body {
  background-color: #fff;
  margin: 0;
  padding: 0;
}

a, a code {
  color: #000090;
  text-decoration: none;
}

a:hover {
  color: #03f;
  text-decoration: underline;
}

a:visited, a:visited code {
  color: #700070;
}

form, div, h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  line-height: 140%;
}

center {
  margin: 1em;
}

h1, h2, h3, h4, h5, h6, .post-paginator {
  margin-top: 1em;
  color: #990033;
}

h4, h5, h6 {
  margin-left: -1ex;
}

h4, .post-paginator {
  font-size: 150%;
}

h5 {
  font-size: 125%;
}

p {
  margin: 0;
}

p+p {
  margin-top: 1em;
}

h1, h2, h3 {
  margin-bottom: .5em;
}
h4, h5, h6 {
  margin-bottom: .25em;
}

small {
  color: #666;
}

blockquote {
  border: solid 3px #d6f1ff;
  padding: 1em;
  margin: 1em;
  font-size: 90%;
  font-style: italic;
  display: table;
  margin-left: auto;
  margin-right: auto;
}

blockquote cite:before {
  content: "- "
}

blockquote cite {
  margin-top: .25em;
  display: block;
  text-align: right;
}

blockquote a {
  text-decoration: none;
}

blockquote a:hover {
  text-decoration: underline;
}

code, pre {
  color: #4f4f6f;
  font-weight: 500;
}

code b, pre b{
  color: #f96;
}

code, pre, .code {
  font-weight: normal;
}

pre.code, pre.figure {
  -moz-border-radius: .3em .3em .3em .3em;
  border-style: solid;
  border-width: 1px;
  border-color: #c0c0c0;
  background-color: #eae9e8;
  white-space: pre;
  padding: .5em;
  display: table;
}
pre.code {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
pre.figure {
  margin-left: auto;
  margin-right: auto;
}

pre.figure {
  font-weight: normal;
  display: table;
  margin: auto;
  color: black;
}

.header {
  background-color: #370D86;
  border-bottom: 1px solid #000033;
  background-repeat: repeat-x;
  background-image: url('http://xenomachina.com/xm-top-plasma.png');
  height: 85px;
}

.header h1 {
  margin: 0;
  padding: 0;
}
.header h1 a {
  color: #ffffff;
  font-size: 32px;
  margin: 0;
  padding: 0;
}

.header h1 a img {
  width: 467px;
  height: 76px;
  border: none;
  margin: 0;
  margin-bottom: 1px;
  padding: 1px;
}

.main {
  background-color: #ffffff;
  padding-bottom: 1.5cm;
}

.sidebar {
  font-size: 75%;
  width: 200px;
  float: right;
  margin: 0px;
}

.sidebar ul li {
  list-style: none;
}

/*
.sidebar .section {
  background-image: url("http://xenomachina.com/images/section-gradient.png");
  background-repeat: repeat-x;
  width: 200px;
  line-height: normal;
  text-align: left;
  border-color: #edf;
  border-style: solid;
  border-width: 1px 0 1px 1px;
  background-color: #e8e8e8;
  padding: 0 0 .75em 0;
  margin-top: 1em;
  overflow: hidden;

  -moz-box-shadow: 5px 5px 5px #bbb;
  -webkit-box-shadow: 5px 5px 5px #bbb;
  box-shadow: 5px 5px 5px #bbb;

}
  */

.sidebar .section {
  background-image: url("http://xenomachina.com/images/section-gradient.png");
  background-repeat: repeat-x;
  width: 200px;
  line-height: normal;
  text-align: left;
  border: none;
  background-color: #fff;
  padding: 0 0 3em 0;
  margin-top: 1em;
  margin-bottom: 2em;
  overflow: hidden;
}

#about-me {
  background-position: 240px 0;
}
#projects {
  background-position: 400px 0;
}
#linkblog {
  background-position: 160px 0;
}
#search {
  background-position: 320px 0;
}
#archives {
  background-position: 80px 0;
}

.sidebar .section h2 {
  line-height: 1;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  color: #370D86;
  padding:4px;
  margin-top: .25em;
  margin-bottom: .5em;
}

.sidebar ul {
  list-style: square;
  color: #338287;
  margin: 0;
  padding-left: 1.5em;
}

.sidebar p {
  margin: .75em 2em;
  color: #666;
  line-height: 140%;
}

.sidebar li span {
  color: #000;
}

.sidebar a {
  color: #006;
  text-decoration: none;
}

.sidebar a:hover {
  color: #00f;
  text-decoration: underline;
}

.sidebar form {
  padding-left: 4px;
  padding-right: 4px;
  display: block;
  width: 100%;
  text-align: center;
}

#archives form {
  padding-bottom: 1em;
}

.sidebar input {
  display: block;
  width: 85%;
  text-align: left;
  margin: auto;
}

#archives ul li {
  margin: auto;
  text-align: center;
}

.sidebar #disclaimer {
  text-align: center;
  font-size: 80%;
  color: #888;
  margin: 1ex;
}

.floats-are-stupid {
  margin-right: 204px;
}

.posts {
  margin: 0;
  padding: 1.5cm;
  margin: auto;
  max-width: 40em;
}

.day {
}

.day + .day {
  margin-top: 2em;
}

.day h3, .itemCommentList h3 {
  color: #990033;
}

.day h3 {
  display: none;
}

.item, .itemComment {
  margin-left: 1em;
  line-height: normal;
}

.itemBacklinkTitle {
  font-style: italic;
}

.post-paginator + .day,
.day + .day,
.day + .post-paginator,
.item + .item {
  padding-top: 4em;
}

.item .body {
  margin-left: 2em;
}

.itemControls {
  text-align: right;
  margin-top: 1.5em;
  font-size: 75%;
  color: #7f7f7f;
  clear: left;
}

a.permalink {
  color: #663399;
  text-decoration: none;
}

a.permalink:hover {
  color: #0000ff;
}

a.permalink:visited {
  color: #330066;
}

.end-sign {
  vertical-align: middle;
  font-size: 300%;
}

.sidebar .section img {
  vertical-align: middle;
  padding-right: .5ex;
}

.sidebar #about-me li {
  white-space: nowrap;
}

.footer {
  border-top: 1px solid #000070;
  border-bottom: 1px solid #000070;
  clear: both;
  background-color: #370D86;
  background-image: url("http://xenomachina.com/xm-bottom-plasma.png");
  background-repeat: repeat-x;
  height: 36px;
}

.footer #copyright {
  padding-top: 10px;
  text-align: center;
  color: #000070;
  font-size: 12px;
}

.footer #bloggerbutton img {
  float: right;
  border: none;
  margin: 3px;
}

.itemCommentList,
.itemBacklinkList {
  margin-top: 2em;
  padding: 8px;
}

.itemCommentListControls a,
.itemBacklinkListControls a {
  font-size: 85%;
  font-weight: normal;
  margin-top: 1em;
  border: 2px outset #d6d6d6;
  background-color: #d6d6d6;
  display: table;
  padding: 4px 1em 4px 1em;
  text-decoration: none;
  color: #336;
  float: right;
}

.itemCommentListControls a:active,
.itemBacklinkListControls a:active {
  border: 2px inset #d6d6d6;
}


.itemComment {
  background-image: url("xm-opencomment.png");
}


.itemBacklink {
  background-image: url("xm-openbacklink.png");
}

.itemComment,
.itemBacklink {
  margin: 1em;
  padding-top: 8px;
  padding-left: 32px;
  background-repeat: no-repeat;
  color: #336;
}


.itemCommentBody,
.itemBacklinkSnippet {
  margin-left: 0;
  font-style: italic;
}

.itemCommentByline,
.itemBacklinkByline {
  font-variant: small-caps;
  line-height: 1;
  text-align: right;
  font-size: 85%;
  font-weight: normal;
  padding:4px;
  margin-bottom: 2px;
}

.itemCommentByline, .itemCommentByline a,
.itemBacklinkByline, .itemBacklinkByline a {
  color: #999;
}

.itemCommentByline a,
.itemBacklinkByline a {
  text-decoration: none;
}

.itemCommentByline a:hover,
.itemBacklinkByline a:hover {
  text-decoration: underline;
  color: #66f;
}

.itemCommentControls,
.itemBacklinkControls {
  color: #990033;
}

.itemCommentControls a, .itemCommentControls a:hover,
.itemBacklinkControls a, .itemBacklinkControls a:hover {
  text-decoration: none;
}

.delete-comment-icon {
  float: right;
  width: 16px;
  height: 16px;
  font-size: 16px;
  background-repeat: no-repeat;
  margin-left: 1ex;
}

/* This is to make sure that the main div is at least as tall as the
 * sidebar. This seems pretty ugly to me. If you know of a better
 * way to do this, please let me know.
 */
#hack {
  clear: both;
  height: 3px;
}

ul li + li {
  margin-top: 1em;
}

#linkblog h3,
#linkblog div.f {
  display: none;
}

.item a img {
  margin: 1ex;
  border: 1px solid #6699ff;
}

.item a img[border] {
  border: none;
}

dd + dt {
  margin-top: 1em;
}

.userid:after {
  content: "@";
}

.atsign {
  display: none;
}

body.thumbnail_gallery h1,
body.photo h1 {
  color: black;
}

body.thumbnail_gallery .footer,
body.photo .footer {
  margin-top: 3ex;
}

.photopanel {
  background-color: #fff;
  border: 1px solid #000;
  margin: auto;
  padding: 3ex;
  max-width: 532px;
  margin-top: 3ex;
  text-align: center;
}

.photopanel .photo {
  vertical-align: center;
  height: 508px;
  width: 508px;
}

.photopanel img {
  border: 1px solid #888;
  margin:2px; padding:0; vertical-align: bottom;
}

.photopanel a:hover img {
  border: 1px solid #44f;
}

.controls a, .controls a:visited {
  text-decoration: none;
  font-weight: bold;
  margin: auto;
  color: #407;
}

.photopanel h1 {
  height: 2em;
}

.controls a:hover {
  color: #cc8;
}

.photopanel .description {
  width: 508px;
  border: 1px inset;
  background-color: #ffd;
  margin-top: 1ex;
  padding: 1ex;
}

.post-paginator {
  text-align: center;
  margin-left: 1em;
}
.post-paginator a:before,
.post-paginator a:after {
  font-size: 75%;
  vertical-align: center;
}
#newer-posts a:after, #newer-posts a:before {
  content: ' △ ';
}
#older-posts a:after, #older-posts a:before {
  content: ' ▽ ';
}

.figure {
  text-align: right;
  font-family: 'Ubuntu', Bitstream Vera Sans, Verdana, sans-serif;
  font-weight: bold;
  color: #888;
  margin-top: 1em;
  margin-bottom: 2em;
  font-size: 80%;

  border: 1px solid #ccc;
  -moz-box-shadow: 5px 5px 5px #bbb;
  -webkit-box-shadow: 5px 5px 5px #bbb;
  box-shadow: 5px 5px 5px #bbb;
}
.figure p {
  margin: 2em 1ex 1ex 20%;
}

hr {
  border: 2px solid #cce;
  width: 80%;
  color: #cce
  background-color: #cce;
  height: 4px;
  padding:0;
  margin:2em;
}