body, html {
  margin:0;
  height:100%;
  background: #FFFFFF;
  background-image: url("img/light-background.png");
  background-size: 100% 100%;
}

.center {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.contain {
  display:block;
  width:100%; height:100%;
  object-fit: contain;
}

.stretch {
  display:block;
  width:100%; height:100%;
}

.cover {
  display:block;
  width:100%; height:100%;
  object-fit: cover;
}

@media (prefers-color-scheme: dark) {
  body {
    margin:0;
    height:100%;
    background: #FFFFFF;
    background-image: url("img/dark-background.png");
    background-size: 100% 100%;
  }
}



/* Cookie Though Styling */
.cookie-though {
  /* The colors used to style the modal */
  --ct-primary-400:  #009499;
  --ct-primary-300:  #009499;
  --ct-primary-200:  #c1ddb5;
  --ct-primary-100:  #cce3c2;

  /* The colors used to style: customizationButton, headerDescription and cookiePolicy */
  --ct-text: #6b7280;

  /* The colors used to style the title elements */
  --ct-subtitle: var(--ct-primary-300);
  --ct-title: var(--ct-primary-400);

  /* The color used to style the cookie svg */
  --ct-cookie: var(--ct-primary-400);

  /* The colors used to style a policy */
  --ct-policy: var(--ct-white);
  --ct-policy-enabled: var(--ct-primary-400);
  --ct-policy-text: var(--ct-primary-400);
  --ct-policy-text-enabled: var(--ct-white);
  --ct-policy-essential: var(--ct-primary-100);

  /* The colors used to style the sliders */
  --ct-slider-primary: var(--gray-400);
  --ct-slider-secondary: var(--gray-300);
  --ct-slider-enabled-primary: #4c4cff;
  --ct-slider-enabled-secondary: #b3b3ff;

  /* The font color of the text inside a policy when it's enabled  */
  --ct-enabled-option-color: var(--ct-white);

  /* The white color */
  --ct-white: #ffffff;

  /* The margin underneath text elements */
  --ct-text-margin: 0.25rem;

  /* The padding of the modal and margin of the banner, toggleButton and customization */
  --ct-default-padding: 1rem;

  /* The padding/margin used to seperate the options and the permission buttons */
  --ct-seperator-padding: 0.5rem;

  /* The font size of the header title */
  --ct-heading-font-size: 1.25rem;

  /* The font size of the header sub title */
  --ct-sub-heading-font-size: 0.875rem;;

  /* The font size of text */
  --ct-text-font-size: 0.75rem;

  /* The font size of the customize button and permission button labels */
  --ct-button-font-size: 0.8125rem;

  /* The font used in the app */
  --ct-primary-font: 'sofia-pro';

  /* The font used for header description and policy description */
  --ct-secondary-font: 'sofia-pro';

  /* The z-index you want the root container to have */
  --ct-z-index: 9999;
}