/*
    Content

    FONTS
    COLORS
    LAYOUT
    GENERAL
    FORM
    PAGE
*/

/* FONTS  */

/* nunito-300  */
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 300;
    src: url("./tmpl/font/nunito/nunito-300.eot");
    /* IE9 Compat Modes */
    src: local(""), url("./tmpl/font/nunito/nunito-300.eot?#iefix") format("embedded-opentype"), url("./tmpl/font/nunito/nunito-300.woff2") format("woff2"), url("./tmpl/font/nunito/nunito-300.woff") format("woff"), url("./tmpl/font/nunito/nunito-300.ttf") format("truetype"), url("./tmpl/font/nunito/nunito-300.svg#Nunito") format("svg");
    /* Legacy iOS */
}

/* nunito-regular  */
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 400;
    src: url("./tmpl/font/nunito/nunito-regular.eot");
    /* IE9 Compat Modes */
    src: local(""), url("./tmpl/font/nunito/nunito-regular.eot?#iefix") format("embedded-opentype"), url("./tmpl/font/nunito/nunito-regular.woff2") format("woff2"), url("./tmpl/font/nunito/nunito-regular.woff") format("woff"), url("./tmpl/font/nunito/nunito-regular.ttf") format("truetype"), url("./tmpl/font/nunito/nunito-regular.svg#Nunito") format("svg");
    /* Legacy iOS */
}

/* nunito-600  */
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 600;
    src: url("./tmpl/font/nunito/nunito-600.eot");
    /* IE9 Compat Modes */
    src: local(""), url("./tmpl/font/nunito/nunito-600.eot?#iefix") format("embedded-opentype"), url("./tmpl/font/nunito/nunito-600.woff2") format("woff2"), url("./tmpl/font/nunito/nunito-600.woff") format("woff"), url("./tmpl/font/nunito/nunito-600.ttf") format("truetype"), url("./tmpl/font/nunito/nunito-600.svg#Nunito") format("svg");
    /* Legacy iOS */
}

/* nunito-italic  */
@font-face {
    font-family: 'Nunito';
    font-style: italic;
    font-weight: 400;
    src: url("./tmpl/font/nunito/nunito-italic.eot");
    /* IE9 Compat Modes */
    src: local(""), url("./tmpl/font/nunito/nunito-italic.eot?#iefix") format("embedded-opentype"), url("./tmpl/font/nunito/nunito-italic.woff2") format("woff2"), url("./tmpl/font/nunito/nunito-italic.woff") format("woff"), url("./tmpl/font/nunito/nunito-italic.ttf") format("truetype"), url("./tmpl/font/nunito/nunito-italic.svg#Nunito") format("svg");
    /* Legacy iOS */
}

/* nunito-700  */
@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 700;
    src: url("./tmpl/font/nunito/nunito-700.eot");
    /* IE9 Compat Modes */
    src: local(""), url("./tmpl/font/nunito/nunito-700.eot?#iefix") format("embedded-opentype"), url("./tmpl/font/nunito/nunito-700.woff2") format("woff2"), url("./tmpl/font/nunito/nunito-700.woff") format("woff"), url("./tmpl/font/nunito/nunito-700.ttf") format("truetype"), url("./tmpl/font/nunito/nunito-700.svg#Nunito") format("svg");
    /* Legacy iOS */
}


/* COLORS */
/* material ui Theme colors. */
:root {
    --mdc-theme-primary: #1e00ff;
    --mdc-theme-secondary: #676778;
    --mdc-theme-background: #fff;
    --mdc-theme-surface: #fff;
    --mdc-theme-error: #b71c1c;
    --mdc-theme-on-primary: #fff;
    --mdc-theme-on-secondary: #fff;
    --mdc-theme-on-surface: #000;
    --mdc-theme-on-error: #fff;
    --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87);
    --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54);
    --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87);
    --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54);
    --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-primary-on-dark: white;
    --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7);
    --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5);
    --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
    --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5);
}

.error {
    color: var(--alert);
}

.success {
    color: var(--success);
}

.text-white {
    color: var(--white) !important;
}

.white {
    color: var(--white) !important;
}

.success .mdc-snackbar__surface {
    background: var(--success);
}

.error .mdc-snackbar__surface {
    background: var(--alert);
}

.warning .mdc-snackbar__surface {
    background: var(--warning);
}

/* LAYOUT */
.row {
    margin-left: 0;
    margin-right: 0;
}

.mobile .mb-hide,
.mobile .tb-hide {
    display: none;
}

.tablet .tb-hide {
    display: none;
}


/* GENERAL */
p {
    font-size: .85rem;
    line-height: 1.3rem;
    font-family: Nunito, sans-serif;
}

h1 {
    font-size: 1.75rem;
    padding-bottom: 10px;
    display: inline-block;
}

.mobile h1 {
    font-size: 1.3rem;
}

a {
    color: var(--main);
    transition: color .2s;
    outline: initial !important;
}

.card.card_row {
    flex-direction: row;
}

/* FORM */
.btn {
    cursor: pointer;
}

.invalid-tooltip.show {
    display: block;
    top: -1.1em;
    right: 0;
}

.has-float-label>span:last-of-type {
    background-color: var(--white);
    padding: 0 5px;
    top: -0.6em;
    font-style: italic;
    font-size: 80%;
}

.btn-outline-primary {
    color: var(--highlight);
    border-color: var(--highlight-light);
}

.btn-outline-primary:hover {
    color: var(--white);
    background-color: var(--highlight-light);
    border-color: var(--highlight);
}

/* PAGE */


.btn {
    border-radius: 50px;
    outline: initial !important;
    box-shadow: none !important;
    box-shadow: initial !important;
    font-size: .8rem;
    padding: 0.5rem 1.25rem 0.5rem 1.25rem;
    transition: background-color box-shadow .1s linear;
}

button:focus {
    outline: none;
}

.icon-button {
    padding: 0;
    font-size: 14px;
    width: 34px;
    height: 34px;
    line-height: 34px;
}

.btn-header-light {
    color: #d7d7d7;
    border-color: transparent;
    background: 0 0;
}

.btn-header-light:hover {
    background-color: transparent;
    border-color: #d7d7d7;
}

.btn-primary {
    background-color: var(--highlight);
    border-color: var(--highlight);
    color: #fff;
}

.btn-primary:hover {
    color: #fff;
    background-color: var(--highlight-light);
    border-color: var(--highlight-light);
}

.icon-button .glyph-icon {
    font-size: 21px;
}

.shadow {
    background-color: #000;
    opacity: 0.5;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 1000;
}

.rowcard .btn-sm {
    height: 1.5rem;
    line-height: 0.5rem;
    padding-top: 0.3rem;
}

.rowcard .btn-sm .glyph-icon {
    line-height: inherit;
}