/**
 * 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 "reveal.js/css/theme/template/mixins";
@import "reveal.js/css/theme/template/settings";
// ---------------------------------------------

@import "./colors";

// Include theme-specific fonts
@import url(https://fonts.googleapis.com/css?family=Raleway:900|Roboto:300,700);


// Override theme settings (see ../template/settings.scss)
$backgroundColor: #fff;

$mainColor: #000;
$headingColor: #000;

$mainFontSize: 42px;
$mainFont: 'Roboto', sans-serif;
$headingFont: 'Raleway', sans-serif;
$headingTextShadow: none;
$headingLetterSpacing: normal;
$headingTextTransform: none;
$headingFontWeight: 900;
$linkColor: $scandioRed;
$linkColorHover: lighten( $linkColor, 15% );
$selectionBackgroundColor: $scandioBlue;

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

$overlayElementBgColor: 0, 0, 0;
$overlayElementFgColor: 240, 240, 240;

.sc-gray {
  color: $scandioGray;
}

.sc-white {
  color: $scandioWhite;
}

@mixin half-size {
  width: calc(50% - 2em);
  height: 100%;
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.sc-left-and-right {
  position: absolute;
  width: 100%;
  height: 100%;

  .sc-left {
    @include half-size;
    left: 0;
    align-items: flex-end;
    text-align: right;
  }

  .sc-right {
    @include half-size;
    right: 0;
    align-items: flex-start;
    text-align: left;
  }
}

ul {
  padding: 0;
  li {
    margin: 24px 0;
    &::marker {
      color: $scandioBlue;
    }
    &:not(:first-child) {
      & {
      }
    }
  }
}

img.diagram {
  height: 600px;
}

// Change text colors against dark slide backgrounds
@include dark-bg-text-color(#fff);


// Theme template ------------------------------
@import "reveal.js/css/theme/template/theme";
// ---------------------------------------------