:root {
  --font-primary: 'Roboto', Arial, Helvetica, Trebuchet MS, Verdana, sans-serif;

  --font-size-tiny: 10px;
  --font-size-extra-small: 12px;
  --font-size-small: 14px;
  --font-size-normal: 16px;
  --font-size-big: 20px;
  --font-size-extra-big: 24px;

  --font-color-primary: #1E2023;
  --font-color-black: #212121;
  --font-color-primary-darker: #1B443C;
  --font-color-inverted: #fff;
  --font-color-brand-dark: #1BAA90;
  --font-color-blue: #596ACA;

  --color-brand-light: #DCECEC;
  --color-brand: #68D0BD;
  --color-brand-dark: #379D8B;
  --color-primary-light: #BDEAE2;
  --color-brand-pale: #C8EEE6;
  --color-warning: #EB445A;
  --color-warning-button: #F0445C;
  --color-success: #27C27D;
  --color-gray-poll: #EAEBF1;
  --color-gray-light: #F4F5F8;
  --color-gray-intermidiate: #E5E5E5;
  --color-gray-mild: #DDDDDD;
  --color-gray-C: #CCCCCC;
  --color-gray-dark: #A4A4A4;
  --color-gray-darker: #666666;
  --color-gray-darkest: #4D4D4D;
  --color-gray-navigation: #92949C;
  --color-chosen-date: #FBCB24;
  --color-facebook-blue: #4267B2;
  --color-screen-background-light: #FBFBFC;
  --color-tertiary: #4854E0;
  --color-secondary: #E0BF4A;
  --color-quaternary: #FCE307;
  --color-quaternary-golden: #FFCA22;

  --color-mui-danger: #D32F2F;

  --tipster-menu-button-size: 56px;
  --tipster-menu-button-padding: 15px;
  --standard-header-height: 60px;

  --tipster-menu-button-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: var(--font-primary);
}

body {
  margin: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  font-size: var(--font-size-normal);
  color: var(--font-color-primary);
  background: #fff;
}

.vb-ellipsis-string, .vb-font.ellipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow-x: hidden;
}
.vb-font.not-decor {
  text-decoration: none;
}
.vb-circle {
  border-radius: 50%;
}
.vb-pre {
  white-space: pre;
}


/* FONTS SIZE */
.vb-font.xBig {
  font-size: var(--font-size-extra-big);
}
.vb-font.normal {
  font-size: var(--font-size-normal);
}
.vb-font.small {
  font-size: var(--font-size-small);
}
.vb-font.x-small {
  font-size: var(--font-size-extra-small);
}
.vb-font.tiny {
  font-size: var(--font-size-tiny);
}

/* FONTS WEIGHT */
.vb-font.w500 {
  font-weight: 500;
}
.vb-font.w700 {
  font-weight: 700;
}
.vb-font.w900 {
  font-weight: 900;
}

/* FONTS COLOR */
.vb-font.black {
  color: var(--font-color-black);
}
.vb-font.darker {
  color: var(--color-gray-darker);
}
.vb-font.dark {
  color: var(--color-gray-dark);
}
.vb-font.brandDark {
  color: var(--font-color-brand-dark);
}
.vb-font.darkest {
  color: var(--color-gray-darkest);
}
.vb-font.warning {
  color: var(--color-warning);
}

/* FLEX TEMPLATES */
.vb-flex-row-fe-c,
.vb-flex-row-fs-c,
.vb-flex-row-c-c,
.vb-flex-row-spb-c,
.vb-flex-row-spb-fs,
.vb-flex-row-fs-fs,
.vb-flex-row-fs-fe{
  display: flex;
  flex-direction: row;
}

.vb-flex-column-fs-c,
.vb-flex-column-c-fs,
.vb-flex-column-fs-fs,
.vb-flex-column-c-c,
.vb-flex-column-c-fe {
  display: flex;
  flex-direction: column;
}

.vb-flex-row-fs-c,
.vb-flex-column-fs-c {
  justify-content: flex-start;
  align-items: center;
}

.vb-flex-column-fs-fs,
.vb-flex-row-fs-fs {
  justify-content: flex-start;
  align-items: flex-start;
}

.vb-flex-row-fs-fe {
  justify-content: flex-start;
  align-items: flex-end;
}

.vb-flex-column-c-c,
.vb-flex-row-c-c {
  justify-content: center;
  align-items: center;
}

.vb-flex-column-c-fs {
  justify-content: center;
  align-items: flex-start;
}

.vb-flex-column-c-fe {
  justify-content: center;
  align-items: flex-end;
}

.vb-flex-row-spb-c {
  justify-content: space-between;
  align-items: center;
}

.vb-flex-row-spb-fs {
  justify-content: space-between;
  align-items: flex-start;
}

.vb-flex-row-fe-c {
  justify-content: flex-end;
  align-items: center;
}