/**
 * White theme for reveal.js. This is the opposite of the 'black' theme.
 *
 * By Hakim El Hattab, http://hakim.se
 */


// Default mixins and settings -----------------
@import "../template/mixins";
@import "../template/settings";
// ---------------------------------------------


// Include theme-specific fonts
@import url(../../lib/font/source-sans-pro/source-sans-pro.css);


// Override theme settings (see ../template/settings.scss)
$backgroundColor: #0c4eb2;
$mainColor: #fff;
// $headingColor: #fff;
// $backgroundColor: #7c2;
// $mainColor: #333;
// $headingColor: #333;

$mainFontSize: 38px;
$mainFont: 'Source Sans Pro', Helvetica, sans-serif;
$headingFont: 'Source Sans Pro', Helvetica, sans-serif;
$headingTextShadow: none;
$headingLetterSpacing: normal;
$headingTextTransform: uppercase;
$headingFontWeight: 600;
// $linkColor: #2a76dd;
$linkColor: rgba(255,255,255,.75);
$linkColorHover: lighten( $linkColor, 15% );
$selectionBackgroundColor: lighten( $linkColor, 25% );

$heading1Size: 2.5em;
$heading2Size: 1.6em;
$heading3Size: 1.3em;
$heading4Size: 1.0em;

section.has-dark-background {
  &, h1, h2, h3, h4, h5, h6 {
    color: #fff;
  }
}

.reveal {

  .slide-background.deck-slide {
    background-position: top -100px right -250px;
    background-size: 800px;
  }

  .deck-slide {
    text-align: left!important;

    hgroup {
      display: block;
      margin-top: 7em;
      margin-left: -3em;
    }

    h1 {
      margin-bottom: 0;
    }

    .profile {
      margin-top: 1em;
      margin-left: -3em;
      img {
        width: 120px;
        border-radius: 50%;
        display: inline-block;
        margin-top: -2em;
        vertical-align: baseline;
      }

      p {
        display: inline-block;
        vertical-align: 110%;
        font-size: 0.65em;
        margin-left: 0.5em;
      }

      a {
        color: #fff;
      }
    }
  }

  .progress {
    height: 20px;

    span {
      background: rgba(255,255,255,.75)!important;
      position: relative;

      &:after {
        content: '';
        height: 60px;
        width: 60px;
        position: absolute;
        right: -1.2em;
        top: -1em;
        background-image: url("/img/enterjs-logo.svg");
        background-repeat: no-repeat;
        background-size: cover;
        transform: rotateZ(-16deg);
      }
    }
  }

  .controls {
    right: 10px;
    bottom: 25px;
  }

  .headline {
    font-size: 2em;
  }

  img {
    margin-top: 0!important;
    box-shadow: none!important;
    background: none!important;
    border: none!important;
  }

  p {
    font-size: 1em;
    margin-top: 1em!important;
  }

  ul {
    margin-top: 0.5em!important;
  }

  li {
    font-size: 1em;
    line-height: 1.6em;
  }

  code {
    font-size: 1em;
  }

  pre {
    box-shadow: none!important;
    code,
    hl-code { 
      font-size: 1.4em;
      line-height: 1.4em;
      padding: 0.8em!important;
      background: transparent;
      max-height: none!important;
    }

    hl-code {
      display: block;
      color: rgba(255,255,255,0.3);

      span {
        color: #fff;
      }
    }
  }
}

// Theme template ------------------------------
@import "../template/theme";
// ---------------------------------------------
