@import "https://fonts.googleapis.com/css2?family=Open+Sans&display=swap";

html, body {
    font-family: "Open Sans", sans-serif;
    font-weight: 300
}

html {
    font-size: 100%
}

body {
    line-height: 1.125em;
    font-size: 1rem
}

@viewport {
    width: device-width
}

.clearfix:before, .clearfix:after {
    content: " ";
    display: block;
    height: 0;
    overflow: hidden
}

.clearfix:after {
    clear: both
}

.clearfix {
    zoom: 1
}

.left {
    float: left
}

.right {
    float: right
}

* {
    outline: 0px transparent !important
}

html {
    margin: 0;
    padding: 0;
    height: 100%
}

html body {
    margin: 0;
    padding: 0
}

html body #pg {
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100%;
    background: #f4f4f4
}

p {
    margin: 0 0 11px 0;
    line-height: 1.375em
}

b, strong {
    font-weight: bold
}

a, a:link, a:visited {
    text-decoration: none;
    color: #5873b1
}

a:hover {
    color: #445c92
}

hr {
    border: 0;
    height: 1px;
    background: #b4b4b4
}

.nowrap {
    white-space: nowrap
}

.bootstrap-table .fixed-table-container .fixed-table-body {
    height: auto
}

.w100 {
    width: 100% !important
}

.w90 {
    width: 90% !important
}

.w80 {
    width: 80% !important
}

.w75 {
    width: 75% !important
}

.w70 {
    width: 70% !important
}

.w66 {
    width: 66.6666% !important
}

.w60 {
    width: 60% !important
}

.w50 {
    width: 50% !important
}

.w40 {
    width: 40% !important
}

.w33 {
    width: 33.3333% !important
}

.w30 {
    width: 30% !important
}

.w25 {
    width: 25% !important
}

.w20 {
    width: 20% !important
}

.w10 {
    width: 10% !important
}

.minw25 {
    min-width: 25% !important
}

.rw100, .rw90, .rw80, .rw75, .rw70, .rw66, .rw60, .rw50, .rw40, .rw33, .rw30, .rw25, .rw20, .rw10 {
    width: 100% !important
}

@media (min-width: 768px) {
    .rw100 {
        width: 100% !important
    }

    .rw90 {
        width: 90% !important
    }

    .rw80 {
        width: 80% !important
    }

    .rw75 {
        width: 75% !important
    }

    .rw70 {
        width: 70% !important
    }

    .rw66 {
        width: 66.6666% !important
    }

    .rw60 {
        width: 60% !important
    }

    .rw50 {
        width: 50% !important
    }

    .rw40 {
        width: 40% !important
    }

    .rw33 {
        width: 33.3333% !important
    }

    .rw30 {
        width: 30% !important
    }

    .rw25 {
        width: 25% !important
    }

    .rw20 {
        width: 20% !important
    }

    .rw10 {
        width: 10% !important
    }
}

button.btn, a.btn, .btn {
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    outline: 0;
    margin: 0 auto 0 0;
    padding-top: calc(11px - 1px);
    padding-bottom: calc(11px - 1px);
    padding-left: calc(22px - 1px);
    padding-right: calc(22px - 1px);
    border: 1px solid #b4b4b4;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 2.75px 2.75px 0 rgba(0, 0, 0, .1);
    line-height: 22px;
    font-weight: 300;
    color: #000
}
button.btn:not(.cancelBtn):not(.applyBtn),
a.btn:not(.cancelBtn):not(.applyBtn),
.btn:not(.cancelBtn):not(.applyBtn) {
    /* Your existing styles here */

    /* Override the display property for elements without the class cancelBtn and applyBtn */
    display: flex;
}



button.btn .icon, a.btn .icon, .btn .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 11px 0 0;
    width: 22px;
    height: 22px;
    color: #5c5c5c
}

button.btn .icon img, button.btn .icon svg, a.btn .icon img, a.btn .icon svg, .btn .icon img, .btn .icon svg {
    width: 100%;
    height: 100%;
    object-fit: contain
}

button.btn .icon svg, a.btn .icon svg, .btn .icon svg {
    filter: invert(12%) sepia(37%) saturate(3713%) hue-rotate(190deg) brightness(96%) contrast(98%)
}

button.btn .icon i, a.btn .icon i, .btn .icon i {
    vertical-align: middle;
    line-height: inherit
}

button.btn .icon:last-child, a.btn .icon:last-child, .btn .icon:last-child {
    margin-right: 0
}

button.btn .text, a.btn .text, .btn .text {
    display: inline-block;
    vertical-align: middle
}

button.btn:active, button.btn:focus, button.btn:hover, a.btn:active, a.btn:focus, a.btn:hover, .btn:active, .btn:focus, .btn:hover {
    outline: 0;
    box-shadow: none;
    border-color: #022f54;
    background: #022f54;
    color: #fff
}

button.btn:active .icon img, button.btn:active .icon svg, button.btn:focus .icon img, button.btn:focus .icon svg, button.btn:hover .icon img, button.btn:hover .icon svg, a.btn:active .icon img, a.btn:active .icon svg, a.btn:focus .icon img, a.btn:focus .icon svg, a.btn:hover .icon img, a.btn:hover .icon svg, .btn:active .icon img, .btn:active .icon svg, .btn:focus .icon img, .btn:focus .icon svg, .btn:hover .icon img, .btn:hover .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

button.btn.btn-sm, a.btn.btn-sm, .btn.btn-sm {
    padding: 5.5px 11px;
    font-size: .875em
}

button.btn.btn-sm .icon, a.btn.btn-sm .icon, .btn.btn-sm .icon {
    margin-right: 8.25px;
    width: 16.5px;
    height: 16.5px
}

button.btn.btn-sm .icon:last-child, a.btn.btn-sm .icon:last-child, .btn.btn-sm .icon:last-child {
    margin-right: 0
}

button.btn.btn-sm:last-child, a.btn.btn-sm:last-child, .btn.btn-sm:last-child {
    margin-right: 0
}

button.btn.btn-lg, a.btn.btn-lg, .btn.btn-lg {
    padding: 16.5px 22px;
    font-size: 1.2em
}

button.btn.btn-default:focus, button.btn.btn-default:active, button.btn.btn-default:hover, a.btn.btn-default:focus, a.btn.btn-default:active, a.btn.btn-default:hover, .btn.btn-default:focus, .btn.btn-default:active, .btn.btn-default:hover {
    border-color: #022f54;
    background: #022f54;
    color: #fff
}

button.btn.btn-default:focus .icon, button.btn.btn-default:focus .glyphicon, button.btn.btn-default:active .icon, button.btn.btn-default:active .glyphicon, button.btn.btn-default:hover .icon, button.btn.btn-default:hover .glyphicon, a.btn.btn-default:focus .icon, a.btn.btn-default:focus .glyphicon, a.btn.btn-default:active .icon, a.btn.btn-default:active .glyphicon, a.btn.btn-default:hover .icon, a.btn.btn-default:hover .glyphicon, .btn.btn-default:focus .icon, .btn.btn-default:focus .glyphicon, .btn.btn-default:active .icon, .btn.btn-default:active .glyphicon, .btn.btn-default:hover .icon, .btn.btn-default:hover .glyphicon {
    color: #fff
}

button.btn.btn-default:focus:focus, button.btn.btn-default:focus:active, button.btn.btn-default:active:focus, button.btn.btn-default:active:active, button.btn.btn-default:hover:focus, button.btn.btn-default:hover:active, a.btn.btn-default:focus:focus, a.btn.btn-default:focus:active, a.btn.btn-default:active:focus, a.btn.btn-default:active:active, a.btn.btn-default:hover:focus, a.btn.btn-default:hover:active, .btn.btn-default:focus:focus, .btn.btn-default:focus:active, .btn.btn-default:active:focus, .btn.btn-default:active:active, .btn.btn-default:hover:focus, .btn.btn-default:hover:active {
    outline: 0;
    color: #fff
}

button.btn.btn-default:focus:focus .icon, button.btn.btn-default:focus:focus .glyphicon, button.btn.btn-default:focus:active .icon, button.btn.btn-default:focus:active .glyphicon, button.btn.btn-default:active:focus .icon, button.btn.btn-default:active:focus .glyphicon, button.btn.btn-default:active:active .icon, button.btn.btn-default:active:active .glyphicon, button.btn.btn-default:hover:focus .icon, button.btn.btn-default:hover:focus .glyphicon, button.btn.btn-default:hover:active .icon, button.btn.btn-default:hover:active .glyphicon, a.btn.btn-default:focus:focus .icon, a.btn.btn-default:focus:focus .glyphicon, a.btn.btn-default:focus:active .icon, a.btn.btn-default:focus:active .glyphicon, a.btn.btn-default:active:focus .icon, a.btn.btn-default:active:focus .glyphicon, a.btn.btn-default:active:active .icon, a.btn.btn-default:active:active .glyphicon, a.btn.btn-default:hover:focus .icon, a.btn.btn-default:hover:focus .glyphicon, a.btn.btn-default:hover:active .icon, a.btn.btn-default:hover:active .glyphicon, .btn.btn-default:focus:focus .icon, .btn.btn-default:focus:focus .glyphicon, .btn.btn-default:focus:active .icon, .btn.btn-default:focus:active .glyphicon, .btn.btn-default:active:focus .icon, .btn.btn-default:active:focus .glyphicon, .btn.btn-default:active:active .icon, .btn.btn-default:active:active .glyphicon, .btn.btn-default:hover:focus .icon, .btn.btn-default:hover:focus .glyphicon, .btn.btn-default:hover:active .icon, .btn.btn-default:hover:active .glyphicon {
    color: #fff
}

button.btn.btn-primary, a.btn.btn-primary, .btn.btn-primary {
    border-color: #18243a;
    background: #18243a;
    font-weight: bold;
    color: #fff
}

button.btn.btn-primary .icon svg, a.btn.btn-primary .icon svg, .btn.btn-primary .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

button.btn.btn-primary:active, button.btn.btn-primary:focus, button.btn.btn-primary:hover, a.btn.btn-primary:active, a.btn.btn-primary:focus, a.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus, .btn.btn-primary:hover {
    border-color: #022f54;
    background: #022f54
}

button.btn.btn-secondary, a.btn.btn-secondary, .btn.btn-secondary {
    border-color: #b4b4b4;
    background: #fbfbfb;
    color: #18243a
}

button.btn.btn-secondary .icon svg, a.btn.btn-secondary .icon svg, .btn.btn-secondary .icon svg {
    filter: invert(12%) sepia(37%) saturate(3713%) hue-rotate(190deg) brightness(96%) contrast(98%)
}

button.btn.btn-secondary:active, button.btn.btn-secondary:focus, button.btn.btn-secondary:hover, a.btn.btn-secondary:active, a.btn.btn-secondary:focus, a.btn.btn-secondary:hover, .btn.btn-secondary:active, .btn.btn-secondary:focus, .btn.btn-secondary:hover {
    border-color: #022f54;
    background: #022f54;
    color: #fff
}

button.btn.btn-secondary:active .icon svg, button.btn.btn-secondary:focus .icon svg, button.btn.btn-secondary:hover .icon svg, a.btn.btn-secondary:active .icon svg, a.btn.btn-secondary:focus .icon svg, a.btn.btn-secondary:hover .icon svg, .btn.btn-secondary:active .icon svg, .btn.btn-secondary:focus .icon svg, .btn.btn-secondary:hover .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

button.btn.btn-deactivate:hover, a.btn.btn-deactivate:hover, .btn.btn-deactivate:hover {
    border-color: #212121 !important;
    background-color: #212121 !important
}

button.btn.btn-deactivate:hover .icon, a.btn.btn-deactivate:hover .icon, .btn.btn-deactivate:hover .icon {
    color: #fff !important
}

button.btn.btn-deactivate:hover .text, a.btn.btn-deactivate:hover .text, .btn.btn-deactivate:hover .text {
    color: #fff !important
}

button.btn.btn-cancel:hover, button.btn.btn-delete:hover, a.btn.btn-cancel:hover, a.btn.btn-delete:hover, .btn.btn-cancel:hover, .btn.btn-delete:hover {
    border-color: #c00 !important;
    background-color: #c00 !important
}

button.btn.btn-cancel:hover .icon, button.btn.btn-delete:hover .icon, a.btn.btn-cancel:hover .icon, a.btn.btn-delete:hover .icon, .btn.btn-cancel:hover .icon, .btn.btn-delete:hover .icon {
    color: #fff !important
}

button.btn.btn-cancel:hover .text, button.btn.btn-delete:hover .text, a.btn.btn-cancel:hover .text, a.btn.btn-delete:hover .text, .btn.btn-cancel:hover .text, .btn.btn-delete:hover .text {
    color: #fff !important
}

button.btn.btn-reactivate:hover, button.btn.btn-ok:hover, a.btn.btn-reactivate:hover, a.btn.btn-ok:hover, .btn.btn-reactivate:hover, .btn.btn-ok:hover {
    border-color: #00b300 !important;
    background-color: #00b300 !important
}

button.btn.btn-reactivate:hover .icon, button.btn.btn-ok:hover .icon, a.btn.btn-reactivate:hover .icon, a.btn.btn-ok:hover .icon, .btn.btn-reactivate:hover .icon, .btn.btn-ok:hover .icon {
    color: #fff !important
}

button.btn.btn-reactivate:hover .text, button.btn.btn-ok:hover .text, a.btn.btn-reactivate:hover .text, a.btn.btn-ok:hover .text, .btn.btn-reactivate:hover .text, .btn.btn-ok:hover .text {
    color: #fff !important
}

button.btn.btn-password-showhide .on, a.btn.btn-password-showhide .on, .btn.btn-password-showhide .on {
    display: none
}

button.btn.btn-password-showhide .off, a.btn.btn-password-showhide .off, .btn.btn-password-showhide .off {
    display: inline-block
}

button.btn.btn-password-showhide.active .on, a.btn.btn-password-showhide.active .on, .btn.btn-password-showhide.active .on {
    display: inline-block
}

button.btn.btn-password-showhide.active .off, a.btn.btn-password-showhide.active .off, .btn.btn-password-showhide.active .off {
    display: none
}

button.btn:disabled, a.btn:disabled, .btn:disabled {
    cursor: not-allowed
}

button.btn:disabled .icon svg, a.btn:disabled .icon svg, .btn:disabled .icon svg {
    filter: invert(92%) sepia(0%) saturate(8%) hue-rotate(150deg) brightness(85%) contrast(80%)
}

form {
    margin: 0
}

.form-intro {
    margin: 0 0 33px 0;
    border-bottom: 1px solid #cfcfcf;
    padding: 0 0 22px 0
}

.form-intro p {
    line-height: 1.5em
}

fieldset {
    margin: 0 0 33px 0;
    border-bottom: 1px solid #cfcfcf;
    padding: 0 0 33px 0
}

fieldset legend {
    float: none;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin: 0 0 11px 0;
    font-size: 1.2em
}

fieldset legend .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 8.25px 0 0;
    border-radius: 50%;
    padding: 8.25px;
    width: 33px;
    height: 33px;
    background: #022f54
}

fieldset legend .icon img, fieldset legend .icon svg {
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: contain;
    width: 100%;
    height: 100%
}

fieldset legend .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

.form-group {
    margin: 0 0 16.5px 0
}

.form-label {
    margin: 0 0 2.75px 0;
    margin: 0;
    min-height: 22px;
    font-size: .9em
}

.form-label.title {
    margin: auto;
    width: 100%
}

.form-control {
    border-color: #b4b4b4;
    border-radius: 6px;
    padding: 0 11px;
    min-height: 44px;
    min-width: 0;
    line-height: 22px;
    font-size: 1em;
    color: #000
}

.form-control:disabled, .form-control[readonly] {
    background-color: #f4f4f4;
    color: #4b4b4b;
    cursor: not-allowed
}

.form-control.form-control-sm {
    min-height: 33px;
    line-height: 22px;
    font-size: .9em
}

input::-ms-clear, input::-ms-reveal {
    display: none
}

input[type=file].form-control {
    position: relative;
    line-height: 44px
}

textarea.form-control {
    min-height: 132px;
    padding-top: 5.5px;
    padding-bottom: 5.5px
}

.form-select {
    border-color: #b4b4b4;
    border-radius: 6px;
    padding-top: calc(5.5px - 1px);
    padding-bottom: calc(5.5px - 1px);
    padding-right: 33px;
    padding-left: 11px;
    min-height: 44px;
    line-height: 33px;
    font-size: 1em;
    color: #000
}

.form-select .dropdown-menu {
    line-height: 22px
}

.form-select:disabled, .form-select[readonly] {
    background-color: #f4f4f4;
    color: #4b4b4b;
    cursor: not-allowed
}

.form-select.form-select-sm {
    min-height: 33px;
    line-height: 22px;
    font-size: .9em
}

.form-control-help {
    margin: 2.75px 0 0 0;
    font-size: .9em;
    color: #7d7d7d
}

.form-control-error {
    position: relative;
    margin: 11px 0 0 0;
    padding: 0 0 0 22px;
    font-size: .9em;
    color: #da4440
}

.form-control-error:before {
    position: absolute;
    left: 0;
    top: 1px;
    display: block;
    content: "";
    width: 16px;
    height: 16px;
    background-image: url(../images/icons/triangle-exclamation-solid.svg);
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 16px;
    filter: invert(31%) sepia(53%) saturate(1404%) hue-rotate(325deg) brightness(107%) contrast(96%)
}

.form-group.hasError .form-control {
    border-color: #da4440
}

.form-or {
    margin-top: -11px;
    margin-bottom: 11px;
    text-transform: uppercase;
    font-style: italic;
    color: #717171
}

.form-check {
    display: flex;
    align-items: center;
    margin: 0 0 11px 0;
    padding: 11px 0
}

.form-check .form-check-input {
    margin: 0 11px 0 0
}

.form-check-input {
    height: 22px;
    min-width: 22px;
    cursor: pointer
}

.form-check-input[type=checkbox]:indeterminate, .form-check-input:checked {
    background-color: #04d184;
    border-color: #04d184
}

.form-check-label {
    display: block;
    user-select: none;
    cursor: pointer;
    cursor: pointer
}

.form-check-group .form-check {
    margin-bottom: 0
}

.form-drawer .form-drawer-intro {
    margin: 0 0 22px 0;
    border-radius: 6px;
    padding: 11px;
    background: #f4f4f4;
    background: -moz-linear-gradient(top, #f4f4f4 0%, rgba(244, 244, 244, 0.8) 100%);
    background: -webkit-linear-gradient(top, #f4f4f4 0%, rgba(244, 244, 244, 0.8) 100%);
    background: linear-gradient(to bottom, #f4f4f4 0%, rgba(244, 244, 244, 0.8) 100%);
    font-size: .9em
}

.daterangepicker {
    border-color: #b4b4b4;
    box-shadow: 0 2.75px 5.5px rgba(0, 0, 0, .2);
    font-family: inherit
}

.daterangepicker:before {
    border-bottom-color: #b4b4b4
}

.daterangepicker .ranges li.active {
    background: #038ba2
}

.daterangepicker td.active, .daterangepicker td.active:hover {
    background-color: #038ba2
}

.daterangepicker td.in-range {
    background-color: #2fbfc1
}

.daterangepicker td.end-date.in-range {
    background-color: #038ba2
}

.daterangepicker td.off {
    background-color: transparent !important
}

.daterangepicker.show-calendar .drp-buttons {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center
}

.form-switch .form-check-input {
    margin-top: 0;
    margin-left: -41.25px;
    border-radius: 11px;
    width: 44px
}

.form-switch .form-check-label {
    margin-top: 1.375px;
    margin-left: 11px
}

.form-check.receipt {
    display: flex;
    align-items: center
}

.form-check.receipt input {
    margin-right: 11px
}

.form-disable-drawer {
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important;
    overflow: hidden;
    height: 0
}

.form-disable-drawer.show {
    height: auto
}

.form-submit {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    margin: 0 0 11px 0;
    padding: 11px 0 0 0
}

.form-submit .btn {
    width: 100%
}

.form-submit .buttons {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 11px;
    width: 100%
}

.form-submit .form-submit-help {
    font-size: .9em;
    color: #7d7d7d
}

.form-submit .buttons + .form-submit-help {
    margin: 11px 0 0 0
}

@media screen and (min-width: 640px) {
    .form-submit {
        flex-direction: row-reverse;
        align-items: center
    }

    .form-submit .btn {
        margin: 0;
        width: auto
    }

    .form-submit .buttons {
        margin-left: 11px;
        flex-direction: row-reverse;
        width: auto
    }

    .form-submit .buttons + .form-submit-help {
        margin: 0
    }
}

.help-block:last-child {
    margin-bottom: 0
}

.form-file-upload {
    position: relative
}

.form-file-upload input.file-upload-input {
    position: absolute;
    z-index: -1;
    overflow: hidden;
    vertical-align: top;
    border-radius: 6px;
    width: .1px;
    height: .1px;
    opacity: 0
}

.form-file-upload input.file-upload-input:focus ~ .file-upload-button {
    border-radius: 6px;
    outline: 1px dotted #344b7e;
    outline: -webkit-focus-ring-color auto 5px
}

.form-file-upload .file-upload-button {
    float: left;
    margin: 0 0 3px 0;
    width: 49%;
    vertical-align: top
}

.form-file-upload input.file-upload-filename {
    float: right;
    margin: 0 0 3px 0;
    width: 49%;
    vertical-align: top;
    border: 1px solid #cfcfcf;
    border-radius: 6px;
    padding: 5px;
    height: 44px;
    min-width: 200px;
    background: #f4f4f4
}

@media screen and (max-width: 479px) {
    .form-file-upload .file-upload-button {
        float: none;
        margin: 0 0 6px 0;
        width: 100%
    }

    .form-file-upload input.file-upload-filename {
        float: none;
        width: 100%
    }
}

.input-group .bootstrap-select {
    float: none;
    width: auto !important
}

.input-group-text {
    border-color: #b4b4b4;
    background-color: #f4f4f4;
    color: #344b7e
}

.input-group-text .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px
}

.input-group-text .icon img, .input-group-text .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

.input-group-text .icon svg {
    filter: invert(12%) sepia(37%) saturate(3713%) hue-rotate(190deg) brightness(96%) contrast(98%)
}

.input-group.account-user-password .input-group-text {
    padding: 0
}

.input-group.account-user-password .input-group-text .btn-toggleViewPassword {
    margin: -1px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    box-shadow: none;
    padding: 0 11px;
    height: calc(44px + 2px)
}

.input-group.account-user-password .input-group-text .btn-toggleViewPassword .icon {
    margin: 0
}

.input-group.account-user-password .input-group-text .btn-toggleViewPassword .icon.on {
    display: block
}

.input-group.account-user-password .input-group-text .btn-toggleViewPassword .icon.off {
    display: none
}

.input-group.account-user-password .input-group-text .btn-toggleViewPassword .text {
    display: none
}

.input-group.account-user-password.show .btn-toggleViewPassword .icon.on {
    display: none
}

.input-group.account-user-password.show .btn-toggleViewPassword .icon.off {
    display: block
}

.datepicker {
    border-radius: 6px
}

input.daterange {
    width: 240px
}

input.daterange + .form-control-feedback {
    top: 6px;
    color: #7d7d7d
}

.bootstrap-select.campaing-selectcardvisual .thumb {
    display: inline-block;
    margin: 0 11px 0 0;
    width: 100px;
    height: 63px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle
}

input[type=checkbox].switch {
    position: absolute;
    z-index: -1
}

input[type=checkbox].switch + .switch-label {
    vertical-align: middle;
    margin: 0;
    font-weight: normal;
    cursor: pointer;
    user-select: none;
    cursor: pointer
}

input[type=checkbox].switch + .switch-label .switch {
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important;
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 0 11px 0 0;
    border: 1px solid #c1c1c1;
    width: 44px;
    height: 32px;
    overflow: hidden
}

input[type=checkbox].switch + .switch-label .switch .on, input[type=checkbox].switch + .switch-label .switch .off {
    -webkit-transition: left .25s ease-out;
    -moz-transition: left .25s ease-out;
    -o-transition: left .25s ease-out;
    transition: left .25s ease-out;
    position: absolute;
    margin: -1px 0 0 -1px;
    float: left;
    width: 32px;
    height: 32px;
    background-image: url(../images/sprites/input-switch.png);
    background-size: 32px
}

input[type=checkbox].switch + .switch-label .switch .on {
    position: absolute;
    left: -32px;
    background-color: #465f98;
    background-position: 0 100%
}

input[type=checkbox].switch + .switch-label .switch .cursor {
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important;
    position: absolute;
    left: 0;
    margin: -1px 0 0 -1px;
    float: left;
    width: 12px;
    height: 32px;
    border: 1px solid #b4b4b4;
    background: #fff
}

input[type=checkbox].switch + .switch-label .switch .off {
    left: 12px;
    background-color: #f4f4f4
}

input[type=checkbox].switch + .switch-label .text {
    display: inline-block;
    vertical-align: top;
    line-height: 32px;
    color: #4b4b4b
}

input[type=checkbox].switch + .switch-label .text .on {
    display: none
}

input[type=checkbox].switch + .switch-label .text .off {
    display: inline-block
}

input[type=checkbox].switch + .switch-label:hover .text {
    color: #000
}

input[type=checkbox].switch:checked + .switch-label .switch {
    border-color: #465f98
}

input[type=checkbox].switch:checked + .switch-label .switch .on {
    left: 0
}

input[type=checkbox].switch:checked + .switch-label .switch .cursor {
    left: 32px
}

input[type=checkbox].switch:checked + .switch-label .switch .off {
    left: 44px
}

input[type=checkbox].switch:checked + .switch-label .text {
    color: #465f98
}

input[type=checkbox].switch:checked + .switch-label .text .on {
    display: inline-block
}

input[type=checkbox].switch:checked + .switch-label .text .off {
    display: none
}

.wizard .wizard-section {
    margin: 0 0 44px 0
}

.wizard .wizard-section .wizard-section-title {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin: 0 0 11px 0;
    font-size: 1.2em
}

.wizard .wizard-section .wizard-section-title .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 8.25px 0 0;
    border-radius: 50%;
    padding: 8.25px;
    width: 33px;
    height: 33px;
    background: #022f54
}

.wizard .wizard-section .wizard-section-title .icon img, .wizard .wizard-section .wizard-section-title .icon svg {
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: contain;
    width: 100%;
    height: 100%
}

.wizard .wizard-section .wizard-section-title .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

.dropdown-menu {
    margin-top: 0;
    border-radius: 6px;
    border-color: #b4b4b4;
    padding: 0;
    box-shadow: 0 2.75px 5.5px rgba(0, 0, 0, .25)
}

.dropdown-menu > li > .dropdown-item {
    padding: 11px;
    font-size: .9em;
    color: #18243a;
    user-select: none;
    cursor: pointer
}

.dropdown-menu > li > .dropdown-item .icon {
    margin: 0 11px 0 0
}

.dropdown-menu > li > .dropdown-item:active, .dropdown-menu > li > .dropdown-item:focus, .dropdown-menu > li > .dropdown-item:hover {
    background-color: rgba(3, 139, 162, .125)
}

.dropdown-menu > li:first-child {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px
}

.dropdown-menu > li:first-child > .dropdown-item {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit
}

.dropdown-menu > li:last-child {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px
}

.dropdown-menu > li:last-child > .dropdown-item {
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit
}

.dropdown-menu > li > .dropdown-divider {
    margin: 0;
    border: 0;
    width: 100%;
    height: 1px;
    background-color: #b4b4b4
}

.popover-help-trigger {
    cursor: pointer
}

.fixed-table-pagination {
    color: #4b4b4b
}

.pagination-detail {
    font-size: .85em
}

.pagination-detail .page-list .btn-group .btn {
    padding: 5.5px 11px
}

.page-link {
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    border: 1px solid #b4b4b4;
    padding: 5.5px 11px;
    background-color: #fff;
    line-height: 22px;
    color: #5873b1
}

.page-link:hover {
    border-color: #a7a7a7;
    background-color: #f4f4f4;
    color: #344b7e
}

.page-item.active .page-link {
    border-color: #5873b1;
    background-color: #5873b1;
    color: #fff
}

.page-item:first-child .page-link {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px
}

.page-item:last-child .page-link {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px
}

.bootstrap-table .fixed-table-pagination > .pagination, .bootstrap-table .fixed-table-pagination > .pagination-detail {
    margin-top: 22px;
    margin-bottom: 11px
}

.table-bordered > :not(caption) > * > * {
    border-width: 1px
}

table {
    border-color: #b4b4b4;
    border-width: 1px
}

table tr th, table tr td {
    vertical-align: middle;
    border-color: #b4b4b4
}

table thead th, table thead td {
    font-size: .9em
}

.bootstrap-table .fixed-table-toolbar .bs-bars, .bootstrap-table .fixed-table-toolbar .columns, .bootstrap-table .fixed-table-toolbar .search {
    margin-top: 11px;
    margin-bottom: 16.5px
}

.cardlist td.card-reference, .orderlist td.reference, .entitylist td.name, .profilelist td.name, .userlist td.firstname, .userlist td.lastname {
    font-weight: bold
}

.modal-content {
    border-radius: 6px;
    border: 0;
    background: transparent;
    box-shadow: 0 .125em .5em rgba(0, 0, 0, .5)
}

.modal-header {
    position: relative;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom: 1px solid #465f98;
    padding: 11px;
    background: #18243a;
    background: -moz-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
    background: -webkit-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
    background: linear-gradient(135deg, #18243a 33%, #022f54 100%);
    color: #fff
}

.modal-header .modal-title {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    font-size: 1.2em
}

.modal-header .modal-title .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    margin: 0 11px 0 0;
    padding: 8.25px;
    width: 44px;
    height: 44px;
    background: #fff
}

.modal-header .modal-title .icon img, .modal-header .modal-title .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

.modal-header .modal-title .icon svg {
    filter: invert(10%) sepia(67%) saturate(584%) hue-rotate(180deg) brightness(93%) contrast(91%)
}

.modal-header .btn-close {
    filter: brightness(0) invert(1)
}

.modal-header:after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    display: block;
    content: "";
    width: 100%;
    height: 2px;
    background: #18243a;
    background: -moz-linear-gradient(-45deg, #18243a 33%, var(--reseller-main) 100%);
    background: -webkit-linear-gradient(-45deg, #18243a 33%, var(--reseller-main) 100%);
    background: linear-gradient(135deg, #18243a 33%, var(--reseller-main) 100%)
}

@media screen and (min-width: 640px) {
    .modal-header {
        padding: 22px
    }
}

.modal-body {
    padding: 22px;
    background: #fff
}

.modal-body .object-detail {
    margin-bottom: 22px
}

.modal-body fieldset {
    margin: 0 0 22px 0;
    border-bottom: 1px solid #cfcfcf;
    padding: 0
}

.modal-body fieldset:last-child {
    margin-bottom: 0;
    border-bottom: 0;
    padding-bottom: 0
}

.modal-body .form-group {
    margin: 0 0 22px 0
}

.modal-body .scroll-container.log {
    border: 1px solid #c1c1c1;
    padding: 22px;
    height: 25vh;
    min-height: 240px;
    background: #f4f4f4;
    line-height: 1.25em;
    overflow-y: scroll
}

.modal-body .scroll-container.log .error {
    color: red
}

.modal-body .scroll-container.log .success {
    color: green
}

@media screen and (max-width: 767px) {
    .modal-body {
        padding: 22px 11px
    }
}

.modal-footer {
    flex-direction: column;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    padding: 11px;
    background: #fff
}

.modal-footer .btn {
    margin-bottom: 11px;
    width: 100%
}

.modal-footer .btn.btn-ok {
    order: -1
}

@media (min-width: 640px) {
    .modal-footer {
        flex-direction: row-reverse;
        justify-content: space-between;
        padding: 22px
    }

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

    .modal-footer .btn.btn-ok {
        order: 0
    }
}

#pg-hdr {
    position: fixed;
    z-index: 999;
    width: 100%;
    background: #18243a;
    background: -moz-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
    background: -webkit-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
    background: linear-gradient(135deg, #18243a 33%, #022f54 100%)
}

#pg-hdr:after {
    display: block;
    content: "";
    width: 100%;
    height: 2px;
    background: #18243a;
    background: -moz-linear-gradient(-45deg, #18243a 33%, var(--reseller-main) 100%);
    background: -webkit-linear-gradient(-45deg, #18243a 33%, var(--reseller-main) 100%);
    background: linear-gradient(135deg, #18243a 33%, var(--reseller-main) 100%)
}

#pg-hdr > .wrapper {
    margin: 0 auto;
    min-width: 258px;
    max-width: 1320px;
    padding: 11px 22px
}

#pg-ftr {
}

#pg-ftr > .wrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
    padding: 33px 11px;
    min-width: 258px;
    max-width: 1320px;
    width: 100%;
}

#pg-ftr .nav-language {
    margin: 0 0 22px 0;
    font-size: .75em
}

#pg-ftr .nav-language > .nav-item.dropdown > .nav-link {
    border-color: rgba(255, 255, 255, .5);
    opacity: .75;
    color: #fff
}

#pg-ftr .nav-language > .nav-item.dropdown > .nav-link .icon img, #pg-ftr .nav-language > .nav-item.dropdown > .nav-link .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

#pg-ftr .nav-language > .nav-item.dropdown > .nav-link:after {
    border-top-color: rgba(255, 255, 255, .5)
}

#pg-ftr .nav-language > .nav-item.dropdown > .nav-link:hover {
    opacity: 1;
    border-color: #038ba2;
    background-color: #022f54
}

#pg-ftr .brand {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

#pg-ftr .brand .frizbeebyselp {
    width: 193px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 5.5px 0;
    line-height: 33px;
    font-size: .75em;
}

#pg-ftr .brand .frizbeebyselp img {
    height: 19.25px
}

#pg-ftr .brand .frizbeebyselp img.frizbee {
    margin-right: 11px;
    margin-bottom: 5.5px
}

#pg-ftr .brand .frizbeebyselp img.selp {
    margin-left: 11px;
    margin-top: 5.5px;
    height: 32px;
    width: 74.73px;
}

#pg-ftr .brand .copyright {
    font-size: .75em;
    color: rgba(255, 255, 255, .5)
}

@media (min-width: 640px) {
    #pg-ftr > .wrapper {
        flex-direction: row
    }

    #pg-ftr .nav-language {
        margin: 0
    }

    #pg-ftr .brand {
        align-items: flex-end
    }

    #pg-ftr .brand .frizbeebyselp img {
        height: 22px
    }
}

#pg-main {
    padding-top: 66px;
    min-height: calc(100vh - 99px)
}

#pg-main section.slice > .wrapper {
    margin: 0 auto;
    padding: 44px 11px;
    min-width: 258px;
    max-width: 1320px;
    width: 100%
}

#pg-main section.slice.xs > .wrapper {
    max-width: 480px
}

#pg-main section.slice.sm > .wrapper {
    max-width: 640px
}

#pg-main section.slice.md > .wrapper {
    max-width: 720px
}

#pg-main section.slice.lg > .wrapper {
    max-width: 960px
}

#pg-main section.slice.xl > .wrapper {
    max-width: 1140px
}

#pg-main section.slice.xxl > .wrapper {
    max-width: 1320px
}

#pg-main section.slice .slice-header {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    margin: 0 0 33px 0
}

#pg-main section.slice .slice-header .slice-title {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%
}

#pg-main section.slice .slice-header h1 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 0;
    width: 100%;
    font-size: 2.2em;
    color: #18243a
}

#pg-main section.slice .slice-header h1 .icon {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 0 11px 0 0;
    border-radius: 50%;
    padding: 11px;
    background: #18243a;
    background: -moz-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
    background: -webkit-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
    background: linear-gradient(135deg, #18243a 33%, #022f54 100%)
}

#pg-main section.slice .slice-header h1 .icon img, #pg-main section.slice .slice-header h1 .icon svg {
    width: 27.5px;
    height: 27.5px;
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

#pg-main section.slice .slice-header h1 .thumbnail {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 0 11px 0 0
}

#thumbnail {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 0 11px 0 0;
}

#thumbnail img {
    width: 60px;
    /*height: 60px*/
}

#pg-main section.slice .slice-header h1 .thumbnail img, #pg-main section.slice .slice-header h1 .thumbnail svg {
    width: 49.5px;
    /*height: 49.5px*/
}

#pg-main section.slice .slice-header h1 .counter {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 0 11px 0 0;
    padding: 0 11px;
    border-radius: 24.75px;
    min-width: 49.5px;
    height: 49.5px;
    background: #dedede;
    letter-spacing: -0.025em;
    font-weight: bolder;
    font-size: .7em;
    color: #18243a
}

#pg-main section.slice .slice-header h1 .text {
    margin: 2.75px 0
}

#pg-main section.slice .slice-header h1 .text .context {
    color: #038ba2
}

#pg-main section.slice .slice-header h1 .text .context:before {
    display: inline;
    content: " / ";
    color: #b4b4b4
}

#pg-main section.slice .slice-header h1.layout-vertical {
    flex-direction: column;
    align-items: center
}

#pg-main section.slice .slice-header h1.layout-vertical .icon {
    margin: 0 0 11px 0;
    width: 77px;
    height: 77px;
    border-radius: 50%;
    background: #fff;
    font-size: .9em
}

#pg-main section.slice .slice-header .user-wallet {
    order: -1;
    margin-bottom: 44px
}

#pg-main section.slice .slice-header .nav-actions {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 11px;
    margin-top: 11px;
    padding: 0 0 0 60.5px;
    width: 100%
}

#pg-main section.slice .slice-header .nav-actions button {
    margin-right: 0
}

#pg-main section.slice .slice-header .nav-back {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin-top: 22px;
    padding: 0 0 0 60.5px;
    width: 100%
}

#pg-main section.slice .slice-header .context-selector {
    z-index: 0;
    margin-top: 22px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding: 16.5px 22px;
    width: 100%;
    background: #ebebeb;
    box-shadow: 0 8.25px 11px rgba(0, 0, 0, .1)
}

#pg-main section.slice .slice-header .context-selector > .form-group {
    display: inline-block
}

#pg-main section.slice .slice-header .context-selector .form-label {
    line-height: 22px;
    font-size: .8em;
    color: #717171
}

#pg-main section.slice .slice-header .context-selector ul.dl {
    display: flex;
    justify-content: flex-end;
    border-top: 1px solid #cfcfcf;
    padding-top: 11px;
    font-size: .8em
}

#pg-main section.slice .slice-header.wslicetabs {
    margin-bottom: 0
}

#pg-main section.slice .slice-header nav.slice-tabs {
    flex-grow: 10;
    position: relative;
    padding-top: 22px;
    width: 100%
}

#pg-main section.slice .slice-header nav.slice-tabs:before {
    display: block;
    content: "";
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom: 1px solid #b4b4b4;
    width: 100%;
    height: 6px;
    background: #fff
}

#pg-main section.slice .slice-header nav.slice-tabs ul.tabs {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    list-style-type: none;
    margin: 0;
    border-bottom: 1px solid #b4b4b4;
    padding: 0;
    width: 100%;
    box-shadow: 0 8.25px 11px rgba(0, 0, 0, .1);
    font-size: .85em
}

#pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li {
    width: 100%
}

#pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li button, #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li a {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    border: 0;
    padding: 11px 22px;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .125);
    color: #939393;
    user-select: none;
    cursor: pointer
}

#pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li button .icon, #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li a .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 8.25px 0 0;
    width: 16.5px;
    height: 16.5px
}

#pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li button .icon img, #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li button .icon svg, #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li a .icon img, #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li a .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

#pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li button .icon svg, #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li a .icon svg {
    filter: invert(66%) sepia(0%) saturate(55%) hue-rotate(202deg) brightness(91%) contrast(85%)
}

#pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li button.active, #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li a.active {
    background: #fff;
    color: #34485c
}

#pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li button.active .icon svg, #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li a.active .icon svg {
    filter: invert(28%) sepia(17%) saturate(899%) hue-rotate(169deg) brightness(90%) contrast(94%)
}

#pg-main section.slice .slice-header nav.slice-tabs .btn-expand {
    position: absolute;
    z-index: 2;
    bottom: calc(-27.5px - 1px);
    right: 11px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 33px;
    border-bottom-right-radius: 33px;
    border: 1px solid #b4b4b4;
    box-shadow: none;
    padding-top: calc(5.5px - 2px);
    padding-bottom: calc(5.5px + 2px);
    padding-left: 13.75px;
    padding-right: 13.75px
}

#pg-main section.slice .slice-header nav.slice-tabs .btn-expand .icon {
    width: 16.5px;
    height: 16.5px
}

#pg-main section.slice .slice-header nav.slice-tabs .btn-expand .icon svg {
    filter: invert(66%) sepia(0%) saturate(55%) hue-rotate(202deg) brightness(91%) contrast(85%)
}

#pg-main section.slice .slice-header .context-selector + .slice-tabs {
    padding-top: 0
}

#pg-main section.slice .slice-header .context-selector + .slice-tabs ul.tabs > li a {
    border-radius: 0
}

#pg-main section.slice .slice-header .context-selector + .slice-tabs ul.tabs > li a:not(.active) {
    background: #ebebeb
}

#pg-main section.slice .slice-header.centered h1 {
    margin-left: auto;
    margin-right: auto
}

#pg-main section.slice .slice-content {
    position: relative;
    margin: 0 auto;
    border-radius: 11px;
    width: 100%;
    padding: 22px;
    background: #fff;
    background: -moz-linear-gradient(45deg, #fbfbfb 0%, #fff 50%, #fbfbfb 100%);
    background: -webkit-linear-gradient(45deg, #fbfbfb 0%, #fff 50%, #fbfbfb 100%);
    background: linear-gradient(45deg, #fbfbfb 0%, #fff 50%, #fbfbfb 100%);
    box-shadow: 0 5.5px 11px rgba(0, 0, 0, .1)
}

#pg-main section.slice .slice-content .slice-content-title {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 0
}

#pg-main section.slice .slice-content .slice-content-title h2 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin: 0 0 11px 0;
    font-size: 1.2em;
    color: #022f54
}

#pg-main section.slice .slice-content .slice-content-title h2 .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 8.25px 0 0;
    border-radius: 50%;
    padding: 8.25px;
    width: 33px;
    height: 33px;
    background: #022f54
}

#pg-main section.slice .slice-content .slice-content-title h2 .icon img, #pg-main section.slice .slice-content .slice-content-title h2 .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

#pg-main section.slice .slice-content .slice-content-title h2 .icon svg {
    display: flex;
    justify-content: center;
    align-items: center;
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

#pg-main section.slice .slice-content .slice-content-title h2 .counter {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 0 8.25px 0 0;
    border-radius: 22px;
    padding: 0 5.5px;
    min-width: 33px;
    height: 33px;
    background: #ebebeb;
    letter-spacing: -0.075em;
    font-weight: bolder;
    font-size: .7em;
    color: #18243a
}

#pg-main section.slice .slice-content .slice-content-title nav.actions {
    flex-direction: row;
    margin-top: -5.5px;
    margin-bottom: 11px;
    padding: 0 0 0 41.25px;
    width: 100%
}

#pg-main section.slice .slice-content .slice-content-title nav.actions > .btn {
    width: auto
}

#pg-main section.slice .slice-content .slice-content-search {
    margin: 0 0 22px 0
}

#pg-main section.slice .slice-content .slice-content-search .btn {
    box-shadow: none
}

#pg-main section.slice .slice-content .slice-content-data + .slice-content-title {
    margin-top: 44px
}

#pg-main section.slice .slice-header.wslicetabs + .slice-content {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

@media (min-width: 640px) {
    #pg-main section.slice > .wrapper {
        padding-left: 22px;
        padding-right: 22px
    }

    #pg-main section.slice .slice-content {
        padding: 33px
    }
}

@media (min-width: 768px) {
    #pg-main section.slice .slice-header .nav-actions {
        width: 100%;
        padding: 0 0 0 60.5px
    }

    #pg-main section.slice .slice-header nav.slice-tabs:before {
        display: none
    }

    #pg-main section.slice .slice-header nav.slice-tabs .collapse {
        display: block !important
    }

    #pg-main section.slice .slice-header nav.slice-tabs ul.tabs {
        flex-direction: row;
        justify-content: flex-start;
        border-bottom: 0
    }

    #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li button, #pg-main section.slice .slice-header nav.slice-tabs ul.tabs > li a {
        border-top-left-radius: 6px;
        border-top-right-radius: 6px
    }

    #pg-main section.slice .slice-header nav.slice-tabs .btn-expand {
        display: none
    }
}

@media (min-width: 992px) {
    #pg-main section.slice .slice-header {
        flex-direction: row;
        justify-content: space-between
    }

    #pg-main section.slice .slice-header .slice-title {
        width: auto
    }

    #pg-main section.slice .slice-header h1 {
        width: auto
    }

    #pg-main section.slice .slice-header .user-wallet {
        order: 0;
        margin-bottom: 0
    }

    #pg-main section.slice .slice-header .nav-actions {
        margin-top: 5.5px
    }

    #pg-main section.slice .slice-header .nav-back {
        margin-top: 11px
    }
}

.notifications {
    position: relative
}

.notifications a {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: 1px solid #b4b4b4;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    user-select: none;
    cursor: pointer
}

.notifications .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    width: 22px;
    height: 22px
}

.notifications .icon img, .notifications .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

.notifications .counter {
    display: none;
    position: absolute;
    z-index: 2;
    top: -2px;
    right: -2px;
    display: block;
    border-radius: 50%;
    width: 17.6px;
    height: 17.6px;
    background: #da4440;
    background: -moz-linear-gradient(45deg, #da4440 0%, #fd9e21 100%);
    background: -webkit-linear-gradient(45deg, #da4440 0%, #fd9e21 100%);
    background: linear-gradient(-135deg, #da4440 0%, #fd9e21 100%);
    line-height: 17.6px;
    text-align: center;
    font-weight: bold;
    font-size: .6em;
    color: #fff
}

.notifications.active .counter {
    display: block
}

.nav-language {
    font-size: .85em
}

.nav-language > .nav-item.dropdown > .nav-link {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    border-radius: 22px;
    padding: 0 11px;
    height: 44px;
    color: white;
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important
}

.nav-language > .nav-item.dropdown > .nav-link .icon {
    margin: 0 5.5px 0 0;
    width: 22px;
    height: 22px
}

.nav-language > .nav-item.dropdown > .nav-link .icon img, .nav-language > .nav-item.dropdown > .nav-link .icon svg {
    object-fit: contain;
    opacity: .95
}

.nav-language > .nav-item.dropdown > .nav-link:hover .icon img, .nav-language > .nav-item.dropdown > .nav-link:hover .icon svg {
    opacity: 1
}

.slice-header .nav-back a {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: fit-content;
    font-size: .9em;
    color: #939393
}

.slice-header .nav-back a .icon {
    display: flex;
    justify-content: center;
    margin: 0 5.5px 0 0;
    height: center;
    width: 16.5px;
    height: 16.5px
}

.slice-header .nav-back a .icon img, .slice-header .nav-back a .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

.slice-header .nav-back a .icon svg {
    filter: invert(66%) sepia(0%) saturate(55%) hue-rotate(202deg) brightness(91%) contrast(85%)
}

.nav-pagination {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center
}

.nav-pagination .previous, .nav-pagination .next {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #b4b4b4;
    padding: 11px;
    width: 50%;
    flex-grow: 5
}

.nav-pagination .previous .icon, .nav-pagination .next .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 22px;
    width: 22px
}

.nav-pagination .previous .icon svg, .nav-pagination .next .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%;
    filter: invert(28%) sepia(17%) saturate(899%) hue-rotate(169deg) brightness(90%) contrast(94%)
}

.nav-pagination .previous.disabled, .nav-pagination .next.disabled {
    border-color: #cfcfcf;
    background: #fbfbfb;
    cursor: not-allowed
}

.nav-pagination .previous.disabled .icon svg, .nav-pagination .next.disabled .icon svg {
    filter: invert(92%) sepia(0%) saturate(8%) hue-rotate(150deg) brightness(85%) contrast(80%)
}

.nav-pagination .previous {
    order: 1;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px
}

.nav-pagination .next {
    order: 2;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px
}

.nav-pagination .pages {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    order: 3;
    flex-grow: 10;
    margin: 0;
    padding: 0;
    list-style-type: none;
    width: 100%;
    font-size: .85em
}

.nav-pagination .pages > li {
    flex-grow: 2;
    border-top: 1px solid transparent;
    border-bottom: 1px solid #b4b4b4;
    text-align: center;
    line-height: 22px
}

.nav-pagination .pages > li > a {
    display: block;
    padding: 11px 5.5px;
    color: #34485c
}

.nav-pagination .pages > li.divider, .nav-pagination .pages > li.current {
    padding: 11px 5.5px
}

.nav-pagination .pages > li.divider {
    color: #b4b4b4
}

.nav-pagination .pages > li.current {
    border-bottom: 3px solid #18243a;
    font-weight: bold;
    color: #18243a
}

.nav-pagination + .form-submit {
    margin-top: 44px
}

@media (min-width: 640px) {
    .nav-pagination {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start
    }

    .nav-pagination .previous, .nav-pagination .next {
        flex-grow: 1;
        width: 66px
    }

    .nav-pagination .previous {
        margin-right: 22px;
        order: 1
    }

    .nav-pagination .next {
        margin-left: 22px;
        order: 3
    }

    .nav-pagination .pages {
        order: 2;
        flex-grow: 5;
        width: auto
    }
}

#pg-hdr .navbar {
    padding: 11px 0
}

#pg-hdr .navbar section.navbar-main {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center
}

#pg-hdr .navbar section.navbar-main .navbar-nav.nav-main {
    display: none
}

#pg-hdr .navbar section.navbar-aside {
    justify-content: flex-end
}

#pg-hdr .navbar section.navbar-aside .navbar-nav.nav-user {
    display: none
}

#pg-hdr .navbar .navbar-nav .nav-item > .nav-link {
    border-radius: 6px;
    height: 44px;
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important;
    user-select: none;
    cursor: pointer
}

#pg-hdr .navbar .navbar-nav .nav-item .dropdown-item {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    color: #022f54
}

#pg-hdr .navbar .navbar-nav .nav-item .dropdown-item .icon {
    width: 16.5px;
    height: 16.5px
}

#pg-hdr .navbar .navbar-nav .nav-item .dropdown-item .icon svg {
    filter: invert(12%) sepia(37%) saturate(3713%) hue-rotate(190deg) brightness(96%) contrast(98%)
}

#pg-hdr .navbar .navbar-nav .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 8.25px 0 0;
    width: 30px;
    height: 22px
}

#pg-hdr .navbar .navbar-nav .icon img, #pg-hdr .navbar .navbar-nav .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%;
    opacity: .95
}

#pg-hdr .navbar .navbar-nav .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

#pg-hdr .navbar .navbar-brand {
    margin: 11px 0;
    padding: 0
}

#pg-hdr .navbar .navbar-brand a {
    display: block
}

#pg-hdr .navbar .navbar-brand .brand-logo {
    height: 22px
}

#pg-hdr .navbar .navbar-nav.nav-main {
    margin-left: 22px
}

#pg-hdr .navbar .navbar-nav.nav-main .nav-item .nav-link {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    padding: 0 11px;
    font-size: .9em;
    color: #fff
}

#pg-hdr .navbar .navbar-nav.nav-main .nav-item .nav-link:hover {
    background-color: #022f54
}

#pg-hdr .navbar .navbar-nav.nav-main .nav-item .nav-link:hover .icon img, #pg-hdr .navbar .navbar-nav.nav-main .nav-item .nav-link:hover .icon svg {
    opacity: 1
}

#pg-hdr .navbar .navbar-nav.nav-main .nav-item:last-child {
    margin-right: 0
}

#pg-hdr .navbar .navbar-nav.nav-main .nav-item.dropdown > .nav-link:after {
    border-top-color: rgba(255, 255, 255, .5)
}

#pg-hdr .navbar .navbar-nav.nav-main .nav-item.dropdown > .nav-link.show {
    background-color: #038ba2
}

#pg-hdr .navbar .navbar-aside {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center
}

#pg-hdr .navbar .user-brand {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    margin: 0 11px 0;
    max-width: 100px;
    height: 44px
}

#pg-hdr .navbar .user-brand img {
    object-fit: contain;
    height: 100%;
    width: 100%
}

#pg-hdr .navbar .notifications {
    margin: 0 11px 0 0
}

#pg-hdr .navbar .notifications a {
    border-color: rgba(255, 255, 255, .5)
}

#pg-hdr .navbar .notifications a:hover {
    border-color: #2fbfc1;
    background-color: #022f54
}

#pg-hdr .navbar .notifications .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

#pg-hdr .navbar .nav-user > .nav-item.dropdown .nav-link {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 50%;
    padding: 0;
    width: 44px;
    height: 44px
}

#pg-hdr .navbar .nav-user > .nav-item.dropdown .nav-link .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    width: 16.5px;
    height: 16.5px
}

#pg-hdr .navbar .nav-user > .nav-item.dropdown .nav-link .icon img, #pg-hdr .navbar .nav-user > .nav-item.dropdown .nav-link .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

#pg-hdr .navbar .nav-user > .nav-item.dropdown .nav-link .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

#pg-hdr .navbar .nav-user > .nav-item.dropdown .nav-link:after {
    display: none
}

#pg-hdr .navbar .nav-user > .nav-item.dropdown .nav-link:hover {
    border-color: #2fbfc1;
    background-color: #022f54
}

#pg-hdr .navbar .nav-user .dropdown-menu > .user {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom: 1px solid #b4b4b4;
    padding: 11px;
    background-color: #ebebeb;
    white-space: nowrap
}

#pg-hdr .navbar .nav-user .dropdown-menu > .user .label {
    display: block;
    margin: 0 0 2.75px 0;
    line-height: 1em;
    font-size: .6em;
    color: #7d7d7d
}

#pg-hdr .navbar .nav-user .dropdown-menu .dropdown-item {
    padding: 11px
}

#pg-hdr .navbar .nav-user .dropdown-menu .dropdown-divider {
    margin: 0
}

#pg-hdr .navbar .smn-btn-show {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 50%;
    padding: 0;
    width: 44px;
    height: 44px;
    background: transparent;
    user-select: none;
    cursor: pointer;
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important
}

#pg-hdr .navbar .smn-btn-show .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0
}

#pg-hdr .navbar .smn-btn-show .icon img, #pg-hdr .navbar .smn-btn-show .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

#pg-hdr .navbar .smn-btn-show .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

#pg-hdr .navbar .smn-btn-show .text {
    display: none
}

#pg-hdr .navbar .smn-btn-show:hover {
    border-color: #2fbfc1;
    background-color: #022f54
}

@media (max-width: 359px) {
    #pg-hdr .navbar .user-brand {
        display: none
    }
}

@media (min-width: 992px) {
    #pg-hdr .navbar section.navbar-main .navbar-nav.nav-main {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: center
    }

    #pg-hdr .navbar section.navbar-aside .navbar-nav.nav-user {
        display: block
    }

    #pg-hdr .navbar section.navbar-aside .smn-btn-show {
        display: none
    }
}

@-webkit-keyframes smn-anim-open {
    0% {
        opacity: 0;
        right: -110%
    }
    25% {
        opacity: .1
    }
    100% {
        opacity: 1;
        right: 0
    }
}

@-webkit-keyframes smn-anim-hiding {
    0% {
        opacity: 1;
        right: 0
    }
    100% {
        opacity: 0;
        right: -110%
    }
}

#supermenu {
    position: fixed;
    top: 0;
    right: -110%;
    bottom: 0;
    z-index: 99999;
    max-height: 100vh;
    min-width: 280px;
    width: 100%;
    background: #fff;
    box-shadow: 0 0 11px rgba(0, 0, 0, .5)
}

#supermenu.show {
    right: 0;
    -webkit-animation: ease-in;
    -webkit-animation-name: smn-anim-open;
    -webkit-animation-duration: .25s
}

#supermenu.hiding {
    -webkit-animation: ease-in;
    -webkit-animation-name: smn-anim-hiding;
    -webkit-animation-duration: .25s
}

#supermenu .smn-header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 11px;
    height: 66px
}

#supermenu .smn-header .brand a {
    display: block
}

#supermenu .smn-header .brand .brand-logo {
    height: 22px
}

#supermenu .smn-header .nav-smn {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

#supermenu .smn-header .notifications {
    margin: 0 11px 0 0
}

#supermenu .smn-header .notifications a {
    border-color: #b4b4b4;
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important
}

#supermenu .smn-header .notifications a:active, #supermenu .smn-header .notifications a:focus, #supermenu .smn-header .notifications a:hover {
    background-color: #f4f4f4
}

#supermenu .smn-header .notifications .icon img, #supermenu .smn-header .notifications .icon svg {
    filter: invert(92%) sepia(0%) saturate(8%) hue-rotate(150deg) brightness(85%) contrast(80%)
}

#supermenu .smn-header .notifications.active .icon img, #supermenu .smn-header .notifications.active .icon svg {
    filter: invert(66%) sepia(0%) saturate(55%) hue-rotate(202deg) brightness(91%) contrast(85%)
}

#supermenu .smn-header .smn-btn-close {
    display: flex;
    justify-content: center;
    align-items: center;
    border-color: #b4b4b4;
    border-radius: 50%;
    padding: 0;
    height: 44px;
    width: 44px;
    box-shadow: none
}

#supermenu .smn-header .smn-btn-close .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0
}

#supermenu .smn-header .smn-btn-close .icon img, #supermenu .smn-header .smn-btn-close .icon svg {
    height: inherit;
    filter: invert(66%) sepia(0%) saturate(55%) hue-rotate(202deg) brightness(91%) contrast(85%)
}

#supermenu .smn-header .smn-btn-close:active, #supermenu .smn-header .smn-btn-close:focus, #supermenu .smn-header .smn-btn-close:hover {
    background-color: #f4f4f4
}

#supermenu .smn-main {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow-y: auto;
    padding: 0 11px;
    height: calc(100vh - 88px)
}

#supermenu .smn-main nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

#supermenu nav.nav-main {
    position: relative;
    margin: 0 0 44px 0;
    padding-top: 11px
}

#supermenu nav.nav-main:before {
    display: block;
    position: absolute;
    top: 0;
    content: "";
    width: 100%;
    height: 2px;
    background-color: var(--reseller-main);
    background: -moz-linear-gradient(-45deg, #cfcfcf 66%, #ebebeb 100%);
    background: -webkit-linear-gradient(-45deg, #cfcfcf 66%, #ebebeb 100%);
    background: linear-gradient(135deg, #cfcfcf 66%, #ebebeb 100%)
}

#supermenu nav.nav-user {
    position: relative;
    padding-top: 11px
}

#supermenu nav.nav-user:before {
    display: block;
    position: absolute;
    top: 0;
    content: "";
    width: 100%;
    height: 2px;
    background-color: var(--reseller-main);
    background: -moz-linear-gradient(-45deg, var(--reseller-main) 66%, #ebebeb 100%);
    background: -webkit-linear-gradient(-45deg, var(--reseller-main) 66%, #ebebeb 100%);
    background: linear-gradient(135deg, var(--reseller-main) 66%, #ebebeb 100%)
}

#supermenu nav.nav-user ul.smn-nav {
    width: 100%
}

#supermenu nav.nav-user ul.smn-nav .smn-subnav > li a {
    background: rgba(var(--reseller-main), 0.25)
}

#supermenu nav.nav-user .nav-item {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%
}

#supermenu .user-brand {
    margin-bottom: 27.5px;
    max-width: 110px;
    height: 44px
}

#supermenu .user-brand img, #supermenu .user-brand svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

#supermenu .user-wallet {
    margin-bottom: 11px
}

#supermenu ul.smn-nav {
    margin: 0;
    padding: 0;
    list-style-type: none
}

#supermenu ul.smn-nav .nav-item .nav-link {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    min-height: 44px;
    text-transform: uppercase;
    letter-spacing: -0.025em;
    color: #18243a
}

#supermenu ul.smn-nav .nav-item .nav-link.collapse-toggle:after {
    display: inline-block;
    margin-left: 8.25px;
    content: "";
    border-top: 0;
    border-right: .3em solid transparent;
    border-bottom: .3em solid #022f54;
    border-left: .3em solid transparent
}

#supermenu ul.smn-nav .nav-item .nav-link.collapse-toggle.collapsed:after {
    border-top: .3em solid #18243a;
    border-bottom: 0
}

#supermenu ul.smn-nav .nav-item .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 8.25px 0 0;
    width: 22px;
    height: 22px
}

#supermenu ul.smn-nav .nav-item .icon img, #supermenu ul.smn-nav .nav-item .icon svg {
    width: 100%;
    height: 100%;
    object-fit: contain
}

#supermenu ul.smn-nav .nav-item .icon svg {
    filter: invert(10%) sepia(67%) saturate(584%) hue-rotate(180deg) brightness(93%) contrast(91%)
}

#supermenu ul.smn-nav .nav-item ul.smn-subnav {
    margin: 0 0 11px 0;
    padding: 0 0 0 33px;
    border-top: 1px solid #cfcfcf;
    border-bottom: 1px solid #cfcfcf;
    list-style-type: none;
    font-size: .95em
}

#supermenu ul.smn-nav .nav-item ul.smn-subnav > li {
    margin: 0;
    padding: 0;
    min-height: 22px
}

#supermenu ul.smn-nav .nav-item ul.smn-subnav > li a {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    padding: 11px 0;
    line-height: 22px;
    color: #18243a
}

#supermenu ul.smn-nav .nav-item ul.smn-subnav > li a .icon {
    width: 18.326px;
    height: 18.326px
}

#supermenu ul.smn-nav .nav-item ul.smn-subnav > li a .icon svg {
    filter: invert(28%) sepia(17%) saturate(899%) hue-rotate(169deg) brightness(90%) contrast(94%)
}

#supermenu ul.smn-nav .nav-item ul.smn-subnav > li.divider {
    min-height: auto
}

#supermenu ul.smn-nav .nav-item ul.smn-subnav > li.divider hr {
    margin: 0;
    width: 100%;
    height: 1px;
    background: #b4b4b4
}

@media (min-width: 640px) {
    #supermenu .smn-main {
        flex-direction: row;
        justify-content: space-between
    }

    #supermenu .smn-main nav {
        width: 48%
    }

    #supermenu nav.nav-user {
        align-items: flex-end
    }

    #supermenu nav.nav-user:before {
        background: -moz-linear-gradient(-45deg, #ebebeb 33%, var(--reseller-main) 100%);
        background: -webkit-linear-gradient(-45deg, #ebebeb 33%, var(--reseller-main) 100%);
        background: linear-gradient(135deg, #ebebeb 33%, var(--reseller-main) 100%)
    }

    #supermenu nav.nav-user .smn-nav .nav-link {
        justify-content: flex-end
    }

    #supermenu nav.nav-user .smn-nav .smn-subnav {
        text-align: right
    }

    #supermenu nav.nav-user .smn-nav .smn-subnav > li a {
        justify-content: flex-end !important
    }
}

@media (min-width: 992px) {
    #supermenu.show {
        display: none
    }

    #smn-btn-show {
        display: none
    }
}

nav.nav-entity {
    display: flex;
    flex-direction: column
}

nav.nav-entity > div {
    position: relative;
    margin: 0 0 5.5px 0;
    background: transparent
}

nav.nav-entity > div.context {
    display: flex;
    align-items: center;
    font-size: .85em
}

nav.nav-entity > div:after {
    position: absolute;
    z-index: 2;
    top: 100%;
    content: " ";
    display: inline-block;
    display: none;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-top-color: #cfcfcf
}

nav.nav-entity > div:last-child {
    flex-grow: 10
}

nav.nav-entity > div:last-child:after {
    border: 0
}

nav.nav-entity .form-group {
    display: flex;
    flex-direction: row;
    align-items: center
}

nav.nav-entity .form-group label {
    margin: 0
}

nav.nav-entity .form-group label .icon {
    display: inline-block;
    margin: 0 8.25px 0 0;
    width: 27.5px;
    text-align: center;
    color: #939393
}

nav.nav-entity .form-group label .text {
    display: none
}

nav.nav-entity .form-group .dropdown-toggle {
    font-size: .85em
}

nav.nav-entity .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: 276px
}

nav.nav-entity.asHeader {
    margin-top: -22px;
    margin-left: -22px;
    margin-right: -22px;
    margin-bottom: 22px;
    border-bottom: 1px solid #c3cce0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background: #d2d9e8
}

nav.nav-entity.asHeader > div {
    margin: 0;
    padding: 11px;
    color: #223765
}

nav.nav-entity.asHeader > div.context {
    color: #fff
}

nav.nav-entity.asHeader > div:after {
    display: inline-block;
    border-top-color: #d2d9e8
}

nav.nav-entity.asHeader > div:first-child {
    padding-left: 11px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px
}

nav.nav-entity.asHeader > div:nth-of-type(1) {
    background: #a5b3d1
}

nav.nav-entity.asHeader > div:nth-of-type(1):after {
    border-top-color: #a5b3d1
}

nav.nav-entity.asHeader > div:nth-of-type(2) {
    background: #c3cce0
}

nav.nav-entity.asHeader > div:nth-of-type(2):after {
    border-top-color: #c3cce0
}

nav.nav-entity.asHeader > div:nth-of-type(3) {
    background: #d2d9e8
}

nav.nav-entity.asHeader > div:nth-of-type(3):after {
    border-top-color: #d2d9e8
}

nav.nav-entity.asHeader > div:nth-of-type(4) {
    background: #e1e6f0
}

nav.nav-entity.asHeader > div:nth-of-type(4):after {
    border-top-color: #e1e6f0
}

nav.nav-entity.asHeader > div:nth-of-type(5) {
    background: #f0f2f7
}

nav.nav-entity.asHeader > div:nth-of-type(5):after {
    border-top-color: #f0f2f7
}

nav.nav-entity.asHeader .form-group label .icon {
    font-size: 1.25em;
    color: #344b7e
}

@media screen and (min-width: 640px) {
    nav.nav-entity.asHeader {
        margin-top: -44px;
        margin-left: -44px;
        margin-right: -44px;
        margin-bottom: 33px
    }
}

@media screen and (min-width: 1024px) {
    nav.nav-entity {
        flex-direction: row;
        justify-content: flex-start;
        align-items: stretch;
        border-bottom: 0
    }

    nav.nav-entity > div {
        margin-right: 22px
    }

    nav.nav-entity > div:after {
        top: 22px;
        right: -12px;
        border-top: 12px solid transparent;
        border-bottom: 12px solid transparent;
        border-left: 12px solid transparent;
        border-right: 0;
        border-left-color: #ebebeb
    }

    nav.nav-entity > div:nth-of-type(1) {
        border-bottom-color: #c1c1c1
    }

    nav.nav-entity > div:nth-of-type(1):after {
        border-top-color: transparent;
        border-left-color: #cfcfcf
    }

    nav.nav-entity > div:nth-of-type(2) {
        border-bottom-color: #cfcfcf
    }

    nav.nav-entity > div:nth-of-type(2):after {
        border-top-color: transparent;
        border-left-color: #dedede
    }

    nav.nav-entity > div:nth-of-type(3) {
        border-bottom-color: #dedede
    }

    nav.nav-entity > div:nth-of-type(3):after {
        border-top-color: transparent;
        border-left-color: #ebebeb
    }

    nav.nav-entity > div:nth-of-type(4) {
        border-bottom-color: #ebebeb
    }

    nav.nav-entity > div:nth-of-type(4):after {
        border-top-color: transparent;
        border-left-color: #f4f4f4
    }

    nav.nav-entity > div:nth-of-type(5) {
        border-bottom-color: #f4f4f4
    }

    nav.nav-entity > div:nth-of-type(5):after {
        border-top-color: transparent;
        border-left-color: #fbfbfb
    }

    nav.nav-entity .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
        width: 143px
    }

    nav.nav-entity.asHeader > div {
        border-bottom-width: 1px;
        border-bottom-style: solid;
        padding-left: 19.25px
    }

    nav.nav-entity.asHeader > div:after {
        border-left-color: #d2d9e8
    }

    nav.nav-entity.asHeader > div:first-child {
        border-bottom-color: #7e93c1;
        border-top-right-radius: 0
    }

    nav.nav-entity.asHeader > div:last-child {
        border-top-right-radius: 6px
    }

    nav.nav-entity.asHeader > div:nth-of-type(1) {
        border-bottom-color: #7e93c1
    }

    nav.nav-entity.asHeader > div:nth-of-type(1):after {
        border-top-color: transparent;
        border-left-color: #a5b3d1
    }

    nav.nav-entity.asHeader > div:nth-of-type(2) {
        border-bottom-color: #a5b3d1
    }

    nav.nav-entity.asHeader > div:nth-of-type(2):after {
        border-top-color: transparent;
        border-left-color: #c3cce0
    }

    nav.nav-entity.asHeader > div:nth-of-type(3) {
        border-bottom-color: #c3cce0
    }

    nav.nav-entity.asHeader > div:nth-of-type(3):after {
        border-top-color: transparent;
        border-left-color: #d2d9e8
    }

    nav.nav-entity.asHeader > div:nth-of-type(4) {
        border-bottom-color: #d2d9e8
    }

    nav.nav-entity.asHeader > div:nth-of-type(4):after {
        border-top-color: transparent;
        border-left-color: #e1e6f0
    }

    nav.nav-entity.asHeader > div:nth-of-type(5) {
        border-bottom-color: #e1e6f0
    }

    nav.nav-entity.asHeader > div:nth-of-type(5):after {
        border-top-color: transparent;
        border-left-color: #f0f2f7
    }
}

@media screen and (min-width: 1180px) {
    nav.nav-entity .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
        width: 176px
    }
}

@media screen and (min-width: 1280px) {
    nav.nav-entity .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
        width: 198px
    }
}

@media screen and (min-width: 1368px) {
    nav.nav-entity .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
        width: 220px
    }
}

nav.nav-filters {
    display: flex;
    margin: 0 0 27.5px 0;
    flex-direction: column
}

nav.nav-filters > div {
    position: relative;
    margin: 0 0 5.5px 0;
    background: transparent
}

nav.nav-filters > div.context {
    color: #000;
    display: flex;
    align-items: center;
    font-size: .85em
}

nav.nav-filters > div:last-child {
    flex-grow: 10
}

nav.nav-filters > div:last-child:after {
    border: 0
}

nav.nav-filters .form-group {
    display: flex;
    flex-direction: row;
    align-items: center
}

@media screen and (min-width: 1024px) {
    nav.nav-filters {
        flex-direction: row;
        justify-content: flex-start;
        align-items: stretch;
        border-bottom: 0
    }

    nav.nav-filters > div {
        margin-right: 22px
    }

    nav.nav-filters > div:last-child, nav.nav-filters > div:only-child {
        margin-right: 0
    }
}

nav.nav-toolbar {
    margin: -8.25px 0 22px 0
}

nav.nav-toolbar:after {
    clear: both;
    display: table;
    line-height: 0;
    content: ""
}

nav.nav-toolbar .tool-export {
    float: right
}

nav.nav-wizardsteps > ol {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    margin: 0;
    padding: 11px;
    counter-reset: step;
    list-style-type: none
}

nav.nav-wizardsteps > ol > li {
    position: relative;
    display: flex;
    flex-direction: row;
    margin: 0 0 5.5px 0;
    color: #7e93c1
}

nav.nav-wizardsteps > ol > li:before, nav.nav-wizardsteps > ol > li:after {
    position: absolute;
    z-index: 0;
    display: block;
    content: "";
    height: 11px;
    width: 2px;
    background: #a5b3d1
}

nav.nav-wizardsteps > ol > li:before {
    left: calc(16.5px - 1px);
    top: -11px
}

nav.nav-wizardsteps > ol > li:after {
    z-index: -1;
    left: calc(16.5px - 1px);
    bottom: -11px
}

nav.nav-wizardsteps > ol > li:first-child:before {
    display: none
}

nav.nav-wizardsteps > ol > li:last-child {
    margin-bottom: 0
}

nav.nav-wizardsteps > ol > li:last-child:after {
    display: none
}

nav.nav-wizardsteps > ol > li a {
    display: flex;
    flex-direction: row
}

nav.nav-wizardsteps > ol > li .counter {
    position: relative;
    z-index: 2;
    display: flex;
    background: #d2d9e8
}

nav.nav-wizardsteps > ol > li .counter:before {
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important;
    margin: 0 5.5px 0 0;
    border: 1px solid #a5b3d1;
    border-radius: 50%;
    width: 33px;
    height: 33px;
    background: transparent;
    text-align: center;
    line-height: calc(33px - 2px);
    counter-increment: step;
    content: counters(step, ".") " "
}

nav.nav-wizardsteps > ol > li .text {
    -webkit-transition: all .25s ease-out !important;
    -moz-transition: all .25s ease-out !important;
    -o-transition: all .25s ease-out !important;
    transition: all .25s ease-out !important;
    position: relative;
    z-index: 2;
    padding: 0 5.5px 0 0;
    background: #d2d9e8;
    line-height: 33px
}

nav.nav-wizardsteps > ol > li.done:before, nav.nav-wizardsteps > ol > li.done:after {
    background: #f0f2f7
}

nav.nav-wizardsteps > ol > li.done + .active:before {
    background: #f0f2f7
}

nav.nav-wizardsteps > ol > li.done .counter:before {
    border-color: #f0f2f7;
    background: #f0f2f7
}

nav.nav-wizardsteps > ol > li.done a:hover .counter:before {
    border-color: #fff;
    background: #fff;
    color: #000
}

nav.nav-wizardsteps > ol > li.done a:hover .text {
    color: #000
}

nav.nav-wizardsteps > ol > li.active {
    font-weight: bold
}

nav.nav-wizardsteps > ol > li.active .counter:before {
    border-color: #fff;
    background: #fff;
    color: #344b7e
}

nav.nav-wizardsteps > ol > li.active .text {
    color: #344b7e
}

nav.nav-wizardsteps.asHeader {
    margin-top: -22px;
    margin-left: -22px;
    margin-right: -22px;
    margin-bottom: 22px;
    border-bottom: 1px solid #c3cce0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background: #d2d9e8
}

@media screen and (min-width: 640px) {
    nav.nav-wizardsteps > ol {
        flex-direction: row;
        padding: 22px
    }

    nav.nav-wizardsteps > ol > li {
        justify-content: center;
        align-items: center;
        margin: 0
    }

    nav.nav-wizardsteps > ol > li:before, nav.nav-wizardsteps > ol > li:after {
        width: 50%;
        height: 1px
    }

    nav.nav-wizardsteps > ol > li:before {
        left: 0;
        top: 16.5px
    }

    nav.nav-wizardsteps > ol > li:after {
        z-index: 0;
        left: auto;
        right: 0;
        top: 16.5px;
        bottom: auto
    }

    nav.nav-wizardsteps > ol > li:first-child:nth-last-child(1) {
        width: 100%
    }

    nav.nav-wizardsteps > ol > li:first-child:nth-last-child(2), nav.nav-wizardsteps > ol > li:first-child:nth-last-child(2) ~ li {
        width: 50%
    }

    nav.nav-wizardsteps > ol > li:first-child:nth-last-child(3), nav.nav-wizardsteps > ol > li:first-child:nth-last-child(3) ~ li {
        width: 33.333%
    }

    nav.nav-wizardsteps > ol > li:first-child:nth-last-child(4), nav.nav-wizardsteps > ol > li:first-child:nth-last-child(4) ~ li {
        width: 25%
    }

    nav.nav-wizardsteps > ol > li:first-child:nth-last-child(5), nav.nav-wizardsteps > ol > li:first-child:nth-last-child(5) ~ li {
        width: 20%
    }

    nav.nav-wizardsteps > ol > li .counter {
        padding: 0 0 0 5.5px
    }

    nav.nav-wizardsteps.asHeader {
        margin-top: -44px;
        margin-left: -44px;
        margin-right: -44px;
        margin-bottom: 33px
    }
}

ul.userrights {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style-type: none
}

ul.userrights > li {
    margin: 0 0 33px 0
}

ul.userrights > li > .form-check .rights-category + .form-check-label .text {
    font-weight: bold
}

ul.userrights > li > ul {
    margin: 0;
    padding: 0 0 0 38.5px;
    list-style-type: none
}

ul.userrights .form-check-input {
    margin-top: 0
}

ul.userrights .form-check-input + .form-check-label {
    margin-left: 11px;
    line-height: 22px
}

ul.userrights .form-check-input + .form-check-label .icon {
    display: inline-block;
    margin: 0 8.25px 0 0;
    width: 27.5px;
    text-align: center;
    color: #5c5c5c
}

@media (min-width: 768px) {
    ul.userrights {
        flex-direction: row
    }

    ul.userrights > li {
        width: 33.333%
    }
}

ul.dl {
    margin: 0 0 11px 0;
    padding: 0;
    list-style-type: none
}

ul.dl > li {
    margin: 0 0 5.5px 0;
    padding: 0
}

ul.dl > li .dt {
    letter-spacing: -0.0375em;
    color: #717171
}

ul.dl > li .dd {
    color: #000
}

ul.dl > li:last-child {
    margin-bottom: 0
}

ul.dl > li.divider {
    border-bottom: 1px solid #cfcfcf
}

ul.dl:last-child {
    margin-bottom: 0
}

.slice-content p + .btn-go {
    margin-top: 44px
}

div.noContent {
    margin: 0 auto;
    max-width: 480px;
    border-radius: 6px;
    padding: 22px
}

div.noContent p {
    margin: 0 0 11px 0
}

div.noContent .actions {
    margin: 22px 0 0 0
}

div.noContent .actions .btn {
    margin-bottom: 11px
}

div.noContent .actions .btn:last-child {
    margin-bottom: 0
}

@media (min-width: 768px) {
    div.noContent {
        border: 2px solid #ebebeb;
        padding: 44px
    }

    div.noContent:only-child {
        margin-top: 22px;
        margin-bottom: 22px
    }
}

.alert {
    margin: 11px;
    border-radius: 11px;
    padding-top: 5.5px;
    padding-bottom: 5.5px;
    box-shadow: 0 2.75px 5.5px rgba(0, 0, 0, .1)
}

.alert.alert-primary {
    border: none;
    background: #022f54;
    background: -moz-linear-gradient(-45deg, #022f54 0%, #038ba2 100%);
    background: -webkit-linear-gradient(-45deg, #022f54 0%, #038ba2 100%);
    background: linear-gradient(135deg, #022f54 0%, #038ba2 100%)
}

.alert.alert-primary .message {
    color: #fff
}

.alert.alert-secondary {
    border: none;
    background: #038ba2;
    background: -moz-linear-gradient(-45deg, #038ba2 0%, #2fbfc1 100%);
    background: -webkit-linear-gradient(-45deg, #038ba2 0%, #2fbfc1 100%);
    background: linear-gradient(135deg, #038ba2 0%, #2fbfc1 100%)
}

.alert.alert-secondary .message {
    color: #fff
}

.alert.alert-danger {
    border: none;
    background: #da4440;
    background: -moz-linear-gradient(-45deg, #da4440 0%, #fd9e21 100%);
    background: -webkit-linear-gradient(-45deg, #da4440 0%, #fd9e21 100%);
    background: linear-gradient(135deg, #da4440 0%, #fd9e21 100%)
}

.alert.alert-danger .message {
    color: #fff
}

.alert.alert-warning {
    border: none;
    background: #fd9e21;
    background: -moz-linear-gradient(-45deg, #fd9e21 0%, #fed302 100%);
    background: -webkit-linear-gradient(-45deg, #fd9e21 0%, #fed302 100%);
    background: linear-gradient(135deg, #fd9e21 0%, #fed302 100%)
}

.alert.alert-warning .message {
    color: #000
}

.alert.alert-success {
    border: none;
    background: #04d184;
    background: -moz-linear-gradient(-45deg, #04d184 0%, #03d184 100%);
    background: -webkit-linear-gradient(-45deg, #04d184 0%, #03d184 100%);
    background: linear-gradient(135deg, #04d184 0%, #03d184 100%)
}

.alert.alert-success .message {
    color: #fff
}

.alert.alert-dismissible {
    justify-content: space-between
}

.alert.alert-dismissible .btn-close {
    padding: 0;
    width: calc(44px + 2px);
    height: calc(44px + 2px)
}

.alert .alert-content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

.alert .message {
    font-size: .9em
}

.alert .message p {
    margin: 0
}

.alert .message p.type {
    display: block
}

.alert .message p.description {
    display: none
}

.alert .actions {
    margin: 0 0 0 11px
}

.alert .actions .btn {
    border-color: transparent
}

.alert .actions .btn .icon {
    display: none
}

.alert .actions .btn .text {
    white-space: nowrap
}

@media (min-width: 768px) {
    .alert {
        padding-left: 44px
    }

    .alert .alert-content {
        justify-content: center;
        width: 100%
    }

    .alert .message p.type {
        display: none
    }

    .alert .message p.description {
        display: block
    }

    .alert .actions .btn .icon {
        display: flex
    }
}

input[type=checkbox]:checked + .account-optin-label .text-off {
    display: none
}

input[type=checkbox]:checked + .account-optin-label .text-on {
    display: inline-block
}

input[type=checkbox]:not(:checked) + .account-optin-label .text-off {
    display: inline-block
}

input[type=checkbox]:not(:checked) + .account-optin-label .text-on {
    display: none
}

#pg-main section.slice.landing-welcome {
    position: relative;
    background: #022f54;
    background-image: url(../images/backgrounds/pg-main-bg.png);
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover
}

#pg-main section.slice.landing-welcome:after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
    content: "";
    width: 100%;
    height: 100%;
    background: -moz-linear-gradient(top, rgba(244, 244, 244, 0) 0%, #f4f4f4 100%);
    background: -webkit-linear-gradient(top, rgba(244, 244, 244, 0) 0%, #f4f4f4 100%);
    background: linear-gradient(to bottom, rgba(244, 244, 244, 0) 0%, #f4f4f4 100%)
}

#pg-main section.slice.landing-welcome .slice-header {
    justify-content: center
}

#pg-main section.slice.landing-welcome .slice-header h1 {
    color: #fff
}

#pg-main section.slice.landing-choice .slice-content {
    display: flex;
    flex-direction: column;
    align: center
}

#pg-main section.slice.landing-choice .slice-content > section {
    padding-top: 22px;
    padding-bottom: 22px
}

#pg-main section.slice.landing-choice .slice-content > section .section-header {
    margin: 0 0 33px 0
}

#pg-main section.slice.landing-choice .slice-content > section .section-header h2 {
    text-align: center
}

#pg-main section.slice.landing-choice .slice-content > section .section-header h2 .icon {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 11px auto;
    border: 3px solid transparent;
    border-radius: 50%;
    padding: 22px;
    width: 88px;
    height: 88px;
    overflow: hidden
}

#pg-main section.slice.landing-choice .slice-content > section .section-header h2 .icon img, #pg-main section.slice.landing-choice .slice-content > section .section-header h2 .icon svg {
    object-fit: contain;
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

#pg-main section.slice.landing-choice .slice-content > section .section-content {
    margin: 0 auto;
    max-width: 320px
}

#pg-main section.slice.landing-choice .slice-content > section .section-content p {
    text-align: justify
}

#pg-main section.slice.landing-choice .slice-content > section:first-child {
    margin: 0 0 44px 0
}

#pg-main section.slice.landing-choice .slice-content > section.signin .section-header h2 .icon {
    border-color: #04d184
}

#pg-main section.slice.landing-choice .slice-content > section.signin .section-header h2 .icon img, #pg-main section.slice.landing-choice .slice-content > section.signin .section-header h2 .icon svg {
    filter: invert(72%) sepia(51%) saturate(4534%) hue-rotate(112deg) brightness(96%) contrast(97%)
}

#pg-main section.slice.landing-choice .slice-content > section.signin .form .signin-password-help a {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    color: #022f54
}

#pg-main section.slice.landing-choice .slice-content > section.signin .form .signin-password-help a .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 5.5px 0 0;
    width: 16.5px;
    height: 16.5px
}

#pg-main section.slice.landing-choice .slice-content > section.signin .form .signin-password-help a .icon img, #pg-main section.slice.landing-choice .slice-content > section.signin .form .signin-password-help a .icon svg {
    object-fit: contain;
    width: inherit;
    height: inherit;
    filter: invert(12%) sepia(37%) saturate(3713%) hue-rotate(190deg) brightness(96%) contrast(98%)
}

#pg-main section.slice.landing-choice .slice-content > section.signin .form .signin-password-help a:hover {
    color: #038ba2
}

#pg-main section.slice.landing-choice .slice-content > section.signin .form .signin-password-help a:hover .icon img, #pg-main section.slice.landing-choice .slice-content > section.signin .form .signin-password-help a:hover .icon svg {
    filter: invert(43%) sepia(46%) saturate(5858%) hue-rotate(164deg) brightness(89%) contrast(98%)
}

#pg-main section.slice.landing-choice .slice-content > section.signin .form .form-submit {
    flex-direction: column
}

#pg-main section.slice.landing-choice .slice-content > section.signin .form .form-submit .buttons {
    margin: 0 0 11px 0;
    width: 100%
}

#pg-main section.slice.landing-choice .slice-content > section.signup .section-header h2 .icon {
    border-color: #fd9e21
}

#pg-main section.slice.landing-choice .slice-content > section.signup .section-header h2 .icon img, #pg-main section.slice.landing-choice .slice-content > section.signup .section-header h2 .icon svg {
    filter: invert(62%) sepia(63%) saturate(771%) hue-rotate(343deg) brightness(103%) contrast(98%)
}

@media (min-width: 768px) {
    #pg-main section.slice.landing-welcome .wrapper {
        min-height: 25vh
    }

    #pg-main section.slice.landing-welcome .slice-header {
        max-width: 66%
    }

    #pg-main section.slice.landing-choice .slice-content {
        margin-top: -88px;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start
    }

    #pg-main section.slice.landing-choice .slice-content > section {
        width: 50%
    }

    #pg-main section.slice.landing-choice .slice-content > section:first-child {
        position: relative;
        margin-bottom: 0;
        padding-right: 44px
    }

    #pg-main section.slice.landing-choice .slice-content > section:last-child {
        padding-left: 44px;
        border-left: 1px solid #cfcfcf
    }
}

.user-wallet {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    border-radius: 22px;
    border: 1px solid #18243a;
    padding: 5.5px;
    height: 44px;
    background: #022f54;
    box-shadow: 0 1.375px 2.75px 0 rgba(0, 0, 0, .1)
}

.user-wallet .helper {
    position: absolute;
    left: 0;
    right: 0;
    top: -16.5px;
    line-height: 16.5px;
    text-align: center;
    font-size: .75em;
    color: #939393
}

.user-wallet .available {
    border-radius: 13.75px;
    padding: 2.75px 11px;
    line-height: 22px;
    font-size: 1.2em;
    color: #fff
}

.user-wallet .available a {
    color: #fff
}

.user-wallet .add a {
    display: block;
    border-radius: 13.75px;
    padding: 2.75px;
    background: #2fbfc1
}

.user-wallet .add a .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px
}

.user-wallet .add a .icon img, .user-wallet .add a .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

.user-wallet .add a .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

.user-wallet .add a:hover {
    background: #038ba2
}

.context-selector.credits > .row {
    position: relative
}

.context-selector.credits > .row:before {
    position: absolute;
    display: inline-block;
    content: "";
    top: 66px;
    left: calc(50% - 6.875px);
    transform: rotate(135deg);
    border-color: #b4b4b4;
    border-style: solid;
    border-width: 2px 2px 0 0;
    width: 11px;
    height: 11px
}

.context-selector.credits .form-select {
    font-weight: bold
}

.context-selector.credits .user-wallet {
    margin: 0 0 16.5px 0 !important;
    justify-content: flex-end;
    box-shadow: none
}

.context-selector.credits .user-wallet .helper {
    top: 11px;
    left: 11px;
    right: auto;
    line-height: 22px;
    font-size: .8em;
    color: rgba(255, 255, 255, .6)
}

.context-selector.credits .user-wallet .available {
    font-weight: bold
}

@media (min-width: 768px) {
    .context-selector.credits > .row:before {
        top: 38.5px;
        transform: rotate(45deg)
    }

    .context-selector.credits .user-wallet {
        margin-top: 22px !important
    }
}

.markers {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style-type: none
}

.markers > li {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 0 0 5.5px;
    width: 12.375px;
    height: 12.375px
}

.markers > li img, .markers > li svg {
    display: flex;
    justify-content: center;
    align-items: center
}

.markers > li svg {
    filter: invert(12%) sepia(37%) saturate(3713%) hue-rotate(190deg) brightness(96%) contrast(98%)
}

.markers > li.favorite svg {
    filter: invert(40%) sepia(58%) saturate(978%) hue-rotate(320deg) brightness(85%) contrast(104%)
}

article.reseller .reseller-profile .characteristics {
    margin-bottom: 22px
}

article.reseller ul.access {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    margin: 0;
    padding: 0;
    list-style-type: none
}

article.reseller ul.access > li {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    border: 1px solid #b4b4b4;
    width: 100%
}

article.reseller ul.access > li:not(:last-child) {
    border-bottom: none
}

article.reseller ul.access > li .name {
    padding: 11px;
    width: 100%;
    background: #f4f4f4;
    line-height: 22px;
    font-weight: bold
}

article.reseller ul.access > li .detail {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 11px;
    width: 100%
}

article.reseller ul.access > li .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px
}

article.reseller ul.access > li .icon img, article.reseller ul.access > li .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

article.reseller ul.access > li.enabled svg {
    filter: invert(72%) sepia(51%) saturate(4534%) hue-rotate(112deg) brightness(96%) contrast(97%)
}

article.reseller ul.access > li.disabled svg {
    filter: invert(92%) sepia(0%) saturate(8%) hue-rotate(150deg) brightness(85%) contrast(80%)
}

@media (min-width: 768px) {
    article.reseller .reseller-profile .characteristics {
        margin-bottom: 0
    }

    article.reseller ul.access {
        flex-direction: row
    }

    article.reseller ul.access > li {
        flex-direction: column
    }

    article.reseller ul.access > li:not(:last-child) {
        border-bottom: 1px solid #b4b4b4
    }

    article.reseller ul.access > li .name {
        border-bottom: 1px solid #b4b4b4;
        text-align: center
    }
}

article.brand .slice-content-title {
    justify-content: flex-start !important;
    align-items: flex-start !important;
    width: 100%
}

article.brand .slice-content-title h2 {
    margin: 0
}

article.brand .slice-content-title .markers {
    margin-top: 11px
}

article.brand .slice-content-title .markers > li {
    width: 16.5px;
    height: 16.5px
}

article.brand .slice-content-data {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start
}

article.brand .slice-content-data > section {
    margin: 0 0 44px 0;
    width: 100%
}

article.brand .slice-content-data > section h3 {
    font-size: 1.1em
}

@media (min-width: 992px) {
    article.brand .slice-content-data {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        gap: 0 44px
    }

    article.brand .slice-content-data > section {
        width: 50%
    }
}

article.brand section.description .thumbnail {
    margin: 0 0 11px 0;
    width: 100%;
    height: 220px
}

article.brand section.description .thumbnail img {
    /*object-fit: cover;*/
    width: 100%;
    /*height: 100%*/
}

article.brand section.description p {
    text-align: justify
}

article.brand section.description p:last-child {
    margin-bottom: 0
}

@media (min-width: 768px) {
    article.brand section.description .thumbnail {
        float: left;
        margin: 0 11px 11px 0;
        width: 165px;
        height: 165px
    }
}

article.brand ul.features {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    margin: 0;
    padding: 0;
    list-style-type: none
}

article.brand ul.features .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px
}

article.brand ul.features .icon img, article.brand ul.features .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

article.brand ul.features h4 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 0;
    border: 1px solid #b4b4b4;
    padding: 11px;
    background: #f4f4f4;
    align-items: center;
    font-weight: bold;
    font-size: 1em;
    color: #18243a
}

article.brand ul.features h4 .icon {
    margin: 0 8.25px 0 0
}

article.brand ul.features h4 .icon svg {
    filter: invert(10%) sepia(67%) saturate(584%) hue-rotate(180deg) brightness(93%) contrast(91%)
}

article.brand ul.features > li {
    margin: 0 0 11px 0
}

article.brand ul.features ul.characteristics {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    margin: 0;
    border: 1px solid #b4b4b4;
    border-top: 0;
    padding: 0;
    list-style-type: none;
    font-size: .9em
}

article.brand ul.features ul.characteristics > li {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    width: 50%
}

article.brand ul.features ul.characteristics > li:first-child {
    border-right: 1px solid #b4b4b4
}

article.brand ul.features ul.characteristics > li.enabled svg {
    filter: invert(72%) sepia(51%) saturate(4534%) hue-rotate(112deg) brightness(96%) contrast(97%)
}

article.brand ul.features ul.characteristics > li.disabled svg {
    filter: invert(92%) sepia(0%) saturate(8%) hue-rotate(150deg) brightness(85%) contrast(80%)
}

article.brand ul.features ul.characteristics > li .name {
    padding: 8.25px;
    border-bottom: 1px solid #b4b4b4;
    width: 100%;
    background: #f4f4f4;
    text-align: center;
    font-weight: bold;
    color: #363636
}

article.brand ul.features ul.characteristics > li .detail {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 8.25px;
    width: 100%;
    text-align: center
}

article.brand ul.features ul.characteristics > li .detail .icon:not(:only-child) {
    margin: 0 0 5.5px 0
}

@media (min-width: 640px) {
    article.brand ul.features {
        flex-direction: row;
        align-items: stretch
    }

    article.brand ul.features > li {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 50%
    }

    article.brand ul.features > li ul.characteristics {
        flex-grow: 5
    }

    article.brand ul.features > li ul.characteristics:before {
        position: relative;
        left: 50%;
        display: block;
        content: "";
        width: 1px;
        height: 100%;
        background: #b4b4b4
    }
}

article.brand nav.actions {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start
}

article.brand nav.actions .btn {
    margin: 0 0 11px 0;
    width: 100%
}

@media (min-width: 992px) {
    article.brand nav.actions {
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: flex-start;
        gap: 0 44px
    }
}

.object-detail {
    margin: 0 0 11px 0;
    border-radius: 6px;
    padding: 22px;
    background: #f4f4f4
}

.object-detail > header {
    margin: 0 0 11px 0;
    border-bottom: 1px solid #cfcfcf;
    padding: 0 0 11px 0
}

.object-detail > header:last-child {
    margin-bottom: 0;
    border-bottom: 0;
    padding-bottom: 0
}

.object-detail .name {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin: 0 0 5.5px 0;
    font-weight: bold;
    font-size: 1.4em
}

.object-detail .name .thumbnail {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 0 11px 0 0
}

.object-detail .name .thumbnail img, .object-detail .name .thumbnail svg {
    width: 49.5px;
    /*height: 49.5px*/
}

.object-detail .name:only-child {
    margin-bottom: 0
}

.object-detail .reseller, .object-detail .brand {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin: 0 0 5.5px 0
}

.object-detail .reseller .thumbnail, .object-detail .brand .thumbnail {
    display: inline-block;
    margin: 0 8.25px 0 0;
    width: 44px;
    height: 44px;
    vertical-align: middle
}

.object-detail .reseller .thumbnail img, .object-detail .reseller .thumbnail svg, .object-detail .brand .thumbnail img, .object-detail .brand .thumbnail svg {
    /*object-fit: contain;*/
    width: 100%;
    /*height: 100%*/
}

.form.order ul.batches {
    margin: 0 0 11px 0;
    padding: 0;
    list-style-type: none
}

.form.order ul.batches > .batch {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    margin: 0 0 22px 0;
    border-bottom: 2px solid #cfcfcf;
    padding: 0 0 22px 0
}

.form.order ul.batches > .batch header {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

.form.order ul.batches > .batch header h3 {
    width: 100%;
    font-weight: bold;
    font-size: 1em
}

.form.order ul.batches > .batch header .actions .btn {
    box-shadow: none
}

.form.order ul.batches > .batch .form {
    display: flex;
    flex-direction: column;
    width: 100%
}

#design-preview {
    margin: 0 0 5.5px 0;
    width: 100%
}

#design-preview img {
    width: 100%
}

#design-selector .actions .btn {
    width: 100%
}

.form.order ul.batches > .batch .form > section.card-parameters {
    display: flex;
    flex-direction: column;
    width: 100%
}

.form.order ul.batches > .batch footer {
    padding-top: 16.5px
}

.form.order ul.batches > .batch .batch-recap {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

.form.order ul.batches > .batch .batch-recap .label {
    margin: 0 0 5.5px 0;
    width: 100%;
    white-space: nowrap;
    font-size: .8em;
    color: #717171
}

.form.order ul.batches > .batch .batch-recap .detail {
    font-size: .8em;
    color: #717171
}

.form.order ul.batches > .batch .batch-recap .total {
    display: flex;
    flex-direction: row;
    font-weight: bold;
    font-size: 1.1em
}

.form.order .btn-add-batch {
    margin: 0 0 22px 0
}

.form.order .order-total {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 10px 0 0 0;
    border-top: 1px solid #cfcfcf;
    padding: 11px 0 0 0
}

.form.order .order-total p {
    margin: 0
}

.form.order .order-total .amounttotal {
    margin: 0 0 0 22px;
    font-weight: bold;
    font-size: 1.2em
}

@media (min-width: 768px) {
    .form.order ul.batches > .batch {
        border-bottom-width: 1px
    }

    .form.order ul.batches > .batch .form .form-group {
        margin-bottom: 0;
        margin-right: 11px
    }

    .form.order ul.batches > .batch .form .form-group:last-child {
        margin-right: 0
    }

    .form.order ul.batches > .batch .form > section {
        margin: 0 0 11px 0
    }

    #design-selector {
        display: flex;
        flex-direction: row;
        align-items: flex-end
    }

    #design-preview {
        margin-right: 11px;
        margin-bottom: 0;
        min-width: 240px;
        max-width: 25%;
        box-shadow: 0 2.75px 2.75px 0 rgba(0, 0, 0, .1)
    }

    .form.order ul.batches > .batch .form > section.card-parameters {
        display: flex;
        flex-direction: row
    }

    .form.order ul.batches > .batch .form > section.card-parameters .form-group {
        width: 50%
    }

    .form.order ul.batches > .batch .batch-recap .label {
        width: 50%
    }

    .form.order ul.batches > .batch .batch-recap .detail, .form.order ul.batches > .batch .batch-recap .total {
        justify-content: flex-end;
        padding-left: 11px;
        width: 25%
    }

    .form.order ul.batches > .batch > footer {
        padding-top: 0
    }
}

article.faq > section, article.legals > section {
    margin: 0 0 44px 0
}

article.faq > section h2, article.legals > section h2 {
    font-size: 2em
}

article.faq > section:last-child, article.legals > section:last-child {
    margin-bottom: 0
}

.list-header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start
}

@media (min-width: 992px) {
    .list-header {
        justify-content: space-between;
        align-items: flex-start;
        width: 100%
    }
}

.list-header .row-container {
    width: 100%
}

.list-actions {
    display: flex;
    margin: 0 0 11px 0
}

.list-actions:first-child {
    margin-bottom: 44px
}

.list-actions .btn {
    margin: 0 11px 11px 0
}

.list-actions .btn:last-child {
    margin-right: 0
}

.list-search {
    margin: 0 0 22px 0;
    width: 100%
}

.list-search .form-control {
    min-height: 33px;
    line-height: 22px
}

.list-search .btn {
    box-shadow: none
}

.list-filter {
    margin: 0 0 44px 0;
    width: 100%
}

.list-filter .daterange {
    width: 100%
}

.list-filter .daterange .form-group {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 11px;
    width: inherit
}

.list-filter .daterange .input-group-text {
    padding-top: calc(11px - 1px);
    padding-bottom: calc(11px - 1px);
    padding-left: 11px;
    padding-right: 11px
}

.list-filter .daterange .input-group {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center
}

@media (min-width: 768px) {
    .list-filter .daterange .form-group {
        flex-direction: row
    }

    .list-filter .daterange .input-group {
        width: 50%
    }
}

.list-sort {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: flex-end;
    margin: 0 0 11px 0;
    width: 100%
}

.list-stats {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 11px;
    margin: 0 0 16.5px 0;
    padding: 0;
    list-style-type: none;
    width: 100%
}

.list-stats > li {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    border-radius: 22px;
    padding: 11px 0 0 0;
    width: 110px;
    height: 110px;
    background: #f4f4f4
}

.list-stats > li .title {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    border-radius: 50%;
    margin: 0 0 5.5px 0;
    padding: 11px;
    background: #022f54;
    font-size: .8em;
    color: #939393
}

.list-stats > li .title .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px
}

.list-stats > li .title .icon img, .list-stats > li .title .icon svg {
    object-fit: contain;
    width: 100%;
    height: 100%
}

.list-stats > li .title .icon svg {
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

.list-stats > li .title .text {
    display: none
}

.list-stats > li .stat {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.list-stats > li .stat .total {
    margin: 0 0 2.75px 0;
    font-weight: bold;
    color: #022f54
}

.list-stats > li .stat .cancelled {
    font-size: .85em;
    color: #939393
}

@media (min-width: 768px) {
    .list-stats {
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start
    }
}

table.list {
    margin: 0 0 44px 0;
    border: 1px solid #b4b4b4;
    width: 100%
}

table.list th, table.list td {
    border: 1px solid #b4b4b4;
    padding: 11px
}

table.list thead th {
    padding-top: 5.5px;
    padding-bottom: 5.5px;
    background: #f4f4f4;
    font-weight: normal;
    font-size: .8em;
    color: #939393
}

table.list tbody .label {
    display: none
}

table.list tbody td a {
    color: #022f54
}

table.list tbody td a:hover {
    color: #18243a
}

table.list tbody td .thumbnail, table.list tbody td .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    display: inline-block;
    width: 22px;
    height: 22px
}

table.list tbody td .thumbnail img, table.list tbody td .thumbnail svg, table.list tbody td .icon img, table.list tbody td .icon svg {
    /*object-fit: contain;*/
    width: 100%;
    /*height: 100%*/
}

table.list tbody td .thumbnail svg, table.list tbody td .icon svg {
    filter: invert(10%) sepia(67%) saturate(584%) hue-rotate(180deg) brightness(93%) contrast(91%)
}

table.list tbody td .icon + .text {
    margin-left: 8.25px
}

table.list tbody td .value {
    line-height: 22px
}

table.list tbody td .thumbnail {
    display: inline-block;
    margin: 0 8.25px 0 0;
    width: 33px;
    height: 33px;
    vertical-align: middle
}

table.list tbody td.key .value {
    font-weight: bold
}

table.list tbody td.key .value a {
    color: #000
}

table.list tbody td.quantity, table.list tbody td.total {
    text-align: right
}

table.list tbody td.comment .value {
    font-size: .9em
}

table.list tbody td.inactive .icon svg {
    filter: invert(92%) sepia(0%) saturate(8%) hue-rotate(150deg) brightness(85%) contrast(80%)
}

table.list tbody td.inactive .text {
    color: #b4b4b4
}

table.list tbody td.active .icon svg {
    filter: invert(10%) sepia(67%) saturate(584%) hue-rotate(180deg) brightness(93%) contrast(91%)
}

table.list tbody td.active .text {
    color: #18243a
}

table.list tbody td.actions {
    width: 66px
}

table.list tbody td.actions .buttons {
    display: flex
}

table.list tbody td.actions .btn {
    float: left;
    margin-right: 11px;
    box-shadow: none
}

table.list tbody td.actions .btn:last-child {
    margin-right: 0
}

table.list tbody td.actions .btn .icon {
    display: flex;
    margin-right: 0
}

table.list tbody td.actions .btn .text {
    margin-left: 0;
    display: none
}

@media (max-width: 992px) {
    table.list {
        display: block;
        margin: 0 0 44px 0;
        border: 0
    }

    table.list thead {
        display: none
    }

    table.list tbody {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        width: 100%
    }

    table.list tbody tr {
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 0 0 22px 0;
        border-radius: 6px;
        width: 100%
    }

    table.list tbody tr td {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        border: 1px solid #b4b4b4;
        border-bottom: 0;
        padding: 5.5px 11px;
        width: 100%
    }

    table.list tbody tr td:first-child {
        border-top-left-radius: 6px;
        border-top-right-radius: 6px
    }

    table.list tbody tr td:first-child:not(.key) {
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }

    table.list tbody tr td:last-child {
        border-bottom-left-radius: 6px;
        border-bottom-right-radius: 6px
    }

    table.list tbody tr td .label {
        display: block;
        font-size: .75em;
        color: #939393
    }

    table.list tbody tr td.key {
        order: -1;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
        border-color: #18243a;
        background: #022f54;
        color: #fff
    }

    table.list tbody tr td.key ~ .key {
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }

    table.list tbody tr td.key .label {
        color: rgba(255, 255, 255, .75)
    }

    table.list tbody tr td.key .value {
        font-weight: bold
    }

    table.list tbody tr td.key .value a {
        color: #fff
    }

    table.list tbody tr td.actions {
        border: 0;
        padding: 0;
        width: 100%;
        height: auto
    }

    table.list tbody tr td.actions .buttons {
        display: flex;
        flex-direction: column;
        border: 0;
        padding: 0;
        width: 100%;
        height: auto
    }

    table.list tbody tr td.actions .label {
        display: none
    }

    table.list tbody tr td.actions .btn {
        float: none;
        display: flex;
        border-radius: 0;
        width: 100%;
        box-shadow: none
    }

    table.list tbody tr td.actions .btn .icon {
        margin-right: 8.25px
    }

    table.list tbody tr td.actions .btn .text {
        display: inline
    }

    table.list tbody tr td.actions .btn:last-child {
        border-bottom-left-radius: 6px;
        border-bottom-right-radius: 6px
    }

    table.list tbody tr td.actions .btn:disabled {
        display: none
    }

    table.list tbody tr td.actions .btn + .btn {
        margin-top: -1px
    }

    table.list tbody tr td:last-child:not(.actions) {
        border-bottom: 1px solid #b4b4b4
    }
}

table.list-resellers tbody td.validationStatus {
    width: 66px;
    text-align: center
}

@media (max-width: 992px) {
    table.list-resellers tbody tr td.brand .label {
        display: none
    }

    table.list-resellers tbody tr td.signaturedate {
        width: 66.666%
    }

    table.list-resellers tbody tr td.validationStatus {
        width: 33.333%
    }
}

ul.list-brands {
    margin: 0;
    padding: 0;
    list-style-type: none
}

ul.list-brands > li {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 22px 0 22px 0;
    border-radius: 6px
}

.accordion-container {
    max-height: 300px; /* Adjust the height as needed */
    overflow-y: auto;
}

.accordion {
    /*border-bottom: 1px solid #cfcfcf;*/
    padding: 0 0 22px 0
}

ul.list-brands > li .thumbnail {
    border: 1px solid #b4b4b4;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    width: 100%;
    height: 110px;
    overflow: hidden
}

ul.list-brands > li .thumbnail a {
    display: block;
    width: inherit;
    height: inherit
}

ul.list-brands > li .thumbnail img {
    /*object-fit: cover;*/
    width: 100%;
    /*height: 100%*/
}

ul.list-brands > li .data {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 0;
    border: 1px solid #b4b4b4;
    border-bottom: 0;
    border-left: 1px solid #b4b4b4;
    border-right: 1px solid #b4b4b4;
    padding: 11px;
    width: 100%
}

ul.list-brands > li .data:last-child {
    border-bottom: 1px solid #b4b4b4;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px
}

ul.list-brands > li .data header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 11px 0;
    width: 100%
}

ul.list-brands > li .data .title {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    font-weight: bold;
    font-size: 1.4em
}

ul.list-brands > li .data .title a {
    color: #000
}

ul.list-brands > li .data > .row {
    width: 100%
}

ul.list-brands > li nav.actions {
    width: 100%
}

ul.list-brands > li nav.actions .btn {
    justify-content: flex-start;
    border-radius: 0;
    border-bottom: 0;
    box-shadow: none
}

.btn-contact, .btn-addfavorite, .btn-removefavorite, .btn-subscribed {
    width: 200px;
}

.btn-order, .btn-api {
    width: 335px;
}


ul.list-brands > li nav.actions .btn:last-child {
    border-bottom: 1px solid #b4b4b4;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px
}

@media (min-width: 640px) {
    ul.list-brands > li {
        flex-direction: row;
        border: 0;
        border-radius: 0;
        border-bottom: 1px solid #cfcfcf;
        padding: 0 0 22px 0
    }

    ul.list-brands > li .thumbnail {
        border-radius: 0;
        border: 0;
        width: 110px;
        height: 110px
    }

    ul.list-brands > li .data {
        flex-grow: 10;
        border: 0;
        padding: 11px 22px;
        width: auto
    }

    ul.list-brands > li .data header {
        justify-content: flex-start
    }

    ul.list-brands > li .data:last-child {
        border-radius: 0;
        border-bottom: 0
    }

    ul.list-brands > li nav.actions {
        width: auto
    }

    ul.list-brands > li nav.actions .btn {
        margin: 0 0 5.5px 0;
        border-radius: 6px;
        border-bottom: 1px solid #b4b4b4;
        box-shadow: none;
        white-space: nowrap
    }
}

table.list-codes tbody td.order .value {
    font-size: .9em
}

table.list-codes tbody td.pin, table.list-codes tbody td.activation, table.list-codes tbody td.cancellation {
    width: 66px;
    text-align: center
}

@media (max-width: 992px) {
    table.list-codes tbody tr td.brand .label {
        display: none
    }

    table.list-codes tbody tr td.pin, table.list-codes tbody tr td.activation, table.list-codes tbody tr td.cancellation {
        width: 33.333%;
        border-bottom: 1px solid #b4b4b4
    }

    table.list-codes tbody tr td.pin {
        border-bottom-left-radius: 6px
    }

    table.list-codes tbody tr td.cancellation {
        border-bottom-left-radius: 0
    }
}

@media (max-width: 992px) {
    table.list-orders tbody tr td.brand .label {
        display: none
    }

    table.list-orders tbody tr td.quantity, table.list-orders tbody tr td.total {
        width: 50%
    }

    table.list-orders tbody tr td.pin, table.list-orders tbody tr td.activation, table.list-orders tbody tr td.cancellation {
        width: 33.333%
    }
}

ul.list-cardvisuals {
    margin: 0 0 11px 0;
    padding: 11px;
    list-style-type: none;
    height: 50vh;
    overflow-y: scroll
}

ul.list-cardvisuals > li {
    float: left;
    position: relative;
    margin: 0 0 11px 0;
    width: 100%
}

ul.list-cardvisuals > li .design-preview {
    cursor: pointer
}

ul.list-cardvisuals > li .design-preview img {
    width: 100%;
    box-shadow: 0 2.75px 2.75px 0 rgba(0, 0, 0, .1)
}

ul.list-cardvisuals > li .selection-marker {
    display: none;
    position: absolute;
    top: -3.63px;
    right: -3.63px;
    border-radius: 50%;
    padding: 5.5px;
    width: 44px;
    height: 44px;
    background: #04d184
}

ul.list-cardvisuals > li .selection-marker svg {
    width: 22px;
    height: 22px;
    filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(321deg) brightness(103%) contrast(107%)
}

ul.list-cardvisuals > li.selected .selection-marker {
    display: flex;
    justify-content: center;
    align-items: center
}

ul.list-cardvisuals > li:last-child {
    margin-bottom: 0
}

@media (min-width: 480px) {
    ul.list-cardvisuals {
        margin-left: -5.5px;
        margin-right: -5.5px
    }

    ul.list-cardvisuals > li {
        margin-left: 5.5px;
        margin-right: 5.5px;
        width: calc(50% - 11px)
    }
}

table.list-credits thead tr.wallet th, table.list-credits thead tr.wallet td {
    border-bottom-width: 2px
}

table.list-credits thead tr.wallet td.value {
    text-align: right;
    font-size: 1em
}

table.list-credits tbody td.date, table.list-credits tbody td.total {
    width: 25%
}

table.list-credits tbody td.comment {
    width: 50%
}

@media (max-width: 992px) {
    table.list-credits tbody td.date, table.list-credits tbody td.total, table.list-credits tbody td.comment {
        width: 100%
    }
}

table.list-physicalcards tbody td.activation, table.list-physicalcards tbody td.cancellation {
    width: 66px;
    text-align: center
}

@media (max-width: 992px) {
    table.list-physicalcards tbody tr td.brand .label {
        display: none
    }

    table.list-physicalcards tbody tr td.activation, table.list-physicalcards tbody tr td.cancellation {
        width: 50%;
        border-bottom: 1px solid #b4b4b4
    }

    table.list-physicalcards tbody tr td.activation {
        border-bottom-left-radius: 6px
    }

    table.list-physicalcards tbody tr td.cancellation {
        border-bottom-left-radius: 0
    }
}

table.list-alerts tbody td.actions .btn .icon {
    margin-right: 11px
}

table.list-alerts tbody td.actions .btn .text {
    display: inline;
    white-space: nowrap
}

@media (max-width: 992px) {
    table.list-roles tbody tr td.name.key {
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
        order: -2
    }

    table.list-roles tbody tr td.type {
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }

    table.list-roles tbody tr td.id, table.list-roles tbody tr td.nbRights {
        width: 50%
    }

    table.list-roles tbody tr td.id {
        border-right: 0
    }
}

table.list-dashboard tbody tr td.obj1 {
    border-color: #18243a;
    background: #18243a;
    background: -moz-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
    background: -webkit-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
    background: linear-gradient(135deg, #18243a 33%, #022f54 100%);
    font-weight: bold;
    font-size: 1.2em;
    color: #fff
}

table.list-dashboard tbody tr td.obj1 a {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: #fff
}

table.list-dashboard tbody tr td.obj2 {
    background: #e2f6fd
}

table.list-dashboard tbody tr td.obj2 .label {
    color: #34485c
}

table.list-dashboard tbody tr td a {
    color: #18243a
}

table.list-dashboard tbody tr td a:hover {
    color: #000
}

table.list-dashboard tbody tr td.salesValue, table.list-dashboard tbody tr td.salesRevenue, table.list-dashboard tbody tr td.grossMargin {
    text-align: right
}

table.list-dashboard tbody tr.total {
    background: #ebebeb
}

table.list-dashboard tbody tr.total th {
    font-weight: normal
}

table.list-dashboard tbody tr.total td {
    font-weight: bold
}

@media (max-width: 992px) {
    table.list-dashboard tbody {
        margin: 0 0 44px 0
    }

    table.list-dashboard tbody tr {
        margin: 0
    }

    table.list-dashboard tbody tr td:last-child {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0
    }

    table.list-dashboard tbody tr td.obj1 {
        border-top-left-radius: 6px !important;
        border-top-right-radius: 6px !important;
        border-bottom: 0 !important;
        padding-top: 11px;
        padding-bottom: 11px
    }

    table.list-dashboard tbody tr td.obj3 {
        border-left: 11px solid #b4b4b4
    }

    table.list-dashboard tbody tr td.obj3 + td {
        border-left: 11px solid #b4b4b4
    }

    table.list-dashboard tbody tr td.salesValue, table.list-dashboard tbody tr td.salesRevenue, table.list-dashboard tbody tr td.grossMargin {
        border-bottom: 0 !important;
        width: 33.333%
    }

    table.list-dashboard tbody tr td.salesValue, table.list-dashboard tbody tr td.salesRevenue {
        border-right: 0
    }

    table.list-dashboard tbody tr.total {
        background: #18243a;
        background: -moz-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
        background: -webkit-linear-gradient(-45deg, #18243a 33%, #022f54 100%);
        background: linear-gradient(135deg, #18243a 33%, #022f54 100%)
    }

    table.list-dashboard tbody tr.total th {
        border-color: #c1c1c1;
        border-bottom: 0;
        width: 100%;
        font-size: .9em;
        color: #fff
    }

    table.list-dashboard tbody tr.total td {
        border-color: #c1c1c1;
        border-bottom: 1px solid #b4b4b4 !important
    }

    table.list-dashboard tbody tr.total td .value {
        color: #fff
    }

    table.list-dashboard tbody tr.total td.salesValue {
        border-bottom-left-radius: 6px !important
    }

    table.list-dashboard tbody tr.total td.grossMargin {
        border-bottom-right-radius: 6px !important
    }
}

@media (max-width: 640px) {
    table.list-dashboard tbody tr td.salesValue, table.list-dashboard tbody tr td.salesRevenue {
        width: 50%
    }

    table.list-dashboard tbody tr td.salesRevenue {
        border-right: 1px solid #b4b4b4
    }

    table.list-dashboard tbody tr td.grossMargin {
        width: 100%
    }

    table.list-dashboard tbody tr.total td.salesValue, table.list-dashboard tbody tr.total td.salesRevenue {
        border-bottom: 0 !important
    }

    table.list-dashboard tbody tr.total td.grossMargin {
        border-bottom-left-radius: 6px !important;
        border-bottom-right-radius: 6px !important
    }
}

.slice.signin .module .module-content {
    margin: 0 auto;
    max-width: 480px
}

.slice.signin .module form .form-submit .btn {
    width: 100%
}

.module.signin .form-group.password .form-control-help {
    text-align: right
}

.slice.signout .module.signedout .module-content {
    text-align: center
}

.slice.signout .module.signedout .module-content p + .btn {
    margin-top: 33px
}

.module.order .products-category {
    margin: 0 0 33px 0
}

.module.order .products-category > h3 {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 0 0 11px 0;
    font-size: 1.2em;
    color: #344b7e
}

.module.order ul.products.list {
    margin: 0;
    padding: 0;
    list-style-type: none
}

.module.order ul.products.list > li {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin: 0 0 5.5px 0;
    padding: 0;
    width: 100%
}

.module.order ul.products.list > li .product-picture {
    display: flex;
    align-items: center;
    /*object-fit: cover;*/
    object-position: center;
    overflow: hidden;
    margin: 0 11px 0 0;
    border-radius: 6px;
    padding: 5.5px;
    width: 88px;
    height: 88px;
    background-color: #ebebeb
}

.module.order ul.products.list > li .product-picture img {
    display: flex;
    margin: 0 auto;
    width: 100%;
    /*height: 100%;*/
    /*object-fit: contain*/
}

.module.order ul.products.list > li .product-data {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-grow: 10;
    font-size: 1.1em
}

.module.order.details .orderDetails-section {
    margin: 0 0 44px 0
}

.orderDetails-section-title {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 0 0 11px 0;
    font-size: 1.4em;
    color: #344b7e
}

.orderDetails-section-title .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 8.25px 0 0;
    width: 22px;
    height: 22px
}

.orderDetails-section-title .icon i {
    font-size: .85em
}

.orderDetails-section ul.dl {
    margin: 0;
    padding: 0;
    list-style-type: none
}

.orderDetails-section ul.dl > li {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    margin: 0 0 2.75px 0;
    padding: 0;
    line-height: 1.375em
}

.orderDetails-section ul.dl > li .dt {
    width: 110px;
    color: #7e93c1
}

.orderDetails-section ul.dl > li.status .dd .icon {
    margin: 0 11px 0 0;
    vertical-align: middle;
    color: #5873b1
}

.orderDetails-section ul.dl > li.status .dd .text {
    vertical-align: middle
}

@media (max-width: 479px) {
    .orderDetails-section ul.dl > li {
        flex-direction: column;
        border-bottom: 1px solid #dedede;
        padding-bottom: 5.5px
    }

    .orderDetails-section ul.dl > li .dt {
        width: auto;
        font-size: .8em
    }

    .orderDetails-section ul.dl > li:last-child {
        border-bottom: 0;
        padding-bottom: 0
    }
}

.module.order .form-section.cart .cart-list, .module.order .orderDetails-section.cart .cart-list {
    margin: 0 auto;
    border: 1px solid #cfcfcf;
    border-radius: 6px;
    padding: 22px;
    max-width: 480px
}

.module.order .form-section.cart .cart-list .products-category, .module.order .orderDetails-section.cart .cart-list .products-category {
    margin-left: -22px;
    margin-right: -22px;
    margin-bottom: 22px;
    border-bottom: 1px solid #cfcfcf;
    padding-left: 22px;
    padding-right: 22px;
    padding-bottom: 22px
}

.module.order .form-section.cart .cart-list .products-category:last-child, .module.order .orderDetails-section.cart .cart-list .products-category:last-child {
    margin-bottom: 0;
    border-bottom: 0
}

.module.stats {
    margin: 0 0 44px 0
}

.module.stats .blocks {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    margin-left: -5.5px;
    margin-right: -5.5px;
    padding: 0;
    list-style-type: none
}

.module.stats .blocks > li {
    margin: 0;
    padding: 5.5px;
    width: 100%
}

.module.stats .blocks .block {
    display: flex;
    flex-direction: column;
    border-radius: 6px;
    border: 1px solid #cfcfcf;
    padding: 11px;
    box-shadow: 0 2.75px 5.5px rgba(0, 0, 0, .1);
    background: #fbfbfb
}

.module.stats .blocks .block > header {
    margin: 0 0 16.5px 0;
    border-bottom: 1px solid #dedede;
    padding: 0 0 5.5px 0
}

.module.stats .blocks .block > header h2 {
    margin: 0 0 5.5px 0;
    font-size: 1.2em;
    color: #344b7e
}

.module.stats .blocks .block > header h2 .icon {
    margin: 0 11px 0 0
}

.module.stats .stat-group {
    display: flex;
    flex-direction: row
}

.module.stats .stat-group > .stat {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 0 auto 2.75px auto;
    border-radius: 33px;
    width: 132px;
    height: 66px;
    background: #fff
}

.module.stats .stat-group > .stat .number {
    font-weight: bold;
    font-size: 1.05em;
    color: #344b7e
}

.module.stats .stat-group > .stat .unit {
    font-size: .85em
}

@media (min-width: 640px) {
    .module.stats .blocks > li {
        width: 50%
    }

    .module.stats .blocks .block {
        padding: 22px
    }
}

@media (min-width: 992px) {
    .module.stats .blocks > li {
        width: 33.3333%
    }
}

.module.graph .nav-graph {
    margin: 0 0 11px 0
}

.module.graph .nav-graph.asHeader {
    margin: 0;
    border: 1px solid #d2d9e8;
    border-bottom: 0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding: 5.5px 11px;
    background: #e1e6f0
}

.module.graph .nav-graph .form-group label {
    vertical-align: middle;
    color: #344b7e
}

.module.graph .nav-graph .form-group:last-child {
    margin-bottom: 0
}

.module.graph .graph-container {
    border-radius: 6px;
    padding: 11px;
    border: 1px solid #cfcfcf;
    background: #fff
}

.module.graph .nav-graph + .graph-container {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

/*# sourceMappingURL=screen.css.map */

.img-fluid {
    width: 150px;
    height: auto;
}

.permission-item {
    border-bottom: none;
}

.account-li {
    cursor: pointer;
}

.reseller-profile-label {
    display: flex;
    align-items: center;
}


.validation-row{
    display: flex;
    flex-direction: column;
    justify-content: space-around
}
/* CUSTOM STYLED SCROLL BAR */
::-webkit-scrollbar {
    width: 15px; /* width of the scrollbar */
}
::-webkit-scrollbar-thumb {
    background: #777; /* color of the scrollbar handle */
}
::-webkit-scrollbar-thumb:hover {
    background: #555; /* color of the scrollbar handle on hover */
}
::-webkit-scrollbar-track {
    background: #f1f1f1; /* color of the scrollbar track */
}

::-webkit-scrollbar-thumb:active {
    background: #666; /* color of the scrollbar handle when dragging */
}

.pg-not-found {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 5%
}