﻿@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');

/*CSS per registrazione e login*/
body {
    color: #333;
}

.bg-primary {
    background-color: #eff0f1 !important;
}

.blue {
    color: #3b5998 !important;
}

.table-striped tbody tr:nth-of-type(2n) {
    background-color: #f2f6fc;
}

.table-striped tbody tr:nth-of-type(2n+1) {
    background-color: unset;
}


th.actions, td.actions {
    width: 100px !important;
}

ul.pagination li a.selected {
    cursor: default;
    background-color: #fff !important;
    color: #8c227d !important;
    text-decoration: none;
    border: 1px solid #eee;
}

ul.pagination li a {
    background: #ececec !important;
    color: #333 !important;
    font-size: 14px;
    border: 1px solid #eee;
}

    ul.pagination li a:hover {
        background-color: #eee;
        border: 1px solid #ccc;
        color: #8c227d;
    }

.table-hover tbody tr:hover img {
    opacity: 0.4 !important;
}


#layoutAuthentication .card-header {
    background: #ececec !important;
}

.login-title {
    color: #8c227d;
    font-family: 'Roboto Slab';
    padding-top: 1.5em;
}

.shadow-lg {
    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2) !important;
}

.bg-primary {
    background: #eee;
}


.btn {
    line-height: 1;
    border-radius: 0.20rem;
}


.btn-primary {
    color: #fff;
    background-color: #8c227d;
    border-color: #8c227d;
    box-shadow: 0 2px 2px 0 rgba(156, 39, 176, 0.14), 0 3px 1px -2px rgba(156, 39, 176, 0.2), 0 1px 5px 0 rgba(156, 39, 176, 0.12);
}

.actions .btn {
    box-shadow: unset;
}

.actions .btn:hover,.btn.in-row:hover {
    box-shadow: unset;
}

.table td.actions .btn i, .btn.in-row i {
    color: #666 !important;
}

.table td.actions a.btn.btn-secondary:hover i, a.btn.in-row.btn-secondary:hover i {
    color: #3b5998 !important;
}


.table td.actions a.btn.btn-info:hover i, a.btn.in-row.btn-info:hover i {
    color: #4169E1 !important;
}

.table td.actions a.btn.btn-danger:hover i, a.btn.in-row.btn-danger:hover i {
    color: #f44336 !important;
}

.table td.actions a.btn.btn-light:hover i, a.btn.in-row.btn-light:hover i {
    color: #212832 !important;
}

.table td.actions a.btn.btn-warning:hover i, a.btn.in-row.btn-warning:hover i {
    color: #ff9800 !important;
}

.table td.actions .btn.btn-secondary:hover i {
    color: #55acee !important;
}

.table td.actions .btn.btn-secondary:hover, .btn.in-row.btn-secondary:hover {
    background-color: transparent !important;
    box-shadow: unset;
}


fieldset.fs-simple {
    border: none;
}

    fieldset.fs-simple legend {
        background: #3b5998;
        color: #fff;
        width: 100%;
        padding: 10px;
    }

th.img {
    background: #ececec !important;
}

.table.table-version-groups td, .table.table-version-groups th {
    color: #333;
}

th.actions.mini {
    opacity: 1;
}

a:hover i {
    color: #af5fa4;
}

li.nav-item a:hover i {
    color:unset;
}


a:hover .sidenav-collapse-arrow i {
    color: #a7aeb8 !important;
}

.btn.btn-secondary {
    color: #fff;
    border-color: #3b5998;
    background-color: #3b5998;
}
    /*a.small-edit:hover i {
    color: #ca9ec4;
}*/
    .btn.btn-secondary:hover {
        color: #fff;
        border-color: #4765a4 !important;
        background-color: #4765a4 !important;
        box-shadow: 0 14px 26px -12px rgba(59, 89, 152, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(59, 89, 152, 0.2);
    }


td.actions > a.btn-warning:hover, td.actions > a.btn-warning:active {
    background-color: transparent !important;
    border-color: transparent !important;
}

    td.actions > a.btn-warning:hover i, td.actions > a.btn-warning:active i {
        color: #ff9800 !important;
    }

.table td.actions .btn.btn-primary:hover i {
    color: #8c227d !important;
}

.btn-primary:hover, .btn-primary:active {
    background-color: #8c227d;
    border-color: #8c227d;
    box-shadow: 0 14px 26px -12px rgba(156, 39, 176, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(156, 39, 176, 0.2);
}

a.bnt-register {
    font-size: 16px;
}

div.register .form-group i {
    color: #cdcdcd;
}

.register .col-xl-5.col-lg-6.mb-3 {
    background: #fff !important;
}

ul.register-hints li {
    list-style-type: none;
    margin-bottom: 1px;
    position: relative;
    color: #444;
    background: #ececec;
    padding: 0.5em;
}

    ul.register-hints li i {
        font-size: 42px;
        vertical-align: middle;
        display: block;
        text-align: center;
        padding: 0.3em;
        color: #8c227d;
    }

    ul.register-hints li label {
        font-size: 12px;
        vertical-align: middle;
        position: unset;
        color: #0042a6;
        display: block;
        text-align: center;
        color: #333;
        text-transform: uppercase;
        font-weight: bold;
    }

ul.register-hints {
    padding-top: unset;
}

.card-footer {
    background: #3b5998;
}

    .card-footer a, .card-footer a:hover {
        color: #fff;
    }

div.register p.bottom-desc {
    color: #515151;
}



/*.form-control.required {
    border-left: 2px solid #e91e63 !important;
}*/

.form-control.required {
    background-color: #f2f6fc !important;
    border-color: #3b5998;
}

.form-control.error, .form-control.required.error {
    border: solid 1px #e91e63 !important;
    background-color: rgb(241, 224, 227) !important;
    /*border-left: solid 2px #e91e63 !important;*/
}


.error-po {
    color: #e91e63;
    font-size: 14px;
    display: none;
}

/*.form-group > label:first-child {
    color: #333;
}*/

a {
    color: #8c227d;
}

    a:hover {
        color: #8c227d;
    }

/*.form-control:focus {
    color: #69707a;
    background-color: #fff;
    border-color: transparent;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(196, 107, 170, 1);
}*/

div.card-body.authenticator h3 {
    color: #333 !important;
}

p.explain, td p.explain-full, div.explain {
    border: none;
    background-color: #ebde57;
    color: #333;
    line-height: 1.2rem;
}

p.explain.bg-green {
    color: #fff;
}


.explain.alert {
    background-color: #e91e63;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
}

label.danger-label {
    background: #e91e63;
}


.topnav .navbar-brand img {
    height: inherit;
    width: 180px;
}

.topnav {
    height: 2.5rem;
}


tr.tr-filters th.upper {
    background: #333 !important;
    color: #ffff;
}

.feather {
    height: 2rem;
    width: 2rem;
    vertical-align: top;
    color: #728dc7;
}

.side-language-menu {
    margin-bottom: unset;
}

    .side-language-menu svg {
        margin-right: unset;
    }

.sidenav-light {
    color: #fff;
}

.sidenav-light {
    background: #3b5998;
}

/*.sidenav .sidenav-menu .nav .nav-link .nav-link-icon .feather {
    width: 1rem;
    height: 1rem;
    color: #8c227d;
}*/

.sidenav .sidenav-menu .nav .nav-link .nav-link-icon i, .sidenav .sidenav-menu .nav .nav-link .nav-link-icon svg {
    width: 1rem;
    height: 1rem;
    color: #8c227d;
}

.sidenav .sidenav-menu .nav .nav-link .nav-link-icon .feather:hover {
    color: #c46baa;
}

.sidenav .sidenav-menu .nav .nav-link:hover .nav-link-icon .feather {
    color: #728dc7;
}

.sidenav .sidenav-menu .nav .nav-link .nav-link-icon {
    font-size: 0.9rem;
}

.sidenav .sidenav-menu .nav .nav-link {
    text-align: left;
    background: #ececec;
    border-top: 1px solid #ccc;
    color: #333;
}

    .sidenav .sidenav-menu .nav .nav-link:hover {
        background: #3b5998;
    }

.shadow-right {
    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2) !important;
}

.sidenav-light .sidenav-footer {
    background-color: #3b5998;
}

    .sidenav-light .sidenav-footer .sidenav-footer-subtitle {
        color: #ececec;
    }

div.collapse.show {
    background: #ccc;
}

.sidenav .sidenav-menu .nav div.collapse.show .nav-link {
    background: #fff;
    border-top: 1px solid #ececec;
}

    .sidenav .sidenav-menu .nav div.collapse.show .nav-link:hover {
        background: #ececec;
    }

.sidenav .sidenav-menu .nav .collapse.show .nav-link {
    color: /*#8c227d*/ #333;
    text-align: left;
}

.sidenav .sidenav-menu .nav .nav-link .nav-link-icon {
    padding-right: unset;
}

.sidenav .sidenav-menu .nav .sidenav-menu-nested {
    flex-direction: column;
    margin-left: unset;
    border-left-style: unset;
    border-left-width: unset;
    padding-left: unset;
}

.sidenav .sidenav-menu .nav .nav-link:hover {
    color: #fff;
}

li.loggeduser {
    color: #333;
    font-weight: 600;
    font-size:11px;
}
li.loggeduser i{
    font-size:20px;
}
.bg-gradient-primary-to-secondary {
    background: unset;
    background-image: unset;
}

#layoutSidenav #layoutSidenav_content {
    background: #ececec;
}

.bg-white {
    background: #ececec !important;
}

.topnav.navbar.navbar-expand.shadow.justify-content-between.justify-content-sm-start.navbar-light.bg-white {
    /* box-shadow:unset !important;*/
}

.page-header.page-header-dark .page-header-title {
    color: #8c227d;
    font-weight: bold;
}

.datatable.table-responsive table thead th {
    color: #333;
    background: #ececec;
}

.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    color: #8c227d;
}

a.nav-link {
    color: #ccc;
}

.red {
    color: #e91e63 !important;
}

.table thead th {
    border-bottom: /*1px solid #e0e5ec*/ 0px;
    border-top: 0px;
}

.table-bordered th {
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
}

.table thead th {
    color: #333;
}
th {
    color: #333;
}

.card {
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.16), 0 0px 3px 0 rgba(0, 0, 0, 0.12) !important;
    border: 1px solid #fff !important;
}

.nav-link {
    display: block;
    padding: 0.3rem 0.5rem;
}

.card-body {
    flex: 1 1 auto;
    min-height: 1px;
    padding: 0.4rem;
}

.card:not([class*="bg-"]) .card-header {
    color: #fff;
    /*font-family:'Roboto Slab';*/
    font-weight: 500;
    font-size: 1.01em;
    background: /*#ececec*/ #333;
    /*text-align:center;
    padding: 0.5em !important;*/
}

.table-billing-history th {
    background: #fff;
}

.sidenav {
    font-size: 0.75rem;
}


.sidenav .sidenav-menu .nav .nav-link {
    display: flex;
    align-items: center;
    line-height: normal;
    padding-top: 0.35rem;
    padding-bottom: 0.55rem;
    position: relative;
}


.card-header {
    padding: 0.5rem 0.7rem;

    margin-bottom: 0;
    background-color: rgba(33, 40, 50, 0.03);
    border-bottom: 1px solid rgba(33, 40, 50, 0.125);
}

.card-header {
    background: #3b5998 !important;
}

/*    .card-header.baseinfo {
        background: #ececec !important;
    }
*/
.nav-borders .nav-link.active {
    color: #8c227d;
    /*font-family: 'Roboto Slab';*/
    font-weight: bold;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.16), 0 0px 3px 0 rgba(0, 0, 0, 0.12);
    background: #fff;
    border-radius: 5px;
}

.nav-borders .nav-link.active {
    border-bottom-color: #8c227d;
}

hr {
    border-top: unset;
}

.orange {
    /*color: #e91e63 !important;*/
    color: darkorange !important;
}

.btn {
    font-size: 0.75rem;
    padding: 0.6rem 0.9rem;
}

.btn-primary:focus, .btn-primary.focus {
    color: #fff;
    background-color: #8c227d;
    border-color: #8c227d;
    box-shadow: none;
}



#navbarDropdownUserImage {
    max-height: 32px;
    max-width: 34px;
}

.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus {
    box-shadow: /*0 0 0 0.2rem rgba(128, 38, 207, 0.5)*/ unset;
}

.btn-secondary:hover, .btn-secondary:active {
    background-color: #4765a4 !important;
    border-color: #4765a4 !important;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #8c227d;
    border-color: #8c227d;
}

    .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus {
        box-shadow: /*0 0 0 0.2rem rgba(140, 34, 125, 1)*/ unset;
    }

.btn.save-failed {
    background-color: #e91e63 !important;
}

.btn-primary.btn.save-failed {
    border: 2px solid #e91e63;
    box-shadow: unset;
}

.nav-borders .nav-link {
    font-family: 'Roboto Slab' color:#333;
}

.nav-borders .nav-link {
    padding: 1em;
}

.nav-borders .nav-link {
    margin-right: unset;
}

.nav-borders .nav-link {
    margin-left: 1px;
}

.nav {
    background: #3b5998;
}

    .nav.nav-borders {
        background: #ececec;
    }

#dashboardNav {
    background: #3b5998;
}

.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
    border-color: unset;
}

.nav-tabs .nav-link {
    border: unset;
}

a.nav-link:hover {
    color: #ececec;
}

.nav-borders .nav-link {
    color: #333;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.16), 0 0px 3px 0 rgba(0, 0, 0, 0.12);
    margin-right: 10px;
    border-radius: 5px;
    font-weight: normal;
    margin-top: 10px;
}
.nav-borders .nav-link:hover {
    color: #8c227d;
    background: #fff;
}



.page-header.page-header-light .page-header-title {
    color: #8c227d;
}

a[aria-expanded^="true"] {
    background: #3b5998 !important;
    color: #fff !important;
}

/*a[aria-expanded^="true"] div.nav-link-icon .feather {
    color: #728dc7 !important;
}
*/

a[aria-expanded^="true"] div.nav-link-icon i, a[aria-expanded^="true"] div.nav-link-icon svg {
    color: #728dc7 !important;
}

.btn.save-success {
    box-shadow: unset;
    border: unset;
}

tr[attr-focused="true"] td, tr[attr-focused="true"] th {
    background-color: #fff;
}

.accordion .card .card-header .btn-header-link.active {
    /*background: #333 !important;
    color: #ccc !important;*/
    /*commentati per colorare le fasce nei canali di vendita-pagamenti*/
}

.accordion .card .card-header .btn-header-link.active {
    background: #00ac69 !important;
    color: #fff !important;
}

    .accordion .card .card-header .btn-header-link.active i {
        color: #fff !important;
    }

tr.tr-filters th {
    background: #ececec !important;
}

th.upper {
    background: #333 !important;
    color: #fff !important;
    border-radius: 5px;
    padding: unset;
}

.table-responsive > .table-bordered, .datatable > .table-bordered {
    border: 1px solid #ccc !important;
}

#frm_item_editor label.lbl {
    color: #333;
}

thead tr.tr-filters th, thead th {
    /*background: #ececec;*/
    background-color: #c9d9f2;
}

.table {
    color: #333;
    /*border: 1px solid #ccc;*/
}

ul.sitepanel-menu li a {
    color: #fff;
}

ul.sitepanel-menu li {
    list-style-type: none;
    display: inline-block;
    background-color: #8c227d;
    margin-right: 20px;
    padding: 8px 20px;
    margin-bottom: 10px;
    border-radius: 3px;
}

.modal-header {
    border-bottom: none;
}

    .modal-header h5 {
        color: #8c227d;
    }

ul.sitepanel-menu li:hover i {
    color: #fff;
}

ul.sitepanel-menu li:hover {
    box-shadow: 0 14px 26px -12px rgba(156, 39, 176, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(156, 39, 176, 0.2);
}

.table.table-fontsmall td.number {
    padding-right: 5px !important;
}

table td.actions a.btn i {
    width: 19px;
    height: 19px;
    font-size: 1.2em;
    margin: 0.1em;
}

.table-bordered th {
    border-top: 1px solid #ccc;
    background: #ececec;
}

/*.form-group > .table {
    border: none;
}*/


.form-group {
    margin-bottom: 0.5rem;
    display: inline-block;
}

.form-group > .table th.upper {
    background: #3b5998 !important;
}

.modal-footer, .modal-header {
    background: #ececec;
}

td.number b {
    margin-right: 5px !important;
}

.datepicker td, .datepicker th {
    -webkit-border-radius: /*4px*/ unset !important;
    -moz-border-radius: /*4px*/ unset !important;
    border-radius: /*4px*/ unset !important;
}

.CodeMirror {
    background: #efefef !important;
    border-radius: 5px !important;
    padding: 5px;
}

.variables-box {
    border: none !important;
}

    .variables-box legend {
        background: #efefef;
        padding: 5px;
        width: 100%;
    }

.btn-transparent-dark:hover {
    background-color: #ececec;
}

.orange {
    color: #ff9e0f !important;
}

table td.actions a.btn.btn-danger:hover i {
    color: #f44336 !important;
}

table td.actions a.btn.btn-primary:hover i {
    color: #9c27b0 !important;
}

table td.actions a.btn.btn-secondary:hover i {
    color: #55acee !important;
}

table td.actions a.btn.btn-light:hover i {
    color: #55acee !important;
}

table td.actions a.btn.btn-info:hover i {
    color: #00bcd4 !important;
}

table td.actions a.btn.btn-warning:hover i {
    color: #ff9800 !important;
}


.magenta {
    color: #cf4dcf !important;
}



td.url-copy a i {
    color: #cf4dcf !important;
}

td.url-copy a i:hover {
    color: #8c227d !important;
}



/*.bootstrap-tagsinput .tag {
    background-color: #8c227d;
}*/

#google_serp_preview .h3, .google_serp_preview .h3 {
    color: #0061f2;
}

td.actions .btn-primary {
    box-shadow: unset;
}

.flag-control img {
    margin-right: 3px !important;
}

.shake-custom {
    width: 100%;
    height: auto;
    animation: wave 3s infinite ease-in-out;
    transform-origin: left center; /* La bandiera ondeggia partendo dal lato sinistro */
}

@keyframes wave {
    0% {
        transform: skewY(0deg) rotate(0deg) scaleX(1);
    }

    25% {
        transform: skewY(5deg) rotate(1deg) scaleX(1.02);
    }

    50% {
        transform: skewY(0deg) rotate(0deg) scaleX(1);
    }

    75% {
        transform: skewY(-5deg) rotate(-1deg) scaleX(0.98);
    }

    100% {
        transform: skewY(0deg) rotate(0deg) scaleX(1);
    }
}

/*.shake-custom {*/
    /* Start the shake animation and make the animation last for 0.5 seconds */
    /*animation: shake 1.5s;*/
    /* When the animation is finished, start again */
    /*animation-iteration-count: infinite;
}

@keyframes shake {
    0% {
        transform: translate(1px, 1px) rotate(0deg);
    }

    10% {
        transform: translate(-1px, -2px) rotate(-1deg);
    }

    20% {
        transform: translate(-2px, 0px) rotate(1deg);
    }

    30% {
        transform: translate(2px, 2px) rotate(0deg);
    }

    40% {
        transform: translate(1px, -1px) rotate(1deg);
    }

    50% {
        transform: translate(-1px, 2px) rotate(-1deg);
    }

    60% {
        transform: translate(-2px, 1px) rotate(0deg);
    }

    70% {
        transform: translate(2px, 1px) rotate(-1deg);
    }

    80% {
        transform: translate(-1px, -1px) rotate(1deg);
    }

    90% {
        transform: translate(1px, 2px) rotate(0deg);
    }

    100% {
        transform: translate(1px, -2px) rotate(-1deg);
    }
}*/


td.actions .btn-warning:hover, .btn-warning:active {
    color: #fff;
    background-color: #ececec !important;
    border-color: #ececec !important;
}
/*a[aria-expanded^="true"] :before {
    color: #ccc;
}*/


.dropdown-menu.show {
    border: 3px solid #666;
}

table a[aria-expanded^="true"] {
    background: #ececec !important;
}

/*.card-header > form .form-group > label:first-child {
    color: #fff;
}*/

td.actions a:hover {
    background-color: transparent !important;
}

.border-bottom {
    border-bottom: 1px solid #ccc !important;
}

ul.sitepanel-menu li a {
    color: #fff;
    background-color: #8c227d;
    border-color: #8c227d;
    box-shadow: 0 2px 2px 0 rgba(156, 39, 176, 0.14), 0 3px 1px -2px rgba(156, 39, 176, 0.2), 0 1px 5px 0 rgba(156, 39, 176, 0.12);
    padding: 1em;
    border-radius: 0.35rem;
}

    ul.sitepanel-menu li a:hover {
        background-color: #8c227d;
        border-color: #8c227d;
        box-shadow: 0 14px 26px -12px rgba(156, 39, 176, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(156, 39, 176, 0.2);
    }

ul.sitepanel-menu li {
    background: unset;
    padding: unset;
}

ul.sitepanel-menu {
    text-align: right;
}


.pb-3, .py-3 {
    padding-bottom: 2rem !important;
    padding-top: 0.7rem !important;
}

.accordion .card .card-header .btn-header-link:hover i {
    color: unset;
}

.accordion .card .card-header .btn-header-link {
    border-bottom: none;
}

.accordion .card .card-header .btn-header-link {
    color: #333 !important;
}

.fs-themes {
    border: unset;
    border-bottom: 3px solid #ccc;
}

    .fs-themes legend {
        color: #8b217c;
        /*font-family: 'Roboto Slab';*/
        font-size: 21px;
        font-weight: 700;
    }

.ul-themes li {
    border: unset;
    background: #ececec;
}

    .ul-themes li label.selected {
        color: #e91e63;
        font-weight: 600;
    }

    .ul-themes li label {
        font-size: 16px;
    }

.explain span {
    font-size: 14px !important;
}

div.logo-position img {
    width: auto;
    height: 100%;
}

div.logo-position {
    border: solid 1px #ccc;
    width: 590px;
    height: 110px;
    overflow: hidden;
    position: relative;
    text-align: center;
    background: #e1eaf1;
}

img.settings-main-logo {
    width: unset;
    height: 110px;
}



/* THEME COLORS AREA */
#theme_colors div.properties-container {
    border-left: solid 1px #ccc;
    background: #ececec;
    border-radius: 0.35rem;
    font-size: 12px;
    padding: unset;
    margin: 5px;
    height:100%;
}

#theme_colors td.color-td {
    text-align: center;
    width: 0px;
}
#theme_colors td.help-td {
    text-align: center;
    width: 0px;
}

#theme_colors div th {
    font-size: 16px;
    color: #fff;
    Background: #333;
    border-radius: 0.35rem 0.35rem 0rem 0rem;
}

#theme_colors div td {
    border-bottom: 1px solid #fff;
}

#theme_colors div td span.help-tip.tooltipstered {
    position: unset !important;
}


/*PROJECT ROOT CSS AREA*/
#project_variables div.properties-container {
    border-left: solid 1px #ccc;
    background: #ececec;
    border-radius: 0.35rem;
    font-size: 12px;
    padding: unset;
    margin: 5px;
    height: 100%;
}

#project_variables td.color-td {
    text-align: center;
    width: 0px;
}

#project_variables td.help-td {
    text-align: center;
    width: 0px;
}

#project_variables div th {
    font-size: 16px;
    color: #fff;
    Background: #333;
    border-radius: 0.35rem 0.35rem 0rem 0rem;
}

#project_variables div td {
    border-bottom: 1px solid #fff;
}

#project_variables div td span.help-tip.tooltipstered {
    position: unset !important;
}




.btn.btn-warning {
    color: #fff;
    border-color: #f08f00;
    background-color: #f08f00;
}
    /*.btn.btn-warning:focus,*/
    .btn.btn-warning:active, .btn.btn-warning:hover {
        box-shadow: none /*0 14px 26px -12px rgba(255, 152, 0, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(255, 152, 0, 0.2)*/;
        background: #f29c1d !important;
        border-color: #f29c1d !important;
    }

.btn:active i, .btn:hover i {
    color: #fff;
}

.actions .btn.btn-warning:hover {
    box-shadow: unset;
}

.card-header.bg-light .dropdown-menu li label {
    color: #333 !important;
}

.card-header button.btn.btn-primary, .card-header a.btn.btn-primary {
    color: #fff;
    /* background-color: #55acee;
    border-color: #55acee;*/
    box-shadow: unset /*0 14px 26px -12px rgba(85, 172, 238, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(85, 172, 238, 0.2)*/;
}

    .card-header button.btn.btn-primary:hover, .card-header a.btn.btn-primary:hover {
        background: #923885;
    }

div.images-box-comands a {
    float: right;
    font-size: 13px;
    text-decoration: none;
    /* padding: 0px 10px; */
    font-weight: 500;
    background: #ececec;
    padding: 2px;
    border-radius: 5px;
    margin-left: 10px;
    border: 1px solid #ececec;
    color: #333;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.16), 0 0px 3px 0 rgba(0, 0, 0, 0.12);
}

div.images-box-comands a:hover {
    background: #fff;
    color: #8c227d;
}

.table-pricelist td.text-center a.btn i {
    margin-right: 0px !important;
}

div.serp-content {
    width: 100%;
    padding: 5px;
    border: 3px solid #ececec;
    max-width: 500px;
    background: #ececec;
    border-radius: 5px;
}

tr:hover div.serp-content {
    border: 3px solid #fff;
}

.table-hover tr:hover img {
    opacity: 0.5;
}

.table-hover tr:hover td.img {
    background: #ececec;
}

/*.table.table_summary td {
    padding: 5px !important;
}*/

.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #3b5998;
}

    .dropdown-item.active i, .dropdown-item:active i {
        color: #fff;
    }

.version-value-selector button.btn {
    padding: 5px 7px !important;
}

a.btn.btn-primary.small-edit {
    box-shadow: none;
}

.btn-info {
    color: #fff;
    background-color: #00aaaf;
    border-color: #009da2;
}

    .btn-info:hover {
        color: #fff;
        background-color: #00cfd5;
        border-color: #00cfd5;
    }

a.btn.btn-primary.small-edit:hover {
    color: #fff !important;
    background: #af5fa4 !important;
    border: 1px solid #af5fa4 !important;
}

    a.btn.btn-primary.small-edit:hover 1 {
        color: #fff !important;
    }


.card-header button.btn.btn-primary:active {
    background-color: #55acee;
    border-color: #55acee;
}

.card-header button.btn.btn-primary:focus {
    background-color: #47a5ed;
    border-color: #1d91e8;
}

.btn.save-success:hover {
    background-color: #00ac69 !important;
    color: #fff !important;
    font-style: italic;
    box-shadow: 0 14px 26px -12px rgba(76, 175, 80, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(76, 175, 80, 0.2);
}

.btn.save-failed.save-required {
    border: none;
}

    .btn.save-failed.save-required:hover {
        background-color: #e91e63 !important;
        color: #fff !important;
        font-style: italic;
        box-shadow: 0 14px 26px -12px rgba(233, 30, 99, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(233, 30, 99, 0.2);
        border: none;
    }

    .btn-warning:focus, .btn-warning.focus, .btn.save-failed.save-required:focus, .btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-warning.dropdown-toggle:focus {
        box-shadow: unset !important;
    }

#maincontent .sidenav-light {
    margin-left: 1em !important;
}

#maincontent .sidenav .sidenav-menu .nav div.collapse.show .nav-link {
    background: #fff !important;
    border-bottom: 1px solid #ccc !important;
    cursor: pointer;
    color: #333;
    padding: 1em;
}

    #maincontent .sidenav .sidenav-menu .nav div.collapse.show .nav-link:hover {
        background: #ececec !important;
    }

#maincontent .sidenav .sidenav-menu .nav .nav-link {
    background: #3b5998;
    color: #fff;
    cursor: default;
}

    #maincontent .sidenav .sidenav-menu .nav .nav-link .nav-link-icon .feather {
        color: #728dc7;
        margin-top: 0.8em;
    }

    #maincontent .sidenav .sidenav-menu .nav .nav-link .nav-link-icon {
        height: 40px;
    }

th.img {
    background: #ccc;
}

td.actions.mini, th.actions.mini {
    width: 124px !important;
}

/*.card-header.baseinfo .form-group a.btn.btn-warning {
    margin-top: 2em;
}*/

th.actions.mini {
    opacity: unset;
}

table.table-order-head {
    border: none;
}

.form-group > a:not(.btn):not([href]) {
    background: #ececec;
    padding: 10px;
    color: #333;
    border-radius: 5px;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.16), 0 0px 3px 0 rgba(0, 0, 0, 0.12);
    border: 1px solid #ececec;
}

.form-group > a:not(.btn):hover {
    background: #fff;
    color: #8c227d;
}

fieldset.fs-onepagesettings {
    border: unset;
    padding: /*10px*/ 0px;
    font-size: 13px;
    height: calc(100%);
    background: #ececec;
}

#alerts_counter {
    background-color: #e91e63;
}

.table td.actions a.btn-danger i {
    color: #e91e63;
}

fieldset.fs-onepagesettings ul li {
    padding: 0px 5px;
}

fieldset.fs-onepagesettings legend {
    font-size: 16px;
    font-weight: 600;
    display: block;
    width: 100%;
    padding: 0px 10px;
    background: #333;
    color: #fff;
}

th.actions a.btn i {
    margin-right: unset;
}

a.page-header-title i {
    color: #333;
}

.page-header-compact .page-header-content .page-header-title .page-header-icon .feather {
    height: 1.5rem;
    width: 1.5rem;
    color: #333;
}

.table-hover tbody tr:hover {
    color: unset;
    background-color: #ececec;
}


.table-bordered th, .table-bordered td {
    border: 1px dotted #555;
}


/*.table-hover tbody tr:hover td {
    border-color: #eee !important;
}
*/
.table-hover tbody tr:hover td span.badge.badge-light {
    color: #ddd;
    background-color: #f9fabb;
}

.card-header.bg-light {
    /*background:#ccc !important;*/
}

/*    .card-header.bg-light label {
        color: #fff;
    }*/

label.inrow-label {
    color: #333 !important;
}

td.actions a.btn i {
    color: #666 !important;
}

fieldset.fs-simple {
    border: unset;
}

    fieldset.fs-simple legend {
        font-size: 16px;
        display: block;
        width: auto;
        padding: 10px;
        font-weight: 600;
        background: #3b5998;
        width: 100%;
        color: #fff;
    }

label.td-label {
    color: #333 !important;
}

.accordion .card .card-header .btn-header-link {
    background: #ececec !important;
}

.sidenav .sidenav-menu .nav .collapse.show .nav-link.active {
    color: #8c227d;
}

a.new-channel {
    background-color: #3b5998 !important;
    border-color: #3b5998 !important;
    box-shadow: none;
}

    a.new-channel:hover {
        background: #5672ad !important;
        border-color: #5672ad !important;
        box-shadow: none;
    }


    a.new-channel i {
        color: #fff !important;
    }

    a.new-channel i {
        color: #fff !important;
    }

th.actions > a:hover i {
    color: #fff;
}
/*marketplace-join*/
a.new-channel.marketplace-join {
    background: #55acee !important;
    border-color: #55acee !important;
    box-shadow: none;
}

    a.new-channel.marketplace-join:hover {
        background: #77bcf0 !important;
        border-color: #77bcf0 !important;
        box-shadow: none;
    }

    a.new-channel.marketplace-join i {
        color: #fff !important;
    }

    a.new-channel.marketplace-join:hover i {
        color: #fff !important;
    }
/*b2b*/
a.new-channel.b2b {
    background: #4caf50 !important;
    border-color: #4caf50 !important;
    box-shadow: none;
}

    a.new-channel.b2b:hover {
        background: #59be5d !important;
        border-color: #4caf50 !important;
        box-shadow: none;
    }

    a.new-channel.b2b i {
        color: #fff !important;
    }

    a.new-channel.b2b:hover i {
        color: #fff !important;
    }
/*marketplace*/
a.new-channel.marketplace {
    background: #cf4dcf !important;
    border-color: #cf4dcf !important;
    box-shadow: none;
}

    a.new-channel.marketplace:hover {
        background: #db77db !important;
        border-color: #db77db !important;
        box-shadow: none;
    }

    a.new-channel.marketplace i {
        color: #fff !important;
    }

    a.new-channel.marketplace:hover i {
        color: #fff !important;
    }
/*amazon*/
a.new-channel.amazon {
    background: #fe9b31 !important;
    border-color: #fe9b31 !important;
    box-shadow: none;
}

    a.new-channel.amazon:hover {
        background: #fdb03e !important;
        border-color: #fdb03e !important;
        box-shadow: none;
    }

    a.new-channel.amazon i {
        color: #fff !important;
    }

    a.new-channel.amazon:hover i {
        color: #fff !important;
    }
/*ebay*/
a.new-channel.ebay {
    background: #e43137 !important;
    border-color: #e43137 !important;
    box-shadow: none;
}

    a.new-channel.ebay:hover {
        background: #e95156 !important;
        border-color: #e95156 !important;
        box-shadow: none;
    }

    a.new-channel.ebay i {
        color: #fff !important;
    }

    a.new-channel.ebay:hover i {
        color: #fff !important;
    }

.input-group-text {
    background: #ebebeb;
    color: #3b5998;
    width: 30px;
    padding: 7px;
}

.specifications-box > .table {
    border: none !important;
}

div.specifications-box {
    border: none !important;
}


a.idlist-selector {
    text-decoration: none;
    background: #ececec;
    border: 1px solid #ececec;
    /*padding: 10px;*/
    border-radius: 5px;
    text-align: center;
    color: #333;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.16), 0 0px 3px 0 rgba(0, 0, 0, 0.12)
}

    a.idlist-selector:hover {
        background: #fff;
        border: 1px solid #ececec;
        color: #8c227d;
    }



/*MEDIA*/
@media (min-width: 992px) {
    .col-lg-3 {
        flex: 0 0 24.3%;
        max-width: 24.3%;
    }
}

@media (max-width: 384px) {
    .topnav .navbar-brand img {
        width: 100px;
    }

    .btn .feather {
        margin-top: -1px;
        height: 1rem;
        width: 1rem;
    }

    ul.sitepanel-menu {
        text-align: center;
    }

        ul.sitepanel-menu li {
            margin-bottom: 0.5em;
        }

    ul.sitepanel-menu {
        padding-left: 1em;
    }

        ul.sitepanel-menu li {
            display: block;
        }

    .container, .container-fluid, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {
        padding-left: 0rem;
        padding-right: 0rem;
    }

    ul.sitepanel-menu li a {
        display: block;
    }

    .sidenav-light .sidenav-menu .sidenav-menu-heading {
        color: #333;
    }

    #maincontent {
        margin-left: 1.5em;
    }

    #dashboardNav li {
        display: block;
        width: 100%;
        text-align: center;
        border-bottom: 1px solid #fff;
    }

    .card .card-header .card-header-tabs .nav-link.active {
        border-radius: unset;
    }

    .mr-1, .mx-1 {
        margin-right: unset !important;
    }

    .footer.footer-light {
        color: #212832;
        padding: 1em;
        text-align: center;
    }

    #maincontent {
        margin-left: unset;
    }

    .navbar-brand img {
        display: none;
    }

    .navbar-brand {
        background: url('/assets/img/Markeplay-logo-small.svg') top left no-repeat;
        height: 50px;
        width: 50px;
        display: block;
        margin-left: 5px !important;
    }

    .topnav .navbar-brand {
        width: unset;
        margin-top: 10px !important;
    }

    .container a.nav-link {
        display: block !important;
        width: 100%;
        text-align: center;
        text-transform: uppercase;
        border-bottom: 1px solid #fff;
    }

    .page-header .page-header-content .page-header-title {
        font-size: 18px !important;
    }

    .card-header-actions .card-header .btn {
        padding: 5px !important;
    }

    .card-body {
        text-align: center !important;
    }

        .card-body div.h3.d-flex {
            display: block !important;
        }

    .row {
        margin-right: unset;
        margin-left: unset;
    }

    .text-right {
        text-align: center !important;
    }

    th.img {
        background: #ececec;
    }

    .page-header-content div.align-items-center.justify-content-between {
        padding: 15px !important;
    }

    table#vfs_browser th.actions {
        text-align: left !important;
        width: 100%;
    }

    #TicketsMenuNav a {
        display: inline-block !important;
    }

    .sidenav.shadow-right.sidenav-light.tickets-nav {
        width: 100%;
    }

    .card.tickets-body {
        width: 100%;
        margin: 5px !important;
    }

    #maincontent .sidenav-light {
        margin: 5px auto !important;
    }

    #maincontent .sidenav .sidenav-menu .nav div.collapse.show .nav-link:hover {
        background: #ececec !important;
    }

    .card:not([class*="bg-"]) .card-header {
        text-align: center;
    }

    .form-group input, .form-group select {
        width: 100% !important;
    }

    select.form-control.auto, option {
        width: 100% !important;
        text-align: center !important;
    }

    .modal-dialog.modal-dialog-centered {
        width: unset !important;
    }

    a.small-edit {
        margin-top: 10px;
    }
}









/*EDITOR VUE*/
#item-sheets {
    background: none;
}

#item-sheets li {
	margin-right: 10px;
}
#item-sheets li a {
	background-color: #f2f6fc !important;
	color: black;
	background: no-repeat;
	/* text-decoration: underline !important; */
	font-weight: bold;
	border-radius: 3px;
	padding: 4px 20px;
}

#item-sheets li a.active{
    background-color:#c9d9f2 !important;
}

div.editor-spacer {
    display: block;
    width: 100%;
    border: solid 1px #999;
}

div.editor-spacer .spacer-icon {
    position: absolute;
    right: 3px;
    top: -2px;
    cursor:help;
    color:#3b5998 !important;
    z-index:10;
}
div.editor-spacer .spacer-icon i, div.editor-spacer .spacer-icon i:hover {
    color: #3b5998 !important;
}


a.btn.formula {
    padding: 4px 5px;
    text-align: center;
    width: auto;
}
a.btn.formula i:first-child{
    margin:0px;
}

td.w-150px .bootstrap-tagsinput{
    width:150px !important;
}


#image_overlap_container #image-container {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

#image_overlap_container #draggable-div {
    position: absolute;
    width: 150px;
    height: 100px;
    background-color: #ddd;
    opacity: 0.5;
    border: dotted 1px #000;
    cursor: move;
    left: 0px;
    top: 0px;
    vertical-align: middle;
}

#image_overlap_container .resize-handle {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #333;
}

#image_overlap_container .resize-handle.br {
    bottom: 0;
    right: 0;
    cursor: nwse-resize;
}

i.editor-error-badge {
    font-size: 18px;
    margin-top: -2px;
    margin-right: -12px;
}
.form-group span.field-has-error {
    margin: 3px 0px 0px 0px;
}



.in-text{
    position:relative;
    display:block;
}
.in-text .floating-label::after{
    content:":";
}
.in-text .floating-label {
	position: absolute;
	top: 1%;
	left: 5px;
	/* transform: translateY(-50%); */
	color: #000;
	transition: all 0.2s ease;
	pointer-events: none;
	font-weight: 500 !important;
	margin: 0px !important;
	font-size: 0.65rem;
	text-transform: lowercase;
}

.in-text .floating-label.link-style {
    color: #3b5998;
    text-decoration: underline;
}

/*.in-text .label-active {
    top: -10px;
    left: 10px;
    font-size: 12px;
    color: #333;
}*/


.in-text .form-control[type="text"], .in-text .form-control[type="tel"] {
	padding-top: 18px !important;
	padding-bottom: 1px !important;
	color: #333;
	font-size: 12px;
}

.in-text span.label {
    display: block;
    padding-top: 18px !important;
    padding-left:.425rem;
    padding-right:.425rem;
    color: #777;
    font-size: 12px;
    font-weight: 400;
    border-radius: 0.15rem;
    border: 1px solid #c5ccd6;
}


.badge.badge-tag {
    background-color: #717dd9;
    color:#fff;
}

element {
    width: 50px;
    float: right;
    text-align: right;
    font-size: 22px;
}


.vueeditor.overlay-area {
    position: absolute;
    width: calc(100% + 15px);
    height: calc(100% + 47px);
    opacity: 0.5;
    z-index: 10;
    background: #000;
    margin-left: -17px;
    margin-top: -56px;
    user-select: none;
}

.vueeditor.overlay-unlock {
    z-index: 20;
    display: block;
    font-weight: bold;
    text-align: center;
    width:100%;
    user-select: none;
}

.ul-simple.editor-buttons a.btn{
    border-radius:3px;
}
.ul-simple.editor-buttons a.btn.active {
    border: solid 1px #666 !important;
    font-weight: bold;
    color: #000;
}