﻿body {
    padding-top: 0px;
    padding-bottom: 0px;
    background: #f5f7f8;
    overflow: hidden;
}

path {
    pointer-events: all;
}
/* Set padding to keep content from hitting the edges */
.body-content {
    height: 100vh;
  
}

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/

fieldset {
    border: 0;
    padding: 0;
    margin: 0;
}

.uk-nav-default > li > a:hover {
    color: white;
}


/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}



        .brand a:hover {
            color: var(--brand-purple); /*background-color: #fff; box-shadow: 0 0 1px #b94a48 inset;*/
        }

.user-info {
    position: fixed;
    bottom: 0;
    left: 0;
    padding: 10px;
    width: 200px;
    border-top: 1px solid #1e242e;
    background: #4f5b6f; /* Old browsers */
    background: -moz-linear-gradient(top, #4f5b6f 0%, #354052 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4f5b6f), color-stop(100%,#354052)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #4f5b6f 0%,#354052 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #4f5b6f 0%,#354052 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #4f5b6f 0%,#354052 100%); /* IE10+ */
    background: linear-gradient(to bottom, #4f5b6f 0%,#354052 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f5b6f', endColorstr='#354052',GradientType=0 ); /* IE6-9 */
}

.top-logout {
    border-left: 1px solid #a7b3be;
}

    .top-logout .user-info {
        position: relative;
        width: 60%;
        background: transparent;
        border: none;
        float: right;
    }


.user-info p {
    font-size: 12px;
    font-weight: normal;
    margin: 0;
    padding: 0;
    display: inline-block;
    color: #fff;
    line-height: 1.3;
}

    .user-info p span {
        font-style: italic;
        font-size: 0.9166em;
        color: #a7b3be
    }



.user-info .k-widget.k-dropdown.k-header {
    font-size: 11px;
    width: 100%;
}

.user-info #dropdown_jezici_login {
    border-top: 1px solid #4f5b6f;
    padding-top: 5px;
}

.user-info .k-dropdown-wrap.k-state-default {
    /*background: none repeat scroll 0 0 #4f5b6f !important;*/
    border-color: #a7b3be !important;
}

.brand .k-upload-files {
    margin-left: 10px;
}

.search {
    margin: 0px auto;
    text-align: center;
    padding: 10px 0;
    width: auto;
    border-bottom: 1px solid #1e242e;
    background: #4f5b6f; /* Old browsers */
    background: -moz-linear-gradient(top, #4f5b6f 0%, #354052 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4f5b6f), color-stop(100%,#354052)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #4f5b6f 0%,#354052 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #4f5b6f 0%,#354052 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #4f5b6f 0%,#354052 100%); /* IE10+ */
    background: linear-gradient(to bottom, #4f5b6f 0%,#354052 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f5b6f', endColorstr='#354052',GradientType=0 ); /* IE6-9 */
}

.top-logout .search {
    position: relative;
    width: 90%;
    background: transparent;
    border: none;
    margin: 0;
    float: right;
}

.search > input, .brand input {
    background: #404c60;
    border: 1px solid #a7b3be;
    border-radius: 15px;
    color: #fff;
    margin: 0px auto;
    padding: 5px 10px;
    width: 75%;
    display: inline-block;
}

    .search > input:focus, .brand input:focus {
        border-color: var(--brand-purple);
    }

.search a, .brand div > .search a {
    display: inline-block;
    float: right;
    padding: 0 5px 0 0;
    left: 2px;
}


    .search a:hover svg, .brand div > a:hover, .brand div > a:hover svg {
        color: var(--brand-purple);
        background-color: transparent;
        border-color: transparent;
        box-shadow: none !important
    }

#page-nav {
    background: #354052;
    border-right: 1px solid #354052;
    height: 100%;
    left: 0;
    overflow: auto;
    position: fixed;
    /*top: 0;*/
    width: 200px;
}

.side-nav,
.side-nav ul,
.side-nav li,
.side-nav a {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    font-weight: normal;
    text-decoration: none;
    line-height: 1;
    font-size: 14px;
    position: relative;
}

.side-nav {
    width: 100%;
    border-top: 1px solid #727a86;
    padding-bottom: 60px;
}

    .side-nav a {
        line-height: 1.3;
    }

        .side-nav a .arrow {
            position: absolute;
            top: 0;
            bottom: 0;
            right: 5px;
            color: #fff;
        }

    .side-nav > ul > li > a {
        padding-left: 10px;
        font-weight: bold;
        display: block;
        background: #354052;
        color: #fff;
        border-bottom: 1px solid #1e242e;
        border-top: 1px solid #727a86;
        text-transform: uppercase;
        position: relative;
        background: #4f5b6f; /* Old browsers */
        background: -moz-linear-gradient(top, #4f5b6f 0%, #354052 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4f5b6f), color-stop(100%,#354052)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, #4f5b6f 0%,#354052 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #4f5b6f 0%,#354052 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #4f5b6f 0%,#354052 100%); /* IE10+ */
        background: linear-gradient(to bottom, #4f5b6f 0%,#354052 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f5b6f', endColorstr='#354052',GradientType=0 ); /* IE6-9 */
    }

    .side-nav > ul > li:first-of-type a {
        border-top: 0 none;
    }

    .side-nav > ul > li:last-child a {
        border-bottom: 0 none;
    }

    .side-nav > ul > li > a > span {
        /*background: #354052;*/
        font-size: 11px;
        font-weight: bold;
        padding: 13px 2px;
        display: inline-block;
    }

    .side-nav > ul > li > a:hover, .side-nav ul ul a.active {
        text-decoration: none;
        color: #a7b3be;
    }

    .side-nav > ul > li.active {
        border-bottom: none;
    }

        .side-nav > ul > li.active > a {
            color: #354052;
            background: #fff;
            border-bottom: 1px solid #fff;
        }

            .side-nav > ul > li.active > a span {
                /*background: #fff;*/
            }

    .side-nav span.icn {
        display: inline-block;
        color: #a7b3be;
        height: 20px;
        margin: 0;
        padding: 0;
        position: relative;
        width: 25px;
        top: 3px;
    }

    .side-nav .active span.icn {
        color: var(--brand-purple);
    }

    .side-nav ul li ul {
        display: none;
        background: #fff;
        padding: 5px 0 10px 0;
    }
    /*.side-nav > ul > li.active > ul {display:block;}*/
    .side-nav ul ul li {
        /*border: 1px solid #e0e0e0;*/
        border-top: 0;
    }

    .side-nav ul ul a {
        padding: 5px 7px 5px 37px;
        display: block;
        color: #354052;
        font-size: 13px;
    }

        .side-nav ul ul a:hover, .side-nav ul ul li.active a {
            color: var(--brand-purple);
        }

    .side-nav ul ul li.odd {
        background: #fff;
    }

    .side-nav ul ul li.even {
        background: #fff;
    }



.navbar {
    position: fixed;
    top: 0
}

#context-menu-long {
    display: none;
}

div.k-treeview {
    font-size: 0.8125em;
    padding-top: 20px;
    overflow: visible !important;
}

.k-treeview span.k-in {
    cursor: pointer !important;
}

.editable-area {
    padding-top: 0.9375em;
    padding-bottom: 0.9375em;
}

.opcije-entiteta.columns {
    padding: 0;
}

.brand {
    background: var(--brand-darkblue); /* Old browsers */
    border-bottom: 1px solid var(--brand-purple);
    font-size: 0.75em;
    color: #fff;
}

    .brand img {
        max-height: 20px;
    }

.edit-right-col {
    background: var(--brand-darkgrey);
    /*border-radius:2px;*/ padding: 10px;
    font-size: 0.75em;
    color: #fff;
    width: 100%; /*position:fixed; margin-left:0; margin-top:0*/
}

    .edit-right-col ul {
        padding: 0;
        margin: 0;
        list-style-type: none;
    }

    .edit-right-col .uk-navbar-item {
        flex-direction: column;
        align-items: baseline;
    }

        .edit-right-col .uk-navbar-item label,
        .edit-right-col .uk-navbar-item label.required {
            color: #fff;
            font-weight: 400;
        }

    .edit-right-col .status label {
        color: #4f5b6f !important;
    }

    .edit-right-col .uk-navbar-item .uk-input {
        background: #fefefe;
        border: 1px solid rgba(112, 141, 238, .4);
        font-weight: 400;
    }

    .edit-right-col .uk-navbar-item .uk-checkbox, .edit-right-col .uk-navbar-item .uk-radio {
        margin-top: 0;
    }

    /*.edit-right-col ul li {
        border-right: 1px solid #ccc;
        padding: 5px 10px;
    }

    .edit-right-col ul.right li {
        border-right: none;
        padding: 5px 0px;
    }*/

    .edit-right-col ul li:last-child {
        border-right: none;
    }

    .edit-right-col ul li.jezik .k-dropdown {
        width: 4em;
    }

#tree-view-container .edit-right-col {
    padding: 13px 10px;
}



.edit-right-col .show-last-change:hover svg {
    border: 1px solid #fff;
}

#tree-view-container .show-last-change:hover svg {
    border-color: var(--brand-purple);
    background: var(--brand-purple);
    color: #fff;
}

#tree-view-container .show-last-change span, .edit-right-col .show-last-change span { /*color:#354052;*/
    border: none;
}

    #tree-view-container .show-last-change span:after, .edit-right-col .show-last-change span:after {
        border-bottom-color: #fff;
        right: 15px;
    }

.show-last-change.round .icon {
    border-radius: 50%;
}
#tree-view-container .show-last-change {
    line-height: 28px;
}
#tree-view-container .show-last-change svg {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #ececec;
    border-radius: 0;
    width: 28px;
    height: 28px;
}
#tree-view-container .uk-button-default {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #ececec;
}

.uk-button-primary {
    margin-right: 5px;
}

.k-alt {
    cursor: pointer;
}

.k-treelist-group {
    cursor: pointer;
}

.internaoznaka {
    cursor: pointer;
}

.line-through {
    text-decoration: line-through;
    color: rgb(153, 153, 153);
}

.edit-right-col .k-textbox {
    font-size: 12px !important;
}

.edit-right-col .status, #MultimedialPanel .status, #M2MGrid .status.sel {
    background: var(--brand-lightgrey);
    padding: 5px 10px !important;
    color: #4f5b6f;
    font-weight: 400
}

    .edit-right-col .status.active, #MultimedialPanel .status.active, #M2MGrid .status.sel.active { /*background:#66cc66;*/
        border-left: 8px solid #66cc66;
    }

    .edit-right-col .status.not-active, #MultimedialPanel .status.not-active, #M2MGrid .status.sel.not-active { /*background:#e0393e;*/
        border-left: 8px solid #e0393e;
    }

    .edit-right-col .status.draft, #MultimedialPanel .status.draft, #M2MGrid .status.sel.draft { /*background:#f5de50;*/
        border-left: 8px solid #f5de50;
    }



#MultimedialPanel .status.active {
    background: #66cc66;
    border-radius: 50%;
    margin-right: 5px;
    padding: 0 8px !important;
    border: none;
}

    #MultimedialPanel .status.not-active {
        background: #e0393e;
        border-radius: 50%;
        margin-right: 5px;
        padding: 0 8px !important;
        border: none;
    }

    #MultimedialPanel .status.draft {
        background: #e0393e;
        border-radius: 50%;
        margin-right: 5px;
        padding: 0 8px !important;
        border: none;
    }

    #MultimedialPanel .status.active.draft {
        background: #f5de50;
        border-radius: 50%;
        margin-right: 5px;
        padding: 0 8px !important;
        border: none;
    }

nav.breadcrumb {
    font-size: 12px;
    color: #ccc;
    background: #354052;
    padding: 0px 10px;
}

    nav.breadcrumb a {
        margin: 0 5px;
        text-decoration: none;
        color: #a7b3be;
    }

        nav.breadcrumb a:first-child {
            margin-left: 0;
        }

        nav.breadcrumb a:hover,
        nav.breadcrumb a:focus {
            color: var(--brand-purple);
        }

.breadcrumb span:last-child {
    display: none;
}
/*grid*/
.status.sel {
    display: block;
    border-radius: 50%;
    float: right;
    height: 14px;
    left: -5px;
    padding: 0 !important;
    position: relative;
    top: 3px;
    width: 14px;
}

.k-grid .status.sel {
    overflow: hidden;
}

.legenda {
    padding: 0;
    margin: 0;
    list-style-type: none;
    font-size: 14px;
    color: #747474;
}

    .legenda .status.sel {
        display: inline-block;
        float: none;
        top: 1px;
        left: 0;
        height: 12px;
        width: 12px;
    }

    .legenda > li {
        display: inline;
        padding-right: 10px;
    }

#M2MGrid .status.sel {
    float: none;
    width: auto;
    border-radius: 0;
    height: auto;
}

#M2MGrid .k-header {
    color: #354052 !important;
}

.status.deleted {
    background: #cc3f44;
    color: #fff;
}

.status.inserted {
    background: #8dc63f;
}

.status.changed {
    background: #40bbea;
}

.status.itemChanged {
    background: #ffba00;
}

.status.inserted.itemChanged {
    background: #8dc63f;
}

.status.changed.itemChanged {
    background: #40bbea;
}

    .status.changed.itemChanged:before, .status.inserted.itemChanged:before {
        content: '';
        position: absolute;
        left: 21%;
        width: 100%;
        height: 200%;
        background-color: rgb(255, 186, 0);
        top: 0;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        transform: rotate(45deg);
    }

.sel.status.active {
    background: #66cc66;
}

.sel.status.not-active {
    background: #e0393e;
}

.sel.status.draft {
    background: #f5de50;
}

.k-tabstrip-wrapper .k-content ul.svojstva-wrapper,
.k-tabstrip-wrapper .k-content ul.svojstva-wrapper-open,
.svojstva-wrapper-open {
    padding: 20px 0 0 0;
    margin: 0;
    list-style-type: none;
}

.k-tabstrip-wrapper .k-content ul.svojstva-wrapper-open { /*padding:0.9em;*/
}

.k-tabstrip-wrapper .k-content .svojstva-wrapper .svojstvo-item {
    border-width: 0;
    margin-top: 0px;
    position: relative;
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: .25rem !important;
    padding-top: .25rem;
}

    .k-tabstrip-wrapper .k-content .svojstva-wrapper .svojstvo-item:first-child {
        margin-top: 20px;
    }

.k-tabstrip-wrapper .k-content .svojstva-wrapper .svojstvo-item-open {
    padding-bottom: 0px;
}

    .k-tabstrip-wrapper .k-content .svojstva-wrapper .svojstvo-item-open label {
        display: flex;
        min-width: 40px;
        font-size: 13px;
        text-align: center;
        border-right: 3px solid var(--brand-purple);
        justify-content: center;
        right: -1px;
        position: relative;
        align-self: flex-start;
        text-transform: uppercase;
        color: #8b959e;
    }

.k-tabstrip-wrapper .k-content .svojstva-wrapper .svojstvo-item.kolone-2 {
    float: left;
    margin-left: -1px;
    margin-top: 20px !important;
    width: 49% !important;
}

.k-tabstrip-wrapper .k-content .svojstva-wrapper .svojstvo-item.kolone-3 {
    float: left;
    margin-left: -1px;
    margin-top: 20px !important;
    width: 32.7%;
}


.k-textbox {
    font-size: 14px !important;
}

.svojstvo-item .k-widget.k-dropdown.k-header {
    font-size: 12px;
}

.svojstvo-item .k-editor-toolbar .k-widget.k-dropdown.k-header {
    font-size: 14px;
    margin: 1px 0;
}

.svojstvo-item .k-editor-toolbar .k-dropdown-wrap.k-state-default {
    /*border-color: #63656a !important;*/
    border-radius: 3px !important;
}

.svojstvo-item .k-widget.k-dropdown.k-header {
    width: 85% !important;
}

.k-button-group .k-tool {
    height: 1.8em !important;
    line-height: 1.8em !important;
    width: 1.8em !important;
}

.k-editor .k-editable-area {
    padding: 10px;
}

.k-calendar .k-link.k-nav-fast {
    color: #999 !important;
}

.k-tabstrip .k-tabstrip-items { padding:0;
}

.k-tabstrip .svojstva-wrapper .svojstvo-item input[type=text], .k-tabstrip .svojstva-wrapper .svojstvo-item textarea, .svojstva-wrapper .k-dropdown {
    width: 100%;
    margin-right: 1rem;
    background: #fefefe !important;
    font-size: 14px;
}

.k-tabstrip .svojstva-wrapper .svojstvo-item.kolone-3 input[type=text], .k-tabstrip .svojstva-wrapper .svojstvo-item.kolone-3 textarea {
    width: 100%;
    margin-right: 1rem;
}

.k-tabstrip .svojstva-wrapper .svojstvo-item-open input[type="text"], .k-tabstrip .svojstva-wrapper .svojstvo-item-open textarea {
    width: 100%;
    margin-right: 1rem;
}

.ob-hide {
    display: none;
}

.grid-scroll {
    overflow: auto;
    width: 100%;
}


.k-tabstrip > .k-content {
    overflow: unset !important;
}

.k-tabstrip > .k-content, .k-panelbar .k-tabstrip > .k-content {
    padding: 0em !important;
}

.tabchild {
    padding: 0.75em 0 0.5em 0 !important;
    background: transparent;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.packages-section-title {
    margin-top: unset !important
}

.k-tabstrip .k-content.k-state-active {
    border-left: none;
    border-right: none;
    border-bottom: none;
    border-color: #e3e3e3 !important;
}

.k-tabstrip-items .k-state-active, .k-ie7 .k-tabstrip-items .k-state-active .k-loading {
    border-color: #d6e4ed !important;
}

.k-tabstrip-items:first-of-type {
    background: transparent !important;
}



div.editor-inside {
    border: 1px dashed #ececec;
    clear: both;
    display: inline-block;
    padding:0px 0;
    width: 100%;
    margin-right: 1rem;
}

    .cke_textarea_inline {
        max-height: 500px;
        overflow: scroll;
    }

    div.editor-inside .cke_textarea_inline {
        background: #fff;
        padding: 5px;
        font-size: 14px;
    }

        div.editor-inside .cke_textarea_inline > p {
        }

        div.editor-inside .cke_textarea_inline .row {
            margin: auto !important;
        }

label.svojstvo-naziv {
    -moz-user-select: none;
    display: block;
    font-weight: bold;
    font-size: 14px;
    margin: 0;
    padding: 0.45em 0.25em 0.25em 0.5em;
    color: var(--grey);
    /*background:rgba(239, 245, 248, 0.7);*/
}
    label.svojstvo-naziv em {
        display:none;
    }
    label.svojstvo-naziv.svojstvo-obavezno {
        color: var(--brand-darkblue);
    }
    label.svojstvo-naziv.svojstvo-obavezno em{
       display:inline-block;
    }
.toggle {
    position: relative;
    left: 4px;
}

.svojstvo-opsirno {
    padding: 20px;
    background: #FFFDF4;
    font-size: 14px;
    color: #6f6f6f !important;
}

.svojstvo-naziv .toogle-opis {
   
    border-radius: 50%;
    color: var(--brand-purple);
    cursor: pointer;
    padding: 2px;
    position: relative;
    top: -1px
}
#popup_edit {
    overflow-x: hidden;
    background: var(--brand-lightgrey);
    padding:0;
}
#popup_edit .svojstvo-naziv .toogle-opis {
    font-size: 16px !important;
    height: 16px !important;
    width: 16px !important;
}

.svojstvo-naziv .toogle-opis.active {
    color: var(--brand-purple);
}



.toggle.plus .icon-minus {
    display: none;
}

.toggle.minus .icon-plus {
    display: none;
}

.k-widget.k-window, .k-widget.k-window *, .k-animation-container *, .k-widget.k-window *:before {
    box-sizing: border-box !important;
}

    .k-widget.k-window .show-last-change svg {
        width: 23px;
        height: 23px;
    }

.k-block > .k-header, .k-window-titlebar {
    height: auto !important;
}

.k-window-action.k-link {
    box-sizing: content-box !important;
}

.k-window-action.k-link {
    background: #fff !important;
}

.k-widget.k-window .editable-area > .k-tabstrip-wrapper {
    margin: 0 -0.9375em;
}

.k-tabstrip .k-content {
    background-color: transparent !important;
    /*color: var(--brand-darkblue) !important;*/
}

.k-block, .k-button, .k-textbox, .k-drag-clue, .k-touch-scrollbar, .k-window, .k-window-titleless .k-window-content, .k-window-action, .k-inline-block, .k-grid .k-filter-options, .k-grouping-header .k-group-indicator, .k-autocomplete, .k-multiselect, .k-combobox, .k-dropdown, .k-dropdown-wrap, .k-datepicker, .k-timepicker, .k-colorpicker, .k-datetimepicker, .k-notification, .k-numerictextbox, .k-picker-wrap, .k-numeric-wrap, .k-colorpicker, .k-list-container, .k-calendar-container, .k-calendar td, .k-calendar .k-link, .k-treeview .k-in, .k-editor-inline, .k-tooltip, .k-tile, .k-slider-track, .k-slider-selection, .k-upload {
    border-radius: 0 !important;
}

.k-block, .k-header, .k-grid-header, .k-toolbar, .k-grouping-header, .k-pager-wrap,  .k-draghandle, .k-treemap-tile, html .km-pane-wrapper .k-header {
    background-color: transparent !important;
    border-color: #ccc !important;
    border-width: 0 !important;
}

.k-calendar > .k-header {
    background-color: #363940 !important;
}

.k-grid-header, th.k-header {
    border-width: 1px 0 0 1px !important;
    background: none repeat scroll 0 0 var(--brand-darkgrey) !important;
}

th:first-child.k-header {
    border-width: 1px 0 0 0px !important;
}



.k-tabstrip-wrapper .k-content .grupa-svojstava ul.svojstva-wrapper .svojstvo-item:first-child {
    margin-top: 0px;
}

.radio-button {
    background: #fff;
    border: 1px solid #ececec;
    border-radius: 5px;
    display: inline-block;
    font-size: 12px;
    line-height: 20px;
    margin-right: 5px;
    padding: 3px 5px 1px;
}

    .radio-button:hover {
        border-color: var(--brand-purple)
    }

    .radio-button > label {
        float: right;
    }

#MultimedialPanel th.k-header {
    border-top: 0 none !important;
}

.k-window-titlebar.k-header {
    background: #354052 !important;
}

#BatchGrid {
    padding: 10px 0 0 0;
    margin: 0 10px;
}

    #BatchGrid .k-grid-content {
        overflow: visible !important;
    }

    #BatchGrid .k-header, #BatchGrid .k-grid-header-wrap {
        color: #4c5356 !important;
        background: #a7b3be !important;
    }

    #BatchGrid .k-grid-header {
        padding-right: 1px !important;
    }

    #BatchGrid .k-grid-toolbar:first-child, #BatchGrid .k-grouping-header + .k-grid-toolbar {
        background: #a7b3be !important;
        border-width: 0 0 1px;
    }

    #BatchGrid.k-grid table {
        font-size: 0.8125em !important;
    }

.k-toolbar {
    line-height: 1em !important;
}

    button.k-button:hover {
        background: var(--brand-purple) !important;
        color: #fff !important;
    }

.k-pager-wrap {
    background: none repeat scroll 0 0 var(--brand-darkgrey) !important;
    bottom: 0;
    color: #fff;
    font-size: 14px;
}

.k-button.k-button-icontext.k-grid-add,
.k-button.k-button-icontext.k-grid-edit,
.k-button.k-button-icontext.k-grid-delete {
    background: #fff !important;
    border: 1px solid #dcdcdc !important;
    color: #777;
    font-size: 12px;
    font-weight: bold;
    padding: 0px 3px !important;
    min-width: 23px !important;
}

.k-button-icontext .k-icon, .k-button-icontext .k-image {
    margin-left: auto !important;
    margin-right: auto !important;
}

#MultimedialPanel .k-button.k-button-icontext.k-grid-edit,
#MultimedialPanel .k-button.k-button-icontext.k-grid-delete {
    margin-top: 3px;
}

.k-button.k-button-icontext.k-grid-edit:hover {
    /*background:var(--brand-purple) !important;*/
    color: var(--brand-purple);
    border-color: var(--brand-purple) !important;
}

.k-button.k-button-icontext.k-grid-delete:hover {
    /*background:#b94a48 !important;*/
    color: #b94a48;
    border-color: #b94a48 !important;
}

#MultimedialPanel .k-header {
    color: #4c5356 !important;
    font-size: 14px;
    font-weight: bold;
}

#MultimedialPanel .k-header.k-state-hover { border:none !important;}

#MultimedialPanel .k-state-active .k-link.k-header {
    background: none repeat scroll 0 0 var(--brand-darkgrey) !important;
    color: #fff !important;
}

#MultimedialPanel .active .k-link.k-header {
    border-left: 4px solid #66cc66 !important;
}

#MultimedialPanel .not-active .k-link.k-header {
    border-left: 4px solid #e0393e !important;
}

.tabchild label.required {
    font-size: 12px;
    font-weight: normal !important;
}


.k-state-focused.k-state-selected, .k-list > .k-state-focused.k-state-selected, .k-listview > .k-state-focused.k-state-selected, td.k-state-focused.k-state-selected {
    box-shadow: none !important;
}

#page-nav .k-block, #page-nav .k-header, #page-nav .k-grid-header, #page-nav .k-toolbar, #page-nav .k-grouping-header, #page-nav .k-pager-wrap, #page-nav .k-button, #page-nav .k-draghandle, #page-nav .k-treemap-tile, html #page-nav .km-pane-wrapper .k-header {
    background-color: #354052 !important;
    border: 0 none !important;
}

.k-window-titlebar, .k-block > .k-header, .k-tabstrip-items .k-item, .k-panelbar .k-tabstrip-items .k-item, .k-tabstrip-items .k-link, .k-calendar-container.k-state-border-down, .k-list-container.k-state-border-down, .k-autocomplete.k-state-border-down, .k-multiselect.k-state-border-down, .k-dropdown-wrap.k-state-border-down, .k-picker-wrap.k-state-border-down, .k-numeric-wrap.k-state-border-down {
    /*border-radius: 0 !important;*/
}

.k-tabstrip-items .k-loading {
    border-top-width: 0 !important;
}


.k-content, .k-panel > li.k-item, .k-panelbar > li.k-item {
    background-color: transparent !important;
    border-bottom: 1px solid #e7e7e7;
}

.k-tabstrip-items .k-state-active, .k-ie7 .k-tabstrip-items .k-state-active .k-loading {
    background-color: #2c3945 !important;
    background-image: none !important;
    border-color: #2c3945 !important;
}

.k-reset { /*font-size: 13px !important;*/
}

    .k-reset.k-tabstrip-items {
        font-size: 13px !important;
    }
.k-panelbar .k-tabstrip-top > .k-tabstrip-items .k-state-active, .k-tabstrip-top > .k-tabstrip-items .k-state-active {
    margin-bottom: 0px !important
}
.k-tabstrip-items .k-state-default, .k-ie7 .k-tabstrip-items .k-state-default .k-loading {
    margin-right: 2px !important;
    background: transparent !important;
    border: 0 none !important;
    border-bottom: 1px solid transparent !important;
}

.k-tabstrip-items .k-tab-on-top, .k-tabstrip-items .k-state-active, .k-panelbar .k-tabstrip-items .k-state-active {
    background: transparent !important;
    border-bottom: 1px solid var(--brand-purple) !important;
    padding-bottom: 0 !important;
}
/*.k-panelbar > li.k-state-default > .k-link, .k-tabstrip-items .k-state-default .k-link {
    color: #7f8a94 !important;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 400;
}*/
.k-tabstrip-items .k-state-active .k-link, .k-panelbar > li.k-state-active > .k-link {
    color: var(--brand-darkblue) !important;
    font-weight: 600;
}
.k-panelbar > li.k-state-default > .k-link.k-state-hover, .k-panelbar > li.k-state-hover > .k-link, .k-tabstrip-items .k-state-hover .k-link {
    color: var(--brand-darkblue) !important;
}

    .k-tabstrip-items .k-state-active .k-link.k-state-hover, .k-panelbar > li.k-state-active > .k-link.k-state-hover {
        color: #fff !important;
    }

.k-tabstrip > .k-content, .k-panelbar .k-tabstrip > .k-content {
    margin: -1px 0 0 0  !important;
}

/*Botuni editor tolbara*/
/*.k-button-group .k-tool, .k-toolbar, .k-grid-toolbar .k-button {
    background: #ffffff; 
    background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); 
    background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); 
    background: -o-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); 
    background: -ms-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); 
    background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); 
    border-color: #354052;
}*/

.k-grid-toolbar, .k-dropdown .k-input, .k-dropdown .k-state-focused .k-input, .k-menu .k-popup {
    color: #747475 !important;
}

    .k-grid-toolbar .k-autocomplete, .k-grid .k-autocomplete, .k-editor-toolbar .k-autocomplete, .k-grid-toolbar .k-picker-wrap, .k-grid .k-picker-wrap, .k-editor-toolbar .k-picker-wrap, .k-grid-toolbar .k-numeric-wrap, .k-grid .k-numeric-wrap, .k-editor-toolbar .k-numeric-wrap, .k-grid-toolbar .k-dropdown-wrap, .k-grid .k-dropdown-wrap, .k-editor-toolbar .k-dropdown-wrap {
        background-color: #a7b3be !important;
    }

        .k-grid-toolbar .k-autocomplete.k-state-hover, .k-grid .k-autocomplete.k-state-hover, .k-editor-toolbar .k-autocomplete.k-state-hover, .k-grid-toolbar .k-picker-wrap.k-state-hover, .k-grid .k-picker-wrap.k-state-hover, .k-editor-toolbar .k-picker-wrap.k-state-hover, .k-grid-toolbar .k-numeric-wrap.k-state-hover, .k-grid .k-numeric-wrap.k-state-hover, .k-editor-toolbar .k-numeric-wrap.k-state-hover, .k-grid-toolbar .k-dropdown-wrap.k-state-hover, .k-grid .k-dropdown-wrap.k-state-hover, .k-editor-toolbar .k-dropdown-wrap.k-state-hover {
            background-color: #354052 !important;
            border-color: #354052 !important;
        }

.k-state-hover, .k-state-hover:hover, .k-splitbar-horizontal-hover:hover, .k-splitbar-vertical-hover:hover, .k-list > .k-state-hover, .k-scheduler .k-scheduler-toolbar ul li.k-state-hover, .k-pager-wrap .k-link:hover, .k-dropdown .k-state-focused, .k-filebrowser-dropzone, .k-mobile-list .k-item > .k-link:active, .k-mobile-list .k-item > .k-label:active, .k-mobile-list .k-edit-label.k-check:active, .k-mobile-list .k-recur-view .k-check:active {
    background: transparent !important;
    /*border-bottom: 1px solid var(--brand-purple) !important;*/
    color: var(--brand-darkblue) !important;
}
.k-block, .k-draghandle, .k-inline-block, .k-widget {
    border-style: none !important;
    border-width: 0px !important;
    -webkit-appearance: none;
}
.k-list > .k-state-hover, .k-item .k-state-hover {
    background: rgba(130,152,164, .65) !important;
    color:var(--white);
}
    .k-button-group .k-tool.k-state-hover, .k-toolbar, .k-grid-toolbar .k-button.k-state-hover {
        background: #fff !important;
    }

.k-button-group .k-tool, .k-toolbar, .k-grid-toolbar .k-button {
    border-color: #cdcdcd !important;
}

#MultimedialPanel .k-state-hover, #MultimedialPanel .k-state-active .k-state-selected, #MultimedialPanel .k-state-hover:hover {
    background-color: #ecebeb !important;
}



#MultimedialPanel.k-panelbar > .k-item, .k-panel > .k-item {
    border-bottom: 1px solid #fff !important;
}
/*Snippeti*/
.k-listview.lista-snippeta {
    background: transparent !important;
    border: none !important;
    margin: 0;
    padding: 0;
    width: 100%;
    float: left;
}

.k-listview li.snippet {
    padding: 0px 0 0 3px;
    font-size: 12px;
    list-style-type: none;
    display: block;
    float: left;
}

    .k-listview li.snippet.k-state-selected {
        background: transparent !important;
        color: var(--brand-purple) !important;
    }

    .k-listview li.snippet .botun svg {
        float: left;
        margin-right: 5px;
    }

    .k-listview li.snippet .botun {
        border: 1px solid #cdcdcd;
        border-radius: 3px;
        padding: 8px;
        display: inline-block;
        cursor: pointer;
        background: #ffffff; /* Old browsers */
        background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* IE10+ */
        background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
    }

        .k-listview li.snippet .botun:hover {
            background: #fff;
        }

    .k-listview li.snippet .naziv {
        display: block;
        float: left;
    }
/*navbar*/
.k-panel > li.k-item {
    background-color: #fff !important;
    color: #354052 !important;
    padding-left: 10px !important;
}
/*.k-sprite.item-css, .k-sprite.folder-css,.k-sprite.disabled-item-css {
    width: 5px !important;
}*/
.k-in {
    border: 0 !important;
    padding: 2px 0.3333em 2px 0 !important;
}

    .k-in.k-state-selected.k-state-focused, .k-in.k-state-hover {
        color: #fff !important;
        box-shadow: none !important;
        border: 0 !important;
    }

.k-sprite.disabled-item-css {
    /*background: #e23f58;
    border-radius: 50%;
    height: 4px;
    margin: 7px 4px 7px 0 !important;
    width: 4px;*/
}

.k-in .k-sprite svg {
    color: var(--brand-purple);
    position: relative;
    top: 2px;
}

.k-in .k-sprite.deleted-item-css svg {
    color: #b94a48 !important;
}

.k-in .k-sprite.disabled-item-css svg {
    color: #ccc;
}

.k-in.k-state-selected .k-sprite svg, .k-in.k-state-hover .k-sprite svg {
    color: #fff;
}

.k-treeview .k-icon {
    background-color: #ececec !important;
    border-radius: 2px !important;
}

    .k-treeview .k-icon.k-minus {
        background-color: #dedede !important;
    }

.k-widget.k-reset.k-header.k-menu.k-menu-vertical.k-context-menu.k-popup.k-group.k-state-border-up {
    background: #ffffff !important;
}

.k-autocomplete.k-state-default, .k-picker-wrap.k-state-default, .k-numeric-wrap.k-state-default, .k-dropdown-wrap.k-state-default {
    background-color: #fefefe !important;
    border-color: #e5e5e5 !important;
}
/*.k-panelbar .k-content, .k-panelbar .k-panel, .k-panelbar .k-item { color:#354052 !important;}*/
#page-nav .k-state-selected, #page-nav .k-state-selected:link, #page-nav .k-state-selected:visited, #page-nav .k-list > .k-state-selected, .k-list > .k-state-highlight, #page-nav .k-panel > .k-state-selected, #page-nav .k-ghost-splitbar-vertical, #page-nav .k-ghost-splitbar-horizontal, #page-nav .k-draghandle.k-state-selected:hover, #page-nav .k-scheduler .k-scheduler-toolbar .k-state-selected, #page-nav .k-scheduler .k-today.k-state-selected, #page-nav .k-marquee-color {
    background-color: #fff !important;
    color: #428bca !important;
}

#page-nav .k-state-active .k-link.k-header {
    background: none repeat scroll 0 0 #fff !important;
}

.k-grid-content {
    height: auto !important;
}

.k-panelbar .k-panel, .k-panelbar .k-content {
    border-bottom-style: none !important;
}



.history-button {
    display: flex;
    padding: 0 .25rem;
}
    .history-button .uk-icon-button {
        background: #fefefe;
        position:relative;
    }
.show-last-change, .sync-button {
    transition: all 0s ease;
}

.edit-right-col ul li.show-last-change {
    padding: 0px 5px;
}

    .edit-right-col ul li.show-last-change li {
        cursor: pointer;
    }

.show-last-change span, .sync-button span {
    color: var(--grey);
}

.show-last-change:hover svg, .sync-button:hover svg {
    color: var(--brand-purple);
}

#popup_edit .sync-button svg {
    height: 22px;
    padding: 2px;
    width: 23px;
}

#popup_edit .sync-button {
    top: 5px;
}



.history-button .uk-dropdown, .history-button .uk-dropdown {
    background: #fff;
    color: var(--brand-darkblue);
    font-size: 12px;
    text-wrap: none;
    -webkit-box-shadow: 1px 1px 2px 0px rgba(50, 50, 50, 0.35);
    -moz-box-shadow: 1px 1px 2px 0px rgba(50, 50, 50, 0.35);
    box-shadow: 1px 1px 2px 0px rgba(50, 50, 50, 0.35);
}

    .show-last-change .info .change {
        min-width: 400px;
        display: block;
        line-height: 2.17em;
    }

    .sync-button .info .change {
        min-width: 200px;
        display: block;
        line-height: 2.17em;
    }



    .show-last-change .info ul li {
        display: block;
        border: none;
        border-bottom: 1px solid #fff;
        padding: 0px 8px;
        text-align: right;
        font-weight: bold;
    }

        .show-last-change .info ul li:last-child {
            border-bottom: none;
        }

.edit-right-col .uk-dropdown .uk-nav li a, ul li.stavke, ul li.stavke a {
    color: var(--brand-purple);
    text-decoration: none;
    cursor:pointer;
}
ul li.stavke {
    padding-left: 9px;
    position: relative;
}

    .show-last-change .info ul li a:hover, ul li.stavke:hover, .edit-right-col  .uk-dropdown .uk-nav li a:hover {
        text-decoration: underline;
    }

            .show-last-change .info ul li a.disable-preview {
                color: #999 !important;
                cursor: default;
            }

                .show-last-change .info ul li a.disable-preview:hover {
                    text-decoration: none;
                }




.time-machine a.uk-text-muted {
    cursor: auto
}
.time-machine a:hover { 
   background:var(--white)
}

.action-button {
    height: auto;
}

    .action-button, .action-button.k-button.k-button-icontext {
        display: inline-block;
        position: relative;
        background: #fff;
        border: 1px solid var(--brand-purple);
        border-radius: 2px;
        cursor: pointer;
        color: var(--brand-purple);
        font-family: Arial, sans-serif;
        font-size: 12px;
        line-height: 18px;
        padding: 3px 8px;
        width: auto;
        margin: 5px;
        text-transform: uppercase;
        font-weight: bold;
    }

        .action-button.k-button.k-button-icontext.plavi {
            background: #7db9e8 !important;
            color: #fff !important;
        }

            .action-button.k-button.k-button-icontext.plavi:after {
                color: #ddd;
                content: " | ";
                position: absolute;
                right: -7px;
            }

        .action-button.k-button.k-button-icontext.zeleni {
            background: #a5c956 !important;
            color: #fff !important;
        }

        .action-button.k-button.k-button-icontext {
            height: auto;
            border: 1px solid #d9d9d9 !important;
        }

            .action-button span, .action-button.k-button.k-button-icontext span {
                float: left;
                margin-right: 5px;
            }

            .action-button svg, .action-button.k-button.k-button-icontext svg {
                width: 16px;
                float: left;
                margin-top: 2px;
            }

            .action-button:hover, .action-button.k-button.k-button-icontext:hover {
                color: #fff;
                border-color: var(--brand-purple) !important;
                background: var(--brand-purple) !important;
            }

.k-widget.k-window .force-delete .action-button {
    box-sizing: content-box !important;
    float: right;
}

#tree-view-container .action-button {
    box-sizing: content-box;
}

#ImportGrid {
    float: left;
    margin-top: 10px;
}

   

    #ImportGrid .k-grid-header th.k-header, #ImportGrid .k-filter-row th {
        border-bottom: 1px solid #ccc !important;
    }

    #ImportGrid.k-grid table {
        font-size: 0.875em !important;
    }

.k-grid {
    font-size: 14px !important;
    margin: 5px;
}

  /*  .k-grid .k-header .k-link:link, .k-grid .k-header .k-link:visited, .k-grid .k-header .k-nav-current.k-state-hover .k-link {
        color: #354052 !important;
        font-size: 13px;
    }
*/
    .k-grid .k-header .k-link.sorted {
        background: #ddd !important;
    }
/*.k-header .k-nav-current.k-state-hover .k-link, .k-panelbar > li.k-state-default.k-state-hover  > .k-link {color:#fff !important;}*/
#SearchresultGrid {
    margin-top: 10px;
}
.k-draghandle.k-state-selected:hover, .k-ghost-splitbar-horizontal, .k-ghost-splitbar-vertical, .k-list > .k-state-highlight, .k-list > .k-state-selected, .k-marquee-color, .k-panel > .k-state-selected, .k-scheduler .k-today.k-state-selected, .k-state-selected, .k-state-selected:link, .k-state-selected:visited {
    color: #fff;
    background-color: var(--brand-purple) !important;
    border-color: var(--brand-purple) !important;
}
    #SearchresultGrid .k-grid-header th.k-header, #SearchresultGrid .k-filter-row th {
        border-bottom: 1px solid #ccc !important;
    }

.k-grid table {
    font-size: 0.875em !important;
}

#SearchresultGrid .k-grouping-header {
    color: #354052 !important;
}

.multiselect-columns { /*padding-top:8px; padding-bottom:8px; background:#354052; margin-bottom:10px;*/
}

    .multiselect-columns label {
        color: #fff;
        display: block;
        font-size: 13px;
        font-weight: bold;
        line-height: 2.5em;
    }

    .multiselect-columns .k-header {
        background: transparent !important;
    }

    .multiselect-columns .k-multiselect-wrap {
        background: rgba(64, 76, 94, 0.9) !important;
        border: 1px solid #a7b3be;
        padding: 3px;
        border-radius: 5px;
        min-height: 1.6em;
        position: relative;
        z-index: 1;
    }

    .multiselect-columns .k-header.k-state-hover .k-multiselect-wrap {
        background: rgba(167,179,190,0.6) !important;
    }

    .multiselect-columns .k-multiselect-wrap .k-input {
        color: #fff !important;
    }

    .multiselect-columns .k-button {
        background: #fff !important;
        color: var(--brand-purple) !important;
        border-radius: 2px !important;
    }

        .multiselect-columns .k-button.k-state-hover {
            background: var(--brand-purple) !important;
            color: #fff !important;
        }

    .multiselect-columns .icon.icon-arrow-down2 {
        fill: #fff;
        position: absolute;
        right: 19px;
        z-index: 0;
        top: 40px;
    }

.k-list-container {
    background-color: #fff !important;
    color: #777 !important;
}

.k-popup .k-list .k-state-hover, .k-popup .k-list .k-state-focused, .k-popup .k-list .k-state-selected, .k-overflow-container .k-state-hover, .k-overflow-container .k-state-focused, .k-overflow-container .k-state-selected, .k-fieldselector .k-list .k-item {
    border-width: 0 !important;
    border-color: transparent !important;
}

.content-closed .icon-menu {
    fill: #a7b3be;
    width: 20px;
    height: 20px;
}

.content-open .icon {
    fill: #a7b3be;
    position: relative;
    left: -4px;
}

.ui-layout-toggler-hover .content-open .icon {
    fill: #fff;
}

.ui-layout-toggler-hover .content-closed .icon-menu {
    fill: #fff;
}

.svojstvo-item .k-multiselect {
    width: 100%;
    margin-right: 1rem;
    font-size: var(--font-size-5);
}


.svojstvo-item .k-multiselect-wrap .k-button {
    background: #fff !important;
    color: var(--brand-purple) !important;
    border-radius: 2px !important;
}

    .svojstvo-item .k-multiselect-wrap .k-button.k-state-hover {
        background: var(--brand-purple) !important;
        color: #fff !important;
    }

.svojstvo-item .k-multiselect .active, .k-animation-container .active, .vezani-entiteti .active {
    border-left: 4px solid #66cc66;
    padding-left: 5px;
}

.svojstvo-item .k-multiselect .not-active, .k-animation-container .not-active, .vezani-entiteti .not-active {
    border-left: 4px solid #e0393e;
    padding-left: 5px;
}
/*import export*/
.missingItem {
    background-color: #cc3f44;
    color: #fff;
}

.import-kolone .small-block-grid-4 li.missingItem > div {
    color: #fff !important;
}

.action-button.refresh {
    box-sizing: content-box;
}

.k-grouping-header {
    color: #354052 !important;
}

.import-sheet {
    border-bottom: 1px solid #ececec !important;
    font-size: 12px;
    padding: 0.25rem 0.9375rem !important;
    width: 50%;
}

.import-kolone .small-block-grid-4 li > div {
    color: #747474;
    font-size: 12px;
    font-style: italic;
    float: left;
}

.import-kolone .small-block-grid-4 li > .k-widget.k-dropdown.k-header {
    float: right;
    font-size: 12px;
    width: 50%;
}

.import-kolone [class*="block-grid-"] > li {
    border-bottom: 1px solid #ececec !important;
    border-right: 1px solid #ececec;
    padding: 0.25rem 0.9375rem !important;
}
/*Editor preview */
.editor-preview-mode {
    font-size: 0.8125em;
}

    .editor-preview-mode h1,
    .editor-preview-mode h2,
    .editor-preview-mode h3,
    .editor-preview-mode h4 {
        color: #354052;
    }

.anchor-item {
    border: 1px dashed red !important;
}

/*Error messages*/


.report-entitet .report {
    border: 1px solid transparent;
    border-radius: 5px;
    float: left;
    margin: 18px 2.5% 0;
    padding: 15px 15px 15px 45px;
    position: relative;
    width: 95%;
    font-size: 14px;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 022s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}

.report-entitet .info, #popup_errorMessage .info {
    font-weight: bold;
}

.report-entitet .icon {
    height: 22px;
    left: 11px;
    position: absolute;
    width: 22px;
}

.report-svojstvo .report {
    color: #fff;
    border-radius: 5px;
    width: auto;
    margin: 5px 0;
    padding: 3px 10px 3px 30px;
    float: left;
    position: relative;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 022s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}

.report-entitet .close-report {
    position: absolute;
    right: 10px;
    top: 9px;
    text-decoration: none;
}

#popup_errorMessage .close-report, .report-svojstvo .close-report {
    display: none;
}

.MaxLength, .CurrentLength {
    display: inline-block;
    font-size: .75rem;
    font-weight: bold;
    padding-bottom: 6px;
}

.errorMsg {
    color: #cc3f44;
    font-size: .75rem;
    font-weight: bold;
    font-style: italic;
    display: block;
    margin-top: -4px;
}

.report-entitet .close-report .icon, #popup_errorMessage .close-report .icon {
    color: #fff;
    left: auto;
    right: 0px;
    top: 0px;
    position: relative;
}

.report-svojstvo .info {
    display: inline-block;
    font-size: 14px;
    font-style: italic;
    font-weight: bold;
    line-height: 22px;
}

.report-svojstvo a {
    font-size: 14px;
}

    .report-svojstvo a:hover {
        font-style: italic;
        text-decoration: none;
    }

.report-svojstvo .icon {
    height: 14px;
    left: 10px;
    position: absolute;
    width: 14px;
    top: 0;
    bottom: 0;
    margin: auto;
}

.report.error {
    background-color: #cc3f44;
    border-color: #cc3f44;
    color: #fff;
    margin-right: 10px;
}

.report.success {
    background-color: #8dc63f;
    border-color: #8dc63f;
    color: #fff;
}

.report.info {
    background-color: #ffba00;
    border-color: #ffba00;
    color: #fff;
}

#popup_errorMessage .report.error span.link-list a {
    color: #fff;
    display: inline-block;
    font-size: 14px;
    margin: 5px 0 0 25px;
    padding: 3px;
    text-decoration: none;
}

    #popup_errorMessage .report.error span.link-list a:hover {
        background: none repeat scroll 0 0 #fff;
        color: #b94a48 !important;
    }
/*.editor-preview-mode > div{
    height: 320px;
    overflow: auto;
}*/
/*
 * Default Layout Theme
 *
 * Created for jquery.layout 
 *
 * Copyright (c) 2010 
 *   Fabrizio Balliano (http://www.fabrizioballiano.net)
 *   Kevin Dalman (http://allpro.net)
 *
 * Dual licensed under the GPL (http://www.gnu.org/licenses/gpl.html)
 * and MIT (http://www.opensource.org/licenses/mit-license.php) licenses.
 *
 * Last Updated: 2010-02-10
 * NOTE: For best code readability, view this with a fixed-space font and tabs equal to 4-chars
 */



/*
 *	PANES & CONTENT-DIVs
 */
.ui-layout-pane { /* all 'panes' */
    overflow: auto;
    /* DO NOT add scrolling (or padding) to 'panes' that have a content-div,
	   otherwise you may get double-scrollbars - on the pane AND on the content-div
	   - use ui-layout-wrapper class if pane has a content-div
	   - use ui-layout-container if pane has an inner-layout
	*/
}
/* (scrolling) content-div inside pane allows for fixed header(s) and/or footer(s) */
.ui-layout-content {
    padding: 10px;
    position: relative; /* contain floated or positioned elements */
    overflow: auto; /* add scrolling to content-div */
}

/*
 *	UTILITY CLASSES
 *	Must come AFTER pane-class above so will override
 *	These classes are NOT auto-generated and are NOT used by Layout
 */
.layout-child-container,
.layout-content-container {
    padding: 0;
    overflow: hidden;
}

.layout-child-container {
    border: 0; /* remove border because inner-layout-panes probably have borders */
}

.layout-scroll {
    overflow: auto;
}

.layout-hide {
    display: none;
}

/*
 *	RESIZER-BARS
 */
.ui-layout-resizer { /* all 'resizer-bars' */
    background: #fff;
    border: 1px solid #BBB;
    border-width: 0;
}

.ui-layout-resizer-drag { /* REAL resizer while resize in progress */
}

.ui-layout-resizer-hover { /* affects both open and closed states */
}
/* NOTE: It looks best when 'hover' and 'dragging' are set to the same color,
		otherwise color shifts while dragging when bar can't keep up with mouse */
.ui-layout-resizer-open-hover, /* hover-color to 'resize' */
.ui-layout-resizer-dragging { /* resizer beging 'dragging' */
    background: #A7E5E3;
}

.ui-layout-resizer-dragging { /* CLONED resizer being dragged */
    border: 1px solid #BBB;
}

.ui-layout-resizer-north-dragging,
.ui-layout-resizer-south-dragging {
    border-width: 1px 0;
}

.ui-layout-resizer-west-dragging,
.ui-layout-resizer-east-dragging {
    border-width: 0 1px;
}
/* NOTE: Add a 'dragging-limit' color to provide visual feedback when resizer hits min/max size limits */
.ui-layout-resizer-dragging-limit { /* CLONED resizer at min or max size-limit */
    background: #E1A4A4; /* red */
}

.ui-layout-resizer-closed-hover { /* hover-color to 'slide open' */
    background: #A7E5E3;
}

.ui-layout-resizer-sliding { /* resizer when pane is 'slid open' */
    opacity: .10; /* show only a slight shadow */
    filter: alpha(opacity=10);
}

.ui-layout-resizer-sliding-hover { /* sliding resizer - hover */
    opacity: 1.00; /* on-hover, show the resizer-bar normally */
    filter: alpha(opacity=100);
}
/* sliding resizer - add 'outside-border' to resizer on-hover 
		 * this sample illustrates how to target specific panes and states */
.ui-layout-resizer-north-sliding-hover {
    border-bottom-width: 1px;
}

.ui-layout-resizer-south-sliding-hover {
    border-top-width: 1px;
}

.ui-layout-resizer-west-sliding-hover {
    border-right-width: 1px;
}

.ui-layout-resizer-east-sliding-hover {
    border-left-width: 1px;
}

.ui-layout-resizer.ui-layout-resizer-west.ui-draggable-handle.ui-layout-resizer-closed.ui-layout-resizer-west-closed.ui-draggable-disabled {
    border-left: 1px solid #ccc;
}
/*
 *	TOGGLER-BUTTONS
 */
.ui-layout-toggler {
    border: 1px solid #BBB; /* match pane-border */
    background-color: #f1f1f1;
}

.ui-layout-resizer-hover .ui-layout-toggler {
    opacity: 1;
    filter: alpha(opacity=100);
}

.ui-layout-toggler-hover, /* need when NOT resizable */
.ui-layout-resizer-hover .ui-layout-toggler-hover { /* need specificity when IS resizable */
    background-color: var(--brand-purple);
    opacity: 1.00;
    filter: alpha(opacity=100);
    color: #fff;
}

.ui-layout-toggler-north,
.ui-layout-toggler-south {
    border-width: 0 1px; /* left/right borders */
}

.ui-layout-toggler-west,
.ui-layout-toggler-east {
    border-width: 0; /* top/bottom borders */
}
/* hide the toggler-button when the pane is 'slid open' */
.ui-layout-resizer-sliding .ui-layout-toggler {
    display: none;
}
/*
	 *	style the text we put INSIDE the togglers
	 */
.ui-layout-toggler .content {
    color: #666;
    font-size: 12px;
    font-weight: bold;
    width: 100%;
    line-height: 1.5;
    padding-bottom: 0.35ex; /* to 'vertically center' text inside text-span */
}

/*
 *	Default printing styles
 */
@media print {
    /*
	 *	Unless you want to print the layout as it appears onscreen,
	 *	these html/body styles are needed to allow the content to 'flow'
	 */
    html {
        height: auto !important;
        overflow: visible !important;
    }

    body.ui-layout-container {
        position: static !important;
        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        /* only IE6 has container width & height set by Layout */
        _width: auto !important;
        _height: auto !important;
    }

    .ui-layout-resizer, .ui-layout-toggler {
        display: none !important;
    }
    /*
	 *	Default pane print styles disables positioning, borders and backgrounds.
	 *	You can modify these styles however it suit your needs.
	 */
    .ui-layout-pane {
        border: none !important;
        background: transparent !important;
        position: relative !important;
        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        width: auto !important;
        height: auto !important;
        overflow: visible !important;
    }
}


.spinner {
    background-color: rgba(52,73,84,0.4);
    background-size: 60px;
    background-repeat: no-repeat;
    background-position: center;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 100000;
    width: 100%;
    height: 100%;
}

    .spinner svg {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        width: 50px;
        height: 50px;
    }

@-webkit-keyframes stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4)
    }

    20% {
        -webkit-transform: scaleY(1.0)
    }
}

@keyframes stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }

    20% {
        transform: scaleY(1.0);
        -webkit-transform: scaleY(1.0);
    }
}
/*Tooltips*/
.hint, [data-hint] {
    position: relative;
    /*display: inline-block;*/
    /**
   * tooltip arrow
   */
    /**
   * tooltip body
   */
}

    .hint:before, .hint:after, [data-hint]:before, [data-hint]:after {
        position: absolute;
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        visibility: hidden;
        opacity: 0;
        z-index: 1000000;
        pointer-events: none;
        -webkit-transition: 0.3s ease;
        -moz-transition: 0.3s ease;
        transition: 0.3s ease;
        -webkit-transition-delay: 0ms;
        -moz-transition-delay: 0ms;
        transition-delay: 0ms;
    }

    .hint:hover:before, .hint:hover:after, .hint:focus:before, .hint:focus:after, [data-hint]:hover:before, [data-hint]:hover:after, [data-hint]:focus:before, [data-hint]:focus:after {
        visibility: visible;
        opacity: 1;
    }

    .hint:hover:before, .hint:hover:after, [data-hint]:hover:before, [data-hint]:hover:after {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .hint:before, [data-hint]:before {
        content: '';
        position: absolute;
        background: transparent;
        border: 6px solid transparent;
        z-index: 1000001;
    }

    .hint:after, [data-hint]:after {
        content: attr(data-hint);
        background: var(--brand-purple);
        color: #fff;
        padding: 8px 10px;
        font-size: 12px;
        line-height: 12px;
        white-space: nowrap;
    }

/**
 * source: hint-position.scss
 *
 * Defines the positoning logic for the tooltips.
 *
 * Classes added:
 * 	1) hint--top
 * 	2) hint--bottom
 * 	3) hint--left
 * 	4) hint--right
 */
/**
 * set default color for tooltip arrows
 */
.hint--top:before {
    border-top-color: var(--brand-purple);
}

.hint--bottom:before {
    border-bottom-color: var(--brand-purple);
}

.hint--left:before {
    border-left-color: var(--brand-purple);
}

.hint--right:before {
    border-right-color: var(--brand-purple);
}

/**
 * top tooltip
 */
.hint--top:before {
    margin-bottom: -12px;
}

.hint--top:after {
    margin-left: -18px;
}

.hint--top:before, .hint--top:after {
    bottom: 100%;
    left: 50%;
}

.hint--top:hover:after, .hint--top:hover:before, .hint--top:focus:after, .hint--top:focus:before {
    -webkit-transform: translateY(-8px);
    -moz-transform: translateY(-8px);
    transform: translateY(-8px);
}

/**
 * bottom tooltip
 */
.hint--bottom:before {
    margin-top: -12px;
}

.hint--bottom:after {
    margin-left: -18px;
}

.hint--bottom:before, .hint--bottom:after {
    top: 100%;
    left: 50%;
}

.hint--bottom:hover:after, .hint--bottom:hover:before, .hint--bottom:focus:after, .hint--bottom:focus:before {
    -webkit-transform: translateY(8px);
    -moz-transform: translateY(8px);
    transform: translateY(8px);
}

/**
 * right tooltip
 */
.hint--right:before {
    margin-left: -12px;
    margin-bottom: -6px;
}

.hint--right:after {
    margin-bottom: -14px;
}

.hint--right:before, .hint--right:after {
    left: 100%;
    bottom: 50%;
}

.hint--right:hover:after, .hint--right:hover:before, .hint--right:focus:after, .hint--right:focus:before {
    -webkit-transform: translateX(8px);
    -moz-transform: translateX(8px);
    transform: translateX(8px);
}

/**
 * left tooltip
 */
.hint--left:before {
    margin-right: -12px;
    margin-bottom: -6px;
}

.hint--left:after {
    margin-bottom: -14px;
}

.hint--left:before, .hint--left:after {
    right: 100%;
    bottom: 50%;
}

.hint--left:hover:after, .hint--left:hover:before, .hint--left:focus:after, .hint--left:focus:before {
    -webkit-transform: translateX(-8px);
    -moz-transform: translateX(-8px);
    transform: translateX(-8px);
}

/*gallery photo*/
.photo svg {
    width: 30px;
    height: 30px;
}

.icon-file-pdf {
    color: #990000
}

.icon-file-word {
    color: #0a309f
}

.icon-file-excel {
    color: #43ac6a;
}

.icon-file-zip {
    color: #ffd800
}

.SlikaPath .icon.icon-file-pdf, .SlikaPath .icon.icon-file-word, .SlikaPath .icon.icon-file-excel, .SlikaPath .icon.icon-file-zip {
    display: inline-block;
    height: 25px;
    width: 25px;
}

.SlikaPath img,
.SlikaPathS img,
.SlikaPathM img,
.SlikaPathL img {
    float: left
}

.img-path {
    width: 90%;
}

.SlikaPath .img-path,
.SlikaPathS .img-path,
.SlikaPathM .img-path,
.SlikaPathL .img-path {
    float: left;
    padding-left: 1rem;
    min-width: 50%;
}

    .SlikaPath .img-path span,
    .SlikaPathS .img-path span,
    .SlikaPathM .img-path span,
    .SlikaPathL .img-path span {
        font-size: .75rem;
        font-style: italic;
        padding-bottom: 5px;
        display: block;
    }

    .SlikaPath .img-path input,
    .SlikaPathS .img-path input,
    .SlikaPathM .img-path input,
    .SlikaPathL .img-path input {
        width: 100%
    }

.uputa {
    background: #fff;
    margin-top: 1em;
    font-size: 0.875em;
}

    .uputa .toggle {
        float: right;
        position: relative !important;
        top: 0;
        right: 0;
    }

        .uputa .toggle .icon {
            background: none repeat scroll 0 0 #fff;
            border: 1px solid #ececec;
            border-radius: 2px;
            color: #ccc;
            font-size: 18px !important;
            padding: 0px;
            height: 18px !important;
            width: 18px !important;
            margin-top: 10px;
        }


.upozorenje .tabchild {
    background: #ffde57 !important;
}

.upozorenje .k-content.k-state-active {
    background: #ffde57 !important;
}

.upozorenje .k-tabstrip-items .k-state-active .k-link {
    background: #ffde57;
    color: #4c5356 !important;
}

.k-tabstrip-wrapper .k-content .svojstva-wrapper .upozorenje .svojstvo-item-open label {
    color: #4c5356;
}

.upozorenje .k-tabstrip-items .k-state-default.k-state-hover .k-link {
    color: #4c5356;
}

.upozorenje li.k-item.k-state-default {
    background: #cfd1cf !important;
}

    .upozorenje li.k-item.k-state-default.k-state-hover {
        background: #ffde57 !important;
    }

/*.action-button#btnCrop{
    height:inherit;
}

.img-crop {
    display: block;
    float: left;
    padding-bottom: 5px;
    min-width: 100%;
}*/

#idNewGalery {
    margin-bottom: 5px;
    width: -webkit-fill-available;
}
