/*
#c3b6a5 - text
#c3b6a58c - mute text
#efd4a8eb title
ffffffbf - hover
linear-gradient(#4a2706, #281502) - Header
#815530 - search, nav btn
#311b0e - bg
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
*/

@font-face {
    font-family: 'CHNOPixelCodePro-Regular';
	font-style: normal;
	font-weight: normal;
	src: local('CHNOPixelCodePro-Regular'),
        url('../fonts/CHNOPixelCodePro-Regular.ttf') format('ttf'), 
        url('../fonts/CHNOPixelCodePro-Regular.woff2') format('woff2'),
		url('../fonts/CHNOPixelCodePro-Regular.woff') format('woff'),
		url('../fonts/CHNOPixelCodePro-Regular.otf') format('otf');
}

body {
  padding-top: 42px;
  /*margin-bottom: 42px;*/
  background-image: url(../images/bg.png);
}

main {
    min-height: calc(100vh-56px);
    margin-bottom: 100px;
}

.footer {
    line-height: 3.5rem;
    background-color: #311b0e;
    position: absolute;
    width: 100%;
    bottom: 0px;
}

code {
    border-radius: 4px;
}

html {
  position: relative;
  min-height: 100%;
}

/*INDEX PAGE*/
.heading-h3 {
    color: #c3b6a5;
    line-height: 1.2;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: transparent;
    font-size: 2rem;
    font-family: 'CHNOPixelCodePro-Regular';
    margin-bottom: 20px;
}

.elementor-text-editor {
    color: #c3b6a5;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    hyphens: manual;
    font-size: 1rem;
    line-height: 1.5;
}

.elementor-text-editor li > a {
    text-decoration: none;
    color: #c3b6a5;
    background-color: transparent;
}

 .elementor-text-editor li > a:hover {
    text-decoration: none;
    color: #ffffffbf;
}

.container-box {
    background-color: #311b0e;
    margin-top: 42px;
}

.container-multi-section {
    background-color: #311b0e;
    margin-top: 42px;


}

.container-box li::marker, .container-multi-section li::marker {
    color: #8BC027;
    /*color: #007bc7;*/
    unicode-bidi: isolate;
    font-variant-numeric: tabular-nums;
    text-transform: none;
    text-indent: 0px !important;
    text-align: start !important;
    text-align-last: start !important;
}
.container-box strong {
    font-family: 'CHNOPixelCodePro-Regular'
}

/*POST-CONTAINER*/
.post-container{
    margin-bottom: 20px;
}

.post-container-date {
    font-size: 80%;
}

.post-container-title, .post-container-date, .post-container-description, .post-container-link {
    display: inline;
}

/**/
.input_field {
    width: 100%;
    height: 30px;
}

.textarea_field {
    width: 100%;
}

.float-right {
    float: right;
}

.hide {
    display: none!important;
}

/* Табличка с иконкой */
.thumbnail_table { 
    border-left: #333 solid 1px;
    border-bottom: #333 solid 1px;
}
.thumbnail_header {
    background-color: burlywood;
    display: inline;
    text-align: center;
    font-weight: bold;
}
.dimensions, .thumbnail, .thumbnail_header, .icoName, .typeItem{
    border-top: #333 solid 1px;
    border-right: #333 solid 1px;
}
.dimensions, .thumbnail, .icoName, .typeItem{
    text-align: center;
    padding: 10px 12px;
}

/*NAV*/
.navbar {
    padding-top:1px;
    padding-bottom:1px;

    background: linear-gradient(#4a2706, #281502);
}

.navbar-brand {
    padding-top: 0px;
}

.navbar > .inactive-banner {
    color: rgba(255,255,255,.5)!important;
}

.navbar > .active-banner {
    color: #fff!important;
}

.nav-active > .nav-link {
    color: #fff!important;
}

.navbar-nav > .nav-item > .nav-link::first-letter {
    text-transform:capitalize;
}

.icon-create, .icon-edit {
    position: relative;
    top: 2px;
}

.icon-create::before {
    content: url(/images/plus.svg);
    position: relative;
    top: 1px;
}

.icon-edit::before {
    content: url(/images/pencil.svg);
    position: relative;
    top: 0px;
}

.icon-save::before {
    content: url(/images/save.svg);
    position: relative;
    top: 3px;
}

#toolbar_add, #toolbar_edit {
    background: #815530 none;
    width: 39px;
    height: 24px;
    border-radius: 4px;
    text-align: center;
}

#toolbar_add:hover, #toolbar_edit:hover, #toolbar_save:hover {
    background-color: #0077c0!important;
}

#searchbox {
    width: 125px;
    position: relative;
    top: 0;
    margin-top: 7px;
    height: 33px;
}

#searchbox .search-background {
    border-radius: 20px;
    background-color: #815530;
    height: 26px;
    width: 125px;
    color: white;
}

#searchbox .search-background .ii-small {
    position: relative;
    top: 6px;
    left: 7px;
    font-size: 14px;
}

#searchbox input {
    background-color: transparent !important;
    position: absolute;
    top: 1px;
    left: 24px;
    right: 30px;
    width: 82px;
    height: 24px;
    color: white;
    font-size: 12px;
    line-height: 16px;
    padding: 0;
    border: medium none !important;
    outline: none !important;
}

#searchbox a.clearsearch {
    cursor: default;
    position: absolute;
    top: 6px;
    right: 5px;
    color: #aaa;
}

.icon-search {
    background-image: url("/images/search.svg");
    background-size: cover;
    display: block;
    width: 15px;
    height: 15px;
}

.user-info {
    color: white;
    display: block;
    padding: 4px;
    border-radius: 50%;
    webkit-border-radius: 50%;
    position: relative;
    height: 32px;
    width: 32px;
    background: #007bc7;
    margin: 4px;
    text-align: center;
    cursor: pointer;
}

.pulldown {
    padding-left: 5px;
    padding-right: 18px;
    background-image: url(data:image/gif;base64,R0lGODlhEwAMAIABAMXDwgAAACH5BAEAAAEALAAAAAATAAwAAAIUjI+py+0PEZh0wmpjjSfzD4aiUQAAOw==);
    background-position: right center;
    background-repeat: no-repeat;
    cursor: pointer;
}

/*change language*/
.language_pulldown {
    color: #c3b6a5;
    display: block;
    padding: 0.5rem 1rem;
}

.item_pulldown {
    position: relative;
    padding-left: 12px;
}

.lang_icon {
    width: 20px;
    position: absolute;
    top: 3px;
}

.icon_ru {
    content: url(/images/lang/RU_russia.png); 
}

.icon_en {
    content: url(/images/lang/UK_unitedKingdom.png); 
}

.popup_block_new {
    display: none;
    z-index: 200;
    position: absolute;
    box-shadow: 0 0 12px #000000;
}

.popup_block_new.active {
    display: block;
}

.popup_block_new .popup_body {
    
    position: relative;
    background-color: #311b0e;
}

.popup_menu a.popup_menu_item {
    text-decoration: none;
}

.popup_menu a.popup_menu_item {
    display: block;
}

.popup_menu .popup_menu_item {
    margin-left: 20px;
    padding: 5px 12px;
    color: #dcdedf;
    text-transform: none;
    font-family: Motiva Sans, Arial, Helvectica, Verdana, sans-serif;
    font-size: 12px;
    font-weight: normal;
    line-height: normal;
    text-align: left;
    cursor: pointer;
}

.popup_menu_item, .popup_menu_subheader {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/**/




.jumbotron {
    background-color: #ffffff;
    border-radius: 0px;
    box-shadow: 0 2px 4px 0 rgb(0 0 0 / 30%);
}

.container-main-page {
    max-width: 1600px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

/*CONTAINER*/
    #main_container,
    #item_container {
        width: 100%;
        padding-right: 15px;
        padding-left: 15px;
        margin-right: auto;
        margin-left: auto;
    }

    /*head*/
    #main_container .table-header-container,
    #item_container .table-header-container {
        font-size: 12px;
        color: #c3b6a5;
        flex-shrink: 0;
        flex-basis: auto;
        box-sizing: border-box;
        user-select: none;
        cursor: default;
        line-height: 17px;
        height: 17px;
    }

    .table-header-container .col,
    .table-header-container .col-1,
    .table-header-container .col-10,
    .table-header-container .col-11,
    .table-header-container .col-12,
    .table-header-container .col-2,
    .table-header-container .col-3,
    .table-header-container .col-4,
    .table-header-container .col-5,
    .table-header-container .col-6,
    .table-header-container .col-7,
    .table-header-container .col-8,
    .table-header-container .col-9,
    .table-header-container .col-auto,
    .table-header-container .col-lg,
    .table-header-container .col-lg-1,
    .table-header-container .col-lg-10,
    .table-header-container .col-lg-11,
    .table-header-container .col-lg-12,
    .table-header-container .col-lg-2,
    .table-header-container .col-lg-3,
    .table-header-container .col-lg-4,
    .table-header-container .col-lg-5,
    .table-header-container .col-lg-6,
    .table-header-container .col-lg-7,
    .table-header-container .col-lg-8,
    .table-header-container .col-lg-9,
    .table-header-container .col-lg-auto,
    .table-header-container .col-md,
    .table-header-container .col-md-1,
    .table-header-container .col-md-10,
    .table-header-container .col-md-11,
    .table-header-container .col-md-12,
    .table-header-container .col-md-2,
    .table-header-container .col-md-3,
    .table-header-container .col-md-4,
    .table-header-container .col-md-5,
    .table-header-container .col-md-6,
    .table-header-container .col-md-7,
    .table-header-container .col-md-8,
    .table-header-container .col-md-9,
    .table-header-container .col-md-auto,
    .table-header-container .col-sm,
    .table-header-container .col-sm-1,
    .table-header-container .col-sm-10,
    .table-header-container .col-sm-11,
    .table-header-container .col-sm-12,
    .table-header-container .col-sm-2,
    .table-header-container .col-sm-3,
    .table-header-container .col-sm-4,
    .table-header-container .col-sm-5,
    .table-header-container .col-sm-6,
    .table-header-container .col-sm-7,
    .table-header-container .col-sm-8,
    .table-header-container .col-sm-9,
    .table-header-container .col-sm-auto,
    .table-header-container .col-xl,
    .table-header-container .col-xl-1,
    .table-header-container .col-xl-10,
    .table-header-container .col-xl-11,
    .table-header-container .col-xl-12,
    .table-header-container .col-xl-2,
    .table-header-container .col-xl-3,
    .table-header-container .col-xl-4,
    .table-header-container .col-xl-5,
    .table-header-container .col-xl-6,
    .table-header-container .col-xl-7,
    .table-header-container .col-xl-8,
    .table-header-container .col-xl-9,
    .table-header-container .col-xl-auto {
        border-right: 1px solid #c3b6a58c;

    }

    #main_container .table-header-row,
    #item_container .table-header-row {
        border-color: #c3b6a58c;
        border-style: solid;
        border-width: 1px 0;
        background: linear-gradient(#4a2706, #281502);
    }

    #main_container .table-header-column,
    #item_container .table-header-column {
        background: linear-gradient(#4a2706, #281502);
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        background: none;
        position: relative;
        text-align: left;
        padding: 0 4px;
        line-height: 15px;
        height: 15px;
        font-size: 11px;
    }

    /*body table*/
    #main_container .view_list_container,
    #item_container .view_list_container {
        cursor: default;
    }

    #main_container .table-row,
    #item_container .table-row {
        margin-right: -15px;
        margin-left: -15px;
    }

    #main_container .table-row:nth-child(odd) {
        background:#f5e9cc;
    }

    #main_container .cell,
    #item_container .cell {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        vertical-align: middle;
        padding: 0 4px;
        height: 20px;
        line-height: 20px;
        font-size: 11px;
    }
/**/

/*MAIN CONTAINER*/
    #main_container .table-row:nth-child(even) {
        background-image: linear-gradient(to top, 
            rgb(255, 253, 237) 20px,
            rgb(255, 253, 237) 20px,
            rgb(255, 255, 255) 20px,
            rgb(255, 255, 255) 20px
        );
    }

    #main_container .cell {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        vertical-align: middle;
        padding: 0 4px;
        height: 20px;
        line-height: 20px;
        font-size: 11px;
    }
/**/

/*ITEM CONTAINER*/

    #item_container .table-row:nth-child(odd) {
        background:#f5e9cc;
        
    }
    #item_container .table-row:nth-child(even) {
        background-image: linear-gradient(to top, 

        rgb(255, 253, 237) 36px,
        rgb(255, 253, 237) 36px,
        rgb(255, 255, 255) 36px,
        rgb(255, 255, 255) 36px
        
    );}

    #item_container .cell {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        vertical-align: middle;
        padding: 0 4px;
        height: 36px;
        line-height: 36px;
        font-size: 11px;
    }

    #item_container .cell-icon {
        width: 36px;
        height: 36px;
    }
    
/**/

/*CAROUSEL*/
    .main-carousel-item {
        max-width: 400px;
    }
/**/

/*BUTTONS*/
    .view-link, .view-link:hover {
        color: #000 !important;
        text-decoration: none;
        display: inherit;
        cursor: default;
        flex-wrap: inherit;
        width: 100%;
    }

    .view-link:active { 
      background: #3875d7!important;
      color: white !important;
    }

    .swal-button {
        background: linear-gradient(#4d90fe, #4787ed);
        background-color: #4d90fe;
        height: 30px;
        padding: 0;
        margin: 0;
        -webkit-transition: border-color 0.218s;
        -moz-transition: border 0.218s;
        -o-transition: border-color 0.218s;
        transition: border-color 0.218s;
        border: 1px solid #3079ed;
        border-radius: 2px;
        vertical-align: top;
        font-size: 13px;
        font-weight: normal;
        text-align: center;
        min-width: 70px !important;
        text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
        line-height: 25px;
        font-family: 'CHNOPixelCodePro-Regular'; 
    }

    .swal-button:focus {
        outline: inherit;
        box-shadow: none;
    }

    .swal-overlay--show-modal .swal-modal {
        will-change: auto;
    }

    .swal-button:hover {
        background: linear-gradient(#4d90fe, #357ae8);
        background-color: #4d90fe;
        border-color: #2f5db7;
        box-shadow: 0 1px 2px rgb(0 0 0 / 15%);
    }

    .btn {
        display: inline-block;
        vertical-align: top;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        height: 24px;
        line-height: 20px;
        padding: 0px;
        margin: 0 2px;
        text-decoration: none !important;
    }

    .btn_save {
        background: linear-gradient(#4d90fe, #4787ed);
        background-color: #4d90fe;
        height: 30px;
        padding: 0;
        margin: 0;
        -webkit-transition: border-color 0.218s;
        -moz-transition: border 0.218s;
        -o-transition: border-color 0.218s;
        transition: border-color 0.218s;
        border: 1px solid #3079ed;
        border-radius: 2px;
        cursor: default;
    }

    .btn_save:hover {
        background: linear-gradient(#4d90fe, #357ae8);
        background-color: #4d90fe;
        border-color: #2f5db7;
        box-shadow: 0 1px 2px rgb(0 0 0 / 15%);
    }

    .btn_save .btn_label {
        display: inline;
        vertical-align: top;
        height: 21px;
        font-size: 13px;
        font-weight: normal;
        text-align: center;
        white-space: nowrap;
        min-width: 70px !important;
        color: #fff;
        text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
        background: none;
        line-height: 25px;
        padding: 2px 10px;
    }

    .btn_cancel, .btn_delete {
        background: linear-gradient(#f5f5f5, #f1f1f1);
        background-color: #f5f5f5;
        border: 1px solid #d6d6d6;
        text-shadow: -1px -1px 0 rgb(0 0 0 / 30%);
        height: 30px;
        padding: 0;
        margin: 0;
        -webkit-transition: border-color 0.218s;
        -moz-transition: border 0.218s;
        -o-transition: border-color 0.218s;
        transition: border-color 0.218s;
        border-radius: 2px;
        cursor: default;
        margin-right: 3px;

    }

    .btn_cancel:hover, .btn_delete:hover {
        background: linear-gradient(#f0f0f0, #e8e8e8);
        background-color: #f0f0f0;
        border-color: #c8c8c8;
        box-shadow: 0 1px 2px rgb(0 0 0 / 15%);
    }

    .btn_cancel .btn_label, .btn_delete .btn_label {
        display: inline;
        vertical-align: top;
        height: 21px;
        font-size: 13px;
        font-weight: normal;
        text-align: center;
        white-space: nowrap;
        min-width: 70px !important;
        background: none;
        line-height: 25px;
        padding: 2px 10px;
        color: #333;
        text-shadow: none;
    }

    .icons .icon-add, .icons .icon-remove {
        padding: 0 3px 2px 0;
        vertical-align: middle;
        color: #c7c7cc;
    }

    .icons .icon-remove {
        content: url(/images/remove.svg);
        position: relative;
        top: 3px;
    }

    .icons .icon-add {
        content: url(/images/add.svg);
        position: relative;
        top: 3px;
    }

    .icons .icon-remove:hover {
        content: url(/images/remove_red.svg);
        cursor: pointer;
    }

    .icons .icon-add:hover {
        content: url(/images/add_green.svg);
        cursor: pointer;
    }

    .ii {
        font: normal normal 14px itrp-icons;
        font-size: 0.875rem;
        line-height: 1;
        display: inline-block;
        text-decoration: none;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
/**/
/*FORM CONTROL*/
    .detail_content {
        padding-top: 42px;
    }

    .input_form, .view_form {
        background-color: #fff3c9;
        /*background-color: #311b0e;*/
        padding: 10px;
        border-right: 4px solid #311b0e;
        border-bottom: 4px solid #311b0e;
        border-left: 4px solid #311b0e;
        border-top: 4px solid #311b0e;
        /*чтобы кнопка сохранить была на фоне белой плашки*/
        padding-bottom: 30px;
        padding-top: 30px;
    }

    .input_form .error, .input_form .error:hover, .input_form .error:focus {
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        -ms-border-radius: 2px;
        -o-border-radius: 2px;
        border-radius: 2px;
        box-shadow: 0 0 4px rgb(51 136 221 / 50%);
        border-color: #38d !important;
    }
    
    .view_form .readonly:focus {
        background-color: #fff3c9!important;
        box-shadow: 0 0 4px rgb(51 136 221 / 50%);
        border-color: #aab7b8 !important;
    }
    .view_form .label_field {
        white-space: break-spaces;
    }
    .input_form .input_field:focus, .view_form .input_field:focus, .input_form .textarea_field:focus, .view_form .textarea_field:focus{
        background-color: #fff;
        outline: 2px dotted transparent;
        box-shadow: 0 0 4px rgb(51 136 221 / 50%);
        border-color: #38d;
        border-radius: 2px;
    }

   .input_form .readonly:focus, .view_form .readonly:focus {
        background-color: #fff3c9;
        outline: 2px dotted transparent;
        box-shadow: 0 0 4px rgb(51 136 221 / 50%);
        border-color: #aab7b8;
    }

    .input_form .input_field, .view_form .input_field, .input_form .textarea_field, .view_form .textarea_field{
        border: 1px solid #aab7b8;
        border-radius: 3px;
    }

    .input_form input[type="text" i], .view_form input[type="text" i], 
    .input_form input[type="time"],   .view_form input[type="time"],
    .input_form textarea[type="text"],   .view_form textarea[type="text"] {
        padding-left: 4px;
    }

    .input_form input[type="time"]::-webkit-calendar-picker-indicator, .view_form input[type="time"]::-webkit-calendar-picker-indicator { 
        background: none; 
        display:none;
    }

    .input_form .readonly, .view_form .readonly {
        background-color: #fff3c9;
    }

    input:-webkit-autofill,
    input:-webkit-autofill:hover, 
    input:-webkit-autofill:focus,
    textarea:-webkit-autofill,
    textarea:-webkit-autofill:hover,
    textarea:-webkit-autofill:focus,
    select:-webkit-autofill,
    select:-webkit-autofill:hover,
    select:-webkit-autofill:focus {
      -webkit-box-shadow: 0 0 0px 1000px white inset;
      box-shadow: 0 0 0px 1000px white inset;
      transition: background-color 5000s ease-in-out 0s;
    }

    input.required:invalid, select.required:invalid{
        background-color: #e9f6ff;
    }

    .btn_segmented .nav-btn {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .btn_segmented {
        display: flex;
        padding: .5rem;
    }

    .btn_segmented #toolbar_add {
        border-bottom-left-radius: 4px;
        border-top-left-radius: 4px;
        border-bottom-right-radius: 0px;
        border-top-right-radius: 0px;
    }

    #toolbar_save {
        border-radius: 4px;
    }

    .btn_segmented #toolbar_edit, .btn_segmented #toolbar_save {
        border-bottom-left-radius: 0px;
        border-top-left-radius: 0px;
        border-bottom-right-radius: 4px;
        border-top-right-radius: 4px;  
    }

    #toolbar_save {
        background-color: #39e;
        width: 39px;
        text-align: center;
        cursor: pointer;
    }

    #toolbar > .nav-btn {
        display: block;
        padding: .5rem;
    }
   


@media (max-width: 768px) {
    #searchbox {
        display: none;
    }

    .btn_segmented {
        display: none;
    }
}