/* roboto-regular - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/roboto-v29-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/roboto-v29-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/roboto-v29-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/roboto-v29-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('../fonts/roboto-v29-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/roboto-v29-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
  }
  
  /* roboto-500 - latin */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/roboto-v29-latin-500.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/roboto-v29-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/roboto-v29-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/roboto-v29-latin-500.woff') format('woff'), /* Modern Browsers */
         url('../fonts/roboto-v29-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/roboto-v29-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
  }
  
  /* roboto-700 - latin */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/roboto-v29-latin-700.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/roboto-v29-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/roboto-v29-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/roboto-v29-latin-700.woff') format('woff'), /* Modern Browsers */
         url('../fonts/roboto-v29-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/roboto-v29-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
  }
  
  /* roboto-900 - latin */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: url('../fonts/roboto-v29-latin-900.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/roboto-v29-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/roboto-v29-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/roboto-v29-latin-900.woff') format('woff'), /* Modern Browsers */
         url('../fonts/roboto-v29-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/roboto-v29-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */
  }
  
  
:root {
  --primary-text-color: #212121;
  --primary-white-color: #ffffff;
  --secondary-text-color: #757575;
  
  --wombat_blue: #9c00d3ff;
  --wombat_yellow: #f7c100;
  --wombat_dark_blue: #28303d;
  --wombat_beige: #ede7de;
  --wombat_black: #212121;
  --wombat_white: #f0f0f0;

  --accent-color: var(--wombat_blue);
  --main-font: "Roboto", sans-serif;
  --secondary-font: "Verdana", sans-serif;
  /*--timing-function: 250ms cubic-bezier(0.4, 0, 0.2, 1);*/
  --moon_background: var(--wombat_dark_blue);
  --chat_header_background: var(--wombat_dark_blue);
  --chat_body_background: var(--wombat_beige);
  --light_background: var(--wombat_beige);
  --dark_background: var(--wombat_dark_blue);
  --shadow: rgba(0, 0, 0, 0.2);
  --footer_background: var(--wombat_black);
  --footer_color: var(--wombat_white);
  /* --footer_link_color: #a08c8c; */
  --footer_link_color: var(--wombat_yellow);
  /* --footer_link_hover: #736262; */
  --footer_link_hover: var(--light_background);
  --light_link_color: var(--accent-color);
  --light_link_hover_color: var(--dark_background);
  --dark_link_color: var(--wombat_yellow);
  --dark_link_hover_color: var(--light_background);
}

.mood-dark {
  --big_headline_color: var(--accent-color);
  --big_headline_shadow: 4px 4px 10px var(--accent-color);
  --body_background: var(--dark_background);
  --body_color: var(--wombat_white); 
  --slat_background: rgba(40, 48, 61, 0.9);
  --slat-bg_background: rgba(255, 255, 255, 0.1);
  --eyecatcher_background: var(--wombat_yellow);
  --eyecatcher_color: var(--wombat_black);
  --button_background: var(--light_background);
  --button_color: var(--wombat_black);
  --link_color: var(--dark_link_color);
  --link_hover_color: var(--dark_link_hover_color);
  --form_body_background: var(--dark_background);
  --form_body_color: var(--wombat_beige);
}

.mood-light {
  --big_headline_color: var(--accent-color);
  --big_headline_shadow: 1px 1px 3px var(--wombat_black);
  --body_background: var(--light_background); 
  --body_color: var(--wombat_black);
  --slat_background: rgba(255, 255, 255, 0.8);
  --slat-bg_background: rgba(40, 48, 61, 0.1);
  --eyecatcher_background: var(--wombat_yellow);
  --eyecatcher_color: var(--wombat_black);
  --button_background: var(--dark_background);
  --button_color: var(--wombat_white);
  --link_color: var(--light_link_color);
  --link_hover_color: var(--light_link_hover_color);
  --form_body_background: var(--light_background);
}
  /* width */
  ::-webkit-scrollbar {
    width: 10px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: var(--body_background);
    border-radius: 0px 5px 5px 0px;
  }
  
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: var(--accent-color); 
    border-radius: 0px 5px 5px 0px;
  }
  
  script{
    display: none;
  }
  
  body {
    font-family: var(--main-font);
  }