/* Extra reset */
h1, h2, h3, h4, p, ul, ol, dl {
  margin: 0; }

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  position: relative;
  min-height: 100%; }

*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit; }

a {
  color: inherit;
  text-decoration: none; }

body {
  background: #e6e6e6;
  color: #677987;
  font-weight: 600;
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  line-height: 1;
  margin: 0 0 100px; }
  body.body-dark {
    background: #13171a; }

h1 {
  font-size: 48px;
  font-weight: 600;
  color: #d14e4e; }

h2 {
  font-size: 28px;
  font-weight: 600; }

h3 {
  font-size: 24px;
  font-weight: 600; }

h4 {
  font-size: 24px;
  font-weight: 600; }

a {
  text-decoration: none; }

p {
  margin-bottom: 20px;
  line-height: 1.4; }

ul {
  margin-bottom: 20px;
  list-style: disc outside; }
  ul li {
    line-height: 1.5;}

/* Wrappers */
.outer-wrapper {
  width: 1080px;
  margin: 0 auto; }
  .outer-wrapper::after {
    clear: both;
    content: "";
    display: table; }

.inner-wrapper {
  width: 850px;
  margin: 0 auto; }

.cookbook-version-selector {
    height: 40px;
    padding: 6px 10px;
    background-color: #f5f5f5;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    box-shadow: none;
    box-sizing: border-box; }

/* Code blocks */
pre code {
  display: block;
  padding: 20px;
  font-size: 14px;
  line-height: 20px; }

code {
  font-family: Consolas, Menlo, Courier, monospace;
  font-weight: normal;
  white-space: pre;
  background-color: #cecece;
  border-radius: 3px;
  color: #1d252a;
  padding: 2px;
  margin: 0 3px; }

.install-instructions {
  font-family: "Maven Pro", sans-serif;
  display: block;
  padding: 20px;
  font-weight: 700;
  margin-left: 25px;
  margin-bottom: 25px;
  font-size: 18px; }

.install-instructions:first-line {
  line-height: 0; }

/* Forms */
form {
  border-bottom: 1px solid #d9d9d9; }

/* Buttons */
.button {
  font-size: 18px;
  font-weight: 400;
  background-color: #d14e4e;
  color: #fff;
  padding: 10px 15px;
  border-radius: 3px;
  text-align: center;
  display: inline-block; }
  .button:hover {
    background-color: #bb3131; }

#paginator .button {
  background-color: #e6e6e6;
  font-size: 14px;
  color: #1D252A;
  margin: 0 0;
  display: inline-block;
  float: left;
  padding: 10px 8px;  }

#paginator .button.disabled {
  pointer-events: none;
  background-color: #d14e4e;
  color: #fff;  }

/* Cookbook items */
.cookbook-item {
  width: 100%;
  border: 1px solid #d9d9d9;
  border-radius: 3px;
  background: #f5f5f5;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 30px; }

.cookbook-item__titlebar {
  border-bottom: 1px solid #d9d9d9;
  padding: 15px 20px; }
  .cookbook-item__titlebar .item-title {
    display: inline-block;
    margin-right: 30px;
    font-size: 18px;
    font-weight: 700;
    color: #1d252a; }
  .cookbook-item__titlebar .item-title:last-child {
    float: right;
    margin-right: 0; }
  .cookbook-item__titlebar .item-title--small {
    font-size: 14px;
    font-weight: 600;
    color: #677987; }
  .cookbook-item__titlebar .item-title--light {
    color: #718493; }
  .cookbook-item__titlebar a:hover {
    color: #d14e4e; }

.cookbook-item__content {
  padding: 15px 20px;
  font-size: 18px;
  border-bottom: 1px solid #d9d9d9; }

.cookbook-item__footer {
  padding: 10px 20px; }
  .cookbook-item__footer::after {
    clear: both;
    content: "";
    display: table; }

.cookbook-item__action {
  float: right; }

/* Detail main content */
.detail-content {
  width: 780px;
  float: left;
  padding-top: 70px;
  padding-bottom: 60px; }

.detail-content__title {
  font-weight: 700;
  font-size: 30px;
  color: #677987;
  border-bottom: 1px solid #d9d9d9;
  padding-bottom: 10px;
  margin-bottom: 10px; }
  .detail-content__title span {
    font-size: 14px;
    font-weight: 600;
    padding-left: 30px; }

/** Markdown Content **/
.markdown {
  word-wrap: break-word;
  font-size: 16px; }

.markdown code {
  word-wrap: normal;
  overflow-x: scroll; }

.markdown h1 {
  font-weight: 700;
  font-size: 36px;
  color: #1d252a;
  margin-bottom: 25px; }

.markdown h2 {
  margin-bottom: 25px;
  font-size: 30px;
  color: #1d252a; }

.markdown h3, h4, h5, h6 {
  margin-bottom: 20px;
  color: #1d252a; }

.markdown a {
  color: #d14e4e; }

.markdown a:hover {
  text-decoration: underline; }

.markdown li p {
  white-space: pre-wrap; }

.markdown table {
  margin-bottom: 20px;
  width: 100%;  }

.markdown table tr {
  border-bottom: 1px solid #cecece; }

.markdown table tr:last-child {
  border-bottom: none; }

.markdown th, td {
  padding: 10px 15px;
  text-align: left; }

.dependency-list a:hover {
  color: #d14e4e; }

.detail-content__tabs {
  border-top: 1px solid #d9d9d9;
  padding-top: 30px;
  margin-bottom: 20px;
  margin-left: 0;
  padding-left: 0;
  list-style-type: none; }
  .detail-content__tabs::after {
    clear: both;
    content: "";
    display: table; }
  .detail-content__tabs li {
    float: left;
    margin-right: 20px; }
  .detail-content__tabs li:before {
    content: "";
    padding-right: 0; }
  .detail-content__tabs a {
    color: #d14e4e;
    text-transform: uppercase;
    font-size: 14px; }
    .detail-content__tabs li.active, .detail-content__tabs li:hover {
      border-bottom: 3px solid #d14e4e; }

/* Detail sidebar */
.detail-sidebar {
  padding: 10px;
  float: right;
  width: 275px;
  border: 1px solid #d9d9d9;
  border-radius: 3px;
  background: #f5f5f5;
  margin-top: 70px;
  font-size: 14px;
  font-weight: 600;  }
  .detail-sidebar h3, .detail-sidebar h4, .detail-sidebar dt {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 5px;
    color: #677987; }

.detail-sidebar__button {
  width: 100%;
  margin-top: 20px; }

.detail-sidebar__halfbutton {
  width: 49%;
  font-size: 14px;
  margin-top: 20px;
}

/* Feature blocks */
.feature-block {
  padding-top: 90px;
  padding-left: 310px;
  color: #94a7b4; }
  .feature-block + .feature-block {
    padding-top: 100px; }
  .feature-block:nth-child(even) {
    padding-left: 0;
    padding-right: 310px; }

.feature-block__title {
  font-size: 36px; }

.feature-block__media {
  float: left;
  width: 250px;
  margin-left: -310px; }

.feature-block:nth-child(even) .feature-block__media {
  float: right;
  margin-left: 0;
  margin-right: -310px; }

.feature-block__body {
  font-family: "Maven Pro", sans-serif;
  font-weight: 400;
  padding-top: 25px; }
  .feature-block__body p {
    line-height: 1.2; }

/* Footer */
.footer {
  background: #0e1113;
  color: #95a7b4;
  text-align: center;
  line-height: 62px;
  display: block;
  bottom: 0;
  width: 100%;
  position: absolute;  }

.footer__logo {
  display: inline-block;
  margin-left: 8px;
  position: relative;
  top: 2px; }

/* App page header */
.header-slim {
  height: 220px;
  border-top: solid 5px #d14e4e;
  padding-top: 70px;
  background: url(../images/header-slim.jpg) bottom center no-repeat #1d252a; }

.header-slim__container {
  padding-left: 540px;
  width: 1080px;
  margin: 0 auto; }

.header-slim__subtitle {
  font-size: 28px;
  color: #fff; }

/* Home page hero */
.home-hero {
  z-index: 0;
  height: 670px;
  text-align: center;
  text-shadow: 1px 0 1px rgba(0, 0, 0, 0.35);
  background: #333;
  overflow: hidden;
  position: relative; }

.home-hero__inner {
  width: 766px;
  margin: 0 auto;
  height: 100%;
  position: relative;
  background: url(../images/home-hero-bg.png) no-repeat -550px 0 #27323a; }

.home-hero__moon {
  position: absolute;
  left: 50px;
  top: 0;
  margin-top: 200px;
  width: 64px;
  height: 80px;
  background: url(../images/home-hero-moon.png) no-repeat 0 0;
  -webkit-transform: translate3d(0px, 0px, 0px);
  -moz-transform: translate3d(0px, 0px, 0px);
  -ms-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px); }

.home-hero__buildings-bg {
  position: absolute;
  left: 0px;
  bottom: 0;
  width: 902px;
  height: 348px;
  background: url(../images/home-hero-buildings-bg.png) no-repeat 0 0;
  -webkit-transform: translate3d(0px, 0px, 0px);
  -moz-transform: translate3d(0px, 0px, 0px);
  -ms-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px); }

.home-hero__title {
  font-weight: 700;
  padding-top: 60px; }

.home-hero__subtitle {
  font-size: 24px;
  color: #fff; }
  .home-hero__title + .home-hero__subtitle {
    margin-top: -4px; }

.home-hero__bg {
  height: 100%;
  position: absolute;
  bottom: 0;
  background: none no-repeat 0 100% #1d252a;
  z-index: 1;
  width: 0; }

.home-hero__bg--left {
  margin-left: -999px;
  padding-left: 999px;
  left: 0;
  background-position: 100% 100%;
  background-image: url(../images/home-hero-bg-left.png); }

.home-hero__bg--right {
  margin-right: -999px;
  padding-right: 999px;
  right: 0;
  background-image: url(../images/home-hero-bg-right.png); }

.home-hero__stars {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: translate3d(0px, 0px, 0px);
  -moz-transform: translate3d(0px, 0px, 0px);
  -ms-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px); }
  .home-hero__stars .home-hero__star {
    position: absolute;
    left: 200px;
    top: 100px;
    background: #f9f7b2;
    width: 4px;
    height: 4px;
    border-radius: 50px;
    opacity: 0;
    -webkit-animation: twinkle 5s 1s ease-in;
    -moz-animation: twinkle 5s 1s ease-in;
    animation: twinkle 5s 1s ease-in;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite; }
    .home-hero__stars .home-hero__star:nth-child(2) {
      left: 250px;
      top: 120px;
      -webkit-animation-delay: 0.3s;
      -moz-animation-delay: 0.3s;
      animation-delay: 0.3s; }
    .home-hero__stars .home-hero__star:nth-child(3) {
      top: 125px;
      left: 280px;
      width: 2px;
      height: 2px;
      -webkit-animation-delay: 4s;
      -moz-animation-delay: 4s;
      animation-delay: 4s; }
    .home-hero__stars .home-hero__star:nth-child(4) {
      top: 220px;
      left: 320px;
      -webkit-animation-delay: 4s;
      -moz-animation-delay: 4s;
      animation-delay: 4s; }
    .home-hero__stars .home-hero__star:nth-child(5) {
      left: 600px;
      top: 250px;
      opacity: 1;
      -webkit-animation-delay: 0.3s;
      -moz-animation-delay: 0.3s;
      animation-delay: 0.3s; }
    .home-hero__stars .home-hero__star:nth-child(6) {
      left: 630px;
      top: 210px;
      opacity: 1;
      width: 2px;
      height: 2px;
      -webkit-animation-delay: 4s;
      -moz-animation-delay: 4s;
      animation-delay: 4s; }
    .home-hero__stars .home-hero__star:nth-child(7) {
      left: 550px;
      top: 255px;
      -webkit-animation-delay: 4s;
      -moz-animation-delay: 4s;
      animation-delay: 4s; }
    .home-hero__stars .home-hero__star:nth-child(8) {
      left: 400px;
      top: 225px; }

.home-hero__buildings {
  background-image: url(../images/home-hero-buildings.png);
  background-repeat: no-repeat;
  background-position: 70px 0;
  width: 902px;
  height: 392px;
  position: absolute;
  bottom: -14px; }

/* Lamp post */
.wrapper-for-lamppost {
  position: relative; }

.wrapper-for-lamppost__inner {
  position: relative;
  height: 100%; }

.lamppost {
  position: absolute;
  width: 439px;
  height: 364px;
  bottom: -47px;
  right: -69px; }

.lamppost__main,
.lamppost__bulb,
.lamppost__highlight {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0; }

.lamppost__main {
  background: url(../images/lamppost.png) no-repeat 0 0; }

.lamppost__bulb {
  background: url(../images/lamppost-bulb.png) no-repeat 0 0;
  -webkit-animation: flicker 5s 1s ease-in;
  -moz-animation: flicker 5s 1s ease-in;
  animation: flicker 5s 1s ease-in;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }

.lamppost__highlight {
  background: url(../images/lamppost-highlight.png) no-repeat 0 0;
  -webkit-animation: flicker 5s 1s ease-in;
  -moz-animation: flicker 5s 1s ease-in;
  animation: flicker 5s 1s ease-in;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }

.ground-highlight {
  background: url(../images/ground-highlight.png) no-repeat 0 0;
  width: 621px;
  height: 31px;
  position: absolute;
  bottom: -31px;
  right: -131px;
  -webkit-animation: flicker 5s 1s ease-in;
  -moz-animation: flicker 5s 1s ease-in;
  animation: flicker 5s 1s ease-in;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }

/* Home main */
.home-main {
  padding-bottom: 60px;
  background: url(../images/main-gradient.png) no-repeat 0 0; }

/* Supported platform list */
.platform-list {
  float: left; }
  .platform-list dt {
    font-size: 12px;
    text-transform: uppercase;
    padding-bottom: 5px; }
  .platform-list dd {
    float: left;
    display: inline;
    margin-left: 0;
    margin-right: 5px; }

/* Cookbook results title */
.results-title {
  padding: 20px 0 25px;
  font-family: "Maven Pro", sans-serif; }

/* Scroll reveal */
.scroll-reveal {
  opacity: 0;
  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  transition: all 1.5s ease;
  -webkit-transform: translate3d(0px, 50px, 0px);
  -moz-transform: translate3d(0px, 50px, 0px);
  -ms-transform: translate3d(0px, 50px, 0px);
  -o-transform: translate3d(0px, 50px, 0px);
  transform: translate3d(0px, 50px, 0px); }
  .scroll-reveal.is-visible {
    opacity: 1;
    -webkit-transform: translate3d(0px, 0px, 0px);
    -moz-transform: translate3d(0px, 0px, 0px);
    -ms-transform: translate3d(0px, 0px, 0px);
    -o-transform: translate3d(0px, 0px, 0px);
    transform: translate3d(0px, 0px, 0px); }

/* Search bar */
.search {
  width: 860px;
  display: table;
  margin: 0 auto;
  padding: 45px 0 40px;
  table-layout: fixed;
  font-size: 24px;
  font-weight: 400; }

.search__td {
  display: table-cell;
  vertical-align: top; }

.search__td input {
  width: 100%;
  height: 58px;
  line-height: 58px;
  padding-left: 70px;
  border: none;
  color: #fff;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  background: url(../images/icon-search.png) 20px 20px no-repeat #677987;
  outline: none; }
  .search__td input::-webkit-input-placeholder {
    color: #fff; }
  .search__td input::-moz-placeholder {
    color: #fff; }
  .search__td input:-moz-placeholder {
    color: #fff; }
  .search__td input:-ms-input-placeholder {
    color: #fff; }

.search__td button {
  line-height: 60px;
  padding: 0 20px;
  background-color: #d14e4e;
  color: #fff;
  border: none;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px; }
  .search__td button:hover {
    background: #bb3131; }

.search__td--btn {
  width: 115px; }

/* Fixed top bar */
.top-bar {
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  height: 65px;
  width: 100%;
  background: rgba(24, 31, 34, 0.8); }

.top-bar__inner {
  display: table;
  table-layout: fixed;
  height: 100%; }

.top-bar__cell {
  display: table-cell;
  vertical-align: middle;
  width: 50%; }

.top-bar__actions {
  text-align: right; }

.top-bar__logo {
  width: 242px;
  height: auto;
  display: block; }

.after-top-bar {
  padding-top: 65px; }

/** Normalizing Icon Names **/
.icon-apple,
.icon-laptop,
.icon-question,
.icon-windows  {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.icon-apple:before { content: "\f179"; }
.icon-laptop:before { content: "\f109"; }
.icon-question:before { content: "\f128" }
.icon-windows:before { content: "\f17a"; }
