body {
    overflow-y: scroll !important;
}

/*------------------------------------------
ANIMATIONS
------------------------------------------*/
.ring {
    -webkit-animation: ring 4s .7s ease-in-out infinite;
    -webkit-transform-origin: 50% 4px;
    -moz-animation: ring 4s .7s ease-in-out infinite;
    -moz-transform-origin: 50% 4px;
    animation: ring 4s .7s ease-in-out infinite;
    transform-origin: 50% 4px;
}

@-webkit-keyframes ring {
    0% {
        -webkit-transform: rotateZ(0);
    }
    1% {
        -webkit-transform: rotateZ(30deg);
    }
    3% {
        -webkit-transform: rotateZ(-28deg);
    }
    5% {
        -webkit-transform: rotateZ(34deg);
    }
    7% {
        -webkit-transform: rotateZ(-32deg);
    }
    9% {
        -webkit-transform: rotateZ(30deg);
    }
    11% {
        -webkit-transform: rotateZ(-28deg);
    }
    13% {
        -webkit-transform: rotateZ(26deg);
    }
    15% {
        -webkit-transform: rotateZ(-24deg);
    }
    17% {
        -webkit-transform: rotateZ(22deg);
    }
    19% {
        -webkit-transform: rotateZ(-20deg);
    }
    21% {
        -webkit-transform: rotateZ(18deg);
    }
    23% {
        -webkit-transform: rotateZ(-16deg);
    }
    25% {
        -webkit-transform: rotateZ(14deg);
    }
    27% {
        -webkit-transform: rotateZ(-12deg);
    }
    29% {
        -webkit-transform: rotateZ(10deg);
    }
    31% {
        -webkit-transform: rotateZ(-8deg);
    }
    33% {
        -webkit-transform: rotateZ(6deg);
    }
    35% {
        -webkit-transform: rotateZ(-4deg);
    }
    37% {
        -webkit-transform: rotateZ(2deg);
    }
    39% {
        -webkit-transform: rotateZ(-1deg);
    }
    41% {
        -webkit-transform: rotateZ(1deg);
    }

    43% {
        -webkit-transform: rotateZ(0);
    }
    100% {
        -webkit-transform: rotateZ(0);
    }
}

@-moz-keyframes ring {
    0% {
        -moz-transform: rotate(0);
    }
    1% {
        -moz-transform: rotate(30deg);
    }
    3% {
        -moz-transform: rotate(-28deg);
    }
    5% {
        -moz-transform: rotate(34deg);
    }
    7% {
        -moz-transform: rotate(-32deg);
    }
    9% {
        -moz-transform: rotate(30deg);
    }
    11% {
        -moz-transform: rotate(-28deg);
    }
    13% {
        -moz-transform: rotate(26deg);
    }
    15% {
        -moz-transform: rotate(-24deg);
    }
    17% {
        -moz-transform: rotate(22deg);
    }
    19% {
        -moz-transform: rotate(-20deg);
    }
    21% {
        -moz-transform: rotate(18deg);
    }
    23% {
        -moz-transform: rotate(-16deg);
    }
    25% {
        -moz-transform: rotate(14deg);
    }
    27% {
        -moz-transform: rotate(-12deg);
    }
    29% {
        -moz-transform: rotate(10deg);
    }
    31% {
        -moz-transform: rotate(-8deg);
    }
    33% {
        -moz-transform: rotate(6deg);
    }
    35% {
        -moz-transform: rotate(-4deg);
    }
    37% {
        -moz-transform: rotate(2deg);
    }
    39% {
        -moz-transform: rotate(-1deg);
    }
    41% {
        -moz-transform: rotate(1deg);
    }

    43% {
        -moz-transform: rotate(0);
    }
    100% {
        -moz-transform: rotate(0);
    }
}

@keyframes ring {
    0% {
        transform: rotate(0);
    }
    1% {
        transform: rotate(30deg);
    }
    3% {
        transform: rotate(-28deg);
    }
    5% {
        transform: rotate(34deg);
    }
    7% {
        transform: rotate(-32deg);
    }
    9% {
        transform: rotate(30deg);
    }
    11% {
        transform: rotate(-28deg);
    }
    13% {
        transform: rotate(26deg);
    }
    15% {
        transform: rotate(-24deg);
    }
    17% {
        transform: rotate(22deg);
    }
    19% {
        transform: rotate(-20deg);
    }
    21% {
        transform: rotate(18deg);
    }
    23% {
        transform: rotate(-16deg);
    }
    25% {
        transform: rotate(14deg);
    }
    27% {
        transform: rotate(-12deg);
    }
    29% {
        transform: rotate(10deg);
    }
    31% {
        transform: rotate(-8deg);
    }
    33% {
        transform: rotate(6deg);
    }
    35% {
        transform: rotate(-4deg);
    }
    37% {
        transform: rotate(2deg);
    }
    39% {
        transform: rotate(-1deg);
    }
    41% {
        transform: rotate(1deg);
    }

    43% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(0);
    }
}

.spin {
    -webkit-animation: spin 4s linear infinite;
    -moz-animation: spin 4s linear infinite;
    animation: spin 4s linear infinite;
}

@-moz-keyframes spin {
    100% {
        -moz-transform: rotate(360deg);
    }
}

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

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


.arrow-jump {
    -webkit-animation: arrow-jump 1s infinite; /* Safari 4+ */
    -moz-animation: arrow-jump 1s infinite; /* Fx 5+ */
    animation: arrow-jump 1s infinite; /* IE 10+, Fx 29+ */
}

@keyframes arrow-jump {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(10px);
        -moz-transform: translateX(10px);
        transform: translateX(10px);
    }
}

@-webkit-keyframes arrow-jump {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(10px);
        -moz-transform: translateX(10px);
        transform: translateX(10px);
    }
}

.shadow-pulse {
    -webkit-animation: shadow-pulse 1s infinite; /* Safari 4+ */
    -moz-animation: shadow-pulse 1s infinite; /* Fx 5+ */
    animation: shadow-pulse 1s infinite; /* IE 10+, Fx 29+ */
}

@keyframes shadow-pulse {
    0% {
        box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
    }
    100% {
        box-shadow: 0 0 0 12px rgba(0, 0, 0, 0);
    }
}

@-webkit-keyframes shadow-pulse {
    0% {
        box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
    }
    100% {
        box-shadow: 0 0 0 12px rgba(0, 0, 0, 0);
    }
}

.floating {
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out
}

@keyframes floating {
    from {
        transform: translate(0, -15px);
    }
    65% {
        transform: translate(0, 15px);
    }
    to {
        transform: translate(0, -15px);
    }
}

@-webkit-keyframes floating {
    from {
        transform: translate(0, -15px);
    }
    65% {
        transform: translate(0, 15px);
    }
    to {
        transform: translate(0, -15px);
    }
}


.floating-small {
    animation-name: floating-small;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out
}

@keyframes floating-small {
    from {
        transform: translate(0, -5px);
    }
    65% {
        transform: translate(0, 5px);
    }
    to {
        transform: translate(0, -5px);
    }
}

@-webkit-keyframes floating-small {
    from {
        transform: translate(0, -5px);
    }
    65% {
        transform: translate(0, 5px);
    }
    to {
        transform: translate(0, -5px);
    }
}


/*------------------------------------------
COLORS
------------------------------------------*/
:root {
    --red-coke: #e4032f;
    --orange-coke: #E98300;
    --black-coke: #1E1E1E;
    --grey-coke: #A7A9AC;
    --alabaster: #f8f8f8;

    --violet: #7863AC;
    --slate: #8E78FF;
    --mehta: #2B244D;
    --muzli: #392E55;
    --speech: #ed3833;
    --chirog: #04B397;
    --pantone: #6AB9FF;
    --supernova: #FBB03B;
    --striped: #C578FF;
    --angel: #a1dd70;
    --snow: #fafafa;
    --green-gradient: linear-gradient(to right, #09DC7F 0%, #04B397 100%);
    --red-gradient: linear-gradient(to right, #000000 0%, #ed1c16 100%)
}


/* BGS */
.kt-bg-red, .kt-btn-red, .kt-outline-btn-red:hover, .kt-bg-red-air {
    background-color: #e4032f !important
}

.kt-bg-orange, .kt-btn-orange, .kt-outline-btn-orange:hover, .kt-bg-orange-air {
    background-color: #E98300 !important
}

.kt-bg--black-coke, .kt-btn-black, .kt-outline-btn-black:hover, .kt-bg-black-air {
    background-color: #1E1E1E !important
}

.kt-bg-grey, .kt-btn-grey, .kt-outline-btn-grey:hover, .kt-bg-grey-air {
    background-color: #A7A9AC !important
}


.kt-bg-green-gradient, .kt-btn-green-gradinet {
    background-image: linear-gradient(to right, #09DC7F 0%, #04B397 100%) !important
}

.kt-bg-red-gradient, .kt-btn-red-gradinet {
    background-image: linear-gradient(to right, #000000 0%, #ed1c16 100%) !important
}

.kt-bg-violet, .kt-btn-violet, .kt-outline-btn-violet:hover, .kt-bg-violet-air {
    background-color: #7863AC !important
}

.kt-bg-slate, .kt-btn-slate, .kt-outline-btn-slate:hover, .kt-bg-slate-air {
    background-color: #8E78FF !important
}

.kt-bg-mehta, .kt-btn-mehta, .kt-outline-btn-mehta:hover {
    background-color: #2B244D !important
}

.kt-bg-muzli, .kt-btn-muzli, .kt-outline-btn-muzli:hover {
    background-color: #392E55 !important
}

.kt-bg-speech, .kt-btn-speech, .kt-outline-btn-speech:hover {
    background-color: #ed3833 !important
}

.kt-bg-chirag, .kt-btn-chirog, .kt-outline-btn-chirog:hover {
    background-color: #04B397 !important
}

.kt-bg-pantone, .kt-btn-pantone, .kt-outline-btn-pantone:hover {
    background-color: #6AB9FF !important
}

.kt-bg-supernova, .kt-btn-supernova, .kt-outline-btn-supernova:hover {
    background-color: #FBB03B !important
}

.kt-bg-striped, .kt-btn-striped, .kt-outline-btn-striped:hover {
    background-color: #C578FF !important
}

.kt-bg-angel, .kt-btn-angel, .kt-outline-btn-angel:hover {
    background-color: #a1dd70 !important
}

.kt-bg-snow {
    background-color: #fafafa !important
}

.kt-bg-white, .kt-bg-white-air {
    background-color: #fff !important
}


/* AIRs */
.kt-bg-red-air {
    box-shadow: 0 9px 16px 0 rgba(244, 0, 0, 0.25) !important
}

.kt-bg-red-air:hover {
    box-shadow: inset 0 48px 0 0 rgba(0, 0, 0, .05), 0 9px 16px 0 rgba(244, 0, 0, 0.25) !important
}

.kt-bg-orange-air {
    box-shadow: 0 9px 16px 0 rgba(233, 131, 0, 0.1) !important
}

.kt-bg-orange-air:hover {
    box-shadow: inset 0 48px 0 0 rgba(0, 0, 0, .05), 0 9px 16px 0 rgba(233, 131, 0, 0.1) !important
}

.kt-bg-black-air {
    box-shadow: 0 9px 16px 0 rgba(0, 0, 0, 0.1) !important
}

.kt-bg-black-air:hover {
    box-shadow: inset 0 48px 0 0 rgba(0, 0, 0, .05), 0 9px 16px 0 rgba(0, 0, 0, 0.1) !important
}

.kt-bg-grey-air {
    box-shadow: 0 9px 16px 0 rgba(167, 169, 172, 0.1) !important
}

.kt-bg-grey-air:hover {
    box-shadow: inset 0 48px 0 0 rgba(0, 0, 0, .05), 0 9px 16px 0 rgba(167, 169, 172, 0.1) !important
}

.kt-bg-violet-air {
    box-shadow: 0 9px 16px 0 rgba(120, 99, 172, 0.1) !important
}

.kt-bg-violet-air:hover {
    box-shadow: inset 0 48px 0 0 rgba(0, 0, 0, .05), 0 9px 16px 0 rgba(120, 99, 172, 0.1) !important
}

.kt-bg-slate-air {
    box-shadow: 0 9px 16px 0 rgba(142, 120, 255, 0.1) !important
}

.kt-bg-slate-air:hover {
    box-shadow: inset 0 48px 0 0 rgba(0, 0, 0, .05), 0 9px 16px 0 rgba(142, 120, 255, 0.1) !important
}

.kt-bg-white-air {
    box-shadow: 0 9px 16px 0 rgba(255, 255, 255, 0.1) !important
}


/* FONT COLORS */
.kt-font-red, .kt-outline-btn-red, .kt-label-btn-red {
    color: #e4032f !important
}

.kt-font-orange, .kt-outline-btn-orange, .kt-label-btn-orange {
    color: #E98300 !important
}

.kt-font--black-coke, .kt-outline-btn-black, .kt-label-btn-black {
    color: #1E1E1E !important
}

.kt-font-grey, .kt-outline-btn-grey, .kt-label-btn-grey {
    color: #A7A9AC !important
}


.kt-font-violet, .kt-outline-btn-violet, .kt-label-btn-violet {
    color: var(--violet) !important
}

.kt-font-slate, .kt-outline-btn-slate, .kt-label-btn-slate {
    color: var(--slate) !important
}

.kt-font-mehta, .kt-outline-btn-mehta, .kt-label-btn-mehta {
    color: var(--mehta) !important
}

.kt-font-muzli, .kt-outline-btn-muzli, .kt-label-btn-muzli {
    color: var(--muzli) !important
}

.kt-font-speech, .kt-outline-btn-speech, .kt-label-btn-speech {
    color: var(--speech) !important
}

.kt-font-chirag, .kt-outline-btn-chirog, .kt-label-btn-chirog {
    color: var(--chirog) !important
}

.kt-font-pantone, .kt-outline-btn-pantone, .kt-label-btn-pantone {
    color: var(--pantone) !important
}

.kt-font-supernova, .kt-outline-btn-supernova, .kt-label-btn-supernova {
    color: var(--supernova) !important
}

.kt-font-striped, .kt-outline-btn-striped, .kt-label-btn-striped {
    color: var(--striped) !important
}

.kt-font-angel, .kt-label-btn-angel, .kt-label-btn-angel {
    color: var(--angel) !important
}

.kt-font-secondary {
    color: var(--secondary) !important
}

.kt-font-white, [class*='kt-btn-'], [class*='kt-outline-btn-']:hover {
    color: #fff !important
}

[class*='kt-btn-'] {
    border: 1px solid transparent !important
}


/* SVG FILLS */
.kt-fill-red {
    fill: #e4032f !important
}

.kt-fill-orange {
    fill: #E98300 !important
}

.kt-fill-black {
    fill: #1E1E1E !important
}

.kt-fill-grey {
    fill: #A7A9AC !important
}


.kt-fill-violet {
    fill: var(--violet) !important
}

.kt-fill-slate {
    fill: var(--slate) !important
}

.kt-fill-mehta {
    fill: var(--mehta) !important
}

.kt-fill-muzli {
    fill: var(--muzli) !important
}

.kt-fill-speech {
    fill: var(--speech) !important
}

.kt-fill-chirag {
    fill: var(--chirog) !important
}

.kt-fill-pantone {
    fill: var(--pantone) !important
}

.kt-fill-supernova {
    fill: var(--supernova) !important
}

.kt-fill-striped {
    fill: var(--striped) !important
}

.kt-fill-angel {
    fill: var(--angel) !important
}


/* OUTLINES */
.kt-outline-btn-red, .kt-btn-red {
    border-color: #e4032f !important
}

.kt-outline-btn-orange, .kt-btn-orange {
    border-color: #E98300 !important
}

.kt-outline-btn-black, .kt-btn-black {
    border-color: #1E1E1E !important
}

.kt-outline-btn-grey, .kt-btn-grey {
    border-color: #A7A9AC !important
}


.kt-outline-btn-violet, .kt-btn-violet {
    border-color: var(--violet) !important
}

.kt-outline-btn-slate, .kt-btn-slate {
    border-color: var(--slate) !important
}

.kt-outline-btn-mehta, .kt-btn-mehta {
    border-color: var(--mehta) !important
}

.kt-outline-btn-muzli, .kt-btn-muzli {
    border-color: var(--muzli) !important
}

.kt-outline-btn-speech, .kt-btn-speech {
    border-color: var(--speech) !important
}

.kt-outline-btn-chirog, .kt-btn-chirog {
    border-color: var(--chirog) !important
}

.kt-outline-btn-pantone, .kt-btn-pantone {
    border-color: var(--pantone) !important
}

.kt-outline-btn-supernova, .kt-btn-supernova {
    border-color: var(--supernova) !important
}

.kt-outline-btn-striped, .kt-btn-striped {
    border-color: var(--striped) !important
}

.kt-outline-btn-angel, .kt-btn-angel {
    border-color: var(--angel) !important
}

.kt-btn-slate-hover:hover {
    background-color: var(--slate) !important
}

.kt-btn-violet-hover:hover {
    background-color: var(--violet) !important
}

.kt-btn-supernova-hover:hover {
    background-color: var(--supernova) !important
}


/* LABELS */
.kt-label-btn-red {
    background-color: rgba(244, 0, 0, 0.1) !important
}

.kt-label-btn-orange {
    background-color: rgba(233, 131, 0, 0.1) !important
}

.kt-label-btn-black {
    background-color: rgba(0, 0, 0, 0.1) !important
}

.kt-label-btn-grey {
    background-color: rgba(167, 169, 172, 0.1) !important
}


.kt-label-btn-violet {
    background-color: rgba(120, 99, 172, 0.1) !important
}

.kt-label-btn-slate {
    background-color: rgba(142, 120, 255, 0.1) !important
}

.kt-label-btn-mehta {
    background-color: rgba(43, 36, 77, 0.1) !important
}

.kt-label-btn-muzli {
    background-color: rgba(57, 46, 85, 0.1) !important
}

.kt-label-btn-speech {
    background-color: rgba(237, 56, 51, 0.1) !important
}

.kt-label-btn-chirog {
    background-color: rgba(4, 179, 151, 0.1) !important
}

.kt-label-btn-pantone {
    background-color: rgba(106, 185, 255, 0.1) !important
}

.kt-label-btn-supernova {
    background-color: rgba(251, 176, 59, 0.1) !important
}

.kt-label-btn-striped {
    background-color: rgba(197, 120, 255, 0.1) !important
}

.kt-label-btn-angel {
    background-color: rgba(161, 221, 112, 0.1) !important
}

/* BADGE */

[class*='kt-badge-'] {
    font-size: 13px;
    font-weight: 600;
    padding: 5px 15px;
    border-radius: 30px;
    text-shadow: 0 0 4px rgba(0, 0, 0, .1);
    text-transform: uppercase;
    color: #fff !important;
    text-align: center;
}

.kt-badge-red {
    background: #e4032f;
    box-shadow: 0 0 12px 0 rgba(228, 3, 47, .25);
}

.kt-badge-white {
    background: rgba(255, 255, 255, .4);
    box-shadow: 0 0 12px 0 rgba(255, 255, 255, .25);
}


/*------------------------------------------
BUTTONS
------------------------------------------*/
.kt-btn-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.kt-btn-reset {
    outline: none;
    border: none;
    background-color: transparent;
}

.kt-btn-reset:focus {
    outline: none
}

.kt-btn-switch-red {
    padding: 8px 15px;
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, .05);
    border-radius: 5px;
    display: inline-block;
    font-size: 12px;
    color: #fff;
    background: linear-gradient(to right, #e4032f 50%, #616161 50%);
    background-size: 200% 100%;
    background-position: right top;
    transition: all .4s ease-out;
    font-weight: bold;
    text-transform: uppercase;
    border: none !important;
    cursor: pointer;
}

.kt-btn-switch-red:hover {
    background-position: left bottom;
}

.kt-btn-switch-red.active-btn {
    background: #e4032f !important;
}

.padding-play {
    padding-bottom: 25px
}

.play-container {
    margin-bottom: 25px;
}

.play {
    position: absolute;
    bottom: -21px;
    left: 0;
    right: 0;
    text-align: center;
}


/*------------------------------------------
PORTLETS
------------------------------------------*/
.kt-portlet-style {
    position: relative;
    height: calc(100% - 20px);
}

.kt-portlet-style .kt-portlet {
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 11px 16px -2px rgba(0, 0, 0, .4);
    border: 1px solid #e5e5e5;
    margin-bottom: 0 !important;
    position: relative;
    margin-top: 25px;
    height: 100%;
}

.kt-portlet-style .kt-portlet__head {
    border-bottom: 0;
    padding: 35px 35px 25px;
}

.kt-portlet-style .kt-portlet__head i {
    color: #999
}

.kt-portlet-style .kt-portlet__head h3, .kt-portlet-style .kt-portlet__head h4 {
    font-weight: bold !important;
}

.kt-portlet-style .kt-portlet__head h4 {
    font-size: 13px !important;
}

.kt-portlet-style .kt-portlet__body {
    padding: 0 35px 35px
}

@media screen and (max-width: 1023px) {
    .kt-portlet-style {
        margin-top: 30px
    }

    .kt-portlet-style .kt-portlet__head {
        padding: 20px
    }

    .kt-portlet-style .kt-portlet__body {
        padding: 0 20px 20px
    }
}


/*------------------------------------------
CUSTOM DATATABLE
------------------------------------------*/
.kt-custom-datatable .table {
    border: 1px solid #e5e5e5
}

.kt-custom-datatable .table th, .kt-custom-datatable .table td {
    font-size: 12px
}

.kt-custom-datatable .dataTables_wrapper .pagination .page-item:hover > .page-link,
.kt-custom-datatable .dataTables_wrapper .pagination .page-item.active > .page-link {
    background: #e4032f;
}

.kt-custom-datatable .table thead th {
    color: #e4032f
}

.kt-custom-datatable table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child:before,
.kt-custom-datatable table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child:before {
    content: "\f2c3";
    font: normal normal normal 19px/1 LineAwesome;
    background: transparent;
    color: #e4032f;
    border: none;
    width: auto;
    height: auto;
    box-shadow: none
}

.kt-custom-datatable .btn-preview {
    color: #e4032f;
}

.kt-custom-datatable .btn-preview:hover {
    text-decoration: underline !important;
}

.kt-custom-datatable .dropdown-item.active, .dropdown-item:active {
    background-color: #e4032f;
}

div.dataTables_wrapper div.dataTables_filter label {
    color: #e4032f !important;
}


/*------------------------------------------
CUSTOM TABLE
------------------------------------------*/
.kt-custom-table .table th, .kt-custom-table .table td {
    font-size: 12px;
}

.kt-custom-table > .table th, .kt-custom-table > .table td {
    max-width: 300px;
}

.kt-custom-table > .table thead th {
    color: #e4032f
}

.kt-custom-table .table tbody tr:nth-of-type(even) {
    background-color: #f7f8fa;
}

.kt-custom-table > .table tbody tr th:before {
    content: none
}

.kt-custom-table .table table {
    width: 100%
}

.kt-custom-table .table table td {
    border: none;
    display: block;
}

.kt-custom-table .table table td {
    font-weight: 400
}

.kt-custom-table .table table td b {
    color: #e4032f;
    margin-right: 10px;
}

.kt-custom-table .table .dynamic-table tr td:not(:first-child) {
    border-top: 1px dashed #e5e5e5;
    padding-top: 10px;
    margin-top: 10px;
}

.kt-custom-table .table .dynamic-table tr td {
    max-width: 100% !important;
}

.kt-custom-table .dynamic-table-tr {
    display: none
}

.kt-custom-table > .table tbody tr:not(.dynamic-table-tr) th:before,
.kt-custom-table > .table tbody tr:not(.dynamic-table-tr) th.show-responsive:before {
    content: "\f2c3";
    display: none;
    font: normal normal normal 19px/1 LineAwesome;
    text-decoration: inherit;
    text-rendering: optimizeLegibility;
    text-transform: none;
    color: #e4032f;
    position: absolute;
    top: 20%;
    left: 5px;
}

.kt-custom-table > .table tbody tr:not(.dynamic-table-tr) th.show-responsive:before {
    content: "\f28f";
}

@media screen and (max-width: 576px) {
    .kt-custom-table .table.responsive-xs .none {
        display: none
    }

    .kt-custom-table > .table.responsive-xs tbody tr:not(.dynamic-table-tr) th {
        padding-left: 30px;
        cursor: pointer;
        position: relative;
    }

    .kt-custom-table > .table.responsive-xs tbody tr:not(.dynamic-table-tr) th:before {
        display: inline-block;
    }
}

@media screen and (max-width: 768px) {
    .kt-custom-table .table.responsive-sm .none {
        display: none
    }

    .kt-custom-table > .table.responsive-sm tbody tr:not(.dynamic-table-tr) th {
        padding-left: 30px;
        cursor: pointer;
        position: relative;
    }

    .kt-custom-table > .table.responsive-sm tbody tr:not(.dynamic-table-tr) th:before {
        display: inline-block;
    }
}


@media screen and (max-width: 992px) {
    .kt-custom-table .table.responsive-lg .none {
        display: none
    }

    .kt-custom-table > .table.responsive-lg tbody tr:not(.dynamic-table-tr) th {
        padding-left: 30px;
        cursor: pointer;
        position: relative;
    }

    .kt-custom-table > .table.responsive-lg tbody tr:not(.dynamic-table-tr) th:before {
        display: inline-block;
    }
}


@media screen and (max-width: 1200px) {
    .kt-custom-table .table.responsive-xl .none {
        display: none
    }

    .kt-custom-table > .table.responsive-xl tbody tr:not(.dynamic-table-tr) th {
        padding-left: 30px;
        cursor: pointer;
        position: relative;
    }

    .kt-custom-table > .table.responsive-xl tbody tr:not(.dynamic-table-tr) th:before {
        display: inline-block;
    }
}


/*------------------------------------------
Bootbox
------------------------------------------*/
.bootbox-size-sm {
    max-width: 400px
}

.bootbox-size-md {
    max-width: 600px
}

.bootbox-size-lg {
    max-width: 800px
}

.bootbox-size-xl {
    max-width: 1200px
}


/*------------------------------------------
SWAL
------------------------------------------*/
#swal2-content {
    font-size: 1rem
}

.swal2-popup {
    width: 40rem!important;
}

.swal2-popup .swal2-title {
    font-size: 1.1rem
}

.swal2-container {
    z-index: 1000000 !important;
}

/*------------------------------------------
CUSTOM GRID
------------------------------------------*/
@media screen and (max-width: 1280px) {
    .col-lg-custom-1 {
        flex: 0 0 100% !important;
        max-width: 100% !important
    }
}

@media screen and (max-width: 1080px) {
    .col-lg-custom-2 {
        flex: 0 0 100% !important;
        max-width: 100% !important
    }
}


/*------------------------------------------
GLOBAL
------------------------------------------*/
.overflow-scroll {
    overflow-y: scroll
}

.fullWidth {
    width: 100%
}

.fullHeight {
    height: 100%
}

.text-icon {
    display: flex;
    align-items: center;
}

.text-icon > i {
    margin-right: 10px
}

.btn-special-coke {
    border-radius: 30px;
    background: #e4032f;
    color: #fff !important;
    text-transform: uppercase;
    font-weight: 600;
    transition: 0.4s;
    width: 250px;
    padding: 0.75rem 1rem;
}

.btn-special-coke:focus, .btn-special-coke:hover {
    background: #F40009
}

.kt-wrapper {
    background-size: cover;
    background-attachment: fixed;
}

.modal-backdrop {
    z-index: 1049;
}

.row-hidden {
    display: none;
}

.hide {
    display: none;
}

.show {
    display: block !important;
}

.form-group label {
    display: block;
}


/*------------------------------------------
TARGET
------------------------------------------*/
.target-cover {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .6);
    z-index: 99;
    display: none;
}

.target-content {
    width: 400px;
    height: 100%;
    background: #fff;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 100;
    display: none;
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, .3)
}

.target-content .target-content-wrapper {
    position: fixed;
    top: 80px;
    width: 400px;
    max-height: calc(100% - 80px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 25px 0;
}

/* -LIST */
.target-content.list a, .target-content.list li > div {
    display: flex;
    align-items: center;
    padding: 25px 15px 25px 50px;
    position: relative;
}

.target-content.list a > *, .target-content.list li > div > * {
    color: #999;
    transition: all .4s ease-out;
}

.target-content.list a:hover > *,
.target-content.list a.active > *, .target-content.list li > div.active > *,
.target-content.list a.active-test > *, .target-content.list li > div.active-test > * {
    color: #e4032f
}

.target-content.list a i, .target-content.list li > div i {
    font-size: 30px
}

.target-content.list a span, .target-content.list li > div span {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 500;
    margin-left: 20px;
}

@media screen and (max-width: 1024px) {
    .target-content .target-content-wrapper, .target-content.list {
        max-height: 100%;
        top: inherit;
    }

    .target-content .target-content-wrapper {
        top: 80px
    }
}

@media screen and (max-width: 600px) {
    .target-content, .target-content .target-content-wrapper {
        width: 100%
    }

    .target-content .target-content-wrapper {
        position: relative
    }
}

/*------------------------------------------
PROGRESS BARS
------------------------------------------*/

/* -RADIAL */
.radial-progress-bar-inline {
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.radial-progress-bar-wrapper {
    width: 140px;
    text-align: center;
    margin: 15px auto 0;
}

.radial-progress-bar {
    width: 100%;
    height: 140px;
    position: relative;
}

.radial-progress-bar + span {
    margin-top: 25px;
    display: block;
    font-size: 11px;
    font-weight: bold;
}

.radial-progress-bar svg {
    stroke-linecap: round
}

.radial-progress-bar-wrapper .desc {
    color: #444;
    text-transform: uppercase;
    display: block;
    margin-top: 5px;
}

/* -RECTAGLE */
.rect-progress-bar-inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.rect-progress-bar-inline .rect-progress-bar-wrapper:not(:last-child) {
    margin-right: 15px
}

.rect-progress-bar-wrapper {
    display: flex;
    align-items: center;
    margin-top: 10px;
    position: relative;
    width: 100%;
}

.rect-progress-bar-wrapper span {
    color: #6f6f6f;
    font-weight: 500;
    font-size: 16px;
    display: block;
    margin-right: 15px;
}

.rect-progress-bar {
    width: 250px;
    border-radius: 10px;
    overflow: hidden;
}

.rect-progress-bar.full-width {
    width: 100%;
    height: 8px;
}

.rect-progress-bar svg {
    stroke-linecap: round;
    height: 8px;
}


/*------------------------------------------
SLICK
------------------------------------------*/
.slick-slider {
    position: inherit
}

.slick-slider .btn.btn-icon.btn-circle {
    border-radius: 5px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #fdfdfd;
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, .1);
    transition: 0.4s;
    z-index: 10;
}

.slick-slider .btn.btn-icon.btn-circle:hover {
    background: #e4032f;
    color: #fff;
    border-color: #e4032f;
}


.slick-slider .btn.btn-icon {
    height: 3.5rem;
    width: 3.5rem;
}

.slick-slider .btn.btn-left {
    left: 0
}

.slick-slider .btn.btn-right {
    right: 0
}


/*------------------------------------------
PRELOADER
------------------------------------------*/
.preloader-page {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 10000000000;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.preloader-page > img:first-child {
    margin-bottom: 30px
}

.preloader-data {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.preloader-data .kt-spinner.kt-spinner--v2.kt-spinner--danger:before {
    border-top-color: #e4032f;
}

/*------------------------------------------
AREA CONTENT
------------------------------------------*/
.area {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.area ul li:first-child {
    border-top: 1px solid #e5e5e5
}

.area ul li:nth-child(odd) {
    background: #fafafa
}

.area ul li {
    border-bottom: 1px solid #e5e5e5;
    padding: 18px 60px;
}

.area ul li span {
    font-weight: bold;
    color: #444;
    max-width: 80%;
}

.area .area-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    cursor: pointer;
    position: relative;
    z-index: 10;
}

.area .bootstrap-switch-handle-on {
    background-color: #e4032f !important;
    border-color: #e4032f !important;
}

.area .bootstrap-switch.bootstrap-switch-focused {
    box-shadow: none;
    border-color: inherit;
}

.area .area-content {
    margin: 30px 14px 15px !important;
    color: #444;
}

.area .area-content .area-content-item-separator .area-content-item {
    border-top: 1px solid #e5e5e5;
    padding-top: 30px;
}

.area .area-content .area-content-item {
    max-width: 100%
}

.area .area-content .area-content-item:not(:first-child) {
    margin-top: 30px
}

.area .area-content .radios .kt-radio-list {
    margin-top: 20px
}

.area .area-content .radios .kt-radio span:after {
    border-color: #e4032f;
    background: #e4032f;
    width: 10px;
    height: 10px;
    top: 35%;
    left: 40%;
}

@media screen and (max-width: 1023px) {
    .area ul li {
        padding: 18px 25px
    }
}


/*------------------------------------------
CUSTOM LIST
------------------------------------------*/
.kt-style-list li span {
    margin-bottom: 15px
}

.kt-style-list p, .kt-style-list b {
    color: #444
}

.kt-style-list a {
    padding: 8px 15px;
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, .05);
    border-radius: 5px;
    display: inline-block;
    font-size: 12px;
    color: #fff;
    background: linear-gradient(to right, #e4032f 50%, #616161 50%);
    background-size: 200% 100%;
    background-position: right top;
    transition: all .4s ease-out;
    font-weight: bold;
}

.kt-style-list a:hover {
    background-position: left bottom;
}

.kt-style-list h5 {
    color: #4a4a4a;
    font-size: 14px;
    margin-bottom: 5px;
    font-weight: bold;
}

.kt-style-list span {
    color: #b7b7b7;
    display: block;
    margin-bottom: 30px;
}

.kt-style-list li:first-child {
    margin-top: 15px
}

.kt-style-list li:not(:first-child) {
    margin-top: 50px
}

.kt-style-list li > div {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}

.kt-style-list li > div i {
    font-size: 15px;
    color: #999;
    padding-right: .75rem;
}

.kt-style-list li > div h5 {
    margin: 0;
}

.kt-style-list-inline {
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;
}

.kt-style-list-inline li {
    margin: 20px 10px 0 !important;
    text-align: center;
}


/*------------------------------------------
CUSTOM CHECKBOX
------------------------------------------*/
.kt-custom-checkbox input[type='checkbox'] {
    height: 0;
    width: 0;
    display: none;
}

.kt-custom-checkbox input[type='checkbox'] + label {
    position: relative;
    display: flex;
    margin: 20px 0;
    align-items: center;
    color: #9e9e9e;
    transition: color 250ms cubic-bezier(.4, .0, .23, 1);
    cursor: pointer;
}

.kt-custom-checkbox input[type='checkbox'] + label > ins {
    position: absolute;
    display: block;
    bottom: 0;
    left: 2em;
    height: 0;
    width: 100%;
    overflow: hidden;
    text-decoration: none;
    transition: height 300ms cubic-bezier(.4, .0, .23, 1);
}

.kt-custom-checkbox input[type='checkbox'] + label > ins > i {
    position: absolute;
    bottom: 0;
    font-style: normal;
    color: #4FC3F7;
}

.kt-custom-checkbox input[type='checkbox'] + label > span {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 1em;
    width: 2.5em;
    height: 2.5em;
    background: transparent;
    border: 2px solid #9E9E9E;
    border-radius: 100%;
    cursor: pointer;
    transition: all 250ms cubic-bezier(.4, .0, .23, 1);
    position: relative;
}

.kt-custom-checkbox input[type='checkbox'] + label > span + i {
    max-width: 76%;
    margin-left: 20px;
    font-style: inherit;
    font-weight: 500;
    color: #444
}

.kt-custom-checkbox input[type='checkbox']:checked + label > span {
    border: 16px solid #e4032f;
    animation: shrink-bounce 200ms cubic-bezier(.4, .0, .23, 1);
    background: #e4032f;
}

.kt-custom-checkbox input[type='checkbox']:checked + label > span:before {
    content: "";
    position: absolute;
    top: -2px;
    left: -8px;
    right: 0;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    transform: rotate(45deg);
    transform-origin: 0% 100%;
    animation: checkbox-check-desktop 125ms 250ms cubic-bezier(.4, .0, .23, 1) forwards;
    box-sizing: unset;
}

@keyframes shrink-bounce {
    0% {
        transform: scale(1);
    }
    33% {
        transform: scale(.85);
    }
    100% {
        transform: scale(1);
    }
}


@keyframes checkbox-check-desktop {
    0% {
        width: 0;
        height: 0;
        border-color: #fff;
        transform: translate3d(0, 0, 0) rotate(45deg);
    }
    33% {
        width: .5em;
        height: 0;
        transform: translate3d(0, 0, 0) rotate(45deg);
    }
    100% {
        width: .5em;
        height: 1em;
        border-color: #fff;
        transform: translate3d(0, -1em, 0) rotate(45deg);
    }
}

@media screen and (max-width: 768px) {
    .kt-custom-checkbox input[type='checkbox'] + label > span {
        width: 1.75em;
        height: 1.75em;
    }

    .kt-custom-checkbox input[type='checkbox']:checked + label > span {
        border-width: .88em;
    }

    .kt-custom-checkbox input[type='checkbox'] + label > span + i {
        margin-left: 10px;
        max-width: 82%;
    }

    .kt-custom-checkbox input[type='checkbox']:checked + label > span:before {
        animation: checkbox-check-mobile 125ms 250ms cubic-bezier(.4, .0, .23, 1) forwards;
        left: -6px;
    }
}

@keyframes checkbox-check-mobile {
    0% {
        width: 0;
        height: 0;
        border-color: #fff;
        transform: translate3d(0, 0, 0) rotate(45deg);
    }
    33% {
        width: .2em;
        height: 0;
        transform: translate3d(0, 0, 0) rotate(45deg);
    }
    100% {
        width: .2em;
        height: .5em;
        border-color: #fff;
        transform: translate3d(0, -.5em, 0) rotate(45deg);
    }
}


/*------------------------------------------
LINK
------------------------------------------*/
.kt-style-link {
    color: inherit !important;
    display: inline-block;
    transition: .3s;
    position: relative;
}

.kt-style-link:after {
    bottom: -2px;
    content: "";
    display: block;
    height: 1px;
    left: 50%;
    position: absolute;
    background: #e4032f;
    transition: width 0.3s ease 0s, left 0.3s ease 0s;
    width: 0;
}

.kt-style-link:hover:after {
    width: 100%;
    left: 0;
}

.kt-style-link:hover {
    color: #e4032f !important;
}


/*------------------------------------------
CHECKBOX
------------------------------------------*/
.kt-custom-checkbox.kt-checkbox--solid > input:checked ~ span {
    background: #e4032f !important;
}

.kt-custom-checkbox.kt-checkbox--solid > span:after {
    border-color: #fff !important;
}
.questionnaire-hidden-comment {
    display: none;
    margin-top: 10px;
}