@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Open+Sans:wght@400;500;600;700&display=swap');

:root {
 --mark: #1976D2;         /* mocny niebieski */
  --mark-light: #63A4FF;   /* jaśniejszy błękit */
  --mark-dark: #0D47A1;    /* ciemny granat */
  --mark2: #FFA000;        /* intensywny pomarańcz */
  --mark2-light: #FFCA28;  /* złoto-pomarańczowy */
  --mark2-dark: #FF6F00;   /* ciemny bursztyn */
  --grey-darker: #2C2C2C;
  --grey-dark: #444444;
  --grey: #888888;
  --grey-light: #CCCCCC;
  --grey-lighter: #F2F2F2;
  --black: #000000;
  --white: #FFFFFF;
  --red: #E53935;
  --yellow: #FDD835;
  --font-family-header: 'Bebas Neue', sans-serif;
  --font-family-header-light: 400;
  --font-family-header-regular: 400;
  --font-family-header-medium: 400;
  --font-family-header-bold: 400;
  --font-family-header-extra-bold: 400;
  --font-family-text: 'Open Sans', sans-serif;
  --font-family-text-light: 400;
  --font-family-text-regular: 500;
  --font-family-text-medium: 600;
  --font-family-text-bold: 700;
	--font-family-icon-google: 'Material Symbols Outlined';
	scroll-behavior: smooth;
}
body.dark_mode {
	--mark:#EF5350;
	--mark-light:#E57373;
	--mark-dark:#F44336;
	--mark2:var(--mark);
	--mark2-light:var(--mark-light);
	--mark2-dark:var(--mark-dark);
	--grey-dark:#f1f2f6;
	--grey-darker:#ccc;
	--grey:#888888;
	--grey-light:#424242;
	--grey-lighter:#272727;
	--black:#dedede;
	--white:#141414;
	--red:#f00;
	--yellow:#ff0;
}