/* Schriftarten */
    @font-face{font-family:"Museo Sans";src:url('/static/custom/fonts/MuseoSans500.woff2') format("woff2");font-weight:500}
    @font-face{font-family:"Museo Sans";src:url('/static/custom/MuseoSans700.woff2') format("woff2");font-weight:700}
    @font-face{font-family:"Museo Sans";src:url('/static/custom/MuseoSans900.woff2') format("woff2");font-weight:900}
    :root {
        /* Colors */
        --fh-blue: #39659f;
        --fh-grey: #6f7072;
        --fh-dark-grey: #222;
        --fh-highlighting: #dd4a9f;
        --main-font-color: #222;

        /* Fonts */
        --fonts: "Museo Sans","Helvetica Neue", Helvetica,Verdana,Arial,sans-serif !important;

        /* Header */
        --header-max-height: 12vh;
        
        /* Username + Password */
        --textbox-background-color: #fff;
        --textbox-height: 3.25rem; 
        --textbox-width: 250px;
        --textbox-border: 2px solid var(--fh-dark-grey);
        --textbox-border-radius: 3rem;
        --textbox-padding: 1.125rem 1.5rem;
        
        /* Login Button */
        --button-background-color: none;
        --button-width: 250px;
        --button-border: 3px solid var(--fh-highlighting);
        --button-border-radius: 3rem;
        --button-padding: 1.125rem 1.5rem;
    }
body {
    font-family: var(--fonts) !important;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    background-color: var(--fh-blue);
    border-color: var(--fh-blue);
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    background-color: var(--fh-grey);
}

a {
    color: var(--fh-blue);
}

form.form-signin > div > .btn-primary {
    background-color: var(--button-background-color);
    color: var(--main-font-color) !important;
    border: var(--button-border);
    border-radius: var(--button-border-radius);
    padding: var(--button-padding);
    width: var(--button-width);
    font-size: 19px !important;
    transition: 0.2s all ease-in-out;

    &:hover,:focus,:active,:hover:active:focus {
        color: var(--fh-highlighting) !important;
        background-color: inherit;
    }

    &:focus{
        outline: none;
    }

}

.navbar-nav .btn-group{
    & > button.btn-warning {
        background-color: var(--fh-blue);
        border-color:var(--fh-grey);
        
        &:focus,:hover,:active {
            border-color: #fff;
        }
    }
}

.btn-warning:active:hover, .btn-warning.active:hover, .open > .dropdown-toggle.btn-warning:hover, .btn-warning:active:focus, .btn-warning.active:focus, .open > .dropdown-toggle.btn-warning:focus, .btn-warning:active.focus, .btn-warning.active.focus, .open > .dropdown-toggle.btn-warning.focus {
    color: #fff;
    background-color: var(--fh-grey);
    border-color: #fff;
}


form.form-signin > div > .btn-primary[disabled] {    
    &,&:hover,:focus,:active,:hover:active:focus {
        background-color: inherit;
        color: #333 !important;
        transition: none;
        border-color: #333 !important;
    }
}

.form-signin .round-top, .form-signin .round-bottom, .form-signin .round-none {
    border-radius: var(--textbox-border-radius);
    width: var(--textbox-width);
    padding: var(--textbox-padding);
    margin-bottom: 2.5rem;
}

.form-control:focus {
    border-color: #39659f;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(57, 101, 159, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(57, 101, 159, 0.6);
}

div.form-group[ng-hide="checkRight('totp_timeshift')"] {
    display: none;
}

body > div.container > div > div > div > div.slide.panel.col-lg-9 > div:nth-child(2) > p > span:nth-child(1) {
    display: block !important;
    margin-top: 15px;
}