﻿::-webkit-scrollbar {
    width: 12px; /* for vertical scrollbars */
    height: 12px; /* for horizontal scrollbars */
}

::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
}

::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.5);
}

.global-header-wrapper {
    height: 47px;
    position: fixed;
    z-index: 1000;
    top: 0px;
    left: 0px;
    width: 100%;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

#global-header {
    height: 47px;
    transition: background-color ease-in 200ms;
}

.global-header-theme-dark #global-header {
    background: #24324C;
}

.global-header-theme-light #global-header {
    background: white;
    height: 47px;
}

#global-header-wrapper.opened #global-header {
    transition: background-color ease-in 0ms;
}

#global-header-search {
    padding: 3px;
}

#global-header-searchbox, #global-header-searchbutton {
    float: left;
}

#global-header-searchbox {
    height: 24px;
    width: 180px;
    border: 1px solid #BDBDBD;
    border-radius: 2px;
    padding: 0 5px;
}

    #global-header-searchbox:focus {
        outline-color: #EE820E;
        outline-offset: -1px;
        outline-style: solid;
        outline-width: 1px;
    }

#global-header-searchbutton {
    width: 40px;
    margin: 0 0 0 -5px;
    height: 26px;
    background: #BDBDBD url(/media/img/global/search-button-icon.png) no-repeat 50% 50%;
    border: 1px solid #BDBDBD;
    border-radius: 2px;
    padding: 0;
    cursor: pointer;
}

    #global-header-searchbutton.focus, #global-header-searchbutton:active, #global-header-searchbutton:focus {
        background-color: #FF913C;
        border: 1px solid #B37E22;
    }

#global-header-wrapper > .profilepreview {
    position: absolute;
    width: 189px;
    height: 189px;
    background: url(/media/img/global/preview-banner.png) no-repeat;
}

#remplan-dropdown {
    height: 45px;
    width: 48px;
    float: left;
    background-color: #f57f29;
    font-family: Arial;
    font-size: 12px;
    font-weight: bold;
    padding: 0 0 2px 5px;
    margin: 0 0 3px 0;
    cursor: pointer;
    background-image: url(/media/img/header/remplan-dropdown-bg.png);
    background-position: 0px 0px;
    background-repeat: no-repeat;
    outline: none;
}

    #remplan-dropdown .notification {
        opacity: 0;
        position: absolute;
        width: 16px;
        height: 16px;
        background: #ff6100;
        top: -20px;
        left: 23px;
        border-radius: 9px;
        border: 2px solid white;
        color: white;
        text-align: center;
        line-height: 16px;
        font-size: 10px;
        font-family: arial;
        font-weight: lighter;
        -webkit-transition: top ease-in 200ms;
        transition: top ease-in 200ms;
    }

        #remplan-dropdown .notification.visible {
            opacity: 1 !important;
            top: 8px !important;
        }

    #remplan-dropdown:hover .notification, #remplan-dropdown.selected .notification {
        background: white !important;
        border: 2px solid #e66814 !important;
        color: #e66814 !important;
    }

    #remplan-dropdown:active .notification {
        background: #ff6100 !important;
        border: 2px solid white !important;
        color: white !important;
    }

.global-header-theme-dark #remplan-dropdown .notification {
    border: 2px solid #24324c;
}

.global-header-theme-dark #remplan-dropdown:active .notification {
    border: 2px solid #24324c !important;
}

#remplan-dropdown:hover, #remplan-dropdown.selected {
    background-position: 0px -50px;
    outline: none;
}

#remplan-dropdown:active {
    background-position: 0px -160px;
    color: #8B3800;
    outline: none;
}


#remplan-dropdown .santahat {
    position: absolute;
    width: 26px;
    height: 17px;
    background: url(/media/img/santahat.png);
    margin: 2px 0 0 -3px;
}

.profile-select-link {
    overflow: auto;
    float: left;
    height: 33px;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

    .profile-select-link a, .profile-select-link a:hover {
        color: #666 !important;
        text-decoration: none;
    }

    .profile-select-link:active .inner1, .profile-select-link:active .inner2, .profile-select-link:active .inner1 a, .profile-select-link:active .inner2 a {
        background-color: #FCBA87;
        color: white !important;
    }

    .profile-select-link .inner1 {
        background-color: #EDEDED;
        overflow: auto;
        height: 31px;
    }

    .profile-select-link .inner2 {
        border-left: 1px solid #D6D6D6;
        line-height: 23px;
        padding: 0 10px 0 10px;
        margin: 4px 0 0 0;
        font-family: 'Lato Light',Verdana, Verdana, Geneva, sans-serif;
        font-size: 14px;
        background-color: #EDEDED;
    }

    .profile-select-link.selected {
        background-color: #e46d1e;
    }

        .profile-select-link.selected .inner2 {
            font-weight: 800;
            font-family: 'Lato',Verdana, Verdana, Geneva, sans-serif;
        }

        .profile-select-link.selected .icon {
            width: 16px;
            height: 16px;
            float: left;
            margin: 4px 6px 0 0;
        }

#profile-select:hover .profile-select-link {
    background-color: transparent;
}

.profile-select-link:hover {
    background-color: #FCBA87 !important;
}

#global-header .right-links {
    float: right;
}

    #global-header .right-links > div {
        float: left;
        line-height: 33px;
        margin-left: 20px;
        color: #777 !important;
    }

        #global-header .right-links > div a {
            color: #777 !important;
            -webkit-transition: color 200ms linear;
            -moz-transition: color 200ms linear;
            -o-transition: color 200ms linear;
            -ms-transition: color 200ms linear;
            transition: color 200ms linear;
            font-family: 'Arial Unicode MS', Arial, sans-serif;
            font-size: 14px;
        }

#app-button-language .label {
    color: #999 !important;
}

#global-header .right-links > div a:hover {
    color: #E46D1E !important;
    text-decoration: none;
}

#myreport-link {
    padding-left: 26px;
    background-color: #999;
    background-image: url(/media/img/global/myreport-link.png);
    background-repeat: no-repeat;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
    cursor: pointer;
}

    #myreport-link:focus {
        outline: none;
    }

    #myreport-link .inner {
        -webkit-transition: color 200ms linear;
        -moz-transition: color 200ms linear;
        -o-transition: color 200ms linear;
        -ms-transition: color 200ms linear;
        transition: color 200ms linear;
    }

    #myreport-link:hover {
        background-color: #de7d89 !important;
    }

        #myreport-link:hover .inner {
            color: #E46D1E !important;
        }

.myreport-content-item-overlay {
    position: fixed;
    width: 0px;
    height: 0px;
    z-index: 9999;
    left: -1000px;
}

    .myreport-content-item-overlay.notsupported {
        display: none !important;
        z-index: 0;
    }

    .myreport-content-item-overlay .border {
        position: absolute;
        width: 200px;
        height: 200px;
        background: #dd1a32;
        z-index: 9999;
        opacity: 0.5;
    }

    .myreport-content-item-overlay .toolbar-wrapper, .mynoteshighlighttoolbar {
        opacity: 0.95;
        position: absolute;
        top: -46px;
        left: -6px;
        width: 180px;
        background: white;
        z-index: 999;
        height: 33px;
        padding: 2px;
        -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
        border-radius: 2px;
        border: 1px solid #ccc;
        border-color: rgba(0, 0, 0, 0.2);
        overflow-y: hidden;
    }


        .myreport-content-item-overlay .ce-toolbar, .mynoteshighlighttoolbar .ce-toolbar {
            width: 100%;
            padding: 0px;
            overflow: auto;
            height: auto !important;
        }

            .myreport-content-item-overlay .ce-toolbar .button, .mynoteshighlighttoolbar .ce-toolbar .button {
                display: inline-block;
                border: none;
                background: white;
                padding: 5px 10px;
                border-radius: 3px;
                cursor: pointer;
                color: #24324C;
                overflow: auto;
            }

                .myreport-content-item-overlay .ce-toolbar .button:hover, .mynoteshighlighttoolbar .ce-toolbar .button:hover {
                    background: #f1b6bd;
                }

            .myreport-content-item-overlay .ce-toolbar .button-disabled {
                opacity: 0.6;
            }


            .myreport-content-item-overlay .ce-toolbar .icon, .mynoteshighlighttoolbar .ce-toolbar .icon {
                width: 16px;
                height: 16px;
                margin-right: 5px;
                background-image: url(/media/img/global/icons.png);
            }

            .myreport-content-item-overlay .ce-toolbar .label, .ce-toolbar .icon {
                float: left;
                line-height: 16px;
            }

            .myreport-content-item-overlay .ce-toolbar .icoaddnote, .mynoteshighlighttoolbar .ce-toolbar .icoaddnote {
                background-position: 0px 0px;
            }

            .myreport-content-item-overlay .ce-toolbar .icocopy, .mynoteshighlighttoolbar .ce-toolbar .icocopy {
                background-position: -16px 0px;
            }

.app-ico-oep-sm {
    background: url(/media/img/global/app-icon-oep-sm.png);
}

.app-logo {
    background-repeat: no-repeat;
    display: inline-block;
    width: 272px;
    height: 46px;
    -webkit-transition: width 0ms ease-out, background-image 0s, margin-top 0s;
    transition: width 0ms ease-out, background-image 0s, margin-top 0s;
}

#global-header-wrapper.opened .app-logo {
    -webkit-transition: width 200ms ease-out, background-image 100ms ease-in 100ms, margin-top 100ms ease-out 100ms;
    transition: width 200ms ease-out, background-image 100ms ease-in 100ms, margin-top 100ms ease-out 100ms;
}

.app-logo-adminconsole {
    background: url(/media/img/global/app-logo-adminconsole.png) no-repeat;
}

.app-logo-ocp {
    background: url(/media/img/global/app-logo-ocp.png) no-repeat;
    width: 86px;
}

.app-logo-oep {
    background: url(/media/img/global/app-logo-oep.png) no-repeat;
    width: 86px;
}

.app-logo-oip {
    background: url(/media/img/global/app-logo-ocp.png) no-repeat;
    width: 86px;
}

.app-logo-remplan {
    background: url(/media/img/global/app-logo-remplan.png) no-repeat;
    width: 86px;
}

#remplandropdown-popup.notransition {
    -webkit-transition: height 0s;
    transition: height 0s;
}

#global-header-app-buttons {
    position: absolute;
}

#global-header .app-buttons.smallscreen .label, #global-header .app-button.smallscreen .label {
    display: none;
}

#global-header-wrapper.opened .app-buttons.smallscreen .label, #global-header-wrapper.opened .app-button.smallscreen .label {
    display: block !important;
}

#global-header .app-buttons {
    display: inline-block;
    height: 48px;
    white-space: nowrap;
    top: 0;
}

#global-header #app-buttons-right {
    float: right;
}

#global-header .app-buttons .app-button {
    display: inline-block;
    color: white;
    height: 48px;
    cursor: pointer;
    overflow: hidden;
}


#global-header .app-buttons .app-button-inner {
    display: inline-block;
    margin: 8px 0;
    height: 30px;
    line-height: 30px;
    border-left: 1px solid #4E596E;
    padding: 0 20px 0 40px;
    transition: color 200ms ease-in,border-left 200ms ease-in;
}

#global-header #app-buttons-right .app-button:first-child .app-button-inner {
    border-left: none !important;
}

#global-header .app-buttons .app-button .icon {
    position: absolute;
    margin: 7px 0 0 -22px;
    width: auto;
    height: 16px;
    -webkit-transition: width 300ms ease-out, height 300ms ease-out;
    transition: width 300ms ease-out, height 300ms ease-out;
}

#global-header .app-buttons .app-button .label {
    text-align: center;
    -webkit-transition: margin 200ms ease-out;
    transition: margin 200ms ease-out;
    color: white;
    font-family: Arial Unicode MS, Arial, sans-serif;
    font-size: small;
}

#global-header .app-buttons .app-button-hidden {
    opacity: 0;
    -webkit-transition: opacity 0s;
    transition: opacity 0s;
    width: 0;
    display: none;
}

#global-header #global-header-shadow {
    opacity: 0;
    top: 44px;
    left: -200px;
    width: 40px;
    background: #dd1a32;
    position: absolute;
    height: 4px;
    z-index: 99999;
    -webkit-transition: left 200ms ease-out, width 200ms ease-out, opacity 400ms ease-out;
    transition: left 200ms ease-out, width 200ms ease-out, opacity 400ms ease-out;
    pointer-events: none;
}

#global-header .app-button .newtab {
    float: right;
}

    #global-header .app-button .newtab div {
        position: absolute;
        width: 16px;
        height: 16px;
        z-index: 999;
        opacity: 0;
        margin: 4px 0 0 -20px;
        -webkit-transition: opacity 400ms ease-out, background-color 200ms ease-out;
        transition: opacity 400ms ease-out, background-color 200ms ease-out;
    }

.global-header-theme-dark .app-button .newtab div {
    background-image: url(/media/img/global/newtab.png);
    background-color: #3E5175;
}

.global-header-theme-dark .app-button .newtab:hover div {
    background-color: #ea602f;
}

.global-header-theme-light .app-button .newtab div {
    background-image: url(/media/img/global/newtab-light.png);
    background-color: #fba76f;
}

.global-header-theme-light .app-button .newtab:hover div {
    background-color: #ff6600;
}

#global-header .app-button:hover .newtab div {
    opacity: 1;
}

#global-header .search {
    /*display: inline-block;*/
    margin: 7px 0px;
    padding: 2px 15px;
    overflow: auto;
    float: right;
    border-left: 1px solid #4E596E;
}

.global-header-wrapper.opened .search {
    display: none !important;
}

#global-search {
    background: #505B70;
    border: none;
    width: 350px;
    height: 24px;
    padding: 2px 8px;
    color: white;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 12px;
    transition: background-color 200ms ease-in, color 200ms ease-in;
    outline-color: #FF6600;
}

    #global-search:focus {
        background: white;
        color: #FF6600;
    }

#global-header .search:hover #global-search {
    background: white;
}

    #global-header .search:hover #global-search::-webkit-input-placeholder {
        color: #666;
    }

    #global-header .search:hover #global-search:-ms-input-placeholder {
        color: #666;
    }

#global-search::-webkit-input-placeholder {
    color: white;
    transition: color 200ms ease-in;
}

#global-search:-ms-input-placeholder {
    color: white;
    transition: color 200ms ease-in;
}

.mynoteshighlighttoolbar {
    position: fixed;
}

#mynotesanimationpanel {
    position: fixed;
    opacity: 0;
    z-index: 9999999;
    pointer-events: none;
    transition: opacity 400ms ease-in 1s;
}

    #mynotesanimationpanel.animate {
        background-position-y: 0px;
        background-color: #df3a4f;
        background-image: none;
        background-image: url(/media/img/global/mynotes-animationpanel-bg.png);
        border: 5px solid #dd1a32;
        opacity: 1;
        -webkit-transition: left 200ms ease-in,top 200ms ease-in,width 200ms ease-in,height 200ms ease-in;
        transition: left 200ms ease-in,top 200ms ease-in,width 200ms ease-in,height 200ms ease-in;
    }

    #mynotesanimationpanel.fadeout {
        opacity: 1;
    }

#mynotesanimationpanelbuttonoverlay {
    position: fixed;
    background-color: #24324C;
    background-repeat: no-repeat;
    z-index: 999999;
    pointer-events: none;
    transition: opacity 400ms ease-in 0ms,background-position-y 200ms ease-in 0ms;
    opacity: 0;
    background-position-y: 44px;
}

    #mynotesanimationpanelbuttonoverlay.fadeout {
        opacity: 1;
        transition: opacity 0ms ease-in 0ms,background-position-y 200ms ease-in;
        background-position-y: 0px;
    }

.global-header-theme-light.hover #global-header {
    background-color: #24324C;
}

.global-header-theme-light #global-header .app-buttons {
    height: 48px;
}

    .global-header-theme-light #global-header .app-buttons .app-button {
        color: #444;
        height: 48px;
        transition: background-color 200ms ease-in, color 200ms ease-in;
    }

.global-header-theme-light.hover #global-header .app-buttons .app-button {
    background-color: #24324C;
}

    .global-header-theme-light.hover #global-header .app-buttons .app-button .label {
        color: white;
    }

.global-header-theme-light #global-header .app-buttons .app-button .label {
    color: #444;
}


.global-header-theme-light.nonhover #global-header .app-buttons .app-button-inner {
    border-left: 1px solid #e7e7e7;
}

.global-header-theme-light #global-header .app-buttons .app-button-moreapps .icon {
    background-color: #EDEDED;
    color: #444;
    height: 40px;
}

.global-header-theme-light #global-header #global-search {
    height: 20px;
}

.global-header-theme-light #global-header .search {
    border-left: 1px solid #BBBBBB;
    margin: 6px 0;
}

.global-header-theme-light.nonhover #global-header #global-search {
    background: white;
    color: #444 !important;
}


.global-header-theme-light.nonhover #global-header .search:hover #global-search::-webkit-input-placeholder {
    color: #444 !important;
}

.global-header-theme-light.nonhover #global-header .search:hover #global-search:-ms-input-placeholder {
    color: #444 !important;
}

.global-header-theme-light.nonhover #global-search::-webkit-input-placeholder {
    color: #444 !important;
    transition: color 200ms ease-in;
}

.global-header-theme-light.nonhover #global-search:-ms-input-placeholder {
    color: #444 !important;
    transition: color 200ms ease-in;
}

.global-header-theme-light.nonhover #global-search:focus {
    color: #444;
}

/*.global-header-theme-light.closed #remplan-dropdown
{
    background-image: url(/media/img/global/remplan-dropdown-bg-light.png);
}

.global-header-theme-light.closed #remplan-dropdown
{
    background-image: url(/media/img/global/remplan-dropdown-bg-light.png);
    background-position:10px -3px;
}

.global-header-theme-light.closed #remplan-dropdown:hover
{
    background-position:10px -83px;
}*/

.global-header-theme-light #global-header .app-button .newtab div {
    background-image: url(/media/img/global/newtab-light.png);
}

#global-header-wrapper.global-header-theme-light.scrolldown {
    display: none !important;
}

.global-header-theme-light #global-header-app-buttons {
    opacity: 0;
    transition: opacity 200ms ease-in;
}

.global-header-theme-light.loaded #global-header-app-buttons {
    opacity: 1;
}

.global-header-theme-light .app-button.noicon .app-button-inner {
    padding: 0 20px !important;
}

.global-header-theme-light .app-button.noicon .icon {
    display: none;
}

.global-header-theme-light.opened #global-header-app-buttons {
    left: auto !important;
}

#remplandropdown-popup.opened .container {
    opacity: 1;
}


#mynotesanimationpanelbuttonoverlay.global-header-theme-light {
    background-color: white !important;
}

.christmas #global-header .theme {
    width: 146px;
    height: 40px;
    background: transparent url(/media/img/themes/santa.png) no-repeat top left;
    display: inline-block;
    position: relative;
    top: -5px;
    left: 10px;
}

#app-button-adminconsole .app-button-inner {
    padding-left: 20px !important;
    padding-right: 40px !important;
}

#app-button-adminconsole .app-button-inner img {
    position: relative !important;
    right: -30px;
    float: right;
}