﻿/* #region ~ HEADER MAIN - главный хидер ~ */

.c-header-secondary {
    height: 70px;
    z-index: 0;
}

.c-header {
    width: calc(100% - 20px);
    display: flex;
    position: relative;
    width: 100%;
    overflow: hidden;
    background-color: var(--bg-main);
    border-bottom: none; /* SKIN!!! */
    height: 70px; /* SKIN!!! */
    /**/
   /* position: fixed;
    z-index: 9;*/
   margin-bottom: -70px;
}

    .c-header.shadow {
        box-shadow: var(--box-shadow-1) !important;
    }

/* #endregion */

/* #region ~ LEFT - logo и поиск ~ */

.c-header-left {
    width: 500px;
    display: inline-block;
}

.c-header-left-logo {
    display: contents;
}

.c-header-left-logo-div {
    display: inline-block;
}

.c-header-left-logo-img {
    content: url('../../images/logo-mosaik1.png?ver=@Global.Version');
    content: var(--logo-mosaik1);
    display: inline-block;
    width: 150px;
    /* cursor: pointer;*/
    background-color: transparent;
    margin: -18px 0 0 15px;
    /**/
    /*margin: -18px 0 0 40px;*/
}

.c-header-left-logo-div-pa {
    position: absolute;
    margin-left: 70px;
    width: 150px;
    margin-top: 37px;
    display: inline;
    /**/
    margin-left: 10px;
    width: 170px;
    text-align: right;
    margin-top: 38px;
    /**/
    width: 180px;
    margin-left: 2px;
/*    height: 2px;
    background-color: yellow;*/
}

.c-header-left-logo-lbl-pa {
    font: 600 12px "Open Sans",Overpass,sans-serif;
    background-color: transparent;
    text-shadow: 1px 2px 5px rgba(0,0,0,0.05); /* SKIN!!! */
    color: rgba(0,207,255,1); /* SKIN!!! */
    display: inline;
    /**/
    font: 600 12px "Open Sans",Overpass,sans-serif;
}

    .c-header-left-logo-lbl-pa.manyroles {
        font: 600 13px "Open Sans",Overpass,sans-serif;
        margin-right: 20px;
    }

.c-header-left-search-div {
    display: inline-block;
}

.c-header-left-search-div-txtbtn {
    display: inline-block;
    height: 28px;
    width: 250px;
    margin: 20px 0 0 20px;
    /**/
    margin: 20px 0 0 26px;
}

.c-header-left-search-txt {
    padding: 0 35px 0 7px;
    border-radius: 3px;
    width: 250px;
    height: 35px;
    background-color: white;
    margin-top: -3px;
    border: 1px solid rgba(30, 144, 255,0.3); /* SKIN!!! */
    box-shadow: 1px 1px 5px rgba(30, 144, 255,0.3); /* SKIN!!! */
    font: 500 15px Arial,sans-serif;
    color: rgba(0,0,0,0.85);
    /**/
    /*margin-left: 5px;*/
    width: 248px;
}

    .c-header-left-search-txt:focus {
        outline: none;
        border: 1px solid transparent;
        box-shadow: 1px 1px 5px transparent;
    }

    .c-header-left-search-txt::-webkit-input-placeholder {
        color: rgba(0,0,0,0.4) !important;
    }

    .c-header-left-search-txt::-moz-placeholder {
        color: rgba(0,0,0,0.4) !important;
    }

    .c-header-left-search-txt.type1 {
        padding: 1px 35px 0 7px;
    }

    .c-header-left-search-btn {
        position: absolute;
        margin: 5px 0 0 -30px;
        outline: none !important;
        border: none;
        cursor: pointer;
        font-size: 18px;
        text-decoration: none !important;
        background-color: transparent;
        color: rgba(56,157,239,1); /* SKIN!!! */
    }

        .c-header-left-search-btn:hover {
            margin: 4px 0 0 -30px;
            font-size: 21px;
        }

        .c-header-left-search-btn.type1 {
            margin: -26px 0 0 220px !important;
        }

    .c-header-addmosaikimage {
        margin-top: -35px;
    }

    .c-header-img-newtab {
        margin-top: 12.5px;
        height: 27.5px;
    }
    /* #endregion */
    /* #region ~ LEFT - надписи,  если используется без меню ~ */

    .c-header-left-info-div {
        height: 50px;
        width: 200px;
        margin-left: 200px;
        margin-top: -50px;
        /**/
        height: 56px;
        min-width: 200px;
        width: 100%;
        margin-top: -47px;
        background-color: rgba(255,255,255,0.1);
        border-radius: 5px;
        position: absolute;
        width: calc(100% - 450px);
    }

    .c-header-paper-name-container {
    }

    .c-header-paper-name {
        color: rgba(255,255,255,1); /* SKIN!!! */
        /*text-shadow: 1px 1px 1px rgba(0,0,0,0.4);*/
        font: 600 12px "Open Sans", Arial;
        position: absolute;
        margin-top: 3px;
        margin-left: 15px;
        background-color: rgba(255,255,255,0.1);
        padding: 5px 10px 5px 10px;
        border-radius: 5px;
        /**/
        color: rgba(255,255,255,1); /* SKIN!!! */
        color: gold; /* SKIN!!! */
        /**/
        background-color: transparent;
        font: 500 19px Arial,"Open Sans", Arial;
        margin-left: 3px;
        margin-top: -1px;
        /*text-shadow: 1px 1px 1px rgba(0,0,0,0.2);*/
        color: rgb(108,231,246);
    }

    .c-header-cust-name-container {
    }

    .c-header-cust-name {
        /*text-shadow: 1px 1px 2px rgba(0,0,0,0.25);*/
        white-space: nowrap;
        border-radius: 5px;
        font: 600 12px "Open Sans", Arial;
        /*padding: 5px 10px 5px 10px;*/
        margin-left: 15px;
        position: absolute;
        margin-top: 33px;
        color: rgba(255,255,255,1); /* SKIN!!! */
        /*background-color: rgba(255,255,255,0.1);*/
        color: rgba(255,255,255,1); /* SKIN!!! */
    }
    /* BOTTOM */

    .c-header-bottom-info-div-1 {
        min-height: 0;
        display: none;
    }

    .c-header-bottom-info-div-2 {
    }

    .c-header-left-info-div-bottom {
        position: relative;
        min-height: 55px;
        width: calc(100% - 30px);
        margin-top: 10px;
        margin-left: 15px;
        background-color: rgba(255,255,255,0.7);
        border-radius: 5px;
    }

    .c-header-paper-name-container-bottom {
    }

    .c-header-paper-name-bottom {
        color: rgba(255,255,255,1); /* SKIN!!! */
        /*text-shadow: 1px 1px 1px rgba(0,0,0,0.4);*/
        font: 600 12px "Open Sans", Arial;
        position: absolute;
        margin-top: 3px;
        margin-left: 15px;
        background-color: rgba(255,255,255,0.1);
        padding: 5px 10px 5px 10px;
        border-radius: 5px;
        /**/
        color: rgba(255,255,255,1); /* SKIN!!! */
        color: gold; /* SKIN!!! */
        /**/
        background-color: transparent;
        font: 500 19px Arial,"Open Sans", Arial;
        margin-left: 3px;
        margin-top: -1px;
        /*text-shadow: 1px 1px 1px rgba(0,0,0,0.2);*/
        color: rgba(0,0,0,0.9);
    }

    .c-header-cust-name-container-bottom {
    }

    .c-header-cust-name-bottom {
        /*text-shadow: 1px 1px 2px rgba(0,0,0,0.25);*/
        white-space: nowrap;
        border-radius: 5px;
        font: 600 12px "Open Sans", Arial;
        /*padding: 5px 10px 5px 10px;*/
        margin-left: 15px;
        position: absolute;
        margin-top: 33px;
        color: rgba(255,255,255,1); /* SKIN!!! */
        /*background-color: rgba(255,255,255,0.1);*/
        color: rgba(255,255,255,1); /* SKIN!!! */
        color: rgba(0,0,0,0.7);
    }
    /* #endregion */
    /* #region ~ CENTER - батоны верхнего меню ~ */

    .c-header-center {
        min-width: 1%;
        display: inline-block;
        /**/
    }

    .c-header-center-menu-div {
        display: inline-block;
        background-color: transparent;
        overflow: hidden;
        white-space: nowrap;
        margin-left: -20px;
        margin-top: 21px;
        /**/
        margin-left: 5px;
        /*padding-left: 160px;*/
    }

    .c-header-mm-div-btn-home {
        margin-left: -45px;
        width: 60px;
        min-height: 1px;
        /**/
        margin-top: -19px;
    }

    .c-header-mm-btn-horizontal {
        padding: 0 15px 0 5px;
        background-color: transparent;
        color: rgba(255,255,255,1); /* SKIN!!! */
        font: 400 13px "Open Sans",arial; /* SKIN!!! */
        /**/
        /* text-shadow: 1px 2px 5px rgba(0,0,0,0.30);*/
        /*text-shadow: 1px 2px 20px rgba(0,0,0,9);*/
        /**/
        padding: 2px 8px 2px 8px;
        border-radius: 9px;
    }

        .c-header-mm-btn-horizontal.icon {
            padding: 0;
            position: absolute;
            margin-top: -4px;
            margin-left: 20px;
            /*            width: 24px;
            height: 24px;*/
            border-radius: 99px;
            padding: 5px;
        }

            .c-header-mm-btn-horizontal.icon:hover {
                /*color: rgba(0,0,0,1);*/ /* SKIN!!! */
                /*color: rgba(255,255,255,0.8);*/
                color: rgba(0,0,0,0.55);
                background-color: rgba(0,0,0,0.03);
                color: rgba(0,207,255,0.7);
            }

        .c-header-mm-btn-horizontal.cursordefault {
            cursor: default;
        }

        .c-header-mm-btn-horizontal.long {
            max-width: 180px;
            min-height: 1px;
            white-space: normal;
            margin-bottom: 50px;
        }

        .c-header-mm-btn-horizontal:hover {
            color: rgba(0,0,0,1);
            /*background-color: rgba(0,0,0,0.03);*/
            background-color: transparent;
            /**/
            color: var(--color-main-header-hovermenu);
        }

    .c-header-mm-child-div {
        margin-bottom: 12px;
        margin-top: 9px;
        border-radius: 5px;
        /*background-color: rgba(55,104,175,0.8);*/ /* SKIN!!! */
        /**/
        background-color: white;
        border-radius: 10px;
        /**/
        margin-bottom: 17px;
        margin-top: 15px;
    }

    .c-header-mm-menuitem {
        margin-top: -20px;
        margin-bottom: -20px;
        background-color: transparent;
        /**/
        cursor: default;
    }

        .c-header-mm-menuitem:hover {
            background-color: transparent;
        }

    .c-header-mm-btn-vertical {
        background-color: transparent;
        display: inline-block;
        padding: 5px 5px 5px 5px;
        text-align: left;
        width: 100%;
        font: 600 13px "Open Sans",arial; /* SKIN!!! */
        color: rgba(0,0,0,0.8) !important;
    }

        .c-header-mm-btn-vertical:hover {
            background-color: transparent;
            color: rgba(55,103,175,1) !important;
        }

    .c-header-mm-btn-vertical-icon {
        margin-top: -5px;
        margin-left: -5px;
        color: rgba(0,0,0,0.8) !important;
    }

        .c-header-mm-btn-vertical-icon:hover .c-header-mm-btn-vertical {
            background-color: transparent;
        }

    .c-header-mm-btn-vertical:hover .c-header-mm-btn-vertical-icon {
        background-color: transparent;
        color: rgba(0,0,0,1) !important; /* SKIN!!! */
    }
    /* #endregion */
    /* #region ~ RIGHT - user и кнопки ~ */

    .c-header-right {
        display: inline-block;
        right: 0;
        text-align: right;
        z-index: 1;
    }

    .c-header-right-documents-buttons-div {
        position: absolute;
        right: 70px;
        margin-top: 5px;
        z-index: 1;
    }
    /* .c-header-right-documents-buttons-div.newtab {
        z-index: 1;
    }*/

    .c-header-right-btn-div {
        display: inline-block;
        margin-right: 17px;
        margin-top: 5px;
        width: 20px;
        height: 20px;
        z-index: 1;
    }

        .c-header-right-btn-div.roles {
            display: inline-block;
        }
    /* выбор роли */

    .c-header-right-roles-btn {
        font-size: 18px;
        background-color: transparent;
        cursor: pointer;
        z-index: 2;
        color: rgb(0,207,255);
    }

        .c-header-right-roles-btn:hover {
            font-size: 19px;
            margin-right: -1px;
            color: rgba(0,207,255,0.8);
        }
    /* заказанные документы */

    .c-header-right-documents-btn {
        font-size: 18px;
        background-color: transparent;
        cursor: pointer;
        z-index: 2;
        color: rgb(0,207,255); /* SKIN!!! */
    }

        .c-header-right-documents-btn:hover {
            font-size: 19px;
            margin-right: -1px;
            color: rgba(0,207,255,0.8); /* SKIN!!! */
        }

    .c-header-right-documents-lbl {
        font: 600 8px "Overpass",sans-serif;
        color: rgba(255,255,255,1);
        background-color: rgba(220,20,60,1);
        border-radius: 99px;
        padding: 3px 2px 2px 3px;
        z-index: 3;
        position: absolute;
        margin-top: -3px;
        margin-left: 13px;
    }
    /* помощь */

    .c-header-right-help-btn {
        font-size: 18px;
        background-color: transparent;
        cursor: pointer;
        z-index: 2;
        color: rgb(0,207,255);
        /*color: rgb(240,230,140);
    color: rgba(0,255,255,1);*/
        color: var(--header-btn-help);
    }

        .c-header-right-help-btn:hover {
            font-size: 19px;
            margin-right: -1px;
            color: rgba(0,207,255,0.8); /* SKIN!!! */
        }

        .c-header-right-help-btn.x01 {
            position: absolute;
            right: 0;
        }

    .c-header-right-exit-btn.x01 {
        position: absolute;
        right: -35px;
    }
    /* настройки */

    .c-header-right-setting-btn {
        font-size: 18px;
        background-color: transparent;
        cursor: pointer;
        z-index: 2;
        color: rgb(0,207,255); /* SKIN!!! */
    }

        .c-header-right-setting-btn:hover {
            font-size: 19px;
            margin-right: -1px;
            color: rgba(0,207,255,0.8); /* SKIN!!! */
        }
    /* выход */

    .c-header-right-exit-btn {
        font-size: 18px;
        background-color: transparent;
        cursor: pointer;
        z-index: 2;
        color: rgb(0,207,255); /* SKIN!!! */
    }

        .c-header-right-exit-btn:hover {
            font-size: 19px;
            margin-right: -1px;
            color: rgba(0,207,255,0.8); /* SKIN!!! */
        }
    /* юзверь */

    .c-header-right-user-div {
        display: inline-block;
        position: absolute;
        right: 20px;
        margin-top: 17px;
        /**/
        margin-top: 14px;
        right: 22px;
    }

    .c-header-right-user-btn {
        font-size: 25px; /* SKIN!!! */
        color: rgba(255,255,255,0.7); /* SKIN!!! */
        cursor: default;
        background-color: transparent;
        padding: 5px;
    }

        .c-header-right-user-btn:hover {
            color: white;
            font-size: 26px;
            margin-right: -1px;
        }

        .c-header-right-user-btn.newtab {
            margin-top: -5px;
            margin-right: -70px !important;
        }

            .c-header-right-user-btn.newtab:hover {
            }


    .c-header-right-user-case {
        font-size: 13px; /* SKIN!!! */
        color: rgba(255,255,255,0.7); /* SKIN!!! */
        cursor: default;
        background-color: transparent;
        padding: 6px;
        position: absolute;
        margin-left: 20px;
    }

    .c-header-right-user-lbl {
        cursor: default;
        background-color: transparent;
        font: 400 11px "Open Sans",sans-serif; /* SKIN!!! */
        color: rgba(255,255,255,0.8); /* SKIN!!! */
        margin-top: -3px;
        position: absolute;
        right: 0px;
        white-space: nowrap;
        margin-top: 33px;
    }

        .c-header-right-user-lbl.newtab {
            margin-right: -70px;
            margin-top: 28px;
        }

    .c-header-user-tooltip {
    }
    /* #endregion */
    /* #region ~ ЛЕВОЕ МЕНЮ ~ */

    .c-header-left-menu {
        display: none;
        color: white;
        /**/
        z-index: 9999;
        height: 100%;
        position: fixed;
        /*overflow: hidden !important;    */
    }

    .c-header-left-menu-button {
        font-size: 24px;
        margin-top: 10px;
        margin-left: -1px;
        position: absolute;
        z-index: 9999;
        /**/
        /*position: relative;*/
        margin-left: 3px;
    }

    .c-header-left-menu-drawer {
        width: 305px !important;
        /**/
        /* width: 331px !important;*/
    }

    .c-header-drawer-header {
        background-color: rgb(55,104,175);
        height: 70px !important;
        color: white;
        margin-bottom: 20px;
        /**/
        background-color: var(--bg-main);
    }

    .c-header-levels {
        margin-left: -10px;
        width: 295px;
        /**/
        width: 331px;
        /**/
        width: 305px;
    }
    /*.c-header-level-1 {
    font: 600 15px "Open Sans",Arial;
}*/

    .c-header-level-1 .mud-nav-link {
        font: 600 15px "Open Sans",Arial;
        width: 273px;
        /**/
        width: 295px;
        /**/
        width: 285px;
    }

    .c-header-level-1.mud-nav-group > .mud-nav-link > .mud-nav-link-text {
        font: 600 15px "Open Sans",Arial;
        width: 295px;
        /**/
        width: 285px;
    }
    /*.c-header-level-2 {
    font: 500 13px "Open Sans",Arial;
    text-decoration: none;
    outline: none;
    color: rgba(47,79,79,1);
    margin-left: 5px;    
}*/

    .c-header-level-2 .mud-nav-link {
        font: 500 13px "Open Sans",Arial;
        text-decoration: none;
        outline: none;
        width: 295px;
        /**/
        /*width: 390px;*/
        width: 285px;
    }

    .c-header-text-1 {
        font: 700 24px "Open Sans",arial !important;
        display: block;
        /**/
        margin-left: 40px;
        margin-top: -3px;
    }

    .c-header-text-2 {
        font: 400 13px "Open Sans",arial !important;
        display: block;
        position: absolute;
        margin-top: 28px;
        margin-left: 50px;
        /**/
        margin-left: 80px;
    }

    .c-header-accessory {
        position: absolute;
        display: flex;
        height: 70px;
        width: 3px;
        left: 304px;
        z-index: 10000;
        background-color: rgba(55,104,175,1);
        /**/
        background-color: var(--bg-main);
    }
    /* #endregion */
    /* #region ~ PERSONAL SETTINGS ~ */
    .c-header-personal-settings {
    }

    .c-header-ps-drawer-header {
        background-color: rgb(55,104,175);
        height: 70px;
        color: white;
        margin-bottom: 20px;
        /**/
        background-color: var(--bg-main);
    }

    .c-header-personal-settings-drawer {
    }
    /* #endregion */
    /* #region ~ РАЗНОЕ ~ */

    .c-header-bufferzone {
        height: 5px;
        width: 100%;
        display: block;
    }

    .c-header-od-type-title {
        font-size: 12px;
        color: rgb(0,0,0,0.7);
    }

    .c-header-od-type-title-for {
        font-size: 12px;
        font-weight: 600;
        color: rgb(0,0,0,1);
        height: 20px;
        padding: 0;
        margin-top: -15px;
        margin-left: 0px;
        margin-bottom: -10px;
    }

    .c-header-od-type-combo {
        /* padding: 0;
    margin: -15px 0 0 40px;
    height: 20px;
    min-width: 210px;*/
        padding: 0 !important;
        margin: 5px 0 0 10px;
        height: 20px;
        min-width: 210px;
    }

    .c-header-od-delimiter {
        height: 1px;
        margin-top: -25px;
        width: 100%;
        background-color: rgba(0,0,0,0.9);
    }

    .c-header-od-info {
        font: 400 12px "Open Sans",Arial !important;
        color: rgba(0,0,0,0.6);
        margin: -5px 0 5px 0;
    }

    .c-header-od-date-container {
        display: inline-block;
        text-align: left;
        /*height: 65px;*/
        /*padding-bottom: -150px;*/
        display: flex;
    }

    .c-header-od-date {
        display: inline-block;
        margin-right: 20px;
    }

    .c-header-title-main {
        padding: 2px 10px 5px 10px;
        background-color: rgba(0,0,0,0.03);
        text-decoration: none;
        color: rgba(0,0,0,0.8);
        border-radius: 9px;
        font-size: 17px;
        font-weight: 600;
    }

    .c-header-od-title-container {
        position: absolute;
        top: 25px;
        left: 20px;
    }
    /* #endregion */
    /* #region ~ HEADER - NEWTAB ~ */

    .c-header-nt {
        width: calc(100% - 20px);
        display: flex;
        position: relative;
        width: 100%;
        overflow: hidden;
        background-color: var(--bg-main);
        border-bottom: none;
        height: 70px;
        /**/
        /*  display: block;
    background-color: red;
    left: 0;
    top: 0;*/
    }

        .c-header-nt.shadow {
            box-shadow: var(--box-shadow-1) !important;
        }

        .c-header-nt.fe-header {
           /* min-height: 150px;
            display: flex !important; 
            position: relative !important;*/
            /*top: 0 !important;*/
        }

    .c-header-nt-center {
        min-width: 1%;
        display: inline-block;
        width: calc(100%);
        /**/
        /* height: 2px;
    background-color: yellow;*/        
    }


    .c-header-nt-center-line-1-div {
        display: inline-block;
        width: calc(100% - 200px);
        margin-left: 50px;
        margin-top: 6px;
        width: calc(70%);
        /**/
        /*height: 2px;
    background-color: red;*/
    }

    .c-header-nt-center-line-1-title {
        font: 700 22px "Open Sans",Overpass,sans-serif;
        color: rgba(255,255,255,1);
    }

    .c-header-nt-center-line-2-div {
        display: inline-block;
        width: calc(100% - 200px);
        margin-left: 50px;
        width: calc(70%);
    }

    .c-header-nt-center-line-2-title {
        font: 400 14px "Open Sans",Overpass,sans-serif;
        color: rgba(255,255,255,1);
    }
    /* #endregion */
    /* #region ~ MEDIA ~ */

    @media screen and (max-width: 1380px) {

        .c-header-left-logo {
            display: none;
        }

        .c-header-left {
            width: 300px;
        }

        .c-header-left-menu {
            display: block;
        }

        .c-header-nt-center-line-1-div {
            margin-left: 20px;
        }

        .c-header-nt-center-line-2-div {
            margin-left: 20px;
        }

        .c-header-left-menu-drawer {
            display: block;
        }

        .c-header-left {
            margin-left: 30px;
        }

        .c-header-center {
            display: none;
        }

        .c-header-left-info-div {
            margin-left: -15px;
            width: calc(100% - 265px);
        }
    }

    @media screen and (max-width: 1000px) {

        .c-header-bottom-info-div-1 {
            display: block;
        }

        .c-header-left-info-div-bottom {
            display: block;
        }

        .c-header-left-info-div {
            display: none;
        }
    }

    @media screen and (max-width: 800px) {

        .c-header-right-user-btn.newtab {
            display: none;
        }

        .c-header-right-user-lbl.newtab {
            display: none;
        }

        .c-header-right-documents-buttons-div.newtab {
            margin-top: 20px;
            right: 5px;
        }

        .c-header-nt-center-line-1-title {
            font: 600 17px "Open Sans",Overpass,sans-serif;
            font: 600 14px "Open Sans",Overpass,sans-serif;
        }

        .c-header-nt-center-line-2-title {
            font: 400 12px "Open Sans",Overpass,sans-serif;
            padding-bottom: 10px;
        }

        .c-header-right-help-btn.x01 {
            display: none;
        }

        .c-header-right-exit-btn.x01 {
            position: absolute;
            right: 10px;
            margin-top: 0;
        }
    }

    @media screen and (max-width: 600px) {
        .c-header-left-search-txt {
            width: 165px;
            height: 30px;
        }

            .c-header-left-search-txt.type1 {
            }

        .c-header-left-search-btn.type1 {
            margin: -25px 0 0 140px !important;
        }

        .c-header-right-documents-buttons-div {
            right: 40px;
        }
        /*  .c-header-right-documents-buttons-div.newtab {
            margin-top: 20px;
            display: none;
        }*/

        .c-header-right-user-div {
            right: 14px;
            margin-top: 17px;
        }
    }
    /* #endregion */
