/*collectum.css v.4.0910*/
/*====INGEN VÄNSTERMENY=====*/
/*====CENTRERAD=====*/

/* ================================================================
   DESIGNVARIABLER — åsidosätts i brand-specifik temafil
   Aktiveras via ?brand=avtalat (URL-parameter, sparas i sessionStorage)
   ================================================================ */
:root {
    /* Etikett "INLOGGAD SOM" i headern */
    --ik-header-label-color:     #8f001c;
    /* Accentfärg: footer, strukturella bakgrundsytor */
    --ik-accent:                 #96001D;
    --ik-accent-hover:           #6b0015;
    /* Nav-fliken som är aktiv (kan skilja sig från accent) */
    --ik-nav-selected:           #96001D;
    /* Headerbakgrund */
    --ik-header-bg-image:        url("../images/background_clean.png");
    --ik-header-bg-color:        transparent;
    /* Sekundär canvasyta: paneler (bg-lightgrey, global-backdrop) och kantlinjer.
       Åsidosätts av avtalat-theme.css. Tidigare hårdkodad #EAE7DF överallt. */
    --ik-canvas-level-2:         #EAE7DF;
    /* Primär interaktionsfärg: knappar, aktiva element, ikoner, länkar */
    --ik-btn-primary:            #00AEEF;
    --ik-btn-primary-hover:      #0099CC;
    /* Informations-/meddelandepanel */
    --ik-info-bg:                #67518D;
    --ik-info-bg-dark:           #42355A;
    /* Typsnitt */
    --ik-font-family:            'Arial Black', Arial, sans-serif;
    /* Kortfärger (puffar) — semantiska, styr layout-kort per kategori */
    --ik-card-green:             #00A88C;
    --ik-card-green-dark:        #00977E;
    --ik-card-green-light:       #6CBF6D;
    --ik-card-green-light-dark:  #62AB62;
    --ik-card-yellow:            #FFE046;
    --ik-card-yellow-dark:       #CDB438;
    --ik-card-purple:            #67518D;
    --ik-card-purple-dark:       #42355A;
    --ik-card-blue:              #009CD7;
    /* Hover-färger för kort */
    --ik-card-purple-hover:      #584778;
    --ik-card-blue-hover:        #0395cb;
    --ik-card-blue-dark-hover:   #0176a3;
    --ik-card-yellow-hover:      #a1903d;
    --ik-card-green-light-hover: #5a9e5b;
    --ik-card-green-cont-hover:  #4c844c;
    /* Footerfärger */
    --ik-footer-bg:              #ec0532;
    --ik-footer-shortcut-bg:     #d4062e;
    /* Åtgärdslänk i footer */
    --ik-action-link-blue:       #0b86c4;
    /* Länkfärg (Bootstrap-blå i Collectum) */
    --ik-link-color:             #337ab7;
    --ik-link-hover:             #23527c;
}

a
{
    color: var(--ik-link-color);
}

    a:hover, a:focus
    {
        color: var(--ik-link-hover);
    }

html
{
    overflow-y: scroll; /*display right-side scrollbar by default to prevent horizontal displacement*/
}

html, body
{
    height: auto;
    width: 100%;
    text-align: center; /*center-content*/
}

pre
{
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.42857143 !important;
    color: #333 !important;
    white-space: break-spaces !important;
    word-break: normal !important;
    background-color: #fff !important;
    border: none !important;
}

#body
{
    margin: 0 auto;
}

.footer
{
    height: auto;
    border-bottom: 35px solid var(--ik-accent);
}

#kundinfo p
{
    margin-bottom: 0;
}

.footer-content
{
    border-bottom: 2px solid white;
}

    .footer-content a
    {
        color: white !important;
        text-decoration: underline;
    }

.infobox a
{
    color: #474747 !important;
    text-decoration: underline;
}

.fc-heading
{
    color: white;
    text-transform: uppercase;
}

.feedback-active-overlay
{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2000;
    overflow: hidden;
}

input[type='text']::-ms-clear
{
    display: none;
}

.dont-break
{
    /* These are technically the same, but use both */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;
    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

body, .wrapper-portal
{
    display: block;
    float: left;
    text-align: left;
}

    body *
    {
        position: relative;
        /* display: -webkit-box; */
    }

.wrapper-portal
{
    /* height: 100%;*/
    max-width: 1280px;
}

    #iframe,
    .wrapper-portal .main-portal
    {
        /* position: absolute !important; */ /*center-content*/
        /* top: 156px; */ /*center-content*/
        /* left: 265px; */
        /* width: 100%; */
        /* width: 1280px; */
    }

    #body,
    .wrapper-portal .head-portal
    {
        width: 1280px !important;
    }

.autoheight
{
    height: auto !important;
}

.fullheight
{
    height: 100% !important;
}

.bg-lightgreen
{
    background-color: var(--ik-card-green-light);
}

.bg-contrastgreen
{
    background-color: var(--ik-card-green-light-dark);
}

.bg-lightgrey
{
    background-color: var(--ik-canvas-level-2) !important;
}

.bg-lightergrey
{
    background-color: #F5F4F0 !important;
}

.bg-lightestgrey
{
    background-color: #f5f5f5 !important;
}

.bg-white
{
    background-color: white !important;
}

.bg-paleyellow
{
    background-color: #E8EA83;
}

.bg-green
{
    background-color: var(--ik-card-green);
}

.bg-orange
{
    background-color: #FCB11F;
}

.bg-puregreen-contrast
{
    background-color: var(--ik-card-green-dark);
}

.card a.pufflink:hover .bg-green
{
    background-color: #008871;
}

.card a.pufflink:hover .bg-puregreen-contrast
{
    background-color: #006453;
}

.c-pointer
{
    cursor: pointer !important;
}

.card a.pufflink.active,
.card a.pufflink.active .puff-body,
.card a.pufflink.active .puff-body .puff-name *,
.card a.pufflink.active .report-footer .details strong,
.card a.pufflink.active .report-footer .details .glyphicon,
.card .pufflink.active > div *,
#loneskatt .active *
{
    color: #272727 !important;
    background-color: var(--ik-canvas-level-2);
}

.card a#NOTISER.pufflink.active,
.card a#NOTISER.pufflink.active:hover
{
    background-color: white !important;
}

.card .puff-inactive-adm .puff-body .puff-name *
{
    color: #272727 !important;
}

.card a.pufflink.active:hover .bg-contrastblue,
.card a.pufflink.active .bg-contrastblue,
.card a.pufflink.active .bg-contrastgreen,
.card a.pufflink.active .bg-contrastpurple,
.card a.pufflink.active .bg-puregreen-contrast,
.card a.pufflink.active .report-footer *,
#individ-area .puff-inactive .report-footer.options
{
    background-color: #DDDaD4 !important;
}

#individ-area .puff-inactive .report-footer.options
{
    top: -30px;
    height: 60px;
}

.card input[type='text']
{
    padding: 5px;
}

.bg-lightgrey
{
    background-color: var(--ik-canvas-level-2) !important;
}

.bg-darkgrey
{
    background-color: #CCCCCC;
}

.c-purple
{
    color: var(--ik-card-purple) !important;
}

.bg-purple
{
    background-color: var(--ik-card-purple);
}

.bg-contrastpurple
{
    background-color: var(--ik-card-purple-dark);
}

.bg-contrastlightgrey,
.bg-contrastlightgrey *
{
    background-color: #DDDaD4 !important;
}

.bg-contrastgrey
{
    background-color: #a0a0a0;
}

.bg-contrastdarkgrey
{
    background-color: #B8B8B8;
}

.bg-contrastyellow
{
    background-color: var(--ik-card-yellow-dark);
}

.bg-contrastblue
{
    background-color: var(--ik-card-blue);
}

.red
{
    color: #FF0033;
}

.txt-red
{
    color: #FF0033 !important;
}

.white
{
    color: white;
}

.blue
{
    color: var(--ik-btn-primary) !important;
}

.bg-red
{
    background-color: #FF0033;
}

.bg-contrastred
{
    background-color: var(--ik-accent);
}

.bg-yellow
{
    background-color: #FFE046 !important;
}

.yellow
{
    color: #FFE046 !important;
}

.flex-align-center
{
    display: flex;
    flex-direction: row;
    align-items: center;
}

.flex > .axis-center
{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ik-red
{
    background-color: #FF0033;
}

.img-compass
{
    width: 100%;
}

.font-italic
{
    font-style: italic !important;
}

.font-regular
{
    font-weight: 400;
}

.headline-inline
{
    /* text-transform: uppercase;*/
    margin-left: 15px;
    font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
    font-size: 1.1em !important;
}

ul.button-list li
{
    float: left;
}

label.l-right, p.l-right
{
    padding-left: 5px;
}

p.l-right
{
    display: inline;
}

.cbo
{
    position: absolute;
    top: 20px;
    left: 25px;
}

.cbo-uc
{
    position: absolute;
    top: 11px;
    left: 30px;
}

.cbo-row
{
    top: -5px
}

    .cbo-row span
    {
        top: -4px;
    }
/*========HEADPORTAL=======*/

.head-portal
{
    /*max-width: 1280px !important;*/ /*center-content*/
    background-image: var(--ik-header-bg-image);
    background-color: var(--ik-header-bg-color);
    /*background-repeat: no-repeat;*/
    height: 146px;
    text-align: right;
    padding-top: 20px;
    /*margin-top: -5px;/*center-content*/
    /*  margin-left: -5px;*/ /*center-content*/
    /*font-family: 'Arial Black';*/
}

    .head-portal .logotype-top
    {
        padding-top: 15px;
        text-align: center;
        -moz-min-width: 40% !important;
        -ms-min-width: 40% !important;
        -o-min-width: 40% !important;
        -webkit-min-width: 40% !important;
        min-width: 22% !important;
    }

        .head-portal .logotype-top a
        {
            display: block;
            float: left;
        }

        .head-portal .logotype-top img
        {
            width: 80%;
            display: inline-block;
            -moz-min-width: 200px !important;
            -ms-min-width: 200px !important;
            -o-min-width: 200px !important;
            -webkit-min-width: 200px !important;
            min-width: 200px !important;
        }

    .head-portal .login-area
    {
        padding-top: 38px;
        padding-right: 0;
    }

    .head-portal *
    {
        font-size: 14px;
    }

    .head-portal ul.user li
    {
        display: block;
    }

.head-bottom-menu
{
    padding-top: 16px;
}

    .head-bottom-menu ul li.selected
    {
        background-color: var(--ik-nav-selected);
    }

/*====MAIN PORTAL=====*/

.main-portal
{
    height: auto;
    /*max-width: 1045px !important;*/
    padding-bottom: 15px;
    /*background-color: lightgrey;*/
}

    .main-portal > div
    {
        min-height: 200px;
    }

#navigator
{
    height: auto !important;
    min-height: auto !important;
}

.main-portal .main-employee-info
{
    min-height: 170px;
}

.head-top-menu
{
    float: right;
    color: white;
}

.leftMenu
{
    max-width: 235px !important;
}

.global-backdrop
{
    background-color: var(--ik-canvas-level-2);
    min-height: 200px !important;
    padding-bottom: 15px;
}

.grey-border
{
    border: 2px solid var(--ik-canvas-level-2);
}

.lightgrey-border-top
{
    border-top: 2px solid #EBE8E1;
}

.lightgrey-border-bottom
{
    border-bottom: 2px solid #EBE8E1;
}

.lightgrey-border-left
{
    border-left: 2px solid #EBE8E1;
}

.lightgrey-border-right
{
    border-right: 2px solid #EBE8E1;
}

.darkgrey-border
{
    border: 2px solid #a0a0a0;
}

.grey-border-top
{
    border-top: 2px solid #a0a0a0;
}

.grey-border-right
{
    border-right: 2px solid #a0a0a0;
}

.grey-border-left
{
    border-left: 2px solid #a0a0a0;
}

.green-border
{
    border: 4px solid #B2D788;
}

.reddish-border
{
    border: 4px solid #FF9999;
}

.dark-orange-border
{
    border: 4px solid #fcb11f;
}

.orange-border
{
    border: 4px solid #FFCC33;
}

.grey-box
{
    border: 3px solid #a0a0a0 !important;
}

.purple-box
{
    border: 3px solid var(--ik-card-purple) !important;
}

.no-pad
{
    padding: 0 !important;
}

.no-pad-b
{
    padding-bottom: 0 !important;
}

.no-pad-lr
{
    padding-left: 0px !important;
    padding-right: 0 !important;
}

.no-pad-l
{
    padding-left: 0 !important;
}

.no-wrap
{
    white-space: nowrap;
}

.no-pad-r
{
    padding-right: 0 !important;
}

.pad-lr
{
    padding-left: 5px;
    padding-right: 5px;
}

.xtra-pad-r
{
    padding-right: 27px !important;
}

.xtra-pad-l
{
    padding-left: 27px !important;
}

.xs-pad-r
{
    padding-right: 4px !important;
    padding-left: 0 !important;
}

.xs-pad-l
{
    padding-left: 0;
    padding-left: 4px;
}

.oneplus
{
    width: 12% !important;
}

.oneminus
{
    width: 6% !important;
}

.white
{
    color: white !important;
}

.bottom-margin
{
    margin-bottom: 15px;
}

.n-top-margin
{
    margin-top: -20px;
}

.nomarg
{
    margin: 0 !important;
}

.nomarg-b
{
    margin-bottom: 0 !important;
}

.t-margin
{
    margin-top: 15px;
}

.t-margin-sm
{
    margin-top: 10px;
}

.t-margin-xs
{
    margin-top: 5px;
}

.b-margin
{
    margin-bottom: 15px;
}

.b-margin-sm
{
    margin-bottom: 10px;
}

.onepx-fix-r
{
    border-right: solid white 1px;
}

.onepx-fix-l
{
    border-left: solid white 1px;
}

.fluid-img
{
    width: 100%;
    height: auto;
}
/*==========FONTS/STYLES===========*/

body,
.head-portal
{
    font-family: var(--ik-font-family);
}

    .head-portal ul.user *
    {
        font-size: 12px;
    }

    .head-portal ul.user li:last-child
    {
        font-family: 'Arial';
    }

    .head-portal p
    {
        margin: 0 !important;
    }

h1, h2, h3, h4
{
    font-weight: bold !important;
    display: inline-block;
}

.font-xl
{
    font-size: x-large !important;
}
/*h1 {
    font-size: 28px!important;
}*/

h3
{
    font-size: 19pt !important;
    text-transform: uppercase;
}

.it-und
{
    font-style: italic;
    text-decoration: underline;
}

.guiden h1, .calendar .year-inspector p
{
    font-weight: bold;
    color: #373737;
}

.ik-btn-default,
.guiden .guide-area .sap-link a
{
    text-transform: uppercase;
    font-size: 12pt !important;
    font-weight: 700;
    background-color: var(--ik-btn-primary);
    color: white !important;
    padding: 10px 15px;
    margin-top: 5px;
}

.btn-remove .ik-btn-default
{
    background: none;
    color: #333 !important;
    text-transform: none;
    padding-left: 30px;
}

    .btn-remove .ik-btn-default:hover
    {
        text-decoration: underline;
        color: #333;
        background: none;
    }

.ik-btn-default
{
    line-height: 0.9em;
}

.select-move-service .ik-btn-default
{
    background-color: var(--ik-card-purple);
}

    .select-move-service .ik-btn-default:hover,
    .select-move-service .ik-btn-default:focus
    {
        background-color: #584778 !important;
    }

#file-status .ik-btn-default,
#file-status-puff .ik-btn-default
{
    line-height: 1.2em;
}

.calendar .status-type h4
{
    font-size: 16pt;
    font-weight: 800 !important;
    color: #373737;
    text-transform: uppercase;
    white-space: nowrap;
}

.calendar .header > div
{
    padding: 0 !important;
}

    .calendar .header > div p,
    .calendar .months p,
    .calendar .status-area,
    .calendar .message p,
    .calendar .total-period-status p
    {
        font-size: 11pt;
        font-weight: bold;
        color: #868686;
        padding-top: 5px;
    }

.calendar a
{
    font-size: 11pt;
    font-weight: bold;
}

.feedback-panel .feedback-tab h4,
.calendar .months p
{
    text-transform: uppercase;
}

.calendar .months ul#itp1 li div p
{
    color: #ff0033;
}

.calendar .months ul#itp1 li.zero div p,
.calendar .months ul#itp2 li.zero div p
{
    color: #373737;
}

.calendar .months ul#itp2 li div p
{
    color: #fcb11f;
}

.calendar .message p
{
    text-transform: initial;
}

.current-info .current-info-area h4
{
    font-size: 16pt;
    color: #373737;
    /*text-transform: uppercase;*/
}

.main-portal h3,
.head-modul > h1,
.head-modul > h2,
.head-modul > h3,
.head-modul > .header h3
{
    text-transform: uppercase;
    font-weight: 800 !important;
    color: #373737;
    white-space: nowrap;
}

.head-modul > h1,
.head-modul > h2,
.head-modul > h3,
.head-modul > .header h3
{
    float: left;
}

.feedback-box h3
{
    text-transform: uppercase;
    font-weight: 800 !important;
    color: #373737;
    white-space: nowrap;
}

/*=======LISTS/LINKS=========*/

ul
{
    list-style-type: none;
    padding-left: 0;
}

.head-portal a:hover
{
    background-color: transparent !important;
}

.head-portal ul li, .head-portal ul li a
{
    display: inline-block;
    color: white;
}

.head-portal ul.user
{
    padding-bottom: 0;
    margin-bottom: 0;
}

    .head-portal ul.user li:first-child
    {
        color: var(--ik-header-label-color);
        padding-right: 0;
    }

    ul.top-menu *, .head-bottom-menu ul, .puff-item-head h4.puff-top, .head-portal ul.user li:first-child
    {
        text-transform: uppercase;
    }

ul.top-menu li
{
    margin: 5px;
}

ul.tight-list li
{
    line-height: 1.4em;
}

.guiden .guide-area a:hover
{
    text-decoration: underline;
}

.ik-btn-default:hover,
.sap-link a:hover,
.ik-btn-default:focus
{
    background-color: var(--ik-btn-primary-hover);
    text-decoration: none;
}

.guiden .guide-area .text-left a:hover,
.calendar a:focus,
.calendar a:hover,
.puff-area-wrap a:hover
{
    /*background-color: lightgray;*/
}

.main-portal .calendar div.months ul li:hover
{
    cursor: pointer;
}

.main-portal .current-info u a,
.main-portal .current-info a
{
    /*text-decoration: none !important;*/
}

    .main-portal .current-info a:hover
    {
        background-color: white;
        text-decoration: underline;
    }

/*============COMPONENTS=================*/

.main-portal .glyphicon
{
    position: absolute !important;
    font-size: 10px;
    color: #272727;
    margin-top: 3px;
    margin-bottom: 10px;
    margin-left: -20px;
    text-align: inherit;
}

.main-portal .info-box-wrapper .body-info-box .glyphicon
{
    cursor: pointer;
    position: absolute !important;
    font-size: 16px;
    margin-top: 11px;
    margin-left: 10px;
    text-align: inherit;
    right: 0;
}

.glyphicon-pencil
{
    color: var(--ik-link-color) !important;
    font-size: 14px !important;
}

    .glyphicon-pencil:hover
    {
        cursor: pointer;
    }

.glyphicon-chevron-down.bluelink,
.glyphicon-chevron-up.bluelink
{
    right: 0;
    margin-left: 0;
    position: relative !important;
    color: var(--ik-link-color);
}

.glyph-question > span.glyphicon,
.glyph-question > i.glyphicon
{
    float: right;
    right: -25px;
    top: -4px;
    font-size: 20px;
    color: var(--ik-btn-primary);
    cursor: pointer;
}

.move-emp-area .glyph-question > span.glyphicon
{
    right: 5px;
    top: 17px;
}

.info-puff-widget
{
    position: absolute;
    width: 450px;
    height: auto;
    background-color: white;
    right: -113px;
    top: 25px;
    float: none;
    clear: both;
    z-index: 1001;
}

.expandable-area-container
{
    overflow: hidden;
}

.info-puff-widget.active
{
    border: 1px solid #ebe8e1;
    box-shadow: 0 1px 10px rgba(0,0,0,.4);
}

.calendar .glyphicon-phone,
.calendar .glyphicon-envelope
{
    color: #272727;
    font-size: 35px;
}

img.img-info
{
    width: 70%;
    -moz-min-width: 27px;
    -ms-min-width: 27px;
    -o-min-width: 27px;
    -webkit-min-width: 27px;
    min-width: 27px;
}

img.logga-print,
.title-print
{
    display: none !important;
}

.info-area
{
    margin-left: 4px;
}

.info-box
{
    margin-left: 10px;
    /*margin-top: 15px;*/
    z-index: 2000;
}

.info-box-wrapper
{
    position: absolute;
    height: auto;
    width: 250px;
    z-index: 1000;
    margin-left: 0;
    margin-top: 36px;
}

.body-info-box
{
    background-color: var(--ik-btn-primary);
    position: absolute !important;
    border: solid 2px white;
    /*margin: 0px 0px 0px 245px;*/
}

    .body-info-box h4
    {
        font-size: 13pt;
        text-transform: uppercase;
    }

    .header-info-box h3, .header-info-box span, .content-info-box, .body-info-box h4
    {
        color: white;
    }

.header-info-box h3
{
    margin-top: 10px !important;
}

.head-modul
{
    padding: 0 15px 15px 15px;
}

    .head-modul span
    {
        float: left;
    }

    .head-modul .header-info-box .glyphicon
    {
        /*float: right;*/
    }

.puff, .puff *, .header-info-box, .info-box-wrapper *
{
    text-align: center;
}

.puff-head
{
    padding: 15px;
}

.puff-item-head
{
    /*background-color: black;*/
    /*color: white;*/
    padding-top: 5px;
    padding-bottom: 5px;
}

    .puff-item-head h4.puff-top
    {
        /*font-weight: 800 !important;*/
        color: #ff0033;
        font-size: 16px;
        line-height: inherit;
    }

.puff-body-head h4
{
    font-size: 14px;
}

.sk-fading-circle
{
    margin: 96px auto;
    width: 40px;
    height: 40px;
    position: relative;
}

.companycard .company-selector .sk-fading-circle,
.empcard .company-selector .sk-fading-circle
{
    width: 30px;
    height: 30px;
}

.startpage .company-selector .sk-fading-circle,
.companycard .company-selector .sk-fading-circle,
.empcard .company-selector .sk-fading-circle
{
    margin: 20px auto;
    position: absolute;
}

.sk-fading-circle.small
{
    width: 25px;
    height: 25px;
    position: absolute;
    /* right: 40px; */
    /* top: 0; */
    margin: 0;
}

.sk-fading-circle .sk-circle
{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

    .sk-fading-circle .sk-circle:before
    {
        content: '';
        display: block;
        margin: 0 auto;
        width: 15%;
        height: 15%;
        background-color: #333;
        -ms-border-radius: 100%;
        border-radius: 100%;
        -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
        -moz-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
        -ms-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
        -o-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
        animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
    }

.sk-fading-circle.white .sk-circle:before
{
    background-color: white !important;
}

.sk-fading-circle .sk-circle2
{
    -webkit-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
}

.sk-fading-circle .sk-circle3
{
    -webkit-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    transform: rotate(60deg);
}

.sk-fading-circle .sk-circle4
{
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

.sk-fading-circle .sk-circle5
{
    -webkit-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    -moz-transform: rotate(120deg);
    -o-transform: rotate(120deg);
    transform: rotate(120deg);
}

.sk-fading-circle .sk-circle6
{
    -webkit-transform: rotate(150deg);
    -ms-transform: rotate(150deg);
    -moz-transform: rotate(150deg);
    -o-transform: rotate(150deg);
    transform: rotate(150deg);
}

.sk-fading-circle .sk-circle7
{
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.sk-fading-circle .sk-circle8
{
    -webkit-transform: rotate(210deg);
    -ms-transform: rotate(210deg);
    -moz-transform: rotate(210deg);
    -o-transform: rotate(210deg);
    transform: rotate(210deg);
}

.sk-fading-circle .sk-circle9
{
    -webkit-transform: rotate(240deg);
    -ms-transform: rotate(240deg);
    -moz-transform: rotate(240deg);
    -o-transform: rotate(240deg);
    transform: rotate(240deg);
}

.sk-fading-circle .sk-circle10
{
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg);
}

.sk-fading-circle .sk-circle11
{
    -webkit-transform: rotate(300deg);
    -ms-transform: rotate(300deg);
    -moz-transform: rotate(300deg);
    -o-transform: rotate(300deg);
    transform: rotate(300deg);
}

.sk-fading-circle .sk-circle12
{
    -webkit-transform: rotate(330deg);
    -ms-transform: rotate(330deg);
    -moz-transform: rotate(330deg);
    -o-transform: rotate(330deg);
    transform: rotate(330deg);
}

.sk-fading-circle .sk-circle2:before
{
    -webkit-animation-delay: -1.1s;
    -moz-animation-delay: -1.1s;
    -ms-animation-delay: -1.1s;
    -o-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.sk-fading-circle .sk-circle3:before
{
    -webkit-animation-delay: -1s;
    -moz-animation-delay: -1s;
    -ms-animation-delay: -1s;
    -o-animation-delay: -1s;
    animation-delay: -1s;
}

.sk-fading-circle .sk-circle4:before
{
    -webkit-animation-delay: -0.9s;
    -moz-animation-delay: -0.9s;
    -ms-animation-delay: -0.9s;
    -o-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.sk-fading-circle .sk-circle5:before
{
    -webkit-animation-delay: -0.8s;
    -moz-animation-delay: -0.8s;
    -ms-animation-delay: -0.8s;
    -o-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

.sk-fading-circle .sk-circle6:before
{
    -webkit-animation-delay: -0.7s;
    -moz-animation-delay: -0.7s;
    -ms-animation-delay: -0.7s;
    -o-animation-delay: -0.7s;
    animation-delay: -0.7s;
}

.sk-fading-circle .sk-circle7:before
{
    -webkit-animation-delay: -0.6s;
    -moz-animation-delay: -0.6s;
    -ms-animation-delay: -0.6s;
    -o-animation-delay: -0.6s;
    animation-delay: -0.6s;
}

.sk-fading-circle .sk-circle8:before
{
    -webkit-animation-delay: -0.5s;
    -moz-animation-delay: -0.5s;
    -ms-animation-delay: -0.5s;
    -o-animation-delay: -0.5s;
    animation-delay: -0.5s;
}

.sk-fading-circle .sk-circle9:before
{
    -webkit-animation-delay: -0.4s;
    -moz-animation-delay: -0.4s;
    -ms-animation-delay: -0.4s;
    -o-animation-delay: -0.4s;
    animation-delay: -0.4s;
}

.sk-fading-circle .sk-circle10:before
{
    -webkit-animation-delay: -0.3s;
    -moz-animation-delay: -0.3s;
    -ms-animation-delay: -0.3s;
    -o-animation-delay: -0.3s;
    animation-delay: -0.3s;
}

.sk-fading-circle .sk-circle11:before
{
    -webkit-animation-delay: -0.2s;
    -moz-animation-delay: -0.2s;
    -ms-animation-delay: -0.2s;
    -o-animation-delay: -0.2s;
    animation-delay: -0.2s;
}

.sk-fading-circle .sk-circle12:before
{
    -webkit-animation-delay: -0.1s;
    -moz-animation-delay: -0.1s;
    -ms-animation-delay: -0.1s;
    -o-animation-delay: -0.1s;
    animation-delay: -0.1s;
}

@-webkit-keyframes sk-circleFadeDelay
{
    0%, 39%, 100%
    {
        opacity: 0;
    }

    40%
    {
        opacity: 1;
    }
}

.vertical
{
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

@keyframes sk-circleFadeDelay
{
    0%, 39%, 100%
    {
        opacity: 0;
    }

    40%
    {
        opacity: 1;
    }
}

.error-message
{
    padding: 8px;
}

.itp2-wrapper .error-message
{
    /*padding: 0;*/
}

.error-message p
{
    font-weight: bold !important;
    font-size: 16px !important;
    text-transform: none !important;
    color: #373737 !important;
}

.companycard .red#error .glyphicon
{
    position: relative !important;
    margin: 0;
    left: 0;
    top: 10px;
}

.companycard .edit-emp-row .red#error .glyphicon-print
{
    /* position: absolute !important; */
    /*left: 11px;
    top: 15px;*/
}

.old-browser
{
    border: 2px solid #FF9900;
    background-color: white;
    top: 300px;
}

    .old-browser .glyphicon-info-sign
    {
        font-size: 30px;
        color: #FF9900;
    }

/*============AREAS==========================*/

/*===GUIDEN===*/

.guiden, .calendar
{
    /*margin: 15px;*/ /*center-content*/
    /*height: inherit;*/
    /*border: solid 2px #E0E1DD;*/
}

.current-info, .puff-area-wrap
{
    margin: 0 15px;
}

.main-portal .guiden
{
    /*padding-left: 0;
    padding-right: 0;*/
}

.guiden .head-modul
{
    padding-top: 0;
    /*padding-left: 0;*/ /*center-content*/
    padding-bottom: 5px;
}

.main-portal .guiden .guide-area
{
    padding: 0;
}

.guide-area, .graphs-area, .current-info-area, .calendar .year *
{
    display: inline-block;
    height: 100%;
}



.guide-area
{
    padding: 0px 15px 0px 15px;
}

.guiden .guiden-body
{
    margin-top: 15px;
    padding: 0 15px;
}

    .guiden .guiden-body ul, .guiden .guiden-body ul *
    {
        display: inline-block;
        /*text-align: left!important;*/
    }

        .guiden .guiden-body ul span
        {
            margin-right: 10px;
        }

.guiden-body h3
{
    margin-top: 0;
}

.guiden .guide-block
{
    border-right: solid 2px #E0E1DD;
    padding-right: 0;
}

    .guiden .guide-block:first-child,
    .guiden .guide-block:first-child .guiden-body
    {
        /*padding-left: 0;*/
    }

    .guiden .guide-block:last-child
    {
        border: none;
    }

    .guiden .guide-block .guiden-body ul
    {
        padding-left: 18px;
    }

.guiden-body a::after
{
}

/*============CALENDAR================*/

.calendar, .puff
{
    background-color: var(--ik-canvas-level-2);
}

.dynamic-border-right
{
    border-top: none;
    border-right: solid 2px #E0E1DD;
    border-bottom: none;
    border-left: none;
}

.dynamic-border-left
{
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: solid 2px #E0E1DD;
}

.calendar
{
    margin-top: 0;
    /*margin-left: -15px;*/ /*center-content*/
    /*padding-left: 30px !important;*/
    /*padding-right: 30px !important;*/
}

    .calendar .head-modul
    {
        padding-top: 5px;
    }

    .calendar .header
    {
        /*padding-left: 0;*/ /*center-content*/
    }

    .calendar .info-area
    {
        position: absolute;
        right: 0;
        top: 6px;
        left: 51px;
        width: 45px;
        z-index: 2000;
    }

        .calendar .info-area .info-box
        {
            margin-right: 10px;
            display: block;
            float: left;
            cursor: pointer;
            z-index: 1000;
        }

    .calendar .year-inspector
    {
        padding-top: 2px;
    }


    .calendar .head-modul,
    .calendar .graphs-area,
    .calendar .itp1-area,
    .calendar .status-type,
    .calendar .months
    {
        /*padding-left: 0;
        padding-right: 0;*/
        /*center-content*/
    }

        .calendar .itp1-area .status-type,
        .calendar .itp1-area .year
        {
            border-top: solid 4px #E3E2DE;
        }

        .calendar .itp1-area .status-type
        {
            text-align: left;
        }

    /*=============COMPANY_SELECTOR==========*/

    .calendar .company-selector
    {
        float: right;
        padding-top: 15px;
        padding-right: 0;
    }

        .calendar .company-selector button.multiselect
        {
            max-height: 34px;
            overflow: hidden;
            -ms-border-radius: 0;
            border-radius: 0;
        }

        .calendar .company-selector label
        {
            white-space: initial;
        }

    .calendar .btn-group > .btn:hover
    {
        z-index: auto;
    }
    /*==========JQUERY UI SELECTOR===========*/
    .calendar .company-selector .company-selector-group button
    {
        /* height: 32px !important; */
    }

.ui-multiselect-menu .ui-widget-header,
.ui-multiselect-menu .ui-widget-header span
{
    background: none !important;
    color: #373737 !important;
    border: none !important;
}

a.ui-multiselect-all:hover,
a.ui-multiselect-none:hover
{
    color: #373737;
    background-color: transparent;
}

.company-selector-group button.ui-widget span
{
    /* font-family: 'Arial' !important; */
    /* font-weight: 600; */
}

.companies-default *,
.ui-multiselect-menu *
{
    font-family: 'Arial' !important;
    font-weight: 100;
}

button.ui-multiselect
{
    line-height: initial !important;
}

.ui-state-active,
.ui-multiselect-menu .ui-corner-all.ui-state-hover
{
    /*border: none !important;*/
    color: #373737 !important;
    text-decoration: underline;
    background: none;
}

select.companies-default option,
.ui-multiselect-filter input
{
    height: 22px !important;
}

.ui-multiselect-checkboxes label input
{
    margin-right: 8px;
}

.ui-multiselect-filter
{
    width: 95%;
}

    .ui-multiselect-filter input
    {
        width: 100% !important;
    }

    .ui-multiselect-filter,
    .ui-multiselect-filter input
    {
        font-size: 12px !important;
    }

.calendar .ui-corner-all
{
    -ms-border-radius: 0;
    border-radius: 0;
}

.ui-multiselect-filter input
{
    /*width: 100% !important;*/
    color: #373737;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 14px;
    font-weight: normal;
    font-family: inherit !important;
}

.ui-multiselect-menu ul.ui-multiselect-checkboxes li span
{
    margin-left: 20px;
}

.ui-multiselect-menu ul.ui-multiselect-checkboxes li input
{
    outline: none !important;
    margin-left: 5px;
}

input[type='text'].general
{
    height: 42px;
    width: 100%;
    padding: 10px;
}

.ui-multiselect-menu ul.ui-multiselect-checkboxes li label.ui-state-hover span,
.ui-multiselect-menu ul.ui-multiselect-checkboxes li label.ui-state-active span
{
    /*border: 1px solid white !important;*/
}

label.ui-state-hover
{
    background: white !important;
}

.ui-multiselect-menu ul.ui-multiselect-checkboxes li label,
.ui-multiselect-menu ul.ui-multiselect-checkboxes li span
{
    border: 1px solid transparent;
}

    .ui-multiselect-menu ul.ui-multiselect-checkboxes li label,
    .ui-multiselect-menu ul.ui-multiselect-checkboxes li span,
    .ui-multiselect-menu ul.ui-multiselect-checkboxes li label.ui-state-hover span,
    .ui-multiselect-menu ul.ui-multiselect-checkboxes li label.ui-state-active span
    {
        line-height: 1.3 !important;
    }

.ui-multiselect-menu ul.ui-multiselect-checkboxes li label
{
    text-decoration: none !important;
}

#cost-center-view .ui-state-default,
.ui-state-default
{
    background: white !important;
    color: var(--ik-btn-primary) !important;
}

button.ui-state-active,
button.ui-state-hover,
.ui-state-focus
{
    color: var(--ik-btn-primary-hover) !important;
    border: 1px solid var(--ik-btn-primary-hover) !important;
    background: white !important;
    /*line-height: normal !important;*/
}

.ui-multiselect-single .ui-multiselect-checkboxes input
{
    left: 0 !important;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br
{
    -ms-border-radius: 0 !important;
    border-radius: 0 !important;
}

.ui-datepicker.ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all
{
    z-index: 26 !important;
}

.ui-state-default .ui-icon
{
    background-image: url("../images/expandArrowExpanded.png") !important;
    background-position: 0 7px !important;
    color: var(--ik-btn-primary-hover) !important;
}

/*=======================================*/

.calendar .company-selector #companies,
.calendar .company-selector .company-selector-group,
.calendar .company-selector .company-selector-group .btn-group button
{
    width: 100%;
}

    .calendar .company-selector .company-selector-group .btn-group ul.dropdown-menu
    {
        width: 349px;
    }

        .calendar .company-selector .company-selector-group .btn-group ul.dropdown-menu li.filter .input-group
        {
            width: 362px;
        }

    .calendar .company-selector .company-selector-group .btn-group
    {
        width: 80%;
        float: right;
    }

        .calendar .company-selector .company-selector-group .btn-group button.multiselect,
        .calendar .company-selector .company-selector-group .input-group .input-group-addon
        {
            -ms-border-top-left-radius: 0;
            border-top-left-radius: 0;
            -ms-border-bottom-left-radius: 0;
            border-bottom-left-radius: 0;
        }

    .calendar .company-selector .company-selector-group button#company-select-btn,
    .calendar .company-selector .company-selector-group .input-group .multiselect-clear-filter
    {
        -ms-border-top-right-radius: 0;
        border-top-right-radius: 0;
        -ms-border-bottom-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .calendar .company-selector .company-selector-group button#company-select-btn
    {
        width: 70px;
        background-color: var(--ik-btn-primary);
        position: absolute;
    }

    .calendar .company-selector .company-selector-group .input-group .multiselect-search
    {
        width: 73%;
    }

    /*//bortkommenterad-- > .calendar .company-selector .company-selector-group .input-group .input-group-addon {
    width: 41px;
}*/

    .calendar .company-selector .company-selector-group span.multiselect-selected-text
    {
        width: 90%;
        overflow: hidden;
        text-align: left;
    }

    .calendar .company-selector .company-selector-group .input-group .input-group-addon,
    .calendar .company-selector .company-selector-group .input-group .multiselect-clear-filter
    {
        height: 34px;
        width: 36px;
    }

.calendar .company-selector-group .input-group .glyphicon
{
    position: absolute !important;
    font-size: 16px;
    margin-top: 8px;
    margin-bottom: 10px;
    margin-left: -9px;
    text-align: inherit;
}

.calendar .company-selector .caret
{
    float: right;
    margin-top: 8px;
}

/*=======================*/
.edit-link
{
    color: var(--ik-btn-primary);
}

    .edit-link:hover
    {
        color: var(--ik-link-hover);
    }

        .edit-link:hover .edit-details
        {
            background-image: url("../images/companycard/edit_hover.png");
        }

.excel-link
{
    /*white-space: nowrap;*/
    /*margin-top: 22px;*/
    padding-left: 0;
}

    .excel-link .clip
    {
        background-image: url(../images/excel.png);
        -ms-background-size: 100%;
        background-size: 100%;
        background-repeat: no-repeat;
        padding: 11px;
        margin-right: 12px;
        top: 5px;
    }

    .excel-link a
    {
        color: var(--ik-btn-primary);
        font-weight: bold;
    }

.top.excel-link a
{
    top: -2px;
}

.calendar .message-area .excel-link
{
    margin-top: 0;
    -moz-background-position-y: 6px;
    -o-background-position-y: 6px;
    background-position-y: 6px;
}

.dz-image.icon
{
    /*    width: 140px;
    height: 115px;*/
    overflow: hidden;
    top: -10px;
}

    .dz-image.icon > span
    {
        display: block;
        background-size: 50px;
        height: 59px;
        width: 59px;
        background-repeat: no-repeat;
        padding: 11px;
        margin-right: 12px;
        top: 5px;
    }

.inbox-image.icon > span
{
    display: block;
    background-size: 40px;
    height: 59px;
    width: 59px;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}

.icon > span.docx, .icon > span.doc
{
    background-image: url(../images/word.png);
}

.icon > span.ppt, .icon > span.pptx
{
    background-image: url(../images/powerpoint.png);
}

.icon > span.pdf
{
    background-image: url(../images/pdf.png);
}

.icon > span.txt
{
    background-image: url(../images/txt.png);
}

.icon > span.xls, .icon > span.xlsx
{
    background-image: url(../images/excel.png);
}

.icon > span.png
{
    background-image: url(../images/png.png);
}

.icon > span.jpeg, .icon > span.jpg
{
    background-image: url(../images/JPEG.png);
}

.icon > span.xml, .icon > span.xml
{
    background-image: url(../images/xml.png);
}

.calendar .graphs-area
{
    padding-bottom: 25px;
}

.calendar .itp2-area
{
    text-align: center;
    border-top: solid 4px #E3E2DE;
}

.calendar .graphs-area .itp1-area
{
    text-align: center;
}

.calendar .graphs-area .itp1-area
{
    padding-right: 30px;
    border-right: solid 4px #E3E2DE;
}

.calendar .graphs-area .itp2-wrapper
{
    padding-left: 30px;
}

.calendar .year
{
    padding-top: 10px;
}

.calendar .itp2-top .year
{
    padding-left: 20px;
}

.calendar .year .year-inspector *, .calendar .itp2-area
{
    float: left;
}

.calendar .months, .calendar .years
{
    border-top: solid 4px #E3E2DE;
    border-bottom: solid 4px #E3E2DE;
}

.calendar .months
{
    margin-bottom: 3px;
}

    .calendar .months ul *, .calendar .years ul *
    {
        text-align: center;
    }

    .calendar .months ul li, .calendar .years ul li
    {
        height: inherit;
        border-left: solid 4px #E3E2DE;
        padding: 10px 0 5px 0;
    }

.calendar ul#itp1
{
    display: inline-block;
    float: left;
    height: 100%;
    padding-left: 0;
    padding-right: 0;
}

.calendar .months ul#itp1 li.firstMonth
{
    background-image: linear-gradient(#9C9C9A 33%, rgba(255,255,255,0) 0%);
    background-position: left;
    -ms-background-size: 2px 5px;
    background-size: 2px 5px;
    background-repeat: repeat-y;
    border-left: none;
}

    .calendar .months ul#itp1 li.firstMonth.selected:first-child,
    .calendar .months ul#itp1 li.selected:first-child
    {
        background-color: white !important;
    }

.noborder-right,
.calendar .months ul#itp1 li.lastMonth
{
    border-right: none !important;
}

.calendar .months ul#itp1 li p
{
    width: 100%;
}

.calendar .months ul li p
{
    padding-top: 0;
}

.calendar .months ul#itp1,
.calendar .months ul#itp2
{
    display: block;
    margin: 0;
    padding: 0;
    height: 100%;
}

    .calendar .months ul#itp2 li
    {
        margin: 0;
    }

.calendar ul#itp1 li.selected:after,
.calendar ul#itp2 li.selected:after
{
    content: "";
    position: absolute;
    top: 79px;
    border-width: 0px 10px 10px;
    border-style: solid;
    border-color: white transparent;
    display: block;
    width: 0;
    z-index: 0;
}

.calendar ul#itp1 li.selected:after,
.calendar ul#itp2 li.selected:after
{
    margin-left: 33%;
}

/*.calendar ul#itp2 li.selected:after {
    margin-left: 18px;
}*/

.calendar .message-area .message
{
    padding-top: 5px;
}

.calendar .message-area .status-area .rapporterade > div,
.calendar .message-area .status-area .saknade > div
{
    float: left;
}

.calendar .message-area .status-area .anstallda
{
    height: 34px;
    padding: 0 !important;
    width: 100%;
}

.calendar .message-area .status-area
{
    border-right: solid 4px #E3E2DE;
    padding-right: 10px;
}

    .calendar .message-area .status-area .rapporterade,
    .calendar .message-area .status-area .saknade
    {
        float: left;
        height: 45px;
        padding: 0 !important;
        width: 100%;
    }

.calendar .progress-bar-reported
{
    background-color: #ffe046;
}

.calendar .progress-bar-missing
{
    background-color: #8a4979;
}

.calendar .message-area .ratio
{
    padding-left: 5px;
    padding-right: 5px;
}

.calendar .message-area .message p
{
}

.calendar .period-status-message
{
    padding-left: 0;
}

.calendar .message .missing,
.calendar .message .noreport,
.calendar .message .noerror,
.calendar .message .warning
{
    position: absolute;
}

.calendar .message > div
{
    margin-right: 2px;
}

.calendar .message-area
{
    margin-top: 5px !important;
    padding-left: 12px;
    padding-top: 20px;
    padding-bottom: 15px;
    background-color: white;
    width: 98%;
}

.calendar .months
{
    min-height: 82px;
}

    .calendar .months ul li,
    .calendar .months ul li *,
    .calendar .years ul li,
    .calendar .years ul li *,
    .calendar .message *,
    .calendar .message .excel-link *
    {
        display: inline-block;
    }

        .calendar .months ul li div
        {
            min-height: 30px;
            width: 100%;
        }

    .calendar .months ul#itp1 li:first-child
    {
        border-left: none !important;
        background: none !important;
    }

    .calendar .months ul#itp2 li:first-child
    {
        border-left: none !important;
    }

.calendar .years ul li:last-child
{
    border-right: none !important;
}

.calendar .months ul li.selected, .calendar .years ul li.selected
{
    background-color: white;
}

.calendar .months ul#itp1.inactive li,
.calendar .months ul#itp1.inactive li:hover,
.calendar .months ul#itp2.inactive li,
.calendar .months ul#itp2.inactive li:hover
{
    cursor: default;
}

.calendar .message-area .excel-link
{
    padding-left: 30px;
    white-space: initial;
}

.calendar .total-period-status
{
    /*padding-top: 5px;
    padding-left: 9px;*/
}

    .calendar .total-period-status .excel-link .clip,
    .calendar .total-period-status .excel-link a
    {
        display: inline-block;
        float: left;
        margin-right: 6px;
    }

    .calendar .total-period-status p
    {
        border-bottom: solid 4px #E3E2DE;
        padding-bottom: 15px;
    }

.calendar .message-area .excel-link a
{
    position: absolute;
    /*margin-left: 5px;*/
}

.calendar .message *, .calendar .message-area .excel-link *
{
    vertical-align: text-bottom;
    /*padding-top: 10px;*/
}

.calendar .message-area .excel-link .clip
{
    margin-top: 0;
    margin-right: 6px;
    /*margin-left: 13px;*/
    -moz-background-position-y: 5px;
    -o-background-position-y: 5px;
    background-position-y: 8px;
}

.calendar .year-inspector a
{
    -moz-min-width: 20px;
    -ms-min-width: 20px;
    -o-min-width: 20px;
    -webkit-min-width: 20px;
    min-width: 20px;
    margin-right: 10px;
    margin-left: 10px;
}

.calendar .left-arrow, .calendar .right-arrow
{
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    -ms-background-size: 90%;
    -ms-behavior: url("../backgroundsize.htc");
    background-size: 100%;
}

.inactive, .inactive .puff-body
{
    outline: none; /*IE-HACK*/
    text-decoration: none; /*IE-HACK*/
    cursor: default; /*IE-HACK*/
    -ms-opacity: 0.5;
    opacity: 0.5;
    pointer-events: none;
    -webkit-filter: grayscale(1);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: gray;
    filter: gray;
    filter: grayscale(100%);
    color: grey; /*IE-HACK*/
}

.notes a.inactive .puff-body, .notes .emp-yellow-puff
{
    height: 145px;
}

.salary-inactive .puff-body,
.inactive .report-footer,
.salary-inactive .report-footer
{
    opacity: 0.5;
    -webkit-filter: grayscale(1);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: gray;
    filter: gray;
    filter: grayscale(100%);
}

.pufflink.inactive .puff-body,
.pufflink.inactive .report-footer
{
    opacity: 0.8;
    -webkit-filter: grayscale(1);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: gray;
    filter: gray;
    filter: grayscale(100%);
}

.refresh-pending
{
    outline: none; /*IE-HACK*/
    text-decoration: none; /*IE-HACK*/
    cursor: default; /*IE-HACK*/
    -ms-opacity: 0.5;
    opacity: 0.5;
    pointer-events: none;
}

    .refresh-pending input#input-emp-search, .refresh-pending .employee-search
    {
        -ms-opacity: 1;
        opacity: 1;
        pointer-events: all;
        outline: inherit; /*IE-HACK*/
        text-decoration: inherit; /*IE-HACK*/
        cursor: auto; /*IE-HACK*/
    }

.companycard input[type="button"].inactive
{
    background-color: gray;
}

.puff-inactive
{
    background-color: #f5f5f5 !important;
    border-collapse: #f5f5f5 !important;
}

/*.salary-puff-inactive,
#salary-inactive .report-footer {
    background-color: var(--ik-canvas-level-2) !important;
}*/

.edit-details.noaccess,
.edit-details.noaccess:hover
{
    -ms-opacity: 0.5;
    opacity: 0.5;
    -webkit-filter: grayscale(1);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: gray;
    filter: gray;
    filter: grayscale(100%);
    color: gray; /*IE-HACK*/
}

.calendar .left-arrow
{
    background-image: url("../images/left.png");
    /*margin-right: 12px;*/
}

.calendar .right-arrow
{
    background-image: url("../images/right.png");
    /*margin-left: 17px;*/
}


.calendar .months ul.itp1 li
{
    background-image: url("../images/lon_small.png");
    width: 28px;
}

/*.calendar ul li .warning {
        background-image: url("../images/B.png");
        width: 24px;
    }

    .calendar .missing {
        margin-top: 2px;
        background-image: url("../images/qmark_mynt.png");
        width: 24px;
    }

    .calendar .noreport {
        background-image: none;
        width: 30px;
        min-height: 30px;
    }*/
.calendar .progress
{
    -ms-border-radius: 0 !important;
    border-radius: 0 !important;
}

.calendar .icon-close
{
    height: 25px;
    width: 25px;
    position: absolute;
    right: 0;
    top: 0;
    background-image: url("../images/Icon_close.png");
    /*background: no-repeat;*/
    cursor: pointer;
    -ms-background-size: 100%;
    background-size: 100%;
}

.calendar .spinner-calendar
{
    position: absolute;
    left: 50%;
    margin-top: -28px;
}

    .calendar .spinner-calendar p
    {
        position: absolute;
        top: 153px;
    }

.calendar-file-area
{
    float: left;
}

/*=========CURRENT INFO============*/

.main-portal .current-info
{
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    /*padding-left: 0;*/ /*center-content*/
    /*padding-right: 0;*/
}

/*.current-info .head-modul,*/
/*.current-info .current-info-area {
    padding: 0;
}*/

.current-info .current-info-area .left-info-area
{
    padding-left: 0;
    padding-right: 50px;
}

.current-info .current-info-area .right-info-area
{
    padding-left: 50px;
    padding-right: 0;
    margin-right: 0;
}

.current-info img
{
    display: block;
}


ul.file-upload-info li::before,
.current-info-area ul li::before
{
    content: "";
    width: 7px;
    height: 7px;
    background: red;
    display: inline-block;
}

ul.file-upload-info li::before
{
    position: absolute;
    left: -16px;
    top: 6px;
}
/*============INFO PUFFS================*/

.wrapper-portal .puff-area-wrap
{
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}

/*{
        margin-left: 15px;
    }*/


.puff-area .puff
{
    border-right: solid 15px white;
}

    .puff-area .puff:last-child
    {
        border-right: none;
    }

.puff-area .glyphicon-stop
{
    color: red;
    left: 0;
}

.puff-area *
{
    text-align: left;
}

.puff-area ul
{
    margin-left: 15px;
    /*list-style-type: none;*/
}

    .puff-area ul *
    {
        /*display: inline-block;*/
    }

    .puff-area ul li a
    {
        margin-left: -15px;
    }

.puff .puff-body
{
    float: left;
}

.puff-area .puff-content
{
    padding-bottom: 15px;
}

/*=======FEEDBACK BOX===========*/

.feedback-panel
{
    background: white;
    padding: 0 !important;
    position: fixed;
    top: 30%;
    left: 0;
    width: 0;
    z-index: 2001;
    -webkit-transition: .2s all ease;
    -moz-transition: .2s all ease;
    -o-transition: .2s all ease;
    -ms-transition: .2s all ease;
    transition: all 200ms ease 0ms;
}


    .feedback-panel.active
    {
        left: 0 !important;
        width: 476px;
    }

.feedback-overlay-panel
{
    margin-top: -51px;
    display: inline-block;
    float: right !important;
    vertical-align: baseline;
    height: 520px;
    width: 476px;
    border: 3px solid #ff0033;
    border-left: transparent;
    background: white;
    z-index: 1000;
}

.active .feedback-overlay-panel
{
    -webkit-transition: .2s all ease;
    -moz-transition: .2s all ease;
    -o-transition: .2s all ease;
    -ms-transition: .2s all ease;
    transition: .2s all ease;
}

.feedback-overlay-panel *
{
    z-index: 1000;
}

.feedback-panel .feedback-tab
{
    text-align: center;
    cursor: pointer;
    height: 43px;
    width: 131px;
    right: -84px;
    top: -7px;
    padding-left: 10px;
    padding-right: 10px;
    color: white;
    background-color: #ff0033;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    z-index: 1000;
}

.feedback-tab
{
    /* display: inline-block; */
    /* float: right; */
    position: absolute;
}

.feedback-panel.active
{
    -webkit-transition: .3s all ease;
    -moz-transition: .3s all ease;
    -o-transition: .3s all ease;
    -ms-transition: .3s all ease;
    transition: .3s all ease;
}

.feedback-panel .feedback-tab.disabled
{
    right: -40px;
}

.feedback-panel .feedback-tab h4
{
    padding-top: 3px;
}

.feedback-overlay-panel .feedback-box
{
    /* margin-top: -18px; */
}

.feedback-overlay-panel .feedback-box-header
{
    padding: 15px 15px;
}

    .feedback-overlay-panel .feedback-box-header h3.response
    {
        padding-top: 30px;
    }

    .feedback-overlay-panel .feedback-box-header div.response
    {
        padding-left: 30px;
        padding-right: 30px;
    }

.feedback-overlay-panel .information-box
{
    padding-top: 10px;
}

.feedback-overlay-panel .feedback-area textarea
{
    width: inherit;
    height: 200px;
    -moz-resize: none;
    -ms-resize: none;
    -o-resize: none;
    resize: none;
}

textarea.invalid, #reply-area.invalid
{
    border: solid 3px red;
}

.feedback-panel .button-div
{
    float: right;
}

.feedback-panel .submitted-area
{
    padding: 20px 0;
}

    .feedback-panel .submitted-area .button-div
    {
        float: none;
    }

.feedback-panel .button-div input[type=button]
{
    background-color: var(--ik-btn-primary);
    border: none;
    width: auto;
    height: 38px;
    padding-left: 20px;
    padding-right: 20px;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 16px;
}

.feedback-panel .submit-box .loading-panel
{
    float: right;
    margin-top: -102px;
    margin-right: 138px;
}

    .feedback-panel .submit-box .loading-panel p
    {
        margin-top: -92px;
    }

.feedback-panel #fb-error
{
    background: red;
    padding-bottom: 5px;
    padding-top: 5px;
    color: white;
    margin-bottom: 10px;
}

    .feedback-panel #fb-error .glyphicon
    {
        left: 0 !important;
    }

/*=======VÄNSTERMENY========*/

.leftMenu
{
    padding-top: 15px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
}

    .leftMenu li a
    {
        color: black;
    }

    .leftMenu ul#main-menu li a.active,
    .leftMenu ul#main-menu li ul li a.active,
    .leftMenu ul#main-menu li ul li a:active,
    .leftMenu ul#main-menu li ul li a:focus
    {
        font-weight: bold;
        text-decoration: underline;
        outline: none;
    }

    .leftMenu ul#main-menu li.has-submenu > a.active
    {
        font-weight: normal;
        text-decoration: none;
    }

    .leftMenu li a:hover
    {
        color: black;
        text-decoration: underline;
        background-color: transparent;
    }

    .leftMenu div
    {
        /*padding: 15px;*/
        background-color: #EBE8E1;
    }

    .leftMenu ul#main-menu
    {
        line-height: 2em;
    }

        .leftMenu ul#main-menu li:first-child
        {
            padding-top: 10px;
        }

        .leftMenu ul#main-menu li:last-child
        {
            padding-bottom: 10px;
        }

        .leftMenu ul#main-menu li a
        {
            margin-left: 20px;
        }

        .leftMenu ul#main-menu li.has-submenu.active
        {
            background-color: #D1D1D1;
        }

        .leftMenu ul#main-menu li.has-submenu
        {
            background-color: transparent;
        }

        .leftMenu ul#main-menu li a.has-submenu
        {
            background-image: url("../images/expandArrow.png");
            background-repeat: no-repeat;
            -moz-background-position-y: 3px;
            -o-background-position-y: 3px;
            background-position-y: 3px;
            padding-left: 10px;
            margin-left: 10px !important;
        }

            .leftMenu ul#main-menu li a.has-submenu.active
            {
                background-image: url("../images/expandArrowExpanded.png");
                -moz-background-position-y: 4px;
                -o-background-position-y: 4px;
                background-position-y: 4px;
            }

                .leftMenu ul#main-menu li a.has-submenu.active:after
                {
                    content: "";
                    position: absolute;
                    top: 20px;
                    left: 10px;
                    border-width: 6px 6px 0px;
                    border-style: solid;
                    border-color: #828282 transparent;
                    display: block;
                    width: 0;
                    z-index: 1000;
                }

        .leftMenu ul#main-menu li.has-submenu.active ul
        {
            border-top: solid darkgrey 1px;
        }

            .leftMenu ul#main-menu li.has-submenu.active ul:before
            {
                content: "";
                position: absolute;
                top: 0;
                left: 20px;
                border-width: 5px 5px 0px;
                border-style: solid;
                border-color: #D1D1D1 transparent;
                display: block;
                width: 0;
                z-index: 2000;
            }

            .leftMenu ul#main-menu li.has-submenu.active ul:after
            {
                content: "";
                position: absolute;
                top: -4px;
                left: 20px;
                background-color: #D1D1D1;
                display: block;
                width: 10px;
                height: 4px;
                z-index: 2000;
            }

        .leftMenu ul#main-menu li ul
        {
            background-color: #efefef;
        }

/*=========IFRAME-DYNPRO===========*/

#iframe
{
    max-width: 1045px;
}

    #iframe iframe#dynpro
    {
        background-color: #ffffff;
        border: #ffffff 0px solid;
    }


/*=========STARTSIDA========*/
.startpage #issue-puff-container .blue-backdrop
{
    height: 145px !important;
    max-height: 145px !important;
    min-height: 145px !important;
}

.stsartpage #issue-puff-container .icons
{
    color: white !important;
}

/*=======FÖRETAGSKORTET===========*/

.companycard.main-portal > div
{
    min-height: initial;
}

.companycard .company-selector
{
    min-height: 35px !important;
}

.companycard .company-info-left .global-backdrop,
.global-backdrop.admin-area
{
    min-height: 150px !important;
}

.bg-blue, .blue-backdrop
{
    background-color: var(--ik-btn-primary);
}

.blue-backdrop, .blue-puffs .active .puff-body
{
    min-height: 145px !important;
}

.blue-backdrop, .blue-puffs.oldstyle .active .puff-body
{
    min-height: 200px !important;
}

.empcard .blue-backdrop,
#filemanager-puff .global-backdrop
{
    min-height: 160px !important;
}

.companycard .company-selector
{
    margin-bottom: 15px;
}

.startpage .company-selector-group,
.empcard .btn-group.company-selector-group,
.companycard .btn-group.company-selector-group
{
    float: left !important;
}

.companycard .company-selector-group button,
#cost-center-view .company-selector-group button
{
    height: 42px;
}

#info-msg-area,
#info-msg-area h3,
.companycard .startinfo,
#info-msg-area-right,
#info-msg-area-right h3
{
    background: var(--ik-info-bg);
    color: white;
    height: auto;
    white-space: normal;
}

    .companycard .startinfo h3
    {
        color: white !important;
    }

#info-msg-area,
#info-msg-area-right
{
    min-height: 209px;
}

#info-msg-area-right
{
    border-left: 15px solid white;
}

.companycard .company-info-left,
.companycard .company-info-right
{
    background: white;
    padding-bottom: 15px;
}

    .companycard .company-info-left > div:last-child
    {
        padding-bottom: 15px;
    }

    .companycard .company-info-left > div > div,
    .companycard .company-info-right > div > div,
    .companycard .admin-area
    /*.companycard .company-info-right > div > div > div*/
    {
        height: 150px;
    }

    .companycard .company-info-left > div > div
    {
        border-right: 15px solid white;
        border-bottom: 15px solid white;
    }

        .companycard .company-info-left > div > div:last-child
        {
            border-right: none;
        }

    .companycard .company-info-left .active-detail
    {
        background-color: var(--ik-btn-primary);
        height: 165px;
    }

/*========COMPANY INFO DETAIL VIEW========*/

.companycard .detail-view
{
    /*color: white;*/
}

    .companycard .detail-view > div
    {
        padding-top: 15px;
        padding-bottom: 30px;
        margin-bottom: 15px;
    }

    .companycard .detail-view h5
    {
        font-weight: bold;
    }

    .companycard .detail-view h5,
    .companycard .detail-view h6
    {
        /*color: white !important;*/
        text-transform: uppercase;
    }

.companycard .service-view > div
{
    margin-bottom: 15px;
}

.companycard .service-view h6,
.empcard .detail-view h6,
.detail-close h6
{
    color: var(--ik-btn-primary) !important;
    text-transform: uppercase;
}

.companycard .detail-view .contract-right .detail-preamble
{
    padding-top: 19px;
}

.companycard .detail-left-body table
{
    width: 630px;
}

/*.companycard .blue-backdrop .directive table tr {
    cursor: pointer;
}*/

.tbl-container
{
    background-color: white;
}

#cost-center-view
{
    min-height: 600px !important;
}

    #cost-center-view .tbl-container
    {
        margin-top: 8px;
    }

.salarytax-area
{
    margin-top: -1px;
}

table.tbl-searchresult,
table#tbl-premiedetails,
table#tbl-directivedetails,
table#tbl-cc
{
    width: 100%;
}

    table.tbl-searchresult a
    {
        font-size: 10pt !important;
        color: var(--ik-btn-primary);
    }

.companycard .detail-left-body table thead
{
    color: white !important;
    text-transform: uppercase;
    font-size: 12px;
}

.companycard .detail-left-body table,
.companycard .detail-left-body table * td
{
    /*border: 2px solid var(--ik-btn-primary);*/
    /*border-bottom: 3px solid var(--ik-btn-primary);*/
    border-collapse: separate;
    padding: 3px;
    font-weight: 600;
}

    .companycard .detail-left-body table tbody
    {
        /*background-color: #40c2f3;*/
    }

        .companycard .detail-left-body table tbody tr td
        {
            /*border-right-color: #40c2f3;*/
        }

.companycard .details a, .companycard .details a:focus
{
    text-decoration: none;
}

    .companycard .details a:hover
    {
        text-decoration: underline;
    }


table#tbl-cc > * td,
table.tbl-searchresult > * td,
table#tbl-directivedetails > * td,
table#tbl-premiedetails > * td
{
    border-right: 2px solid #a0a0a0;
    border-collapse: collapse;
    padding-left: 5px;
    padding-top: 5px;
    padding-right: 15px;
    padding-bottom: 5px;
}

.newemployee table.tbl-searchresult > * td
{
    border-right: 2px solid white;
}

.newemployee table.tbl-searchresult thead
{
    border-bottom: 1px solid white;
}

table#tbl-cc thead,
table.tbl-searchresult thead td,
table#tbl-directivedetails thead,
table#tbl-premiedetails thead
{
    color: #a0a0a0;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 12px !important;
}

.newemployee table.tbl-searchresult thead *
{
    color: white;
    font-weight: 500;
}

table#tbl-cc thead tr,
table#tbl-cc thead tr td,
table.tbl-searchresult thead tr,
table.tbl-searchresult thead tr td,
table#tbl-directivedetails thead tr,
table#tbl-directivedetails thead tr td,
table#tbl-premiedetails thead tr,
table#tbl-premiedetails thead tr td
{
    border-bottom-color: var(--ik-canvas-level-2) !important;
}

.companycard .detail-view .premie-details table#tbl-premiedetails tbody tr > td
{
    /*border-color: var(--ik-canvas-level-2) !important;*/
}

table#tbl-cc tr td:nth-child(3),
table.tbl-searchresult tr td:last-child,
table#tbl-directivedetails tr td:last-child,
table#tbl-premiedetails tr td:last-child
{
    border-right: none;
}

table#tbl-cc tr
{
    height: 45px;
}

table#tbl-cc tbody tr.ccparent td,
table#tbl-directivedetails tbody tr:first-child td
{
    font-weight: bold !important;
}

.newemployee#error table.tbl-searchresult tbody tr:nth-child(odd)
{
    background-color: transparent !important;
}

table#tbl-cc tbody tr:nth-child(odd),
table.tbl-searchresult tbody tr:nth-child(odd),
table#tbl-directivedetails tbody tr:nth-child(odd),
table#tbl-premiedetails tbody tr:nth-child(odd)
{
    background-color: var(--ik-canvas-level-2);
}


#tbl-cc tr.ccchild td:first-child,
#tbl-cc tr.ccchild td:nth-child(2)
{
    padding-left: 15px;
}


#tbl-cc tr td:nth-child(2)
{
    padding-right: 30px !important;
}
/*======FÖRETAGSKORTET/ANSTÄLLDAKORTET FONTER, FÄRGER, LÄNKAR=======*/

.companycard.main-portal h1,
.companycard.main-portal h2,
.companycard.main-portal h3,
.companycard.main-portal h4,
.companycard.main-portal h5,
.companycard.main-portal h6,
.companycard .h8,
.startpage .boldtext,
.empcard .boldtext,
.calendar .boldtext,
.admincard .boldtext,
.adminpersoncard .boldtext,
.companycard .boldtext,
.companycard .company-info-left .active-detail h4,
.companycard table,
.companycard table a,
.head-portal table
{
    color: #252525;
}

#tgl-puff-data h1,
#file-status h1,
#file-status-puff h1
{
    font-family: "Arial";
    color: var(--ik-card-purple);
}

#tgl-puff-data h1
{
    font-size: 65px;
}

#file-status h1,
#file-status-puff h1
{
    font-size: 25px;
    margin-top: -5px;
}

#tgl-puff-data strong
{
    text-transform: uppercase;
}

.companycard .blue-backdrop .directive
{
    padding-top: 10px;
}

.detail-right-body,
.companycard .detail-view .detail-right-body.plans,
.companycard .detail-view .detail-right-body.directive
{
    min-height: 122px !important;
}

.contract-right .detail-right-body
{
    margin-top: 0;
}

.detail-right-body.edit
{
    margin-top: 0 !important;
}

#cost-center-view .detail-right-body
{
    min-height: 250px !important;
}

#cost-center-view .btn-group
{
    right: -11px;
    top: 3px;
}

#cost-center-view .detail-right-body .btn-group
{
    right: 0 !important;
}

#cost-center-view .left-area > div:first-child
{
    margin-bottom: 7px;
}

.bridge
{
    position: absolute;
    background: white;
    /*height: 27px;
    top: 55px;*/
    right: 0;
    width: 15px !important;
    z-index: 1000;
}

#cc-detail-view.active
{
    border: solid 1px #a0a0a0;
    background: white;
    position: absolute;
    margin-left: -36px;
    z-index: 999;
}

.cc-actions
{
    border-top: solid 2px var(--ik-canvas-level-2);
}

.companycard .detail-view .detail-right-body.active.plans h5,
.companycard .detail-view .detail-right-body.active.directive h5
{
    margin-top: 5px;
    color: #252525 !important;
}

.companycard h2,
.companycard h3,
.companycard h4,
.companycard h5,
.companycard h6
{
    font-family: Arial !important;
}


.companycard h1,
.companycard h4
{
    text-transform: uppercase;
}

h4.normal,
h3.normal
{
    text-transform: none !important;
}

.empcard h3,
.companycard h3,
.admincard h3
{
    font-size: 15pt !important;
    margin-top: 5px;
}

.empcard h4,
.companycard h4
{
    font-size: 10pt;
}

.companycard .h8
{
    font-size: 15pt;
}

.companycard.main-portal h1
{
    font-family: "Arial Black";
    font-size: 18pt;
    font-weight: 800;
}

.companycard button .boldtext
{
    position: absolute;
    margin-top: 13px;
}

.ui-state-disabled .boldtext
{
    margin-top: 0px;
    /* padding-top: 25px; */
}

.boldtext, .companycard .boldtext
{
    font-weight: bolder;
}

#cost-center-view .boldtext
{
    padding: 0 !important;
}

.companycard .companycard .orgnr
{
    font-weight: normal !important;
    color: initial;
    padding-left: 15px;
}

.empcard .darkgrey,
.companycard .darkgrey
{
    color: #a0a0a0 !important;
}

.companycard .company-info-left h4
{
    color: #a0a0a0 !important;
}

.companycard .company-info-left .info-center-item h3
{
    font-weight: 600 !important;
}

.companycard .company-info-left .active-detail .info-center-item h3
{
    color: white !important;
}

.companycard .company-info-left .active-detail h4
{
    color: #252525 !important;
}

.companycard .company-info-left .active-detail .details
{
    background-color: white;
}

.companycard #contract-area h4.darkgrey
{
    margin-bottom: 0;
}

.companycard .info-center-item
{
    top: 10px;
    width: 100%;
}

/*.companycard #directive-area .info-center-item,
.companycard #plan-area .info-center-item {
    top: 6px;
}

.companycard #contract-area .info-center-item {
    margin-top: 3px;
}*/

/*.companycard .detail-view table tr.active td:last-child::after {
    font-family: 'Glyphicons Halflings' !important;
    content: '\e250';
    font-size: 20px;
    color: white;
    right: -25px;
    /*background-color: white;
    position: absolute;
    top: 0px;
}*/

.companycard .detail-container
{
    position: absolute;
    left: 0;
    top: 105px;
    width: 100%;
}


.companycard .company-info-left .details
{
    margin-left: 10%;
    margin-right: 10%;
}

.companycard .change-administrator
{
    font-size: 12px;
    position: absolute;
    bottom: 0;
    padding-bottom: 15px;
}

.companycard .detail-view a,
.companycard .active-detail .detail-container a
{
    /*color: initial !important;*/
    color: #272727;
    text-decoration: underline;
}

.empcard .main-employee-info .details a,
.companycard .details a,
.companycard .secondary-company-info a
{
    color: var(--ik-btn-primary);
    font-weight: bolder;
}

    .empcard .main-employee-info .details a:hover,
    .empcard .main-employee-info .details a:hover .glyphicon
    {
        color: var(--ik-link-color) !important
    }

.companycard .details p
{
    font-weight: bold;
    margin: 0;
}

.card .details a,
.companycard .details p
{
    color: var(--ik-btn-primary) !important;
}

.admincard .details *
{
    color: white !important;
}

.card #top-row a.pufflink .details *
{
    color: white;
}

.empcard .emp-reports #itp1 .details *,
.empcard .standard-puffs .details *,
.empcard .standard-puffs .details span.glyphicon,
.empcard .emp-reports #itp2 .details *,
.empcard .emp-reports #filemanager-puff .details *,
.startpage .single-row-puffs .details *,
.empcard .emp-reports #itp1 .details *,
.empcard .emp-reports #itp2 .details *,
.empcard .emp-reports #filemanager-puff .details *,
.startpage .single-row-puffs .details .glyphicon
{
    color: white;
}

.info-text
{
    min-height: 500px !important;
}

.companycard .details a,
.companycard .secondary-company-info a
{
    /*left: -6px;*/ /*center-content*/
}

/*.empcard .details a {
    left: -14px;
}*/

.companycard .change-administrator a
{
    color: var(--ik-btn-primary) !important;
}

    /*.company-info-left > div:nth-child(2) > div {
    cursor: pointer;
}*/

    .companycard .details a:hover,
    .companycard .change-administrator a:hover,
    #filemanager .sap-link a:hover,
    .engangspremie .sap-link a:hover
    {
        text-decoration: underline !important;
    }

        /*.company-info-left > div:nth-child(2) > div:hover a*/
        .company-info-left > div:nth-child(2) > div:hover > a p,
        .companycard .details a:hover,
        .companycard .change-administrator a:hover,
        .companycard .details a:hover span,
        #filemanager .sap-link a:hover
        {
            color: #42355a !important;
        }

.empcard #filemanager,
.empcard .engangspremie
{
    margin-bottom: 15px;
}

#kst-pnr-list, #plans-pnr-list, #orgnr-pnr-list
{
    width: 300px;
    height: 500px;
    padding: 5px;
    resize: vertical;
}

.companycard .secondary-company-info a
{
    text-transform: uppercase;
}

.companycard .secondary-company-info .detail-left-body .ik-tbl-default a
{
    text-transform: none;
}

.detail-view .global-backdrop a
{
    color: var(--ik-link-color);
    font-weight: normal;
    text-transform: initial;
}

.detail-left-body table thead td
{
    color: #7f7c7c;
}

.companycard .secondary-company-info .servicelink a
{
    /*font-size: 12px;*/
    left: 0;
}

.companycard .secondary-company-info .servicelink
{
    position: absolute;
    top: 189px;
    left: 0;
}

.companycard .ui-multiselect-menu ul.ui-multiselect-checkboxes li label.ui-state-hover span,
.companycard .ui-multiselect-menu ul.ui-multiselect-checkboxes li label.ui-state-active span
{
    border: none;
}

.start,
.cancel,
.forms ul li.cancel,
#cc-form ul li.cancel
{
    top: 11px;
    text-transform: uppercase;
}

.button-list li,
.forms ul li,
#cc-form ul li
{
    padding-left: 20px;
}

    #cc-form ul li.hidden
    {
        padding: 0;
    }

.companycard .detail-view .detail-left-body table tr td:last-child
{
    /*    background-color: var(--ik-btn-primary);
    color: var(--ik-btn-primary);*/
    border-right: none;
}

table#tbl-cc tr td:last-child
{
    background-color: var(--ik-canvas-level-2);
    color: var(--ik-canvas-level-2);
    border-right: none;
}

table tr.active td.empty,
.companycard .detail-view .detail-left-body table tr.active td.empty
{
    color: white !important;
}

    table tr.active td.empty:after
    {
        content: "";
        position: absolute;
        background: white;
        right: 0;
        top: 0;
        height: 44px;
        width: 15px !important;
        z-index: 1000;
    }

table#tbl-cc
{
    background-color: white;
    margin-top: 8px;
    border-right: solid 5px var(--ik-canvas-level-2);
}

    table#tbl-cc tr.active
    {
        border-left: solid 1px #a0a0a0;
        border-top: solid 1px #a0a0a0;
        border-bottom: solid 1px #a0a0a0;
        border-right: solid 5px #a0a0a0;
    }

    table#tbl-cc tr.active-ie
    {
        border-left: solid 2px #a0a0a0;
        border-top: solid 2px #a0a0a0;
        border-bottom: solid 2px #a0a0a0;
        border-right: solid 5px #a0a0a0;
    }

        table#tbl-cc tr.active td,
        table#tbl-cc tr.active-ie td
        {
            border-collapse: separate;
            background-color: white;
            border-right: none;
        }

.companycard .detail-view .detail-left-body table tr.active,
.companycard .detail-view .detail-left-body table tr.active-ie,
.companycard .detail-view .detail-left-body table tr.active-ie td,
.companycard .detail-view .detail-left-body table tr.active td,
.companycard .detail-view .detail-right-body.active,
.detail-right-body.active
{
    background-color: white;
    color: black;
    border-right: white;
}

    .companycard .detail-view .detail-left-body table tr.active td:last-child
    {
        /*border-top: 2px solid var(--ik-btn-primary);
        border-bottom: 2px solid var(--ik-btn-primary);*/
        /*border-top: none;
        border-bottom: 1px solid var(--ik-btn-primary);
        border-left: none !important;
        border-right-color: white;
        display: block;*/
    }

table tr.active-ie td.empty,
table tr.active td.empty,
table tr td.empty,
.companycard .detail-view .detail-left-body table tr td.empty
{
    width: 50px;
}

table tr.active td,
.companycard .detail-view table tr.active td
{
    border-right: none;
    border-left: none;
    /*border-left-color: var(--ik-canvas-level-2);
    border-right-color: var(--ik-canvas-level-2);*/
}

table tr.active a,
.companycard .detail-view table tr.active a
{
    text-decoration: none;
    color: black !important;
}

#tglstatus
{
    /*text-transform: uppercase;*/
    /*margin-top: -10px;*/
}

.plans table thead td.td-age
{
    word-break: break-all;
    width: 74px;
}

.plans table thead td.td-prem
{
    width: 60px;
}

.secondary-company-info .return-msg,
.font-small
{
    font-size: 13px;
}

#invoice-msg
{
    position: absolute;
    text-align: center;
    width: inherit;
    height: 20px;
    left: 0;
}

.costcenter-puff-data-area .return-msg
{
    /*top: 18px;*/
}

.companycard .secondary-puffs.active,
#costcenter-puff > div.active:hover,
#loneskatt.active:hover
{
    height: 251px !important;
    background-color: var(--ik-canvas-level-2);
    margin-bottom: -15px;
}

.companycard .service-view
{
    /*border-bottom: 15px solid white;*/
}

/*=======FÖRETAGSKORTET, ANSTÄLLDAKORTET GRAPHICS====*/

.companycard .startinfo img
{
    /*position: absolute;*/
    width: 100%;
    height: auto;
}

.companycard .company-admins .glyphicon
{
    position: absolute !important;
    font-size: 10px;
    color: #ff0033;
    margin-top: 91px;
    margin-left: 93px;
    text-align: center;
}

.company-selector-group button.ui-widget
{
    height: 48px;
}

.companycard .company-selector-group button.ui-widget,
.empcard .company-selector-group button.ui-widget,
.startpage .company-selector-group button.ui-widget
{
    background-color: #ebe8e1 !important;
}

.company-selector-group button.ui-widget span.briefcase
{
    font-family: 'Glyphicons Halflings' !important;
    font-size: 18pt;
    display: block;
    width: 20px;
    color: #a0a0a0;
    margin-left: 12px;
    margin-top: 8px;
}

#company-adress .briefcase
{
    font-size: 27pt !important;
    color: #474747;
    width: 20px;
    margin-top: 7px;
    margin-left: -17px;
}

.company-selector-group button.ui-widget span.boldtext,
.company-selector-group button.ui-multiselect.ui-state-disabled:disabled span.boldtext
{
    position: absolute;
    top: 15px;
    left: 15px;
    margin-left: 0;
    margin-top: 0;
}


.company-selector-group button.ui-widget span.boldtext
{
    position: absolute;
}

/*.company-selector-group button.ui-multiselect.ui-state-disabled:disabled span.boldtext {
    position: absolute;
    margin-left: 15px;
    margin-top: -8px;
}*/

.company-selector-group button.ui-widget span.orgnr
{
    padding-left: 10px;
    font-weight: normal !important;
    color: initial !important;
}

.companys-elector-group .selector-arrow
{
    position: absolute;
    top: 0;
    right: 0;
}

.company-selector-group button.ui-widget .selector-arrow
{
    float: right;
    height: 100%;
    width: 45px;
    background-color: var(--ik-btn-primary);
    padding-left: 15px;
    z-index: 1;
}

    .company-selector-group button.ui-widget .selector-arrow:hover,
    .company-selector-group button.ui-widget.ui-state-active .selector-arrow,
    .main-companyselector .ui-state-active
    {
        color: white !important;
        background-color: #42355a !important;
        background-image: none !important;
    }

.main-companyselector .ui-state-hover
{
    background-color: var(--ik-btn-primary) !important;
}

.ui-multiselect-menu.main-companyselector .ui-state-hover
{
    color: white !important;
}

.ui-multiselect-menu.main-companyselector ul.ui-multiselect-checkboxes li label.ui-state-active span
{
    border: none !important;
}

.ui-multiselect.companyselector-calendar.ui-state-disabled,
.ui-multiselect.main-companyselector.ui-state-disabled
{
    opacity: 1 !important;
    padding-bottom: 10px !important;
    padding: 0px 0 0px 4px !important;
    overflow: hidden;
}

.ui-multiselect.companyselector-calendar.ui-state-disabled
{
    /* background-color: #ebe8e1 !important; */
}

.calendar .ui-state-disabled .selector-arrow,
.ui-multiselect.main-companyselector.ui-state-disabled .selector-arrow
{
    display: none;
}

.simpledrop .arrow-down,
.company-selector-group .arrow-down
{
    font-family: 'Glyphicons Halflings' !important;
    color: white !important;
    font-size: 12pt;
    font-weight: normal;
    content: "\e114";
    margin-top: 15px;
    margin-left: 0;
    background-image: none !important;
}

.ui-multiselect-menu.main-companyselector
{
    background: white;
}

/*.selected {
    -webkit-animation: purple-rain 1.5s;
    -moz-animation: purple-rain 1.0s;
    -ms-animation: purple-rain 1.0s;
    -o-animation: purple-rain 1.0s;
    animation: purple-rain 1.0s;
}

.closed {
    -webkit-animation: doves-cry 1.5s;
    -moz-animation: doves-cry 1.0s;
    -ms-animation: doves-cry 1.0s;
    -o-animation: doves-cry 1.0s;
    animation: doves-cry 1.0s;
}*/

#directive-detail-spinner
{
    position: absolute;
    top: 44px;
}

#save-userinfo > span
{
    float: right;
    right: 10px;
    top: 10px;
}

.companycard .help
{
    font-size: 11px;
}

.owl
{
    background: url(/images/companycard/uggla-foretagskort-270x253.png);
    background-repeat: no-repeat;
    background-position-x: 0px;
    background-position-y: -15px;
    background-size: 100%;
}

.chest
{
    background: url(/images/companycard/uggla-foretagskort-535x253.png);
    background-repeat: no-repeat;
    background-position-x: 0px;
    background-position-y: -11px;
    background-size: 100%;
}

@keyframes purple-rain
{
    0%
    {
        background: #42355a;
    }

    100%
    {
        background: #ebe8e1;
    }
}

@-webkit-keyframes purple-rain /* Safari and Chrome - necessary duplicate */
{
    0%
    {
        background: #42355a;
    }

    100%
    {
        background: #ebe8e1;
    }
}

@keyframes doves-cry
{
    0%
    {
        background: var(--ik-canvas-level-2);
    }

    100%
    {
        background: white;
    }
}

@-webkit-keyframes doves-cry /* Safari and Chrome - necessary duplicate */
{
    0%
    {
        background: var(--ik-canvas-level-2);
    }

    100%
    {
        background: #ebe8e1;
    }
}

.company-selector .ui-multiselect, .empcard .company-selector .ui-multiselect,
.simpledrop .ui-multiselect
{
    padding: 0px 0 0px 4px;
}

.card .info-text span.glyphicon,
.card .details span.glyphicon,
.companycard .servicelink span.glyphicon
{
    margin-left: 8px;
    float: right;
    color: var(--ik-btn-primary);
}

.userinfo .details span.glyphicon
{
    right: 8px;
    top: 9px;
}

.userinfo .details
{
    color: var(--ik-btn-primary);
}

#individcard .hs-details span.glyphicon
{
    right: 15px;
    color: var(--ik-btn-primary);
}

.companycard .servicelink span.glyphicon
{
    /*top: -2px;*/
}

.companycard .servicelink p span.glyphicon
{
    top: 2px;
}

.companycard .edit-details-container
{
    right: 0;
    top: 0;
    position: absolute;
}

.companycard .edit-details,
.edit-details
{
    cursor: pointer;
    width: 30px;
    height: 30px !important;
    background-image: url("../images/companycard/edit.png");
    position: absolute;
    right: 0;
    top: 0;
    /* background-repeat-y: no-repeat; */
    background-repeat: no-repeat;
}

    .companycard .edit-details:hover, .adminpersoncard .edit-details:hover
    {
        background-image: url("../images/companycard/edit_hover.png");
    }

.adminpersoncard .edit-details
{
    top: -5px;
    right: 0;
}

.info-icon img
{
    width: 60px;
}

.detail-close
{
    cursor: pointer;
    position: absolute;
}

.companycard .detail-close
{
    right: 33px;
}

#invoicecopy-view .detail-close
{
    right: 0;
}

#health-status-view
{
    margin-top: -1px;
}

    #health-status-view .detail-close,
    .tgl-area .detail-close
    {
        right: 0;
    }

#individcard .detail-close
{
    right: 0;
    position: relative;
    cursor: pointer !important;
}

.calendar .detail-close
{
    right: 19px;
    top: -5px;
}

#calendar-info-msg-area .detail-close
{
    position: relative;
    right: initial;
    top: initial;
}

.empcard .detail-close
{
    right: 32px;
    top: 13px;
}

.empcard .tgl-area .detail-close
{
    right: 9px;
}

.empcard #reconfile-view .detail-close
{
    /* right:0; */
    /* top:0; */
}

.empcard #health-status-view .detail-close
{
    right: -6px;
    top: 13px;
}

#ind-search-result .detail-close
{
    right: 20px;
    position: absolute;
    top: 25px;
    cursor: pointer;
}

    #ind-search-result .detail-close > *,
    .companycard .detail-close > *,
    .empcard .detail-close > *,
    .card .detail-close > *,
    .detail-close > *
    {
        float: left;
    }

.companycard .detail-close > div .empcard .detail-close > div
{
    margin-right: 25px;
}

.companycard .detail-close .close-icon,
.empcard .detail-close .close-icon,
.detail-close .close-icon
{
    top: 0;
    right: -15px;
    width: 30px;
    height: 34px;
    /*content: url("../images/companycard/close_white.png");*/
}

    #ind-search-result .detail-close .close-icon img,
    .companycard .detail-close .close-icon img,
    .empcard .detail-close .close-icon img,
    .detail-close .close-icon img
    {
        width: 30px;
    }

.companycard .detail-view p span
{
    color: #272727;
    position: relative !important;
    left: 23px;
    top: -2px;
}

.external-link::after,
.companycard .detail-view #contract a::after,
.companycard .detail-view .plans .detail-preamble a::after,
.companycard .detail-right-body .inkonvtxt a::after,
.companycard .admin-container .change-administrator a::after
{
    font-family: 'Glyphicons Halflings' !important;
    content: "\e164";
    position: absolute;
    right: -13px;
    top: -3px;
    font-size: 10px;
    text-decoration: none;
}

.companycard .detail-view a.internal::after,
.companycard .detail-view table a::after
{
    content: none;
}

#costcenter-puff-data .costcenter-puff-data-area .sk-fading-circle
{
    margin: 100px auto;
    width: 30px;
    height: 30px;
    position: absolute;
    left: 120px;
    top: 5px;
}

/*========COMPANY ADRESS==========*/

#official-adress
{
    line-height: 0.7;
    padding-top: 6px;
}

    #official-adress .adress-area > div
    {
        font-size: 13.5px;
        display: inline-block;
        padding-left: 5px;
    }

    #official-adress > div:first-child
    {
        padding-left: 0;
    }

    #official-adress .adress-area > div.no-divide::before,
    #official-adress .adress-area > div:first-child::before
    {
        content: "";
    }

    #official-adress > div:last-child
    {
        padding: 0;
    }

    #official-adress .adress-area > div::before
    {
        content: ",";
        position: absolute;
        margin-left: -9px;
    }

.companycard .adress-area > div
{
    display: inline-block;
}

#official-adress sup
{
    position: absolute;
    font-size: 13.5px !important;
    top: 1em;
    left: 5px;
}

/*========COMPANY ADMINS==========*/

.companycard #admin-selector
{
    border-right-style: solid;
    border-right-color: var(--ik-canvas-level-2);
    height: 146px;
}

.companycard .admin-container
{
    overflow: hidden;
    position: relative;
}

    .companycard .admin-container > div
    {
        height: inherit;
    }

    .companycard .admin-container .mail
    {
        text-overflow: ellipsis;
        overflow: hidden;
    }

.mail#ext-ha
{
    width: 70%;
}

/*.companycard #admin-selector::after {
        content: "";
        background: var(--ik-canvas-level-2);
        height: 10px;
    }*/

.companycard #admin-selector .glyphicon
{
    color: var(--ik-btn-primary);
}

    .companycard #admin-selector .glyphicon:hover,
    .companycard a:hover,
    .companycard a:hover .glyphicon,
    #costcenter-puff > div:hover a,
    #costcenter-puff > div:hover a .glyphicon,
    #loneskatt:hover a,
    #loneskatt:hover .glyphicon,
    #health-puff:hover a,
    #health-puff:hover .glyphicon
    {
        color: var(--ik-link-hover);
    }

.row-2 a:hover .details p
{
    color: var(--ik-link-hover) !important;
    text-decoration: underline;
}

.secondary-company-info .c-pointer:not(.active):hover
{
    background-color: #f9f6f6;
}

.secondary-company-info .userinfo .c-pointer:not(.active):hover
{
    background-color: initial;
}

#costcenter-puff > div:hover a,
#loneskatt:hover a,
.row-2 a:hover > .details p,
#invoicecopy-puff-data:hover a,
#health-puff:hover a
{
    text-decoration: underline;
}

.companycard #admin-selector span.glyphicon-chevron-left
{
    left: -100px;
}

.companycard #admin-selector span.glyphicon-chevron-right
{
    right: -8px;
}

.companycard #admin-selector > div
{
}

.companycard #admin-nav
{
    top: -25px;
}

.companycard #admin-active
{
    top: 35px;
    /* left: -2px; */
}

.companycard #inner > div
{
    height: 150px;
}

.companycard #img-admin
{
    position: absolute;
    top: 57px;
    width: 110px;
    right: 0;
}

.companycard .no-comp-selected img
{
    position: absolute;
    width: 46%;
    right: -28px;
}

/*======COMPANY PUFF AREA======*/

.secondary-company-info
{
    height: auto;
}

    .secondary-company-info h4
    {
        line-height: 1.5em;
        font-weight: 800 !important;
    }

#invoice-puff,
#costcenter-puff,
#tgl-puff,
#placeholder-puff
{
    height: 100%;
}

.secondary-company-info > div
{
    height: inherit;
}

.companycard .secondary-company-info > div
{
    padding-left: 0;
    padding-right: 15px;
    padding-bottom: 15px;
    height: 100%;
}

/*.companycard .secondary-company-info span.glyphicon {
    margin: 0;
    float: right;
    color: var(--ik-btn-primary);
}*/

.companycard .secondary-company-info ul
{
    line-height: 2em;
}

.companycard .secondary-puffs
{
    height: 233px !important;
}

.empcard .secondary-puffs
{
    height: 233px;
}

.empcard #filemanager-puff .secondary-puffs
{
    height: 140px;
}

.companycard #placeholder-puff .secondary-puffs
{
    overflow: hidden;
}

    .companycard #placeholder-puff .secondary-puffs img
    {
        width: 481px;
        height: 379px;
        position: absolute;
        left: -118px;
        top: -41px;
    }

.companycard .costcenter-puff-data-area img
{
    width: 117px;
    height: auto;
}

/*=========FELRATTNING==========*/

#btn-position-spinner.NYA
{
    left: 133px;
    top: -29px;
}

#btn-position-spinner.FLY
{
    right: -1080px;
    top: -29px;
}

#btn-position-spinner.LON
{
    right: -758px;
    top: -29px;
}

#btn-position-spinner.AVA
{
    right: -449px;
    top: -29px;
}

.snabbatomst-box
{
    border: 1px solid #d9d6cf;
    border-radius: 3px;
    padding: 12px 14px;
    margin-top: 8px;
    background: #F5F4F0;
    overflow: visible;
}

.snabbatomst-box::after
{
    content: "";
    display: table;
    clear: both;
}

.snabbatomst-box strong
{
    display: block;
    margin-bottom: 8px;
}

.snabbatomst-links a
{
    display: block;
    padding: 3px 0;
    color: #00aeef;
    font-weight: bold;
}

.snabbatomst-links a.inactive
{
    color: #aaa;
    pointer-events: none;
}

.snabbatomst-box .excel-link
{
    border-top: 1px solid #d9d6cf;
    padding-top: 8px;
    padding-left: 0;
}

.feltyp-section
{
    border: 1px solid #d9d6cf;
    border-radius: 3px;
    padding-left: 16px !important;
    padding-right: 16px !important;
    padding-top: 12px;
    padding-bottom: 4px;
    margin-bottom: 16px;
    background: #F5F4F0;
}

.period-selector .glyphicon-question-sign
{
    vertical-align: middle;
    margin-left: 6px;
    font-size: 16px;
    color: #00aeef;
}

/*=========EMBEDDED SERVICE==================*/
.embedded-service { padding: 0; min-height: 100vh; }
.embedded-service #puff-row-1,
.embedded-service .start-view,
.embedded-service .startview { display: none !important; }
.embedded-service .detail-close { display: none !important; }
.embedded-service #health-puff-container,
.embedded-service #contract-area,
.embedded-service #plan-area,
.embedded-service #directive-area { display: none !important; }

/*---EMBEDDED ANSTALLDAKORT---*/
.embedded-service #emp-puff7-area,
.embedded-service #emp-puff4-area { display: none !important; }
.embedded-service #salarypuffrow { display: none !important; }
.embedded-service #singlerow { display: none !important; }
.embedded-service #filemanager-puff { display: none !important; }
.embedded-service #btn-new-employee { display: none !important; }
.embedded-service .empcard .infobox { display: none !important; }

/*---EMBEDDED INDIVIDKORT---*/
.embedded-service #individ-status-area { display: none !important; }
.embedded-service #top-row { display: none !important; }
.embedded-service #hs-area { display: none !important; }
.service-historik .embedded-service #hs-area { display: block !important; }

/*=========INDIVIDKORTET HEADER=============*/

ul#top-nav-links, .employee-search
{
    font-weight: normal !important;
    font-family: Arial !important;
    color: white;
}

    ul#top-nav-links li
    {
        padding-left: 10px;
        padding-right: 10px;
        padding-bottom: 5px;
        padding-top: 5px;
    }

    .employee-search > div:first-child
    {
        padding-top: 3px;
    }

    .employee-search .glyphicon
    {
        position: absolute;
        cursor: pointer;
        top: 3px;
        right: 15px;
        font-size: 21px;
        z-index: 2003;
    }

#input-emp-search
{
    background-color: black;
    border: none;
    padding: 3px;
    width: 176px;
    height: 26px;
    z-index: 2003;
    right: 15px;
}

input#input-emp-search::placeholder
{
    color: white;
    opacity: 1;
}

.hs-details a:focus,
#input-emp-search:focus
{
    outline: none !important;
}

#input-emp-search.active
{
}

#search-result-area
{
    position: absolute;
    top: 141px;
    right: 471px;
}

    #search-result-area table tr
    {
        cursor: default !important;
    }

#ind-search-result
{
    text-align: left;
    border: solid 1px #272727;
    width: 750px;
    z-index: 2003;
    background: white;
    color: #272727;
}

    #ind-search-result h3
    {
        text-transform: none !important;
        font-weight: normal !important;
    }

#search-errors .glyphicon
{
    /* top: 5px !important; */
}

/*====CENTERED CONTENT========*/
.ik-modal-content
{
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 0px;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}

.modal-overlay
{
    background-color: #000000;
    background-color: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    /* opacity: 0.5; */
}

#modal-dialog
{
    display: block;
    width: inherit;
    height: inherit;
    margin: 0 auto;
    pointer-events: all;
}

.modal-body
{
    height: auto;
    padding: 15px;
    display: inline-block;
}

    .modal-body > div:first-child
    {
        max-height: 500px;
        overflow-y: auto;
    }

.vertical-alignment-helper
{
    display: table;
    height: 100%;
    width: 100%;
    pointer-events: none;
}

.vertical-align-center
{
    /* To center vertically */
    /* min-height: 207px; */
    display: table-cell !important;
    vertical-align: middle;
    pointer-events: none;
}

.infobox a
{
    color: #474747 !important;
    text-decoration: underline;
}

.infobox-small
{
    min-height: 86px !important;
}

/*====NEW TABLE=====*/
.ik-tbl-alt tbody td
{
    font-size: 14px !important
}

/*.ik-tbl-alt tbody tr, .ik-tbl-alt .list > ul > li {
    border-top: 1px solid #EBE8E1;
}*/

.tbl-detail .list > ul
{
    border-left: 4px solid #EBE8E1;
    border-bottom: 10px solid #EBE8E1;
    border-right: 4px solid #EBE8E1;
}

    .tbl-detail .list > ul > li > ul > li
    {
        height: 40px;
    }

        .tbl-detail .list > ul > li > ul > li:not(.first), .sub-level > li:not(.first)
        {
            border-left: 2px solid #EBE8E1;
            border-bottom: 2px solid #EBE8E1;
        }

.ik-tbl-alt thead, .ik-tbl-alt .head
{
    background-color: #EBE8E1;
    font-weight: bold;
}

table.ik-tbl-alt td[class*="col-xs"],
table.ik-tbl-alt th[class*="col-xs"]
{
    display: block;
    float: left;
}

table.ik-tbl-alt #ind-search-result td[class*="col-xs"]
{
    display: table-cell;
    float: none;
}

.tbl-detail .list .calendar
{
    background-color: transparent;
}

.tbl-detail .list .glyphicon-calendar
{
    top: 8px;
    z-index: -1;
}

.tbl-detail *, .tbl-detail .list > ul > li
{
    text-align: left;
    font-size: 12px !important;
}

.corrections_approved .glyphicon-ok
{
    font-size: 23px !important;
}

.tbl-detail .list > ul > li:not(.box)
{
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tbl-detail .list > ul > li, .tbl-detail .list select, .tbl-detail .list input[type=text]
{
    height: 38px;
    padding-top: 0px;
    border: none
}

    .tbl-detail .list select:focus, .tbl-detail .list input:focus
    {
        border: none;
        outline: none;
    }

.tbl-detail .list .active select:focus, .tbl-detail .list .active input[type=text]:focus
{
    border: 2px solid black;
    outline: none;
    height: 38px;
}

.tbl-detail input[type="text"]:disabled
{
    border: none !important;
}

.tbl-detail .box input[type=checkbox]
{
    width: 15px;
    height: 15px;
}

.tbl-detail .box span
{
    top: -2px;
    right: -2px;
}

.tbl-detail .list .inactive
{
    background-color: #EBE8E1;
}

.tbl-detail .calendar input.hasDatepicker
{
    cursor: pointer;
    background-color: transparent;
}

.tbl-detail input[type="text"]:disabled
{
    border: none !important;
}

.error-row .glyphicon
{
    position: relative !important;
}

.error-row input[type=button]
{
    top: -4px;
}

.error-row
{
    min-height: 42px !important;
    height: auto !important;
    white-space: normal !important;
}

.tbl-detail .h-full a
{
    top: 10px;
    padding: 5px;
}

.tbl-detail .list input[type=text].edited,
.tail-select .select-label.edited,
.tbl-detail .list select.edited
{
    font-weight: 700;
}

/*=======TAIL SELECT TWEAKS=======*/

.tbl-detail .tail-select.w-full.drop.active .select-dropdown
{
    top: 34px;
    width: initial !important;
}

.tbl-detail .tail-select.drop,
.tbl-detail .tail-select.drop .select-label,
.tbl-detail .tail-select.drop.select-label:hover,
.tbl-detail .tail-select.drop:hover
{
    box-shadow: none;
    -webkit-box-shadow: none;
}

    .tbl-detail .tail-select.drop .select-label.edited .label-inner
    {
        opacity: 1;
    }

.tbl-detail .tail-select .select-label:after
{
    right: -7px;
}

.tail-select.w-full.drop.open-top .select-dropdown
{
    top: 34px !important;
    bottom: initial !important;
    /*   margin: 0 0 -1px 0;
    border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    -webkit-border-radius: 3px 3px 0 0;*/
}
/*====PROGRESSBAR=====*/

#error-detailview .ui-widget-header
{
    border: 1px solid var(--ik-btn-primary);
    background: var(--ik-btn-primary) url("images/ui-bg_e78f08_500x100.png") 50% 50% repeat-x;
    color: #fff;
    font-weight: bold;
}

.empcard.card h3.active
{
    text-decoration: underline;
}

/*=====PAGINATION======*/
/*.empcard .pagination li:nth-child(n+11) {
    display: none;
}

.empcard .pagination li:last-child {
    display: inline-block;
}*/

/*=======RESPONSIVE=========*/
@media (max-width: 992px)
{
    /*========HEADPORTAL=======*/
    .head-portal
    {
        max-width: 1280px;
        background-image: var(--ik-header-bg-image);
        background-color: var(--ik-header-bg-color);
        background-repeat: no-repeat;
        height: 146px;
        text-align: right;
        padding-top: 20px;
        margin-top: -5px;
        margin-left: -5px;
        font-family: var(--ik-font-family);
    }

        .head-portal .logotype-top
        {
            padding-top: 15px;
            text-align: center;
            -moz-min-width: 40% !important;
            -ms-min-width: 40% !important;
            -o-min-width: 40% !important;
            -webkit-min-width: 40% !important;
            min-width: 22% !important;
        }

            .head-portal .logotype-top img
            {
                width: 200px;
                display: inline-block;
                -moz-min-width: 40% !important;
                -ms-min-width: 40% !important;
                -o-min-width: 40% !important;
                -webkit-min-width: 40% !important;
                min-width: 20% !important;
            }

    .head-modul > h1,
    .head-modul > h2,
    .head-modul > h3,
    .head-modul > .header h3
    {
        white-space: initial;
    }

    .main-portal
    {
        /*width: 1050px !important;*/
    }

    .puff-area .puff, .puff-area .puff:last-child
    {
        border-right: solid 15px white;
        border-bottom: solid 15px white;
    }
}



@media (max-width: 768px)
{

    .main-portal
    {
        /*width: 1050px !important;*/
    }

    /*===========FONTS, TEXT===================*/
    .head-modul > h1,
    .head-modul > h2,
    .head-modul > h3,
    .head-modul > .header h3
    {
        white-space: initial;
    }

    .head-portal .logotype-top
    {
        padding-top: 15px;
        text-align: left;
        -moz-min-width: 40% !important;
        -ms-min-width: 40% !important;
        -o-min-width: 40% !important;
        -webkit-min-width: 40% !important;
        min-width: 80% !important;
    }

        .head-portal .logotype-top img
        {
            width: 200px;
        }

    .head-portal .login-area
    {
        padding-top: 0;
        padding-right: 0;
        float: right;
        margin-top: -52px;
    }

    .guide-area
    {
        padding: 0px;
    }

    .guiden .guide-block, .current-info .left-info-area
    {
        padding: 30px 0 15px 0;
        /*border-right: none;
        border-bottom: solid 2px #E0E1DD;*/
    }

    .main-portal .calendar
    {
        padding-left: 0 !important;
        margin: 0 !important;
    }

    .calendar .info-area
    {
        -moz-min-width: 50px;
        -ms-min-width: 50px;
        -o-min-width: 50px;
        -webkit-min-width: 50px;
        min-width: 50px;
    }

    .current-info .current-info-area .right-info-area
    {
        padding-top: 15px;
        padding-left: 0;
    }

    .puff-area .puff
    {
        border-right: solid 15px white;
        border-bottom: solid 15px white;
        min-height: 250px;
    }

    /*.puff-area .puff:last-child {
            border-right: none;
        }*/
}

/*=======FILER-PUFF (startpage)======*/
.filer-puff-count
{
    font-size: 42px;
    font-weight: bold;
    line-height: 1;
    margin: 0;
}

.filer-puff-footer
{
    display: flex;
    height: 30px;
}

.filer-puff-btn
{
    flex: 1;
    text-align: center;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.filer-puff-btn + .filer-puff-btn
{
    border-left: 1px solid rgba(255, 255, 255, 0.3);
}

.filer-puff-btn:hover
{
    text-decoration: none;
    color: white;
    background-color: rgba(255, 255, 255, 0.1);
}