/*
Columns:
660, 40 padding, 260

Colors:

Text Black:     #232323
Subtitle:       #526d95
Subtitle Dark:  #325680
Light Text:     #445056
Link Blue:      #282d66

Highlight:      #ffffcc
Divider:        #ccc
*/

/* 960px wide centered box, for debugging */
#grid {
  width: 960px; height: 1000px;
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: -480px;
  border: 1px dotted red;
  z-index: 1000;
  display: none;
}

body {
  background: #fff url(/images/embed/home/stripes.png);
  font: 13px/18px Helvetica, Segoe, "Segoe UI", Arial, sans-serif;
  color: #232323;
}
  body.homepage {
    font-size: 15px;
    line-height: 22px;
  }

.sans, h6 small {
  font-family: "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif;
}

.imagetext {
  text-indent: -10000px;
}

a, a:link, a:visited, #help a, #help a:visited {
  color: #282d66;
}
  a:hover, a:active, #help a:hover, #help a:active {
    color: #000033;
  }
  a.imagelink {
    padding: 0;
    border: 0;
  }
  a .minibutton {
    text-decoration: none;
  }

body > h1 {
  position: absolute;
  width: 960px;
  text-align: left;
  z-index: 5;
  top: 92px; left: 50%;
  margin-left: -480px;
  font-weight: 300;
  font-size: 22px;
  color: #fff;
}
h2, #help h1, #help h2 {
  position: static;
  font-weight: 300;
  text-align: left;
  font-size: 22px;
  margin: 40px 0 20px 0;
}
  body.homepage h2 {
    font-size: 25px;
    margin: 0;
    padding: 3px 0 25px 45px;
  }
h3, #help h3 {
  font-weight: 300;
  font-size: 16px;
  margin: 20px 0 10px 0;
}
h6 {
  font-weight: 300;
  font-size: 16px;
  line-height: 18px;
  margin: 30px 0 0 0;
}
  h6 small {
    display: block;
    color: #445056;
    font-weight: normal;
    font-size: 11px;
    white-space: nowrap;
    margin-bottom: 5px;
  }

p {
  margin-bottom: 18px;
}

ul.bullet, #help ul {
  margin: 0 0 25px 16px;
  list-style-type: circle;
}
  ul.bullet li, #help ul li {
    margin-bottom: 15px;
    width: 500px;
  }
    ul.bullet li h6 {
      margin-top: 0;
    }

ol {
  margin: 0 0 25px 16px;
}
  ol.decimal {
    list-style-type: decimal;
  }
  ol.lower_alpha {
    list-style-type: lower-alpha;
  }
  ol.lower_roman {
    list-style-type: lower-roman;
  }
  ol li {
    margin-bottom: 15px;
  }

#sky {
  position: absolute;
  top: 70px; left: 0; right: 0;
  height: 82px;
  background: transparent url(/images/embed/home/sky_small.png) repeat-x 0 0;
  z-index: 3;
}
  body.homepage #sky {
    height: 350px;
    background: transparent url(/images/embed/home/sky.png) repeat-x 0 0;
  }

#logo {
  position: absolute;
  right: 50%; top: 86px;
  margin-right: -479px;
  z-index: 5;
}

#toolbar {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 79px;
  z-index: 50;
  background: url(/images/embed/home/toolbar.png);
}
  #innerbar {
    width: 1030px;
    position: absolute;
    left: 50%;
    margin-left: -515px;
  }
    #nav {
    }
      #nav li {
        width: 206px;
        height: 70px;
        margin: 0;
        float: left;
        cursor: pointer;
        background-repeat: no-repeat;
        background-position: center 12px;
      }
      #nav a {
        text-decoration: none;
        text-align: center;
        line-height: 22px;
      }
        #nav .nav_title {
          display: inline-block;
          font-size: 14px;
          padding: 7px 14px 0;
          text-shadow: 0 1px 0 #fefeff;
          background-position: right 14px;
        }
        #nav .nav_subtitle {
          font-size: 11px;
          line-height: 13px;
          color: #526d95;
          text-shadow: 0 1px 0 #e5e5ef;
        }
          #nav a:hover .nav_subtitle {
            color: #3a5085;
          }
        #nav li .mark {
          display: block;
          height: 70px;
        }
          #nav .mark.active {
            background: url(/images/embed/home/tip.png) no-repeat center bottom;
          }

#workspace_link {
  display: block;
  position: absolute;
  width: 314px; height: 262px;
  top: 115px; left: 50%;
  margin-left: -480px;
  z-index: 6;
}
#docs_wrapper {
  position: absolute;
  width: 1009px;
  top: 72px; left: 50%;
  margin-left: -508px;
  z-index: 5;
}
  #featured_document {
    position: absolute;
    right: 68px;
    top: 30px;
  }
    #featured_document img {
      -ms-interpolation-mode: bicubic;
    }

#container {
  position: relative;
  width: 960px;
  margin: 170px auto 0;
}
  body.homepage {
    margin: 425px auto 0;
  }

#content {
  width: 620px;
  padding-bottom: 25px;
}
  body.homepage #content {
    width: 650px;
  }
  #content h1:first-child {
    margin-top: 0;
  }

  #content.featured h1 {
    position: static;
    text-align: left;
    z-index: 1;
    margin: 0.4em 0;
    font-weight: 1;
    font-size: 22px;
    color: #232323;
  }
  #content.featured h2 {
    position: static;
    text-align: left;
    z-index: 1;
    margin: 0.4em 0;
    font-weight: 1;
    font-size: 18px;
    color: #232323;
  }
  #content.featured h3 {
    position: static;
    text-align: left;
    z-index: 1;
    margin: 0.4em 0;
    font-weight: 1;
    font-size: 16px;
    color: #232323;
  }

  #content.featured blockquote {
    margin: 1em 3em;
    color: #999;
    border-left: 2px solid #999;
    padding-left: 1em;
  }
  #content.featured p {
    margin-bottom: 0.3em;
  }
  #content.featured ul {
    list-style: disc inside;
    padding-left: 0.5em;
  }
  #content.featured hr {
    margin-top: 6px;
  }


#content hr {
  border: 0;
  background: #ccc;
  height: 1px;
  margin-top: 30px;
}
#content .graf {
  position: relative;
  margin: 30px 0 15px;
}
  #content .graf.section {
    margin-top: 25px;
  }
    #content .graf.section:first-child {
      margin-top: 0;
    }
#content .visual {
  float: right;
  border: 1px solid #ccc;
  margin: 0 0 0 20px;
  box-shadow: 0px 0px 3px #ccc; -webkit-box-shadow: 0px 0px 3px #ccc; -moz-box-shadow: 0px 0px 3px #ccc;
}
  #content .visual.left {
    float: left;
    margin: 0 20px 0 0;
  }

#content #faqs ul li {
    padding-left: 10px;
    list-style: circle inside;
}

#content p.bio {
  position: relative;
  padding-left: 100px;
}
  #content img.headshot {
    position: absolute;
    left: 0;
    border: 3px solid #ddd;
    width: 80px; height: 80px;
  }

.number {
  position: absolute;
  top: 0; left: 0;
  display: block;
  width: 28px; height: 28px;
  background: url(/images/embed/home/numbers.png);
}
  .number.two {
    background-position: 0 -49px;
  }
  .number.three {
    background-position: 0 -99px;
  }

.github_link {
  display: inline-block;
  width: 16px; height: 16px;
  position: relative;
  top: 3px; left: 10px;
  background: url(/images/embed/home/github.png);
}

.columns {
  margin-top: 30px;
}
  .columns .column {
    width: 174px;
    float: left;
    margin-left: 40px;
  }
    .columns .column.one {
      margin-left: 16px;
    }
    .columns ul.column li {
      width: auto;
      font-size: 11px;
      line-height: 14px;
      margin-bottom: 10px;
    }

#sidebar .sidebar_section, #tweets .content {
  border-radius: 3px;
  border: 1px solid #ccc;
  background: #fff url(/images/embed/home/sidebar.png) repeat-x top left;
  box-shadow: 0px 0px 3px #ccc; -webkit-box-shadow: 0px 0px 3px #ccc; -moz-box-shadow: 0px 0px 3px #ccc;
}

#tweets {
  padding: 40px 30px 10px;
  border-top: 1px solid #ccc;
}
  #tweets .bird {
    float: left;
    width: 81px; height: 50px;
    background-image: url(/images/embed/home/tweet.png);
  }
    #tweets .right .bird {
      float: right;
      background-position: 0 -50px;
    }
  #tweets .content {
    padding: 15px 25px;
    border: 1px solid #ccc;
    background: white;
    margin: 5px 220px 30px 90px;
    text-align: center;
    color: #445056;
  }
    #tweets .right .content {
      margin: 5px 90px 30px 220px;
    }
    #tweets .text {
      font-weight: 300;
      font-size: 16px;
      line-height: 20px;
    }
    #tweets .user {
      margin-top: 5px;
      font-size: 11px;
    }

#pitch {
  text-align: center;
  font-size: 20px;
  line-height: 26px;
  font-weight: 300;
}
  #pitch .minibutton {
    width: 120px;
    margin: 20px auto;
  }

#sidebar {
  width: 260px;
  float: right;
  margin-bottom: 25px;
  font-size: 11px;
  line-height: 14px;
  color: #445056;
}
  #sidebar .sidebar_section {
    position: relative;
    margin-bottom: 30px;
    padding: 15px;
    text-align: center;
  }
    #sidebar .login_section {
      overflow: hidden;
    }
  #sidebar .minibutton {
    display: inline-block;
    margin: 15px auto 0;
  }
  #sidebar .section_title {
    color: #333;
    font-size: 12px;
    font-weight: bold;
    height: 20px;
    padding-top: 4px;
    background: url(/images/embed/home/section_title.png);
    color: white;
    position: absolute;
    top: -1px; left: -1px;
    width: 258px;
    border: 1px solid #345790;
    border-top-color: #5070a9;
    border-top-left-radius: 3px; -webkit-border-top-left-radius: 3px; -moz-border-radius-topleft: 3px;
    border-top-right-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topright: 3px;
  }
  #sidebar .error {
    margin: 0 0 15px;
    color: #aa2222;
  }
  #sidebar #login_form {

  }
    #sidebar .login_services {
      margin-top: 5px;
      float: left;
    }
    #sidebar #login_button {
      float: left;
    }
    #sidebar .reset_password {
      display: block;
      float: right;
      margin-top: 21px;
      font-size: 10px;
      color: #808080;
    }
  #sidebar ul {
    margin-top: 22px;
    text-align: left;
  }
    #sidebar li {
      margin-top: 10px;
    }
  #sidebar .text_input {
    margin-top: 10px;
  }
    #sidebar .text_input.first {
      margin-top: 0;
    }

#footer {
  position: relative;
  width: 960px;
  margin: 0 auto;
  padding: 25px 0 50px 0;
  border-top: 1px solid #ccc;
  font-size: 11px;
  color: #445056;
}
  #logos li {
    margin-right: 22px;
    float: left;
  }
    #logos a {
      position: relative;
    }
    #logos a.more {
      position: absolute;
      right: 0px;
      top: 36px;
    }
  #knight_credit {
    display: block;
    width: 150px; height: 23px;
    margin: 0 auto;
  }
  #calais_credit {
    display: block;
    width: 250px; height: 39px;
    margin: 0 auto;
  }
  #footer_links {
    margin: 8px 0 25px;
    text-align: center;
  }

#content #help {
  font: inherit;
  display: block;
  padding: 0;
  max-width: inherit;
  color: #000;
}
  #content #help ul {
    margin-left: 0;
    padding-left: 15px;
    color: #000;
  }
    #content #help ul li {
      padding-left: 5px;
    }
  #content #help .ajax_only {
    display: none;
  }
  #content #help .static_only {
    display: inline;
  }
  #content #help table {
    width: 620px;
  }
  #content #help #search_form .text_input {
    margin: 0 0 0 140px;
    width: 400px;
  }
