/*@import "../fonts/fonts.css";*/

:root {
    --top-color: #00a128;
}

@import url('https://fonts.googleapis.com/css?family=Roboto');
* {
    outline: none!important;
}


html,
body {
    height: 100%;
    background-color: #FAFAFA;
}

body {
    /*font-family: ProximaNova;*/
    font-size: 13px;
    color: #333;
    overflow: hidden;
}

h1,
h2,
h3,
h4 {
    margin-top: 15px;
}

h3 {
    font-size: 20px;
}

h4,.h4 {
    font-size: 15px;
}



/* Breacrumb */

.breadcrumb {
    background: none;
    padding: 0;
    margin-bottom: 0;
}

.breadcrumb>li a {
    color: inherit;
}

.breadcrumb li.active {
    font-weight: bold;
    color: #fff;
}


/* Logo */

.logo-name {
    margin-left: -15px;
    margin-bottom: 0px;
    color: #008de7;
    font-size: 180px;
    font-weight: 800;
    letter-spacing: -10px;
    line-height: 140px;
}

.logo-desc {
    margin-top: 30px;
    font-size: 27px;
}

.user-info{
    font-size: 12px;
    line-height: 12px;
    position: relative;
    top:-5px;
}

.user-name{
    margin-left:55px;
    margin-top:7px;
}

.user-owner {
    margin-left:55px;
    font-size: 13px;
    font-weight: bold;
    line-height: 13px;
}

.user-department {
    margin-left:55px;
    font-size: 10px;
    margin-top:2px;
}


/* Page */

#wrapper {
    height: 100%;
    padding-left: 200px;
}

#wrapper.no-padding {
    padding-left: 0px;
}

#page-wrapper {
    width: 100%;
    height: 100%;
    padding-left: 15px;
}

#page-wrapper .page-nav {
    background-color: #f9f9f9;
    color: #222;
}

#page-nav {
    position: fixed;
    left: 0;
    width: 200px;
    height: 100%;
    background-color: #fff;
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.3);
}

.app-name {
    padding: 2px 15px;
    background-color: #ffffff;
    color: #444;
    font-weight: 800;
    font-size: 22px;
    line-height: 27px;
    height: 30px;
}

.app-version {
  font-size: 12px;
  font-weight: normal;
  color: #999;
}

.page-header {
    background-color: var(--top-color);
    border-bottom: 1px solid #e7eaec;
    color: #fff;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0px 22px;
    height: 76px;
}

.page-content {
    animation: fadeIn 0.5s ease-out;
    -webkit-animation: fadeIn 0.5s ease-out;
    overflow-y: scroll;
    height: 100%;
    padding: 0px 5px 15px 15px;
    padding-top: 10px;
    padding-bottom: 0px;
    margin-right: 0px;
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.page-login {
    padding-top: 10%;
    margin: 10px;
}

.page-scroll {
    overflow-y: scroll;
}

.page-footer {
    position: fixed;
    bottom: 0;
    z-index: 999;
    width: 100%;
    background-color: #ffffff;
    border-top: 1px solid #e7eaec;
    padding-top: 0px;
}

.page-footer p {
    margin-left: 15px;
    position:relative;
    top:5px;
}

.pagination {
    margin-left: 15px;
}

.pagination>li>a,
.pagination>li>span {
    color: #008de7;
}

.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
    background-color: #008de7;
    border-color: #008de7;
}

.pagination-per-page {
    padding-left: 20px;
    line-height: 31px;
}

.pagination-per-page-dropdown {
    background-image: none;
    border: 1px solid #e5e6e7;
    border-radius: 2px;
    color: inherit;
    padding: 6px 3px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    font-size: 12px;
    margin-left: 20px;
    box-shadow: none!important;
    line-height: 31px;
}

.panel {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    padding: 0;
    padding-top: 0px;
    border: solid 1px #e7eaec;
    border-radius: 2px;
    box-shadow: none;
    overflow: hidden;
}

.panel.br {
    border: solid 3px #e7eaec;
    box-shadow: none;
}

.panel h4,
.panel-title {
    padding: 0px 15px;
    margin-top: 0;
    margin-bottom: 0;
    border-bottom: solid 1px #ddd;
    line-height: 40px;
}

.panel h4.in i {
    transform: rotate(90deg);
    transition: all 0.2s ease-out;
}

.panel>h4 .btn,
.panel-title .btn {
    margin: 6px 0 0 0;
    line-height:1;
}


.panel>h4 .buttons{
    margin-right:-10px;
    float:right;
    position: relative;
    top:0px;
    padding:0px;
}

.panel>h4 .buttons .btn{
    padding:0px;
    margin:0px;
}

.top-buttons .btn{ margin:4px 0px 3px 4px!important; }
.top-buttons .btn-search {margin-right:4px!important;}
.top-buttons .btn-search .glyphicon{font-size: 1em; font-weight: bold; top:3px; position: relative;}

.panel>h4 .btn-lock{position:relative;;top:-2px;}
.nav-steps .step .btn-lock{color:black;}

.panel>h5,
.panel>h6 {
    padding: 10px 15px;
}

.panel-title-extras {
    float: right;
    margin-top: -60px;
}

.panel-title-extras>div {
    display: inline-block;
    margin-right: 15px;
}

.panel .form-horizontal {
    padding-top: 0px;
    padding-bottom: 0px;
}

.panel .form-horizontal h4 {
    margin-bottom: 15px;
}

.panel-footer {
    background: #fff;
    padding: 0px;
    padding-left:1rem;
}

#generator {
    height: 100%;
    margin-bottom: 0;
}

#generator.preview {
    border: none;
    width: 100%;
    height: 100%;
}


table tr td>label{
    font-size:13px;
    line-height:14px;
    cursor:pointer;
    color:#222;
}

table tr td .chbx-label{
    position:relative;
    top:+2px;
}

/* Sidebar */

.sidebar {
    transition: all 0.2s ease-out;
}

.sidebar h4 {
    margin-top: 0px;
    padding: 10px 0;
    line-height: 20px;
}

.sidebar.col-sm-1 h4 {
    border: none;
}

.sidebar .btn-sidebar {
    margin-top: -3px;
    transition: all 0.2s ease-out;
}

.sidebar .btn-sidebar.left {
    border-bottom: none;
}

.aside {
    transition: all 0.2s ease-out;
}


/* Footar */

.footer {
    height: 60px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}


.jumbotron h1 {
    margin-top: 0;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

.not-set {
    color: #c55;
    font-style: italic;
}


/*----------------------------------------------------------------------------*/


/* Html elements
/*----------------------------------------------------------------------------*/


/* Global */

a {
    color: #676a6c;
}

a:hover,a:focus {
    color: #333;
    text-decoration: none;
}


/* add sorting icons to gridview sort links */

a.asc:after,
a.desc:after {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    padding-left: 5px;
}

a.asc:after {
    content: /*"\e113"*/
    "\e151";
}

a.desc:after {
    content: /*"\e114"*/
    "\e152";
}

.sort-numerical a.asc:after {
    content: "\e153";
}

.sort-numerical a.desc:after {
    content: "\e154";
}

.sort-ordinal a.asc:after {
    content: "\e155";
}

.sort-ordinal a.desc:after {
    content: "\e156";
}

.sort-items{
    list-style-type: none;
}

.sort-items li {
    padding:2px 5px 2px 6px;
}

.sort-items li .glyphicon {
    margin-right: 6px;
    font-size:0.8em;
}
.sort-items li .fa {
    vertical-align: middle;
}



.sort-items li:hover{
    background-color: #ddd;
}

.sort-items li>ul>li:hover{
    background-color: #aaa;
}

.alignright {
    text-align: right;
}

.alignleft {
    text-align: left;
}

.aligncenter {
    text-align: center;
}

bold,
strong {
    font-weight: bold;
}

*[disabled],
.disabled {
    background-color: #eee!important;
    cursor: not-allowed!important;
    box-shadow: none!important;
    border-color: #e5e6e7!important;
    transition: 0.2s ease-out!important;
    
    /*display: none;*/
}

.disabled a,
.disabled label,
.disabled input,
.disabled select,
.disabled textarea {
    cursor: not-allowed!important;
}



.left {
    float: left!important;
}

.right {
    float: right!important;
}

.clear {
    display: block;
    clear: both;
    float: none;
}

hr {
    clear: both;
    border-style: dashed;
    margin-top: 0px;
    margin-bottom: 0px;
}

.no-margin {
    margin: 0!important;
}

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


/* Alerts */

.alert {
    padding: 10px 15px;
    margin-bottom: 10px;
    border-radius: 2px;
}

.alert-danger pre {
    margin: 15px 0 0 0;
    border-color: #ebccd1;
    background-color: #fff2f2;
}

.alert-danger {
    background-color: rgba(237, 85, 101, 1);
    border-color: rgba(237, 85, 101, 1);
    color: #fff;
}

.alert .close {
    color: #fff;
    opacity: 0.8;
}

.alert.alert-warning {
    background-color: #FF9800;
}





/* Buttons */


/*.btn {
    border: none;
    background: #95a5a6;
    border-radius: 2px;
    box-shadow: none;
    transition: all 0.2s ease-out;
    color: #ffffff;
    font-size: 12px;
}

.btn:hover {
    background: #7f8c8d;
    transition: all 0.2s ease-out;
}

.btn:active,
.btn:focus {
    color: #fff;
}*/

.label{
    border-radius: 2em;
}


.btn {
    padding: 4px 9px 5px 9px!important;
    background-color: #f8f8f8;
    border-radius:2em;
}

.btn-sm {
    padding: 4px 7px 6px 7px!important;
    border-radius: 2em;
    line-height:1;
}

.btn-border {
    border:1px solid #e1e1e1;
}

.btn-border:hover,.btn-border:focus{
    border:1px solid #ddd!important;
}
.btn-border:active {
    border:1px solid #ccc!important;
}



.btn-link {
    margin: 0;
    padding: 0!important;
}

.btn-group .btn,
table .btn {
    margin-left: 1px!important;
}

.btn-group {
    margin-top: 0px;
    margin-bottom: 5px;
}

.btn-lg {
    border-radius: 3px;
}

.btn[disabled],
.btn.disabled {
    cursor: not-allowed!important;
    color: #555!important;
    border: none;
    pointer-events: none!important;
    padding:5px 12px 5px 12px!important;
}

.btn:not(.btn-raised).btn-primary,
.input-group-btn .btn:not(.btn-raised).btn-primary {
    color: #008de7;
}

.btn-slim {
    margin: 0;
    padding: 4px 6px 2px 6px!important;
}

.btn-mini{
    font-size:0.95em;
    margin: 0;
    padding: 0px 4px 0px 4px!important;
    position:relative;
    top:-1px;
}

/*.btn-success {
    background-color: #1ab394;
}

.btn-success:active,
.btn-success:focus,
.btn-success:hover,
.open .dropdown-toggle.btn-success {
    background-color: #18a689!important;
    color: #ffffff;
}

.btn-danger {
    background-color: #ed5565;
}

.btn-danger:hover {
    background-color: #ec4758;
}

.btn-info {
    background-color: #34495E;
}

.btn-info:hover {
    background-color: #2C3E50;
}

.btn-primary {
    background-color: #3498db;
}

.btn-primary:hover {
    background-color: #3498db;
}

.btn-warning {
    background-color: #f37f00;
}

.btn-warning:hover {
    background-color: #f7a54a;
}

.btn-warning a {
    color: #fff!important;
}
*/

[class*=bg-],
[class*=bg-]:active,
[class*=bg-]:focus,
[class*=bg-]:hover {
    color: #fff!important;
}

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

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

.bg-blue {
    background-color: #03A9F4!important;
}

.bg-blue:hover {
    background-color: #039BE5!important;
}

.bg-blue-light {
    background-color: #87daff!important;
}

.bg-blue-light:hover {
    background-color: #89d8fb!important;
}


.bg-blue-dark {
    background-color: #3F51B5!important;
}

.bg-blue-dark:hover {
    background-color: #3949AB!important;
}

.bg-braun {
    background-color: #795548!important;
}

.bg-braun:hover {
    background-color: #6D4C41!important;
}

.bg-gray {
    background-color: #bbb!important;
}

.bg-gray:hover {
    background-color: #999!important;
}

.bg-gray-light {
    background-color: #ececec!important;
}

.bg-gray-light:hover {
    background-color: #ddd!important;
}


.bg-gray-dark {
    background-color: #999!important;
}

.bg-gray-dark:hover {
    background-color: #888!important;
}


.bg-green {
    background-color: #4caf50!important;
}

.bg-green:hover {
    background-color: #388E3C!important;
}

.bg-green-light {
    background-color: #8BC34A!important;
}

.bg-green-light:hover {
    background-color: #7CB342!important;
}

.bg-orange {
    background-color: #FF9800!important;
}

.bg-orange:hover {
    background-color: #FB8C00!important;
}

.bg-pink {
    background-color: #E91E63!important;
}

.bg-pink:hover {
    background-color: #D81B60!important;
}

.bg-red {
    background-color: #F44336!important;
}

.bg-red:hover {
    background-color: #E53935!important;
}

.bg-violet {
    background-color: #673AB7!important;
}

.bg-violet:hover {
    background-color: #5E35B1!important;
}

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

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

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

.bg-yellow-light:hover {
    background-color: #FDD835!important;
}


.color-white{
    color: #FFF!important;
}
.color-blue {
    color: #03A9F4!important;
}

.color-blue:hover {
    color: #039BE5!important;
}

.color-blue-dark {
    color: #3F51B5!important;
}

.color-blue-dark:hover {
    color: #3949AB!important;
}

.color-braun {
    color: #795548!important;
}

.color-braun:hover {
    color: #6D4C41!important;
}

.color-gray {
    color: #777!important;
}

.color-gray:hover {
    color: #444!important;
}

.color-gray-light {
    color: #dddddd!important;
}

.color-gray-light:hover {
    color: #f1f1f1!important;
}


.color-green {
    color: #388E3C!important;
}

.color-green:hover {
    color: #018e00!important;
}

.color-green-light {
    color: #8BC34A!important;
}

.color-green-light:hover {
    color: #7CB342!important;
}

.color-orange {
    color: #f37f00!important;
}

.color-orange:hover {
    color: #dc7300!important;
}

.color-pink {
    color: #E91E63!important;
}

.color-pink:hover {
    color: #D81B60!important;
}

.color-red {
    color: #F44336!important;
}

.color-red:hover {
    color: #E53935!important;
}

.color-purple {
    color: #9C27B0!important;
}

.color-purple:hover {
    color: #8E24AA!important;
}

.color-purple-dark {
    color: #673AB7!important;
}

.color-purple-dark:hover {
    color: #5E35B1!important;
}

.color-yellow {
    color: #FFC107!important;
}

.color-yellow:hover {
    color: #FFB300!important;
}

.color-yellow-light {
    color: #FFEB3B!important;
}

.color-yellow-light:hover {
    color: #FDD835!important;
}

.color-black {
    color: #000000!important;
}

.color-black:hover {
    color: #000000!important;
}


.close {
    /*color: #fff;*/
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}

code {
    padding: 0;
}


/* Detail view */

.detail-view>thead>tr>th,
.detail-view>tbody>tr>th,
.detail-view>tfoot>tr>th,
.detail-view>thead>tr>td,
.detail-view>tbody>tr>td,
.detail-view>tfoot>tr>td {
    padding: 10px 15px;
}

.glyphicon {
    top: 2px;
}
.glyphicon-check{top:1px}

/* Data grid*/


.grid-view th {
    white-space: nowrap;
}

.grid-view h4 {border:none;}
.grid-view h4 a{margin:5px 0px 0px 0px;}
.summary {
    padding: 14px 15px;
    border-bottom: solid 1px #ddd;
}


/* List view */
.item-gallery {
    position: relative;
    margin-bottom: 10px;
}

.item-gallery .row {
    position: relative;
}


/*.item-gallery .col-lg-2:nth-child(6n+1) {
    clear: both;
}*/



.file-gallery, .modal-scroll-content {
    max-height: 600px;
    min-height: 100px;
    overflow: auto;
}
.modal-scroll-content {padding:0px 10px 0px 10px;}
.modal-scroll-content .table {margin-bottom:0px;}
.modal-scroll-content .table-bordered > thead > tr > th, 
.modal-scroll-content .table-bordered > tbody > tr > th, 
.modal-scroll-content .table-bordered > tfoot > tr > th,
.modal-scroll-content .table-bordered > tbody > tr > td{border:none; border-top:1px solid #cdcdcd;}

.img-thumbnail {
    border-radius: 2px;
}

.item-gallery .attribute {
    padding-bottom: 0px;
    padding-top:10px;
    border-radius:3px;
    transition: background-color 0.5s ease;
}

.item-gallery .attribute:hover {
    background-color:#f7f7f7;
}

.item-gallery .attribute.search-highlight{
    background-color: #0ab3ff;
    animation: blink-highlight 1s infinite;
}

@keyframes blink-highlight {
    0% {
      background-color: transparent; 
    }
    50% {
      background-color: #0ab3ff;
    }
    100% {
      background-color: transparent; 
    }
  }

.item-gallery .item,
.file-gallery .item {
    position: relative;
    margin-bottom: 8px;
}
.item-gallery .item {
    cursor: move;
}

.item-gallery .item-title {
    display: block;
    margin-bottom: 10px;
    height: 20px;
    line-height: 1em;

}

.item-gallery .item-price-group-info{
    font-size:0.8rem;
}

.item-gallery .item img,
.file-gallery .item img {
    width: 100%;
    height: auto;
}

.file-gallery .file .title{font-size: 11px; word-break: break-all; position:relative;}
.file-gallery .file .title .used{ position: absolute; top:-22px; text-align:center;width:100%;}
.file-gallery .file .title .used .ico{font-size:9px;padding:2px; border:1px solid #ddd; background:#fff;}

.item-gallery .item-group.checkbox {
    padding: 0;
}

.item-group.checkbox {
    margin: 0;
}

.item-group.checkbox .checkbox-material {
    top: 0;
}

.item-group.checkbox .checkbox-material .check {
    height: 22px;
    width: 22px;
    border: 2px solid #795548;
}

.item-group.checkbox input[type=checkbox]:checked+.checkbox-material .check::before {
    color: #795548;
}

.item-group.checkbox input[type=checkbox]:checked+.checkbox-material .check {
    background-color: white;
    border-width: 3px;
    border-color: #795548;
}

.item-gallery .item-group {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    padding: 2px 6px;
    border-radius: 2px;
}

.item-gallery .item-group input {
    cursor: pointer;
}

.item-gallery .item-group.checked {
    opacity: 1;
}

.item-gallery .item:hover .item-group {
    opacity: 1;
}

.item-gallery .item-actions,
.file-gallery .item-actions {
    opacity: 0;
    transition: all 0.2s ease-out;
}

.item-gallery .item-actions .btn,
.file-gallery .item-actions .btn {
    margin: 0;
}

.item-gallery .item:hover .item-actions,
.file-gallery .item:hover .item-actions {
    opacity: 1;
    transition: all 0.2s ease-out;
}

.item-gallery [class^="item-"].btn {
    padding: 4px 7px!important;
}

.item-gallery .item-duplicate,
.file-gallery .item-duplicate {
    position: absolute;
    left: 0;
    bottom: 0;
}

.item-gallery .item-edit,
.file-gallery .item-edit {
    position: absolute;
    right: 0;
    bottom: 0;
}

.item-gallery .item-delete,
.file-gallery .item-delete {
    position: absolute;
    top: 0;
    right: 0;
}

.item-gallery .item-order {
    width: 100%;
    text-align: center;
    position:absolute; 
    top:-8px;
   
}

.item-gallery .item-order span {
    background: #fff;
    color: black;
    font-size: 9px;
    line-height: 1em;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 1px 2px 0px 2px;
    border: 1px solid #ddd;
    text-align: center;
}


.item-gallery .item-ico-eval{
    position: relative;
    top: -19px;
    text-align:center;
    width:100%;
     height: 0px;
}


.file-gallery-search input {
    text-align: center;
}

.file-gallery-search-empty {
    text-align: center;
    color: #444;
    display: none
}

.file-gallery {
    display: flex;
    flex-wrap: wrap;
}

.file-gallery .item {
    height: 100px;
    width: 100px;
}

.file-gallery .file {
    /*  flex: 1 0 10%; */
    width: 100px!important;
    overflow:hidden!important;
    margin:5px;
   /* max-width: 10%;*/
}

.item-info {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    text-align: center;
    padding: 5px;
}

.item-info.disable {
    background: rgba(0, 0, 0, 0.1);
}

.item-warning {
    color: red;
}

.item-warning img {
    border: 1px red solid;
    color: red;
}

.item-name-warning {
    padding: 3px;
    background: red;
    color: white;
    font-size: 10px;
    line-height: 9px;
    padding: 5px 3px 5px 3px;
    margin: 43% auto 7px auto;
    position: absolute;
    top: 0px;
    text-align: center;
}

.item-name-disabled {
    color: #fff;
    padding: 3px;
    background:#aaa;
    font-size: 10px;
    line-height: 9px;
    padding: 5px 3px 5px 3px;
    margin: 43% auto 7px auto;
    position: absolute;
    top: 0px;
    text-align: center;
    width:100%;
}


/* Legend */

.legend {
    padding-top: 7px;
}

.legend .bull {
    display: inline-block;
    width: 15px;
    height: 15px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: -2px;
}


/* Menu */


.nav-header {
    padding: 14px 15px;
    background-color: var(--top-color);
    border-bottom: solid 1px rgba(0, 0, 0, 0.1);
    color: #fff;
    margin-bottom: 12px;
}

.nav-header .avatar {
    float: left;
    width: 27%;
}

.nav-header .avatar img {
    width: 100%;
    height: auto;
}

.nav-header .info {
    float: left;
    margin-top: 5px;
    margin-left: 15px;
}

.nav-header .text-light {
    font-size:80%;
}

.nav-header .text-muted {
    color: #8095a8;
}

.navbar-nav.side-nav {
    border: none;
    border-radius: 0;
    overflow-y: auto;
    float:none;
}

.navbar-nav.side-nav>li {
    width: 100%;
}
.navbar-nav.side-nav>li:hover{
    background: #f1f1f1;
    transition: all 0.2s ease-out;
    color:#222;
}
.navbar-nav.side-nav>li a {
    position: relative;
    display: block;
    padding: 10px 15px;
    color: #333;
    padding:6px 10px 5px 10px;
    border-bottom:1px solid #fefefe;
}

.navbar-default .navbar-nav>.active{
    border-right:4px solid #008de7;
}


.navbar-default .navbar-nav>.active>a {
    background: #F5F5F5;
    color: #008de7;
    border-bottom:1px solid #eee;
}

.navbar-nav.side-nav>li a i {
    margin-right: 10px;
    width:20px;
    text-align:center;
}

.navbar-nav.side-nav>li:hover>a,
.navbar-nav.side-nav>li>a:focus {
    color: #008de7;
    text-decoration: none;
    transition: all 0.2s ease-out;
}

.navbar-nav.side-nav>li ul {
    margin: 0;
    padding-left:0px;
    list-style: none;
    border-left: 4px solid #37474F;
    background: #fafafa;
}
.navbar-nav.side-nav>li ul>li>a{
    padding-left:20px;
}
.navbar-nav.side-nav>li ul>li:hover a {
    color: #008de7;
    text-decoration: none;
    background: #F5F5F5;
}



.navbar-minimalize,
.navbar-minimalize:active,
.navbar-minimalize:hover {
    padding: 4px 12px;
    margin: 12px 5px 11px 10px;
    font-size: 14px;
    float: left;
    background: #2d3945!important;
    color: #fff;
}

.navbar-form-custom {
    float: left;
    height: 50px;
    padding: 0;
    width: 200px;
    display: inline-table;
}

.navbar-form-custom .form-group {
    margin-bottom: 0;
}

.navbar-form-custom .form-control {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: medium none;
    font-size: 14px;
    height: 60px;
    margin: 0;
    z-index: 2000;
    box-shadow: none;
}

.nav.navbar-right {
    margin-right: 15px;
}

.nav.navbar-right>li>a:hover {
    background: transparent;
}

.navbar-top-links li {
    display: inline-block;
}

.nav.navbar-top-links a {
    color: #333;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 12px;
    line-height: 25px;
    height:30px;
}

.navbar-top-links li a {
    padding: 3px 10px;
    min-height: 10px;
}

.navbar-top-links li a:hover{
    background-color: #008de7;
}


/* Nav steps */

.nav-steps {
    width: 100%;
    padding: 0;
    margin-bottom: 8px;
}

.nav-steps>li {
    display: inline-block;
    position: relative;
    height: 40px;
    line-height: 40px;
    margin-right: -3.5px;
}

.nav-steps>li .step:after,
.nav-steps>li .step:before {
    position: absolute;
    top: 50%;
    left: 100%;
    z-index: 2;
    height: 0;
    width: 0;
    border: solid transparent;
    content: "";
    pointer-events: none;
}

.nav-steps>li .step:after {
    margin-top: -19px;
    border-width: 19px 9px;
    border-color: transparent;
    border-left-color: #fff;
}

.nav-steps>li .step:before {
    margin-top: -20px;
    border-width: 20px 10px;
    border-color: transparent;
    border-left-color: #d6dada;
}

.nav-steps>li:last-child .step:after,
.nav-steps>li:last-child .step:before {
    display: none;
}

.nav-steps>li .step {
    display: inline-block;
    position: relative;
    z-index: 1;
    height: 100%;
    padding: 0;
    padding-left: 20px;
    padding-right: 10px;
    background: #fff;
    border: 1px solid #e7eaec;
    border-right: none;
    color: #5d6b6c;
    font-size: 14px;
    text-transform: uppercase;
    transition: border 0.2s ease-out;
}

.nav-steps>li .step:active,
.nav-steps>li .step:focus {
    text-decoration: none;
}

.nav-steps>li:first-child .step {
    padding-left: 10px;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}

.nav-steps>li:last-child .step {
    padding-right: 15px;
    border-right: 1px solid #e7eaec;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}

.nav-steps>li .step div {
    width: inherit;
    height: inherit;
    overflow: hidden;
}

.nav-steps>li .step-label {
    position: relative;
    margin-left: 5px;
}

.nav-steps>li .step .step-num {
    display: inline-block;
    position: relative;
    top: 0px;
    width: 20px;
    height: 21px;
    line-height: 21px;
    margin-left: 0px;
    text-align: center;
    /*border: solid 1px #f37f00;*/
    border-radius: 15px;
    /*background-color: #f37f00;*/
    color: #fff;
    font-weight: bold;
    font-size:14px;
}

.nav-steps>li.active {
    margin-left: 0;
}

.nav-steps>li.active .step:after {
    border-left-color: #f37f00;
}

.nav-steps>li.active .step:before {
    border-left-color: #f37f00;
}

.nav-steps>li.active .step {
    border-color: #f37f00;
    background: #f37f00;
    color: #fff;
}

.nav-steps>li.active .step-num {
    border-color: #fff;
    color: #f37f00;
    background: #fff;
}

.nav-steps>li:first-child .step-num {
    text-indent: -1px;
}

.nav-steps>li.active:after,
.nav-steps>li.active:before {
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 2;
    height: 0;
    width: 0;
    border: solid transparent;
    content: "";
    pointer-events: none;
}

.nav-steps>li.active:before {
    left: 1px;
    margin-top: -25px;
    border-width: 25px 15px;
    border-color: transparent;
    border-left-color: transparent;
}

.nav-steps>li:first-child:after,
.nav-steps>li:first-child:before {
    display: none;
}


/* Tabs */

.tab-steps {
    position: relative;
}

.tabs h4 {
    margin-bottom: 0px;
}



.tab-steps {
    border-bottom: solid 1px #ddd;
    border-top: solid 1px #ddd;
    padding-left:10px;
}


.nav-tabs {
    background: none;
    /*border: none;*/
}

.nav-tabs.tab-groups {
    clear: both;
    position: relative;
    border-bottom: solid 1px #f3f3f3;
    /*margin-bottom: 5px;*/
}



.nav-tabs.tab-groups li:first-child span {
    font-weight: bold;
}

.nav-tabs>li {
    display: block;
    position: relative;
    padding-left: 0;
    border-bottom: solid 2px transparent;
    margin-bottom:0px;
    white-space: nowrap;
    color: #555!important;
}

.nav-tabs>li>a,
.nav-tabs>li>a:active,
.nav-tabs>li>a:focus,
.nav-tabs>li>a:hover {
    display: block;
    float: left;
    background: none!important;
    border-radius: 2px;
    color: #555!important;
    cursor: pointer;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:active, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    color:#000!important;
}


.nav-tabs.tab-steps>li {
    margin-left: 1px;
}

.nav-tabs.tab-groups>li>a {
    padding: 7px 18px 7px 5px;
}

.nav-tabs.tab-steps>li>a {
    padding: 5px 18px 4px 5px;
}

.nav-tabs>li:hover {
    background-color: #f6f6f6;
    border-bottom:2px solid #d8d8d8;
}

.nav-tabs>li.active {
    border-bottom: solid 2px #008de7;
    background-color:#f1f1f1;
    color:#111;
    a{
        color:black;
    }
}


.nav-tabs>li .dropdown {
    position: absolute;
    top: 2px;
    right: 5px;
    text-align: right;
}

.nav-tabs>li .dropdown .dropdown-btn {
    background: none;
    cursor: pointer;
    line-height: 24px;
}

.nav-tabs>li .dropdown .dropdown-menu {
    margin-top: 10px;
    margin-right: -4px;
    border: solid 1px #ddd;
    border-radius: 0px;
    box-shadow: none;
    min-width: 100px;
}

.nav-tabs>li .dropdown .dropdown-menu .caret {
    margin: 0;
}

.nav-tabs>li .dropdown .dropdown-menu li a {
    padding: 3px 10px;
    font-size: 12px;
    text-align: right;
}

.nav-tabs>li .dropdown .dropdown-menu li a:hover {
    color: #008de7;
}


.nav-tabs>li .btn:hover{
    background-color: rgba(153,153,153,.2)!important;
}

.nav-groups>li a{
   padding-left:7px;
}

.nav-groups>li a .ico{
    margin:0px 3px 0px 3px;
}
.nav-groups>li .dropdown{
    margin-top:2px;
}



.nav-tabs>li.step-hidden > a >span{
    color:#ff7171;
}

.nav-stacked {
    padding-right: 0px;
    margin-right: -1px;
    border-right: 1px solid #ddd;
    z-index: 1;
}

.nav-stacked>li {
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    background-color: #f9f9f9;
}

.nav-stacked>li.active {
    border: none;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.nav-stacked>li:first-child {
    border-top: none;
}

.nav-stacked>li a {
    padding: 14px 15px;
}

.nav-stacked>li.active a {
    background-color: #66BB6A!important;
    margin-right: -1px;
	border-radius: 0px;
}

.nav-stacked>li+li {
    margin-top: 0px;
}

.nav-stacked-content {
    padding-right: 0px;
    z-index: 0;
    border-left: 1px solid #ddd;
    background-color: #fff;
}

.nav-stacked-content table tr:first-child td {
    border: none;
}

.nav-stacked-content table td .form-group {
    margin-bottom: 0;
}

.nav-pills{border-right:1px solid #66BB6A;}


nav{border-bottom:1px solid #ccc;}
nav>.navbar-nav{ 
    color:#333; border:none;
}

nav>.navbar-nav>li,nav>.navbar-nav>li>a { 
    color:#333!important; 
}

nav>.navbar-nav>li>a { 
    margin:0px!important;
    top:1px;
    
}

nav>.navbar-nav.navbar-right li{
    float: right;
}
nav>.navbar-nav>li>a.btn-thin{
    top:2px;
    right:-10px;
}

nav>.navbar-nav>li.active {
    border-bottom: solid 2px #008de7;
    background-color:#f7f7f7
}





/*Forms elements*/

::-webkit-input-placeholder {
    font-size: 13px!important;
}

:-moz-placeholder {
    font-size: 13px!important;
}

::-moz-placeholder {
    font-size: 13px!important;
}

:-ms-input-placeholder {
    font-size: 13px!important;
}

.form-horizontal {
    margin-top: 15px;
}

.form-control {
    font-size: 13px!important;
    padding: 0 0 0 5px!important;
    margin: 0;
}

.form-group.is-focused select.form-control[multiple], select.form-control[multiple]{
  height: auto!important;
}



.form-group {
    margin: 0;
    margin-bottom: 15px;
    padding: 0;
}

/* .form-group:last-child .btn:first-child {  margin-left: -10px;} */

.form-group .form-control {
    margin-top: 0px;
    margin-bottom: 0px;
}
.form-control:focus {
    box-shadow: none;
    color: #000;
}

.form-group label,
.form-group .checkbox>label {
    color: #333;
    font-style: normal;
    font-size: 13px;
    padding:0px;
}



.form-group.is-focused>.checkbox>label {
    color: #000!important;
}

.checkbox input[type=checkbox]:checked+.checkbox-material .check, *
.checkbox-inline input[type=checkbox]:checked+.checkbox-material .check,
label.checkbox-inline input[type=checkbox]:checked+.checkbox-material .check{
    color: #008de7;
    border-color: #008de7;
}

.checkbox input[type=checkbox]:checked+.checkbox-material .check:before,
.checkbox-inline input[type=checkbox]:checked+.checkbox-material .check:before,
label.checkbox-inline input[type=checkbox]:checked+.checkbox-material .check:before {
    color: #008de7;
}

.checkbox-active input[type=checkbox]:checked+.checkbox-material .check,
.checkbox-inline input[type=checkbox]:checked+.checkbox-material .check {
    color: #fff;
    border-color: #fff;
    background-color:#fff;
}

.checkbox-active input[type=checkbox]:checked+.checkbox-material .check:before,
.checkbox-inline input[type=checkbox]:checked+.checkbox-material .check:before {
    color: #fff;
}

.checkbox .checkbox-material, .checkbox-inline .checkbox-material { top:4px;}

.checkbox-label { text-transform: uppercase; color:#222; font-style: normal;  margin-left:5px;}
.checkbox .checkbox-material .check, .checkbox-inline .checkbox-material .check {border-radius: 0px}

.checkbox>label{
    font-family: Roboto, Helvetica, Arial, sans-serif;
    font-size:13px;
    font-style: normal!important;
    color:#222;
    line-height: 2.2em;
}



.radio input[type=radio]:checked~.check, label.radio-inline input[type=radio]:checked~.check{
    color: #008de7;
    border-color: #008de7;
    background-color: #008de7;
}

.radio label{ padding-left:22px;}
.radio span{ left:0;}

.radio .check, label.radio-inline .check{ background-color: #008de7;}
label.radio-inline {padding-left:20px; margin-top:4px!important;}
label.radio-inline span{position:absolute; top:6px; left:0px;}
label.radio-inline .circle, label.radio-inline .check {margin:1px;}

.form-horizontal .radio{  padding:0px; margin-bottom:3px; border:1px solid #fff;} 
.form-horizontal .radio:hover{border:1px solid #ddd; background:#f9f9f9;}
.form-horizontal .radio label{  text-align: left; padding:6px 5px 5px 25px; width:100%;}
.form-horizontal .radio label .circle{ margin:4px;}
.form-horizontal .radio label .check{ margin:4px;}
.form-group .checkbox label, .form-group .radio label, .form-group label {
    font-size: 12px;
    color: #555;
    font-weight: 400;
    line-height: 1.2em;
}

.form-group .checkbox label{
    line-height: 2.2em;
}

.form-horizontal .checkbox, .form-horizontal .radio{
    padding-top:4px;
    
}

.form-group.is-focused .radio label, .form-group.is-focused label.radio-inline{
	color:#111!important;
}

.checkbox .checkbox-material:before, label.checkbox-inline .checkbox-material:before{
    top:-8px;
}




input[type=radio]{
    color: #008de7;
    border-color: #008de7;
}


.form-group label.control-label,
.form-group.is-focused label.control-label {
    color: #008de7;
    margin-top: 5px;
}

.form-group.is-focused .checkbox label,.form-group.is-focused .checkbox-inline label{
    color:#333!important;
}

.form-group select {
    text-transform: capitalize;
}

.form-group textarea.form-control {
    margin-top: 8px;
    /*height: 30px;*/
}

.form-group.is-focused .form-control,
.form-group.has-success.is-focused .form-control {
    /*background-size: 100% 0px,100% 1px;*/
    /*background-image: linear-gradient(#D2D2D2, #D2D2D2), linear-gradient(#D2D2D2, #D2D2D2);*/
    background-image: linear-gradient(#008de7, #008de7), linear-gradient(#D2D2D2, #D2D2D2);
}
.form-group.is-focused > .form-control,
.form-group.has-success.is-focused > .form-control {
    /*background-size: 100% 2px,100% 1px;*/
    background-image: linear-gradient(#008de7, #008de7), linear-gradient(#D2D2D2, #D2D2D2);
}


.form-group.has-error .form-control {
    /*background-size: 100% 2px,100% 1px;*/
    background-image: linear-gradient(#f44336, #f44336), linear-gradient(#f44336, #f44336);
}


.form-group.has-error label.control-label {
    color: #f44336;
}

.help-block,
.form-group .help-block,
.form-group.is-focused .help-block {
    display: none;
    font-size: 11px;
    margin: 0;
}

.form-group.has-error .help-block {
    display: block;
}
.input-group .btn {
    margin: 0;
}

.input-group .input-group-btn {
    padding: 0;
}


/*.form-control,
.single-line {
    background-image: none;
    border: 1px solid #e5e6e7;
    border-radius: 2px;
    color: inherit;
    display: block;
    padding: 0 8px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
    font-size: 12px;
    box-shadow: none!important;
}*/

.checkbox-group {
    padding-top: 7px;
}

.checkbox-group>label {
    padding: 0;
    margin: 0;
    cursor: pointer;
}

.checkbox-group .check-all {
    cursor: pointer;
}

.checkbox-group i.check-all,
.checkbox-group i.check-col,
.checkbox-group i.check-row {
    color: #5cb85c;
    cursor: pointer;
}

.checkbox-group .uncheck-all {
    color: #d9534f;
    cursor: pointer;
}

.checkbox>label {
    font-style: italic;
}

input[type="radio"] {
    margin-top: 2px;
}


/* Custom forms elements */

#container-attribute-item-form {
    height: 0px;
    overflow: hidden;
}

#container-attribute-item-form.open {
    height: auto;
}

#container-attribute-item-list {
    overflow: hidden;
    
}

#container-attribute-item-list .item-gallery {
    min-height: 158px;
}

#login-form input {
    text-align: center;
}


/* Editable */

.editable {
    display: inline-block;
    position: relative;
    top: -3px;
    /*min-width: 130px;*/
    margin-top: 6px;
}

.editable label {
    display: inline-block;
}

.editable .label-xs {
    font-weight: normal;
    font-size: 11px;
}

.editable .label-xs i {
    font-size: 10px;
}

.editable .value {
    cursor: pointer;
}

.editable .form-group {
    position: relative;
    margin: 0;
}

.editable .input-group {
    float: left;
    margin-top: 0px;
    margin-right: 3px;
    margin-left: 0px;
    /*width: 130px;*/
}

.input-xs {
    max-width: 60px;
    height: 19px;
    padding: 5px 5px;
    font-size: 12px;
    line-height: 19px;
    border-radius: 3px;
    border: 1px solid #ddd;
}

.attribute-item-relationship-create .input-group-addon,
.price-table-index .input-group-addon,
.step-update .input-group-addon,
.step-relationship-create .input-group-addon {
    width: auto;
    top: 0px;
    right: 0px;
}

.input-group-addon-xs {
    padding: 3px 15px;
    font-size: 12px;
    font-weight: normal;
    line-height: 1;
    color: #555;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 4px;
}

select.input-group-addon-xs {
    cursor: pointer;
    padding: 0px 2px;
}

select.input-group-addon-xs option {
    text-align: center;
}

select option {
    line-height: 30px!important;
}


/* Files */

.file-preview,
.input-group-addon,
pre {
    border: none;
    border-radius: 2px;
    padding: 0;
}

.file-preview-frame {
    height: 215px;
    margin: 0;
    margin-top: 10px;
    box-shadow: none;
}

.file-preview-frame img {
    width: 100%;
    height: auto;
}

.file-preview-image {
    max-width: 200px;
}

.krajee-default.file-preview-frame .kv-file-content{
    width:auto!important;
    height:100%!important;
}

.kv-file-content{
    display: flex;
    align-items: center;
    justify-content: center;
}


.field-attributeitem-image_file .file-thumbnail-footer{
    display: none;
}

.file-input {
    position: relative;
    border-bottom: 1px solid #cdcdcd;
    padding: 5px;
}

.file-input::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 1px;
    background-color: #008de7;
    box-shadow: 0 1px 0 0 #008de7;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.5s ease, opacity 0.5s ease;
    opacity: 0;
    pointer-events: none;
}


.file-input:hover::after {
    transform: scaleX(1);
    opacity: 1;
}

.file-input .input-group {
    width: 100%;
}

.kv-fileinput-caption{
    height:0px;
}



.file{cursor: pointer; position:relative; }


.file .thumbnail {
    position: relative;
}

.file .selected {
    position: absolute;
    /* width: 35px; */
    /* height: 34px; */
    top: 32%;
    left: 32%;
    color: #5cb85c;
    text-align: center;
    line-height: 32px;
    font-size: 32px;
    margin: auto;
    border: 2px solid white;
    border-radius: 50%;
    background-color: white;
}

.file .glyphicon-ok-circle:before{
    position:relative;
}

.file .item-delete {
    padding: 0 !important;
    position: absolute;
    width: 24px;
    height: 24px;
    top: 1px;
    right: 1px;
    color: white !important;
    background-color: #f44336;
    text-align: center;
    line-height: 24px;
    font-size: 16px;
    border-radius: 2px;

}


.file .item-select {
    padding: 0 !important;
    position: absolute;
    width: 24px;
    height: 24px;
    top: 1px;
    left: 1px;
    background:#f44336;
    
}
.file .item-select .ico{
    position:absolute;
    top:5px;
    left:5px;
    color:white;
}    
    
.file .item-delete:hover {
    background-color: #f44336 !important;
}


/* Messages */


/*.help-block {
    margin-bottom: 10px;
}

.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label,
.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label {
    margin-bottom: 0;
}

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label {
    color: #676a6c;
}

.has-error .form-control,
.form-control.has-error {
    border-color: #ed5565;
    margin-bottom: 0!important;
}

.has-error .help-block {
    padding-top: 2px;
    padding-bottom: 10px;
    font-style: italic;
}

.has-success .form-control,
.has-success {
    border-color: #1ab394;
}
*/


/* Hints */

.hint-block {
    display: block;
    margin-top: 5px;
    color: #999;
}


/* Modal */

.modal-open,
.modal-open .modal {
    /*    overflow: hidden;*/
    padding: 0!important;
}

.modal-open .modal-dialog {
    z-index: 99999;
}


/* 
.modal-open .modal-backdrop {
    right: 18px;
} */



.modal-content {
    border: none;
    border-top: solid 3px #e7eaec;
}

.modal-content .modal-header {
    padding: 0;
}

.modal-content  .modal-header .modal-title {
    padding: 0 15px;
    margin: 0!important;
    line-height: 40px;
    border-bottom: solid 1px #e7eaec;
}

.modal-content  .modal-header .close {
    position: absolute;
    right: 15px;
    top: 10px;
}
.modal-content .modal-body {
    padding: 15px;
    padding-top: 0;
}
.modal-content .modal-body .bootbox-body{
    margin-top: 15px;
}

.modal-content .modal-body .modal-body-form{
    margin:15px;
}

.modal-content .modal-body .configurator-info{
    padding-bottom:5px;
    border-bottom:1px solid #eee;
}


.modal-content .form-horizontal {
    padding: 0;
}

.modal-footer .btn {
    margin: 0;
}

.modal-footer .btn + .btn {
    margin-left:0px;
}

.modal-content .modal-footer button.pull-left{
    left:0px;
}

/* Switchery */

.switch-content {
    margin-top: 10px;
}

.switch-enable {
    margin-top: -45px;
    margin-bottom: 0;
}

.switch-enable .help-block {
    display: none;
}



.switch-enable .checkbox {
    padding-top: 0px;
}

.switch-enable .form-control {
    height: 20px;
    width: 40px;
}

.switchery {
    margin-bottom: 10px
}

.field-attributeitem-selected .switchery,
.field-step-defines_thumbnail .switchery,
.field-step-defines_price .switchery,
.field-attributeitem-enabled .switchery {
    margin-bottom: 0px
}


/* Table */

table tr td .btn {
    margin: 0;
}

table tr td:last-child .btn {
    float: right;
}

.panel .table {
    margin: 0;
}

.panel .table td {
    vertical-align: middle;
}

.panel .table th:first-child,
.panel .table td:first-child {
    padding-left: 14px;
}

.panel .table thead tr:first-child {
    background-color: #f9f9f9;
}

.panel .table-bordered {
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
    border-left: none;
    border-right: 0px;
}

.panel .table-bordered thead tr,
.panel .table-bordered tbody tr {
    border-bottom: solid 1px #ddd;
}

.panel .table-bordered thead tr>th,
.panel .table-bordered thead tr>td,
.panel .table-bordered tbody tr>td {
    border: none;
}

.panel .table .filters .form-control {
    margin-bottom: 0;
}

.panel .table-hover tr:hover td{background-color:#f5f5f5 }

.thead {
    float: left;
    width: 100%;
    vertical-align: bottom;
    border-top: 2px solid #ddd;
    border-bottom: 1px solid #ddd;
    background-color: #f9f9f9;
}

.thead .col-md-10 {
    padding-right: 0px;
}

.thead table tr:first-child th {
    border: none;
}

.table-grid tr th:first-child,
.table-grid tr td:first-child {
    width: 3%;
}

.table-grid tr th:last-child,
.table-grid tr td:last-child {
    vertical-align: top;
}

.col-sm-8 .table-grid tr th:last-child,
.col-sm-8 .table-grid tr td:last-child {
    width: 18%;
    vertical-align: top;
}


.table-grid thead {
    background-color: #f9f9f9;
}

.table-grid thead .form-group {
    margin: 0;
}



.table-matrix th:first-child,
.table-matrix td:first-child {
    position: absolute;
    display: table-cell;
    z-index: 99;
    width: 300px;
    background-color: #f9f9f9;
    border-left: none;
    margin-left: -300px;
}

.table-matrix th,
.table-matrix td {
    border-left: solid 1px #ddd;
    font-size: 11px;
    white-space: nowrap;
}

.table-matrix>thead>tr>th {
    vertical-align: top;
    border-bottom: 1px solid #ddd;
    font-weight: normal;
}

.table-matrix>thead>tr>th:first-child {
    font-weight: bold;
}



.price-matrix th:first-child,
.price-matrix td:first-child {
    display: table-cell;
    background-color: #f9f9f9;
    border-left: none;
}

.price-matrix th,
.price-matrix td {
    border-left: solid 1px #ddd;
    font-size: 11px;
    white-space: nowrap;
}

.price-matrix>thead>tr>th {
    vertical-align: top;
    border-bottom: 1px solid #ddd;
    font-weight: normal;
}

.price-matrix>thead>tr>th:first-child {
    font-weight: bold;
}
.price-matrix .cell-label{
    font-size:14px;
    padding-top:6px!important; 
    padding-bottom:6px!important;
}

.price-matrix .dimension,.price-matrix .cell-label-first{
    text-align:right;
    padding-right:20px!important;
}

.price-matrix .dimension .btn.btn-xs {
    padding:1px 2px 1px 2px!important;
    position:relative;
    top:-1px;
    left:10px;
}



.price-matrix .cell{
    font-size:11px!important;
}
.price-matrix .value{
    width: 111px;
    min-width: 111px;
    border:none;
    border-radius: 0;
    text-align: center;
    background-color: #e4f9e0;
    color: red;
    font-size:11px!important;
    margin-top:1px;
}

.price-matrix .value::-webkit-input-placeholder { /* Edge */
    font-size:11px!important;
    color: #aaa;
}
  
.price-matrix .value:-ms-input-placeholder { /* Internet Explorer */
    font-size:11px!important;
    color: #aaa;
}
  
.price-matrix .value::placeholder {
    font-size:11px!important;
    color: #aaa;
}


.price-matrix .value::-webkit-outer-spin-button,
.price-matrix .value::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.price-matrix .value[type=number] {
    -moz-appearance:textfield; 
    appearance:textfield;
}



.table-price {
    clear: both;
    float: left;
    width: 100%;
}

.price-table-wrapper{border-top:1px solid #ddd; border-bottom: 1px solid #ddd; display: flex;}
.price-table-wrapper .table-price .table {margin:0px;}
.price-table-modifier>input{border:1px solid #ddd; padding:3px;text-align:center;} 
.price-table-modifier>select{border:1px solid #ddd; padding:3px;} 
.price-table .table>thead>tr>th{
    border-left:1px solid #888;
}

.price-table>tbody>tr>td{
    border-left:1px solid #888;
}
.price-table>tbody>tr>td .cell-group .cell:last-child input{ 
    width: 108px;
    min-width: 108px;
}
    
.price-table .table>thead>tr>th .cell{
    font-size:1.1em;
    font-weight:bold;
}


.table-price .table-wrapper {
    clear: both;
    float: left;
    width: 100%;
    padding-left: 180px;
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
}

.table-price .table {
    display: block;
    width: 200%;
    max-width: none;
    margin-bottom: 4px;
}

.table-price thead,
.table-price tbody {
    border-right: solid 1px #ddd;
}

.table-price th,
.table-price td {
    padding: 0!important;
    margin: 0;
    text-align: center;
    vertical-align: middle;
}

.table-price th:first-child,
.table-price td:first-child {
    width: 180px;
    margin-left: -180px;
}

.table-price label {
    margin: 0;
}

.table-price .dimension {
    display: block;
    /*padding: 5px 15px;*/
    width: 100%;
    height: 20px;
    border: none;
    font-weight: bold;
    /*border-right: solid 1px #ddd;*/
    border-top: solid 1px #aaa;
    line-height: 20px;
}

.table-price .dimension .form-group{
    height:20px;
    text-align: center;
    width:102px;
    margin: auto;
    position:relative;
    left:+2px;
}

.table-price .dimension .form-group input{
    font-size:11px!important;
    float:left;
    width:50px;
    text-align:right;
}

.table-price .dimension .form-group select{
    font-size:11px!important;
    width:25px;
    font-size:11px;
    float:left;
    margin-top:4px;
    text-transform: lowercase;
}

.table-price .dimension .form-group a{
    padding:1px!important;
    margin:0px!important;
    background:#fff;
    float:left;
    margin-top:2px;
}

.table-price .cell{
    vertical-align: middle;
    line-height: 21px;
}

.table-price .cell .form-group{
    vertical-align: middle;
    line-height: 21px;
    margin:0px;
    padding:0px;
}

.table-price .cell .form-group input{
    width:100%;
    min-width:100%;
    font-size:11px!important;
    text-align:center;
    background-color: #e4f9e0;
    padding:1px 0px 0px 0px!important;
    color:red!important;
}











.table-price .cell-group {
    height:20px;
    width:101%;
    border:1px solid transparent;
}
    

.table-price td>.cell-header {
    border-bottom: none;
}

.table-price .cell {
    display: inline-block;
    min-width: 111px;
    height: 19px;
    border-left: solid 1px #ddd;
    transition: border-color 0.3s ease-out;
    cursor: pointer;
}

.table-price .cell:first-child {
    border-left: none;
}

.table-price .editable {
    padding: 0;
    margin: 0 auto;
    height: auto;
    top: 0px;
    left: 0px;
    overflow: hidden;
}


.table-price .active .editable {
    top: -2px;
    border: solid 2px #1ab394;
    transition: border-color 0.3s ease-out;
    box-shadow: none;
    text-align:left;
}

.table-price .active .editable .glyphicon {
    top: 2px;
    font-size: 8px;
}

.table-price .active .editable .btn {
    line-height: 12px;
    padding: 2px!important;
    background: #fff;
    margin:0px;
}

.table-price .active .editable .btn:hover {
    line-height: 12px;
    padding: 2px!important;
    margin: 0;
    background: #fff;
    margin:0px;
}

.table-price .active .editable select {
    font-size:11px;
    float:left;
    padding:2px;
    position:relative;
    top:+2px;
}

.table-price .active .editable input {
    font-size:11px!important;
    float:left;
    width: 50px;
    padding-left:0px;
    text-align: center;
}



.table-price .error .editable {
    border: solid 2px #ed5565;
}



/*.table-price .editable .input-group {
    width: 110px;
}*/

.table-price .cell .editable .input-group {
    margin: 0;
}

.table-price .cell .editable .input-group input {
    border: none;
    border-radius: 0px;
    border-right: solid 1px #ddd;
}

.table-price .cell .editable .input-group .input-group-addon {
    padding: 4px 15px;
    border: none;
    border-radius: 0px;
}

.table-price .cell-header .editable {
    top: 2px;
    border: none!important;
}

.table-price .cell-header.active .editable {
    top: 0px;
}

.table-price .cell-header .error .form-control,
.table-price .cell-header .error .input-group-addon {
    border-color: #ed5565;
}

.table-realations .table {
    border-right: solid 1px #ddd;
}

.table-realations th {
    padding: 5px 8px!important;
}

.table-realations td {
    position: relative;
    padding: 5px 8px!important;
    min-width: 100px;
}

.table-realations td:first-child {
    padding-top: 8px;
}

.table-realations td .editable {
    display: none;
    position: absolute;
    top: 7px;
    left: 25px;
    margin: 0;
}



.table-realations td .editable label {
    margin: 0;
}

.table-realations td input[type="checkbox"] {
    position: relative;
    top: 2px;
    margin-top: 0px;
}

.table-realations td .editable select {
    text-align: right;
    direction: rtl;
    border-radius: 3px!important;
    border: 1px solid #ddd!important;
}

.table-realations td .editable input {
    border-radius: 3px!important;
}

.table-realations td .price-type {
    max-width: 64px;
}

.table-realations td .price-group {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 60px;
    background: #fff;
}

.table-wrapper {
    position: relative;
    overflow: hidden;
    padding-left: 300px;
    border-top: solid 2px #ddd;
    border-bottom: solid 1px #ddd;
}

.row-duplicate{
    background-color:#f1f1f1;
}


/* Sswitch */
.switch {
  position: relative;
  display: inline-block;
  width: 31px;
  height: 16px;
}

.switch.middle{
    vertical-align: middle;
}

.switch input {display:none;}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .3s;
  transition: .3s;
}


.slider:before {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  -webkit-transition: .3s;
  transition: .3s;
}

input:checked + .slider {
  background-color: #008de7;
}

input.warning + .slider { 
    background-color: #ffc3be;
}

input:checked.warning  + .slider{
  background-color: #ff5500;
}



input:focus + .slider {
  box-shadow: 0 0 1px #008de7;
}

input:checked + .slider:before {
  -webkit-transform: translateX(15px);
  -ms-transform: translateX(15px);
  transform: translateX(15px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}


/*----------------------------------------------------------------------------*/


/* Customs styles
/*----------------------------------------------------------------------------*/


/* Configurator skin */

.field-configurator-skin_custom_css {
    display: none;
}


/* Price plain */

.price-plain-form .form-horizontal {
    padding-bottom: 0;
}


/* Role */

.role-update .field-role-controllers .col-sm-4:nth-child(3n+1) {
    clear: both;
}


/* Step */

.field-step-defines_price label,
.field-step-defines_thumbnail label,
.field-step-depends_on_size label {
    padding: 0;
}


/* Step attributes */

div.field-attributeitemeval-eval,
div.attributeitem-formula-holder{
    display: none;
}

div[class_="field-attributeitem-custom_"] {
    display: none;
}

div[class*="field-attributeitemgroup-custom_"] {
    display: none;
}


/* Step */

.step-settings h4 {
    cursor: pointer;
}

.step-ico{font-size:8px; position:relative; top:-1px; padding:2px 4px; margin-left:3px;}
.step-ico i {position:relative;top:0px;}
/* Step relationship */

.field-steprelationship-extra_price .input-group-addon {
    width: 28%;
}

.field-steprelationship-price_group_id,
.field-steprelationship-price_group_id label,
.field-steprelationship-price_group_id .help-block {
    padding: 0!important;
    margin: 0!important;
}

.field-steprelationship-price_type_id {
    border-radius: 3px;
    width: 100%;
}

#steprelationship-extra_price {
    width: 70%;
    border-radius: 3px;
}

#steprelationship-extra_price {
    width: 70%;
    border-radius: 3px;
}

.field-steprelationship-price_group_id {
    display: none;
}

#steprelationship-price_group_id {
    width: 71.4%;
    margin-top: -32px;
    margin-left: -7px;
    margin-bottom: 9px;
}

.field-configurator-arrangement_view label,
.field-configurator-basket_active label {
    padding-left: 0px;
}


/* Site index */

.site-index .table-grid tr th:last-child,
.site-index .table-grid tr td:last-child {
    width: 30%;
}

.site-index .panel {
    min-height: 326px;
    margin-bottom: 30px;
}

.site-index .panel h4 {
    padding-right: 10px;
}

.site-index .panel .summary {
    display: none;
}


/* Layers */
.layers-image-thumb img {
    background: #fff;
    border: 1px solid #ddd;
}

.layers-preview {
    position: relative;
    padding:0px;
    margin:0px;
    height: 500px;
    width: 500px;
    text-align: center;
}

.layers-preview-image {
    position: absolute;
    top: 0px;
    margin: 0px auto 0px auto;
    border:1px solid #ddd;
}

.layers-preview-image img {
    width: 100%;
    max-width: 500px;
    max-height: 500px;
    display: block;
    margin: auto auto;
}


.hotspot{
    position:absolute;
    display:block;
    
    width:1px;
    height:1px;
    cursor:pointer;
    border-bottom:1px solid #f1f1f1;
}
.hotspot i{
    display:block;
    background-image: url(../img/hotspot.png);
    background-position: center center;
    position: absolute;
    top:-23px;
    left:-9px;
    width:18px;
    height: 25px;
}
.hotspot span{
    position: absolute;
    top: -40px;
    left: -14px;
    /* border: 1px solid red; */
    padding: 0px 4px;
    /* font-weight: bold; */
    background: #565656;
    color: white;
    font-size: 11px;
    border-radius: 3px;
    border:1px solid #ddd;
    color:white;
}

.hotspot:hover span{
    border:1px solid #fff;
    background: #222;
}


.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}






.attributeitem-layers {
    padding: 5px 0px 5px 0px;
    border-bottom: 1px solid #ddd;
    margin-top: 10px;
    width: 100%;
}

.attributeitem-layers .btn {
    position: relative;
    right: 0px;
    top: -2px;
    margin: 0px 0px 0px auto;
}

.attributeitem-layers table {
    width: 100%;
}

.attributeitem-layers table tr th {
    font-size: 80%;
    padding-left: 5px;
}

.attributeitem-layers table tr td {
    position: relative;
    padding: 5px;
    vertical-align: middle;
}

.attributeitem-layers table tr:hover td {
    background: #e7f7ff
}

.attributeitem-layers .layer-color-value {
    text-align: right;
    width: 140px;
}

.attributeitem-layers .form-group .control-label {
    display: none;
}

.attributeitem-layers .sp-replacer {
    margin: 7px;
    float: right;
    position: absolute;
    top: 0px;
}

.attributeitem-layers .form-group .help-block {
    display: none;
}

.attribute-ico{font-size:10px;}
.attribute-ico i {font-size:10px; position:relative; top:-1px;}
.attribute-ico i.fa-code{font-size:8px;position:relative; top:1px;}
.layer-color-selector {
    display: none;
}

.layer-data-holder {
    position: relative;
    top: -2px;
}

.layer-color-holder {
    display: none;
}

.layer-color-holder .sp-replacer {
    position: relative;
    top: -2px;
    left: -2px;
}

.layer-image-name {
    display: none;
    font-weight: bold;
    vertical-align: middle;
}

.layer-image-name button {
    vertical-align: middle;
}

.layer-image-holder {
    display: none;
    text-align: left;
    position: relative;
    vertical-align: middle;
}

.layer-image-holder .btn {
    float: left !important;
    padding: 6px;
    position: relative;
    top: 0px;
}

.layer-image-filename {
    position: relative;
    top: +5px;
}

.layer-image-change {
    position: relative;
    top: +5px;
    cursor: pointer;
    padding-top: 4px;
    background: #efefef;
    color: #aaa;
}

.layer-image-change:hover {
    background: red;
    color: white;
}

.layer-image-thumb {
    border: 1px solid #ddd;
    padding: 3px;
    overflow: hidden;
    display: block;
    height: 30px;
    width: 35px;
    float: left;
    margin-right: 3px;
    background: #fff;
    cursor: pointer;
}

.layer-image-thumb img {
    width: 100%;
    height: 100%;
    border: 1px solid #ddd;
}

.layer-action {
    width: 43px;
}

.layer-action-holder {
    width: 160px;
}

.layer-save-btn {
    position: relative;
    top: -2px;
    display: none;
    margin: 0px;
}

.layer-remove-btn {
    color: red;
    cursor: pointer;
    display: none;
    position: realtive;
    top: -2px;
}

.layer-edit-btn {
    color: red;
    cursor: pointer;
    position: relative;
    top: -2px;
}

.layer-link{
    padding:2px 4px 2px 4px;
}

.layer-notset,.row-notset {
    color: white!important;
    background: #ff5757;
}

.layer-notset:hover,.row-notset:hover {
    color: white!important;
    background: red!important;
}

.layer-newset,.row-newset {
    color: black!important;
    background: #ffa3a3!important;
}

.layer-newset:hover,.row-newset:hover {
    color: black!important;
    background: #f38080!important;
}

.row-different{
    color: black!important;
    background: #fbf5d0!important;
}

.row-different:hover{
    color: black!important;
    background: #f7ecb5!important;
}

.row-notset td .btn-success{
    color:white!important;
}

.row-notset:hover td .btn-success{
    color:#555!important;
}

.row-notset td input.form-control{
    background:#fff;
    height:30px!important;
}

.row-notset td input.form-control:focus{
    background:#fff;
}


.has-error{
    color: #f44336;
}

.row-error{
    color: #e40000!important;
    background: #fddada!important
}

.row-error:hover{
    color: black!important;
    background: #fbd0d0!important;
}


.btn-layer-link {font-size:11px!important;}

.layer-group-item-notset{background:#fff2f1; }
.layer-group-item-notset td{color: red;}
.layer-background-action {width: 40px;}

.layer-step-attributes-holder{max-height:620px;min-height: 100px; overflow: auto;}
.layer-step-attribute-item-selected td, .modal-group-value-selected td{background: rgb(172, 236, 188);}

.attributeitem-layers table tr:hover td .layer-remove-btn {
    color: red;
    cursor: pointer;
    display: block
}

.attributeitem-layers-custom-form {
    display: none;
}

.attributeitem-layers-custom-form .layer-save-btn {
    display: block;
}

.attributeitem-layers-custom-form .layer-image-change {
    position: relative;
    top: 0px;
}

.attributeitemsize-name {
    height: 30px;
    vertical-align: middle;
}

.attributeitemsize-name>label {
    margin-top: 10px;
}



.attributeitemsize-table-holder .btn-add {
    position: relative;
    top: -1px;
}

.attributeitemsize-table-holder .label {
    font-size: 12px;
    font-weight: normal;
}

.attributeitemsize-table {
    width: 100%;
}

.attributeitemsize-table th {
    font-size: 80%;
    padding: 3px;
    border-bottom: 1px dashed #eee;
}

.attributeitemsize-table tr td {
    padding: 3px;
}

.attributeitemsize-table tr td a {
    margin-left: 5px;
    color: #ddd;
    text-decoration: none !important;
}

.attributeitemsize-table tr:hover td {
    background: #e7f7ff
}

.attributeitemsize-table tr:hover td a {
    color: red;
}

.attributeitemsize-table tr .action {
    width: 25px;
}

.attributeitemsize-table .off td {
    color: #aaa;
}

.attributeitemsize-table .off td {
    color: #aaa;
}


.attributeitemsize-table td span.glyphicon-ban-circle{
    color:#ccc;
}

.attributeitemsize-table td span.glyphicon-ban-circle:hover{
    color:#444;
}

.size span.glyphicon-ban-circle.off
{
    color:red
}

.attributeitemsize-form {
    display: none;
}

.table-simple {
    width: 300px;
}

.table-simple tbody tr th {
    font-size: 80%;
    padding-left: 10px!important;
}

.table-simple tbody tr {
    border-bottom: none!important;
}

.table-simple tbody tr:hover td {
    background: #fff;
}

.table-simple tbody tr td {
    font-size: 80%;
    line-height: 80%;
    border: none;
    padding: 2px 3px 2px 10px!important;
    min-width: 60px;
    min-height: 24px;
    vertical-align: middle;
    text-align: left;
}

.table-simple tbody tr td.action .btn{
    float: right;
}


.exportGenerate {
    padding: 10px 15px 10px 15px;
    height: 60px;
}

.copyStepFormHolder {
    display: none;
    margin: 15px 5px 10px 0px;
    height: 30px;
    vertical-align: middle;
}

.copyStepFormHolder button,
.copyStepFormHolder span,
.copyStepFormHolder select .copyStepFormHolder i {
    vertical-align: middle;
}

.copyStepFormHolder button,
.copyStepFormHolder span {
    position: relative;
    top: -1px;
}

.copyCloseButton {
    display: none;
}

.progressInfoHolder {
    display: none;
}

.preview-frame {
    width: 100%;
    height: 300px;
    border: none;
}


.prodcode-group-value-attribute{position:relative;}
.prodcode-group-value-attribute .label{position:absolute; left:-35px; top:8px;}


.version-channels{padding:5px;}
.version-channels input{position:relative; top:2px;}
.version-channels label{color:#222; font-size:0.95em; margin-right:10px;}





.table-version tbody tr td .form-group{ margin:0px;}
.table-version tbody tr td .form-group select { -webkit-appearance:menulist-button; -moz-appearance:menulist-button; appearance:menulist-button}
input.version-hash{padding:1px 4px 1px 4px; border:1px solid #ddd; width:110px; text-align: center; border-radius: 15px; font-size:0.9em;}
span.version-hash{display:inline-block; width:110px; height:20px; padding:1px 4px 1px 4px;  cursor: pointer; border:1px solid #03a9f4; background:#fff; color:#444;  text-align: center; border-radius: 15px; font-size:0.9em;}
span.version-hash:hover{background:#21baff; cursor: pointer;color:#fff;}
.column-switcher {width:60px; overflow: hidden;}

.versionAttributes{padding-left:0px;}
.versionAttributes>li .fa{font-size:1.2em; margin-right:10px;}
.versionVariantsTableHolder{border:1px solid #ddd; max-height:700px; overflow: auto;}
.versionAttributesCheckAll{margin-left:6px;margin-bottom:4px;}
.versionAttributesCheckAll .check-all{ cursor:pointer;font-weight:bold;}
.versionAttributesCheckAll .check-all .fa{font-size:1.2em; margin-right:10px}
.version-attribute_item_size{max-width: 300px;}
.version-size-default-value {width:60px;}
.version-size-default-value input {padding: 0px 3px 0px 3px; border: none;  width: 60px; color:red}
.version-size-default-value.custom{font-weight: bold; color:red;}

.rotate45{-ms-transform: rotate(45deg);  /* IE 9 */ -webkit-transform: rotate(45deg); /* Safari 3-8 */  transform: rotate(45deg);}
.rotate90{-ms-transform: rotate(180deg);  /* IE 9 */ -webkit-transform: rotate(180deg); /* Safari 3-8 */  transform: rotate(180deg);}

/* Globals */

.top1px {
    position: relative;
    top: 1px;
}

.top2px {
    position: relative;
    top: 2px;
}

.top-2px {
    position: relative;
    top: -2px;
}

.top3px {
    position: relative;
    top: 3px;
}

.top-3px {
    position: relative;
    top: -3px;
}

.top4px {
    position: relative;
    top: 4px;
}

.top5px {
    position: relative;
    top: 5px;
}


.top-5px {
    position: relative;
    top: -5px;
}

.top-7px {
    position: relative;
    top: -7px;
}


.top10px {
    position: relative;
    top: 10px;
}

.top15px {
    position: relative;
    top: 15px;
}

.top20px {
    position: relative;
    top: 20px;
}


.top-10px {
    position: relative;
    top: -10px;
}

.w50{
    width:50%;
}

.file-caption-name {
    margin-top: 5px;
}

.param-image-thumb img {
    height: 30px;
    border: 1px solid #676767;
}

.param-image-thumb .color-thumb {
    width: 30px;
    height: 30px;
    border: 1px solid #676767;
}

.div-configurator-status .control-label {
    margin-top: 5px;
}

.div-configurator-status i {
    font-size: 26px;
    margin: 0px 10px 0px 10px;
    position: relative;
    top: +5px;
}

.btn-configurator-status {
    line-height: 1.3;
    padding-left: 0.7em;
    padding-right: 0.7em;
    float: right;
}

.div-configurator-status .btn-configurator-status {
    font-size: 11px;
    line-height: 1.5;
}

.modal-configurator-comments .modal-content {
    width: 800px;
}

.btn.status-normal {
    background: #efefef;
    border: 1px solid #bbb;
    color: #777;
}

.btn.status-normal:hover,
.btn.status-normal:focujs,
.btn.status-normal:active {
    background: #ed5565!important;
    color: #eee;
    border-color: #ed5565;
}

.btn.status-normal-selected{
    background: red!important;
    color: white;
}

.btn.status-in-progress {
    background: #f91605;
    color: #fff;
}

.btn.status-in-progress:hover,
.btn.status-in-progress:active,
.btn.status-in-progress:focus{
    background: #f91605!important;
    color: #fff;
}

.btn.status-test{
    background: #ff9800!important;
    color: #fff;
}

.btn.status-test:hover,
.btn.status-test:focus,
.btn.status-test:active{
    background: #ff9800!important;
    color: #fff;
}

.btn.status-complete {
    background: #008de7;
    color: #fff;
}

.btn.status-complete:hover,
.btn.status-complete:focus,
.btn.status-complete:active {
    background: #008de7!important;
    color: #fff;    
}

.btn.status-ready {
    background: #0dc238;
    color: #fff;
}

.btn.status-ready:hover,
.btn.status-ready:focus,
.btn.status-ready:active{
    background: #0dc238!important;
    color: #fff;
}

.btn.status-old-public {
    border: 1px solid #0271b8;
    background: #74c9ff;
    color: #0271b8;
}

.btn.status-old-public:hover,
.btn.status-old-public:focus,
.btn.status-old-public:active{
    border: 1px solid #0271b8;
    background: #008de7!important;
    color: white;
}

.task-table-holder {
    max-height: 600px;
    overflow: auto;
}

.task-table {
    width: 100%;
}

.task-table tr th {
    font-size: 13px;
    padding: 3px;
    border-bottom: 1px solid #eee;
}

.task-row td {
    border-bottom: 1px solid #eee;
    vertical-align:middle;
    padding-left:3px;
}

.task-row:hover td {
    background: #d9edf7
}

.task-id {
    width: 40px;
}

.task-status {
    width: 30px;
    text-align: center;
}

.task-status .fa-circle {
    font-size: 18px;
    cursor: pointer;
    color: #ccc;
}

.task-status .fa-check-circle {
    font-size: 18px;
    cursor: pointer;
    color: #0dc238;
}

.task-row:hover .task-status .fa-circle {
    color: #888;
}


.task-message {
    position: relative;
}

.task-message textarea {
    height: 80px;
    width: 100%;
    padding:0px!important;
}


.taskt-row td.task-acction {
    width: 25px;
    padding:3px;
}


.task-row-deleted {
    display: none;
}

.fixed {
    position: fixed;
    top: 212px
}

.cursor {
    cursor: pointer
}

.margin-none {
    margin: 0px!important;
}

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

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

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

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

.padding-none {
    padding: 0px!important;
}

.row-checkbox {
    width: 35px;
}

.form-control-mini {
    padding: 3px;
    font-size: 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    border: 1px solid #e5e6e7;
}

.form-inline .checkbox,
.form-inline .radio {
    padding-top: 0px;
}

.width-50{
    width:50px;
}

.width-150{
    width:150px;
}

.width-full {
    width: 100%;
}

.vertical-middle{
    vertical-align: middle!important;
}

.attribute-item-relationship-cell{
    height:25px; cursor:pointer;
}

.attribute-item-relationship-cell:hover{
    background:#abd2ff;
}
.td-relation-checked{
    background: #66BB6A;
}

.td-relation-checked:hover{
    background: #2cb433;
}

.btn-thin{
    padding:4px 8px 3px 8px!important;
    margin:4px!important;
}

.table .checkbox {
    margin: 0;
}


.table tr td.select2 .form-group {
   margin: 0;
}



.display-none{
    display:none;
}

.translation-value{
    position:relative;
    border-left:1px solid #ccc!important;
    
}

.translation-action{
    width:80px;
}

.copyLayersFormHolder{
    display:none;
}

.pointer {
    cursor: pointer;
}

.sidebar-header .glyphicon{
    margin-top:10px;
}

.radio-inline .radio{float:left; margin-right:10px}
.radio-inline .radio label {
    color: #333;
    font-style: normal;
    font-size: 13px;
    padding-left:2.3em;
    padding-top:1px;
    margin-left:-6px;
}
.radio-inline .radio:hover label{color:#000;}
.radio-inline:hover{color:#000;}

.stage-offline i{font-size:1.4em; color:#d3d3d3;}
.stage-offline i:hover{color: #aaa;}

.stage-online i{font-size:1.4em; color:#008de7}
.stage-online i:hover{color: #0068ec;}

.cleaner-files-list{height:400px; overflow: auto; border:1px solid #ddd; margin-top:10px; padding:5px;}
.cleaner-files-list .section {margin-left:5px;border-bottom:1px solid #ddd; margin-top:5px; font-weight: bold;}
.cleaner-files-list a {font-size:0.9em; padding:2px 5px 2px 5px; display: block; }
.cleaner-files-list a:hover{ background:#e4f7ff; color:black;}
.btn-cleaner{margin-left:10px; float:left;}

.flag-changed{ font:bold 9px Tahoma; color:red; }
.label-micro{ font:8px Tahoma; line-height: 10px; }


.fa-spin-custom, .glyphicon-spin {
  -webkit-animation: spin 1000ms infinite linear;
  animation: spin 1000ms infinite linear;
}


.relation-name .form-group{margin:0px!important;}

.bootbox-btn {margin:0px 10px 0px 10px!important; position:relative; top:-5px; }


th > label{    
    font-size: 13px;
    color: #333;
    font-family: Roboto,Helvetica,Arial,sans-serif;
    font-weight: 700;
    vertical-align: bottom;
    margin-bottom:1px;
    cursor:pointer;
}

.rows td .btn-lock{position:relative; left:-2px;}



.form-small input,
.form-small textarea{padding:5px; border:1px solid #ddd; border-radius: 3px;}
.form-small select{padding:3px 2px 3px 2px; border:1px solid #ddd; border-radius: 3px;}
.form-small .error{border:1px solid red;}



.modal-search-attributes-body{height: 700px;overflow: auto;}
.modal-discount-body{height: 600px;overflow: auto;}
.browser .search-input{position:fixed; width: calc(100% - 45px); background-color:#fff;z-index:+100}
.browser .search-content{padding-top:40px;}
.browser .search-items>div { max-height: 600px; display: flex; flex-wrap: wrap; overflow: auto;padding:0px;}
.browser .search-items>div .group{font-size:0.8em; display:block;margin:6px 0px 2px 5px; width:100%; height:20px;}
.browser .search-items>div .group span{padding:0px 3px 1px 3px; border-radius: 3px; cursor:pointer}
.browser .search-items>div .group input{position:relative; top:4px;margin:0px 4px 0px 0px;padding:0px;}
.browser .search-items>div .item-check{width:95%;margin:1px 2px 1px 10px;border-radius: 3px; padding:0px 0px 2px 5px; line-height: 1em;}
.browser .search-items>div .item-check:hover{background:#ddd; cursor:pointer;}
.browser .search-items>div .item-check input{position:relative; top:2px;margin:0px;padding:0px;}
.browser .search-items>div .item-check.selected{color:black; background-color:#c9e897;}

.browser .search-items .step{ padding:7px 0px 0px 0px; margin:7px 0px 0px 0px; border-bottom:1px solid #ddd; font-size:16px; color:black; display:block;}
.browser .search-items .step label{ position:relative; left:3px; top:2px; font-size:12px; vertical-align: middle; color:#444; cursor:pointer; padding: 1px 5px 0px 5px; border-radius:3px;}
.browser .search-items .step label span{ position:relative; top:-2px }
.browser .search-items .step label:hover{background:#ddd;}
.browser .search-items .step label.selected{color:black; background-color:#c9e897;}

.browser .search-items>div .item{ width: 100px; height:157px; padding:5px; overflow:hidden;}
.browser .search-items>div .item:hover{background-color: #f1f1f1; border-bottom:2px solid #008de7;}
.browser .search-items>div .item .title{font-size:0.82em; line-height:1.1em;margin-top:4px;}

.owner-change-select{padding: 3px 5px 3px 0px!important; margin: 0; border:0px; }


/* Ace Editor */
.ace_editor { min-height: 200px; border: solid 1px #ddd;margin-bottom: 15px; border-radius: 2px; margin-top: 5px;}
.ace-tm .ace_print-margin { background: none!important;}
.ace-editor-snippets { margin-top: 5px;}
.ace-editor-snippets .btn { margin: 0; padding: 2px 3px!important;}
.ace-preview-body{margin-top:10px;}



.btn.btn-xs .glyphicon{position:relative; top:1px; left:-1px;}



.attribute-selected-icon{
    font-size: 10px;
    font-weight: 800;
    position:relative;
    top: +1px;
}

.discount-table tr td{padding:2px;}
.discount-label{
    font-size:11px;
    padding-bottom: 5px;
    padding-right: 5px;
}


.discount-field {
    height:24px!important; 
    margin-top:10px!important; 
    font-weight: bold!important; 
    background:#fff!important;
    border:1px solid fff!important; 
}

.variants{padding:10px; margin-bottom:20px;border:1px solid #ddd; background:white;}
.variants .step{margin-top:15px; font-size:20px;}
.variants .step .prodcode {font-size: 11px;
    padding: 3px 7px 3px 5px;
    border-radius: 7px;
    top: -3px;
    position: relative;
    background: #999;
    color:white;
}
.variants .step .error{font-size: 11px; background: red; padding: 3px 5px 3px 5px; color: white; border-radius: 4px; margin-left:5px; position: relative; top:-3px; display:inline-block;}
.variants .step .is-hidden{color:#888;}
.variants .step .step-hidden{font-size:11px; color:red; font-weight: bold; border:1px solid red; padding:1px 4px 1px 4px; position:relative;top:-3px;border-radius: 3px;}

.variants .step .sizes {margin-bottom:10px;}
.variants .step .sizes tr td{ padding:3px 5px 3px 5px;}
.variants .step .sizes .size-label {text-align:right; font-size:13px; padding-right: 10px;font-weight: bold; width:200px;}
.variants .step .sizes .size-input-label{font-size:11px; color:#444; display:inline-block; position:relative; top:-3px;}
.variants .step .sizes .size-input {border:1px solid #ddd; text-align: center; padding:2px; font-size:0.95em; width:100px;}
.variants .step .sizes .attribute-size {margin-left:5px;}
.variants .step .sizes .attribute-size input {display:none;}
.variants .step .sizes .attribute-size label{cursor:pointer; padding:3px 5px 2px 5px;font-size:12px; font-weight: normal; color: #444; border-radius: 3px; border:1px solid #ddd; background:#f1f1f1;}
.variants .step .sizes .attribute-size .selected{background: #8BC34A; border: 1px solid #6ca030; color: white;}

.variants .attributes .attribute input {display:none;}
.variants .attributes .attribute label{cursor:pointer; padding:3px 5px 2px 5px;font-size:12px; font-weight: normal; color: #444; border-radius: 3px; border:1px solid #ddd; background:#f1f1f1;}
.variants .attributes .attribute label.selected{background: #8BC34A; border: 1px solid #6ca030; color: white;}
table.variant-no tr td{padding:4px;}

.thin{font-size:10px; margin-left:4px; position:relative; top:-3px; color:#555;}
.blink{
  animation: blinker 1.5s linear infinite;
}

div.ui-slider{height:15px!important;}

@keyframes blinker { 
    50% { opacity: 0; }
}








@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}


table.compact-table tr td{padding:5px;}
table.compact-table tr th.configurator-action{width: 375px;}
table.compact-table tr td a.btn{padding:1px 5px 1px 5px!important;}
table.compact-table tr td a.btn span{font-size:0.9em}

.translation-lang-nav{ border-top:1px solid #ddd; position:relative; top:-2px; background:#fff;}

.inplaceEditor {background:white; padding:2px; position:relative; top:-5px; left:-5px; width:101%;}
.inplaceEditor textarea{border:1px solid #ddd; font-size:13px; color:#000000;}
.inplaceEditor textarea.error{ border:1px solid red;}
.inplaceEditor .buttons {padding:0px 2px 2px 2px;}

/* Media */

@media (min-width: 768px) {
    /*
    .navbar-nav > .active > a,
    .navbar-nav > .active > a:hover
    .navbar-nav > .active > a:focus {
    }

    .navbar-nav > li > .dropdown-menu{
        display: none;
        transition: all 0.2s ease-out;
    }

    .navbar-nav > li.open > a {
        color: #777!important;
        background-color: transparent!important;
    }
    .navbar-nav > li > a {
    }
    .navbar-nav > li:hover > a{
        color: #fff;
        background-color: #080808;
    }

    .navbar-nav > li:hover > .dropdown-menu{
        display: block!important;
        top: 100%;
        height: auto;

        transition: all 0.2s ease-out;
    }

    .navbar-nav > li > .dropdown-menu > li .dropdown-menu{
        display: none;
        margin-top: -1px;
        margin-left: 0px;

    }

    .navbar-nav > li > .dropdown-menu > li:hover .dropdown-menu{
        display: block;
    }
    */
}

table .ui-sortable-helper {
    background-color: #badbad!important;
    
}

.panel table {
    table-layout: auto;
}

@media (max-width: 991px) {
    #fileManager .file:nth-child(2n+1) {
        clear: both;
        float: left;
    }
}

@media (min-width: 992px) {
    #fileManager .file:nth-child(4n+1) {
        clear: both;
        float: left;
    }
    .modal-lg {
        width: 1180px;
    }
}



.table-filter-id{width: 75px }
table.configurator-table tr.lock{ color:#888; -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ filter: grayscale(100%);}
table.configurator-table tr.lock .fa-circle {color:#444;}
table.configurator-table tr td{padding:5px;}
table.configurator-table tr th.configurator-action{width: 360px;}
table.configurator-table tr td a.btn{padding:1px 5px 1px 5px!important;}
table.configurator-table tr td a.btn span{font-size:0.9em}
table.translation-table tr td a{color: #0068ec; text-decoration:underline}
table.configurator-table tr td:last-child {vertical-align: middle;}

@media (max-width: 1600px) {  
    table.configurator-table tr td a.btn {padding:3px!important;}
    table.configurator-table tr td a.btn span{display:none;}
    table.configurator-table tr th.configurator-action{width: 205px;}
}





.bootstrap-timepicker {position:relative;}
.bootstrap-timepicker .input-group-addon{float:left; position:absolute; left:0px;top:11px; width:20px; height: 20px;}
.bootstrap-timepicker input{margin-left:20px;}

.publisher-progress{

    position:relative;
    margin:0px;padding:0px; height:15px;background:#fff;
    font-size:0.9rem;
    .progress-bar{text-align:right;font-weight: bold;}
    .progress-bar-label{display:inline-block; position:relative; right:5px; top:-2px;}
    .progress-label{font-weight:bold; color:black; 
         position: absolute;
        width: 100%;
        text-align: center;
        display:none;
    }
}


.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
 }

 /* Select 2 adjustments */

 .select2-container .select2-selection--single .select2-selection__clear {
    position: relative;
    top: 2px;
    right: -24px;
    color: #333;
    font-size: 14px;
 }

.select2-container--bootstrap4 .select2-selection--single{
    height: calc(1.5em + .75rem + 8px) !important;
    border-top:none;
    border-left:none;
    border-right: none;
    margin-top:2px;
}

.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered{
    line-height: calc(1.5em + .75rem + 7px) !important;
    position:relative;
    left:-3px;
}
.select2-container--focus .select2-selection, .select2-container--open .select2-selection {
    border-color: #008de7!important;
    box-shadow: none!important;
    border-bottom:2px solid #008de7;
}