/* The border radius used in the interface, par example the buttons*/
.border-radius {
    border-radius: 6px;
}

/* The backgroundcolor of the page*/
body.jive, .j-modal, #jive.fullscreen, div#j-ac-search, div#j-ac-search .ac-s-result ul {
    background-color: #FCFAF8;
}

/* The background colors of the section headers */
.header-color {
    background: #f6f7f8;
    color: #000;
}

a.header-color, span.header-color {
    background: none;
}

ul.dialog-border-color, div.dialog-border-color {
    border-color: #444 !important;
}

/*modules override header-color*/
/*tree*/
#j-tree .header-color {
}
/*geolevel*/
#j-geolevel .header-color {
}
/*presentation*/
#j-presentation .header-color {
}
/*period*/
#j-period .header-color {
}
/*legend*/
#j-legend .header-color {
}
/*dialog*/
.j-modal .header-color {
}
/*scenario*/
#j-scenario .header-color {
}
/*compare button*/
#j-geocompare-btn button.header {
}

    #j-geocompare-btn button.header:hover {
    }

header.header-color {
    border-bottom: 1px solid #ccc;
    font-weight: bold !important;
}

#j-presentation a {
    color: inherit !important;
}

#j-period header.header-color {
    border-right: 1px solid #ccc;
}

#j-tree h2, #j-dimensions h2, #j-geolevel h2, #j-period h2, #j-presentation h2, #j-legend h2 {
    font-weight: bold !important;
}


/* The style properties of the topheader, background image etc.*/
.jive header.topheader {
    background-color: #fff;
    background-position: left center;
    background-repeat: no-repeat;
    height: 45px;
    border: 1px solid #cbcfe0;
    text-align: left;
    filter: none;
}

.jive header.defaultheader {
    padding: 10px;
    background: #0b72b5 url(img/logo.svg) no-repeat 15px center;
    background-size: auto 65%;
}

/* small header, appears on small screens*/
div.j-workspace-bar-header {
    overflow: hidden;
    height: 30px;
    background-image: url(img/header-title-small.png);
    background-position: left center;
    background-repeat: no-repeat;
    width: 128px;
}

    div.j-workspace-bar-header a {
        display: block;
        margin: 0;
        padding: 0;
        width: 100%;
        height: 30px;
    }

    div.j-workspace-bar-header h2 {
        display: none;
        font-size: 18px;
        line-height: 28px;
        padding: 0;
        margin: 0;
    }

/* standard button color, background and text color*/
.button-color {
    border: 0 solid #fff;
    background-color: #0B72B5;
    color: #fff;
}

    /* highlighted button  */
    .button-color.high {
        background-color: #0B72B5;
    }

/* disable button color, background and text color*/
button:disabled {
    background-color: #999;
    color: #444;
}

button.item:disabled {
    background-color: #fff;
    color: #ccc;
}
/* disable button color for clean button, background and text color*/
button.clean:disabled {
    background-color: transparent;
    color: #999;
}

    /* disable icon color for clean button*/
    button.clean:disabled i {
        color: #999;
    }
/* highlighted button color */
button.highlight {
    outline: none;
    background-color: #7dbce5;
}

/* highlight color for the current workspace tab*/
.j-workspace-bar .j-list li.current .item {
    border-bottom-color: #0B72B5;
}

.j-workspace-bar-popup .j-list li.current .item {
    border-left-color: #0F70B4;
}

/* selection button color*/
.j-showselpopup.button-color {
    background-color: #000;
    /*background-color: #0F70B4;*/
}

/* error message colo r*/
.error {
    color: darkred;
}

/*button:focus, a:focus {
	background-color: red;
}*/

/*list item color*/
.item {
    background-color: #fff;
    color: #000;
}

    /* category with selected child */
    .item.hasselectedchild {
        /*color: #0F70B4;*/
    }

        /* category icon with selected child */
        .item.hasselectedchild .icon-color {
            /*color: #0F70B4;*/
        }

/* default icon color */
.icon-color {
    color: #000;
}

    /* semi selected icon color, for example in the period control when some months from one year are selected */
    .icon-color.low {
        color: #000;
    }

    /* selected icon color */
    .icon-color.high {
        color: #0F70B4;
    }

    /* delete icon color */
    .icon-color.delete {
        color: #E00000;
    }

/* default iconbeforeclass color */
.iconbeforeclass-color {
    color: #333;
}

    /* semi selected iconbeforeclass color, for example in the period control when some months from one year are selected */
    .iconbeforeclass-color.low {
        color: #999;
    }

    /* selected iconbeforeclass color */
    .iconbeforeclass-color.high {
        color: #0B72B5;
    }

    /* delete iconbeforeclass color */
    .iconbeforeclass-color.delete {
        color: red;
    }

/* tree icon background color*/
#j-tree button.item.pre i.icon-color, #j-tree button.item.rep i.icon-color, #j-tree button.item.url i.icon-color,
#j-selection-tree-content button.item.pre i.icon-color, #j-selection-tree-content button.item.rep i.icon-color, #j-selection-tree-content button.item.url i.icon-color {
    background-color: transparent;
    color: #000;
}

.icon-bg {
    background: rgba(255,255,255,0.7);
}

/* unselected viewtype icon color */
.viewtype-color, .presoption-color {
    background-color: transparent;
    color: #000;
}

    /* selected viewtype icon color */
    .viewtype-color.high, .presoption-color.high {
        background-color: #0B72B5;
        color: #fff;
    }

        .viewtype-color.high i, .presoption-color.high i {
            color: #fff;
        }

        .viewtype-color.high:hover i, .presoption-color.high:hover i, .presoption-color.high:hover {
            background-color: transparent;
            color: #000;
        }


/*used for the background of the warning panels*/
.warning {
    background-color: #E9C8C8;
}

.success {
    background-color: #dff0d8;
}


/* listitem when hovered*/
button.item:hover:not(.not-clickable), a.viewer-link:hover {
    background-color: rgba(140,140,140, 0.1);
}

button.item.header:hover:not(.current) {
    background-color: #fff7ed;
}

/* darker color, for open categories, information titles and also subheader in modal popup*/
.item.header, .j-modal div.level2, .j-workspace-bar {
    background-color: #f6f7f8;
}
/* darker color, for open categories, information titles*/
.item.disabled {
    background-color: #EFF5FC;
}

/*Datatable*/



/*header cell*/
.j-datatable th {
    background-color: #f6f7f8;
}

/*datacell*/
.j-datatable td {
}

    .j-datatable td.t /*total*/ {
        background-color: #f8f8fd;
    }

/* table left top, should be the same color as the th */
.j-datatable.lefttop-div, .j-datatable.lefttop-div td {
    background-color: #f6f7f8;
}

/*Jive infoscreen banner*/
.jive-info-banner {
    background: url(img/logo_swing_2013.jpg) no-repeat;
    background-position: center;
    height: 146px;
}

/*focus*/
body.kbe select:focus, body.kbe textarea:focus {
    border: 1px dotted #2c77ba !important;
}

body.kbe input:focus, body.kbe button:focus, body.kbe a:focus, body.kbe label input:focus {
    outline: 1px dotted #333;
}

body.kbe .button-color.high:focus {
    background-color: #7dbce5;
    outline: none;
    border: 1px solid #333
}

body.kbe .button-color:focus {
    background-color: #7dbce5;
    color: #000;
    outline: none;
    border: 1px solid #333;
}

body.kbe button.item.header:focus, body.kbe button.item:focus, body.kbe #j-period-select-all:focus {
    background-color: #edfffe;
    border-color: #000;
    color: #000;
    /*outline: 1px dotted #2c77ba !important;*/
}

    body.kbe #j-period-select-all:focus span {
        color: #000;
    }

    body.kbe button.item.hor:focus {
        background-color: #edfffe;
        border-color: #000;
        /*outline: 1px dotted #2c77ba !important;*/
    }

/*width for tree (left-pane) and legend (right-pane)*/
.left-pane {
    width: 300px;
}

.right-pane {
    width: 212px;
}

/* startpage style*/
.startpanel-def {
    padding: 0 16px;
}

    .startpanel-def h2 {
        font-size: 2em;
    }

    .startpanel-def p {
        font-size: 18px;
    }

    .startpanel-def button {
        font-size: 14px;
        line-height: 22px;
    }

        .startpanel-def button.large {
            font-size: 18px;
            line-height: 36px;
        }


/* viewtype list style */