/* Monospace font */
.monospace, .code {
    font-family:'Courier New', Courier, monospace;
}

/* roboto-regular - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('fontface/roboto-v29-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
        url('fontface/roboto-v29-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fontface/roboto-v29-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('fontface/roboto-v29-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('fontface/roboto-v29-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fontface/roboto-v29-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* Garuda: Mac system font lookalike (orig: San Francisco) */
@font-face {
    font-family: 'Garuda';
    font-style: normal;
    font-weight: 400;
    /* The glyphs of this font are weird. adjust! */
    /* Check out https://web.dev/css-size-adjust */
    ascent-override: 100%;
    descent-override: 25%;
    /* line-gap-override: 50%; */
    src: url('fontface/Garuda.eot'); /* IE9 Compat Modes */
    src: local(''),
        url('fontface/Garuda.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fontface/Garuda.woff2') format('woff2'), /* Super Modern Browsers */
        url('fontface/Garuda.woff') format('woff'), /* Modern Browsers */
        url('fontface/Garuda.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fontface/Garuda.svg#Garuda') format('svg'); /* Legacy iOS */
}

/* weblysleek: Windows system font lookalike (orig: Segoe UI) */
@font-face {
    font-family: 'weblysleek';
    font-style: normal;
    font-weight: 400;
    ascent-override: 100%;
    descent-override: initial;
    src: url('fontface/weblysleek.eot'); /* IE9 Compat Modes */
    src: local(''),
        url('fontface/weblysleek.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fontface/weblysleek.woff2') format('woff2'), /* Super Modern Browsers */
        url('fontface/weblysleek.woff') format('woff'), /* Modern Browsers */
        url('fontface/weblysleek.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fontface/weblysleek.svg#weblysleek') format('svg'); /* Legacy iOS */
}

/* 
    icons overview: https://fonts.google.com/icons?selected=Material+Icons
    https://github.com/google/material-design-icons/tree/master/variablefont
    https://github.com/google/material-design-icons/tree/master/font (deprecated)
*/
@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url('fontface/Material_Icons_baseline.woff2') format('woff2');
}

@font-face {
    font-family: 'Material Icons Outline';
    font-style: normal;
    font-weight: 400;
    src: url('fontface/Material_Icons_Outlined.woff2') format('woff2');
}

@font-face {
    /* very buggy: colors! */
    font-family: 'Material Icons Two Tone';
    font-style: normal;
    font-weight: 400;
    src: url('fontface/Material_Icons_Two_Tone.woff2') format('woff2');
}

/* Font W95FA by Alina Sava */
@font-face {
    font-family: 'win95';
    font-style: normal;
    font-weight: 400;
    src: url('fontface/w95fa.eot');
    src: url('fontface/w95fa.woff2') format('woff2'), 
         url('fontface/w95fa.woff') format('woff');
}
@font-face {
    font-family: 'win95-mono';
    font-style: normal;
    font-weight: 400;
    src: url('fontface/w95fa-mono.eot');
    src: url('fontface/w95fa-mono.woff2') format('woff2'), 
         url('fontface/w95fa-mono.woff') format('woff');
}
@font-face {
    font-family: 'topaz';
    font-style: normal;
    font-weight: 400;
    src: url('fontface/topaz.eot');
    src: url('fontface/topaz.woff2') format('woff2'), 
         url('fontface/topaz.woff') format('woff');
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 1.8em;  /* Preferred icon size - was 24px */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-feature-settings: 'liga';
    font-feature-settings: 'liga';
    user-select: none;
}

.material-icons.outline, .material-icons-outline {
    font-family: 'Material Icons Outline';
}
.material-icons.two-tone, .material-icons-two-tone {
    font-family: 'Material Icons Two Tone';
    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
}
.darkMode .material-icons.two-tone, .darkMode .material-icons-two-tone {
    background-color: white;
}
.lightMode .material-icons.two-tone, .lightMode .material-icons-two-tone {
    background-color: black;
}

.material-icons.small {
    font-size: 1em;
}

.material-icons.big {
    font-size: 2em !important;
}

.material-icons.small.vertCenter {
    transform: translateY(.2em);
}

input[type='radio'],
input[type='checkbox'] {
    appearance: none;
    padding:0 !important;
}

input[type='radio']:before,
input[type='checkbox']:before {
    display: inline-block;
    font-family: 'Material Icons';
    font-size: 2em;
    color:grey;
    vertical-align: middle;
}
input[type='radio']:before {
    font-size: 1.4em;
    transform: translateY(-4px) translateX(-5px);
}

input[type='checkbox']:not(:checked):before {
    content: "\e9f5";
}

input[type='checkbox']:checked:before {
    content: "\e9f6";
    color: rgb(114, 176, 210);
}

input[type='radio']:not(:checked):before {
    content: "\e836";
}

input[type='radio']:checked:before {
    content: "\e837";
    color: rgb(114, 176, 210);
}
