/* GLOBAL STYLES */

/* Use 1200px as mobile breakpoint, it is the Bootstrap XL breakpoint */

/*font-family: 'Oswald', sans-serif;*/
@font-face {
  font-family: 'Oswald';
  src: url('fonts/Oswald-VariableFont_wght.ttf');
}

:root, [data-bs-theme="light"] {
    /* COLORS */
    --color-cw: #ED1A3A;
    --color-cw-50: #FAC4CC;
    --color-cw-100: #F9B1BC;
    --color-cw-200: #F68B9C;
    --color-cw-300: #F3667B;
    --color-cw-400: #F0405B;
    --color-cw-500: #ED1A3A;
    --color-cw-600: #C00F2A;
    --color-cw-700: #8C0B1F;
    --color-cw-800: #580713;
    --color-cw-900: #240308;
    --color-cw-950: #0A0102;

    --color-neutral: #999999;
    --color-neutral-50: #FFFFFF;
    --color-neutral-100: #EFEFF0;
    --color-neutral-200: #CDCDCD;
    --color-neutral-300: #AAABAD;
    --color-neutral-400: #ABABB0;
    --color-neutral-500: #999999;
    --color-neutral-600: #808184;
    --color-neutral-700: #404040;
    --color-neutral-800: #27272A;
    --color-neutral-900: #070708;
    --color-neutral-950: #000000;

    /* Bootstrap style overwrites */
    --bs-border-radius: 0 !important;
    --bs-secondary-bg: var(--color-neutral-100);
    --bs-secondary-bg-rgb: rgba(var(--color-neutral-100), 1);
    --bs-border-color: var(--color-neutral-200);
}

/* mobile-only and desktop-only content */
@media (max-width: 1199px) {
    .mobile-only {
      display: inline-block;
    }
    .desktop-only {
      display: none;
    }
  }
  
  @media (min-width: 1199px) {
    .mobile-only {
      display: none;
    }
    .desktop-only {
      display: inline-block;
    }
}

/* CSS reset - http://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn,
em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav,
output, ruby, section, summary, time, mark, audio, video {
  font: inherit;
  padding: 0;
  border: 0;
  margin: 0;
  vertical-align: baseline
}

* {
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
}

html {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 100%;
  line-height: 1.25;
}

body {
  min-width: 330px;
  background-color: var(--color-neutral-100);

  &[data-bs-theme="dark"]{
    background-color: var(--color-neutral-800);
  }
}

img {
  max-width: 100%;
  height: auto;
}

svg {
  width: 100%;
  height: auto;
  max-height: 100%;
}

object {
  pointer-events: none;
}

main {
  min-height: calc(100vh - 110px); /* Make content use full screen minus navbar */
}