/*!
  Lithium - Site Styles for use within the Lithium Universe

  Copyright (c) 2014 Union of RAD - All rights reserved.

  The code is distributed under the terms of the BSD 3-clause
  License. For the full license text see the LICENSE file.
*/

/* General
---------------------------------------------------------------- */
.home pre code, .home .code pre {
    background: white;
    border-color: transparent;
    padding: 0;
}

/* Home
---------------------------------------------------------------- */
/* Fine tune spacing between sections. */
.home section + section {
  margin-top: 150px;
}
.home hr + section,
.home section + hr {
  margin-top: 120px;
}
.home section + hr {
  margin-top: 100px;
}
.home .latest-posts {
  margin-top: 80px;
}
.home .features {
  margin-top: 100px;
}
.home .features,
.home .define,
.home .eureka {
  min-width: 600px;
  max-width: 800px;
}

.home .docs .jumpboxes {
  justify-content: center;

}
.home .wild {
  min-width: 800px;
}

/* Features */
.features {
  width: 75%;
  margin: 0 auto 0 auto;
}
.features > h1 {
  margin-bottom: 40px;
}
.features article + article {
  margin-top: 30px;
}

/* Backers & In the Wild */
.backers {
  text-align: center;
}
.backers .logo-radify {
  position: relative;
  top: 3px;
}
.backers .logo-uor {
  position: relative;
  top: -10px;
  height: 70px;
}

.backers .logo-disko {
  height: 19px;
}
.backers .logo-ey {
  height: 29px;
}
.wild h1,
.backers article h1 {
  padding-top: 30px;
  border-top: 1px solid #e6e6e6;
}
.backers .upper {
  height: 65px;
}
.sponsors,
.creators {
  min-height: 150px;
  vertical-align: top;
  display: inline-block;
}
.creators {
  margin-right: 100px;
}
.backers .upper {
  padding: 0 60px;
}
.backers .upper a + a {
  margin-left: 40px;
}
.sponsors img,
.creators img {
  vertical-align: middle;
}
.wild {
  margin: 0 auto;
  width: 60%;
  text-align: center;
}
.wild .project {
  display: inline-block;
  margin: 5px 20px;
}
.wild a.title {
  font-weight: bold;
  border-color: transparent !important;
}
.wild .let-us-know {
  opacity: .5;
}

/* Latest Posts */
.latest-posts {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
.post-item {
  display: inline-block;
  text-align: left;
  max-width: 400px;
}
.post-item h1 {
  line-height: 1.2;
  min-height: 40px;
  text-align: left;
}
.post-item h1 a {
  text-decoration: none;
}
.post-item time {
  display: block;
  color: #CB0532;
  font-weight: bold;
  margin-bottom: 10px;
}
.post-item + .post-item {
  vertical-align: top;
  margin-left: 100px;
}

/* Define */
.define, .eureka {
  margin: 0 auto;
  width: calc(50% - 30px);
}

/* Eureka */
.eureka p {
  margin: 0;
  font-weight: bold;
  text-align: center;
  font-size: 30px;
  line-height: 1.2;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.eureka p + pre {
  margin-top: 2em;
}
.eureka pre {
  width: 100%;
}
.eureka pre > code {
  margin-left: -7px;
}

/* Home: Hero
---------------------------------------------------------------- */
.home .hero nav {
  margin-top: 3em;
}
.home .hero {
  overflow: hidden;
  position: relative;
  margin: -21px -60px 0 -60px;
  padding: 10% 0 10% 0;
  height: calc(100vh - 150px);
  max-height: 1000px;
  color: white;
}
.home .hero .text {
  margin-left: 80px;
  position: relative;
  z-index: 10;
}
.home .hero h2 {
  margin-top: 2px;
}
.home .hero h1, .home .hero h2 {
  display: inline-block;
  margin-bottom: 0;
  color: black;
  background: white;
  padding: 5px 10px;
}
.home .hero .area {
  top: 0;
  position: absolute;
  width: 200%;
  height: 200%;
}
.home .hero .area:nth-of-type(2) {
  background-image: url(../img/bg2dark.png);
  background-color: #180274;
  transform: rotate(26deg);
  z-index: 6;
  top: 50%;
  left: 10%;
  height: 250%;

}
.home .hero .area:nth-of-type(1) {
  z-index: 5;
  background-image: url(../img/bg2.png);
  background-color: #2F99A1;
  transform: rotate(210deg);
  width: 250%;
}
.home .hero .area:nth-of-type(3) {
  background-image: url(../img/bg2.png);
  background-color: #CB0532;
  transform: rotate(15deg);
  z-index: 4;
}
.home .hero nav > a + a {
  margin-left: -4px;
}
.home .hero a + a {
  margin-left: -4px;
}
.home .hero .source:before {
  background-image: url(../ico/github_mark.png);
}

.home .download-buttons {
  margin-top: 100px;
}

.home .download {
  display: inline-block;
  width: 300px;
  margin-top: 2px;
  font-family: Helvetica, Arial, sans-serif;
  text-align: left;
}
.home .download__title {
  display: block;
  font-size: 22px;
  margin-bottom: 5px;
}
.home .download__version {
  font-size: 16px;
  display: block;
}
.home .version {
  display: block;
  color: white;
  font-weight: bold;
}

/* Present
---------------------------------------------------------------- */
.present img {
  padding: 20px 0;
  max-width: 100%;
}

/* Versions
---------------------------------------------------------------- */
.supported-versions-table {
  table-layout: fixed;
}
.supported-versions-table tfoot {
  margin-top: 40px;
}
.sv--pre {
  background: gray;
}
.sv--live {
  background: #2F99A1;
}
.sv--sec {
  background: #180274;
}