/*
Theme:  LocalBranding KF-Website Theme - Contao
Author: LocalBranding
*/
/**
 * Fix fonts that render as bold in Firefox
 *
 * Put this near the top of your style.css
 * Before any overriding styles
 */

html {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  font-weight: 300;
}

/**
 * Firefox specific rule
 */

@-moz-document url-prefix() {
  body {
    font-weight: lighter!important;
  }
}
/* ///// Fonts ///// */

/* ///// Fonts ///// */
@font-face {
    font-family: 'ClientFont';
    src: url('../fonts/Montserrat-Bold.eot');
    src: local('Montserrat Bold'), local('Montserrat-Bold'),
        url('../fonts/Montserrat-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Montserrat-Bold.woff2') format('woff2'),
        url('../fonts/Montserrat-Bold.woff') format('woff'),
        url('../fonts/Montserrat-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'ClientFont';
    src: url('../fonts/Montserrat-Italic.eot');
    src: local('Montserrat Italic'), local('Montserrat-Italic'),
        url('../fonts/Montserrat-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Montserrat-Italic.woff2') format('woff2'),
        url('../fonts/Montserrat-Italic.woff') format('woff'),
        url('../fonts/Montserrat-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'ClientFont';
    src: url('../fonts/Montserrat-Light.eot');
    src: local('Montserrat Light'), local('Montserrat-Light'),
        url('../fonts/Montserrat-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Montserrat-Light.woff2') format('woff2'),
        url('../fonts/Montserrat-Light.woff') format('woff'),
        url('../fonts/Montserrat-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'ClientFont';
    src: url('../fonts/Montserrat-Regular.eot');
    src: local('Montserrat Regular'), local('Montserrat-Regular'),
        url('../fonts/Montserrat-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Montserrat-Regular.woff2') format('woff2'),
        url('../fonts/Montserrat-Regular.woff') format('woff'),
        url('../fonts/Montserrat-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* ///// Core Colors ///// */
:root{
  /* Brand Colors Primary */
  --spotcolor1: #32317a;
  --spotcolor2: #FFFFFF;

  /* Greytones */
  --black: #2f2f2f;
  --midgrey: #656565;
  --lightgrey: #C2C2C2;
  --white: #fff;
  --bodybackground: #f2f2f2;

  /* UI Colors */
  --error: #FB478A;
  --success: #8CCC30;
  --info: #47BEFB;
  --signal: #FF742D;
  --warning: #FBD747;
  --inactive: #9D9D9D;

  /* Border Radius */
  --theme-radius: 0.3rem;

  /* Spacing */
  --space-xxl: 10rem;
  --space-xl: 5rem;
  --space-l: 4rem;
  --space-m: 3rem;
  --space-s: 2rem;
  --space-xs: 1rem;
  --space-xxs: 0.5rem;

  /* negative Spacing */
  --n-space-xxl: -10rem;
  --n-space-xl: -5rem;
  --n-space-l: -4rem;
  --n-space-m: -3rem;
  --n-space-s: -2rem;
  --n-space-xs: -1rem;
  --n-space-xxs: -0.5rem;

  /* Font Families */
  --theme-font1: 'ClientFont', sans-serif;
  /* If a second Font is used take this variable
  --theme-font-2: 'value';
  */

  /* Font Sizes */
  --font-xxl: 5rem;
  --font-xl: 4rem;
  --font-l: 3.5rem;
  --font-m: 2.6rem;
  --font-sm: 1.8rem;
  --font-s: 1.6rem;
  --font-xs: 1.4rem;
  --font-xxs: 1.2rem;

  /* Line Heights */
  --lh-xxl: 8rem;
  --lh-xl: 7rem;
  --lh-l: 4.3rem;
  --lh-m: 3.5rem;
  --lh-s: 2.6rem;
  --lh-xs: 2.4rem;
  --lh-xxs: 2.4rem;

  /* Radius */
  --theme-radius: 2px;
  --theme-radius-top: 2px 2px 0 0;
  --theme-radius-bottom: 0 0 2px 2px;

  /* Shadows */
  --text-shadow: 0px 3px 6px rgba(0,0,0, 0.3);
  --box-shadow: 0px 3px 6px rgba(0,0,0,0.1);
  --deep-shadow:  0 16px 8px 0px rgba(60,64,67,0.302), 0 3px 8px 8px rgba(60,64,67,0.149),  0 3px 4px 4px rgba(60,64,67,0.149);

  /* transition */
  --theme-transition:  all 0.3s cubic-bezier(.72,.28,.33,.93);

  /* Borders */
  --theme-border-interactive: 5px solid var(--spotcolor1);
  --theme-border-inactive: 5px solid var(--lightgrey);
  --theme-border-white: 5px solid var(--white);
}
