// -----------------------------------------------------------------------------
// This file contains very basic styles.
// -----------------------------------------------------------------------------

html {
  box-sizing: border-box;
}

body {
  min-height: 100vh;
  $svg-gradient-shim-threshold: 1 !global;
  @include background-image(linear-gradient(to bottom right, #000f56, #000000));
  font-family: $font-sans;
}

/**
 * Make all elements from the DOM inherit from the parent box-sizing
 * Since `*` has a specificity of 0, it does not override the `html` value
 * making all elements inheriting from the root box-sizing value
 * See: https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/
 */
*, *::before, *::after {
  box-sizing: inherit;
}

.content {
  width: 95%;
  margin: 0;
  padding: 27px 0px 27px 335px;
  
  @include respond-to('lg') {
    width: 95%;
    padding: 41px 0px 41px 434px;
  }
  
  @include respond-to('xxl') {
    width: 90%;
    padding: 55px 0px 55px 572px;
  }
}

.sheet {
  width: 100%;
  min-height: 100vh;
  position:absolute;
  top: 300px;
  background-color: white;
  
  @include respond-to('lg') {
    top: 400px;
  }
  
  @include respond-to('xxl') {
    top: 500px;
  }
}

a {
  color: $brand-color;
  text-decoration: none;

  @include on-event {
    color: $text-color;
    text-decoration: underline;
  }
}


