:root {
  --white: white;
  --black: black;
  --red: red;
  --green: green;
  --blue: #7d9bfc;
  --yellow: #ffffb3;
  --orange: #ff944d;
  --lime: #68b300;
  --aqua: #7082db;
  --lightyellow: lightyellow;
  --lightblue: lightblue;
  --salmon: salmon;
  --deeppink: #ff80ff;
  --purple: #7d9bfc;
  --teal: teal;
  --indigo: indigo;
  --olive: #04B404
}


.bg_white { background: var(--white, white); }
.bg_blue { background: var(--blue, blue); }
.bg_green { background: var(--green, green); } 
.bg_yellow { background: var(--yellow, yellow); }
.cl_black { color: var(--black, black); }
.cl_orange { color: var(--orange, orange); }
.cl_yellow { color: var(--yellow, yellow); }
.cl_lime { color: var(--lime, lime); }
.cl_aqua { color: var(--aqua, aqua); }
.cl_blue { color: var(--blue, blue); }
.cl_lightblue { color: var(--lightblue, lightblue); }
.cl_red { color: var(--red, red); }
.cl_salmon { color: var(--salmon, salmon); }
.cl_deeppink { color: var(--deeppink, deeppink); }
.cl_purple { color: var(--purple, purple); }
.cl_teal { color: var(--teal, teal); }
.cl_indigo { color: var(--indigo, indigo); }
.cl_lightyellow { color: var(--lightyellow, lightyellow); }
.cl_olive { color: var(--olive, olive); }


::-webkit-scrollbar {
    width: 16px;
    height: 16px;
}

::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
    display: block;
}

::-webkit-scrollbar-button:vertical:start:increment,
::-webkit-scrollbar-button:vertical:end:decrement {
    display: none;
}

::-webkit-scrollbar-button:end:increment {
    background-image: url(../img/scroll_cntrl_dwn.png);
}

::-webkit-scrollbar-button:start:decrement {
    background-image: url(../img/scroll_cntrl_up.png);
}

::-webkit-scrollbar-track-piece:vertical:start {
    background-image: url(../img/scroll_gutter_top.png), url(../img/scroll_gutter_mid.png);
    background-repeat: no-repeat, repeat-y;
}

::-webkit-scrollbar-track-piece:vertical:end {
    background-image: url(../img/scroll_gutter_btm.png), url(../img/scroll_gutter_mid.png);
    background-repeat: no-repeat, repeat-y;
    background-position: bottom left, 0 0;
}

::-webkit-scrollbar-thumb:vertical {
    height: 56px;
    -webkit-border-image: url(../img/scroll_thumb.png) 8 0 8 0 stretch stretch;
    border-width: 8 0 8 0;
}