@import 'compass/utilities';

body, html {
  margin: 0;
  padding: 0;
}

#slides-container {
  position: absolute;
  width: 100%;
  height: 100%;
  @include clearfix;
}

body.loading {
  #slides-container {
    opacity: 0;
  }
}

#slides {
  position: absolute;
  top: 0;
  height: 100%;

  .slide {
    @include float-left;
    position: relative;
    height: 100%;

    .content {
      text-align: center;

      position: absolute;
      left: 5%;
      width: 90%;

      h1, h2, h3 {
        margin: 0;
      }

      h1 {
        font-size: 5em;
      }

      h2 {
        font-size: 3em;
      }

      h3 {
        font-size: 1.75em;
      }

      div.highlight {
        text-align: left;

        padding: 1em;

        font-size: 160%;

        pre {
          margin: 0;
        }
      }
    }

    &.style-larger {
      div.highlight {
        font-size: 200%;
      }
    }

    &.style-even-larger {
      div.highlight {
        font-size: 250%;
      }
    }
  }
}