:root {
    --esa-darkArea-body: #0b0c1b;
    --esa-darkArea-main: #1a1b2e;
    --esa-darkArea-reset: #212235;
    --esa-colorArea-main: 10, 187, 118;
    --esa-colorArea-mainDarker: #057e4f;
    --esa-colorArea-mainOther: #057e4f;
    --esa-colorArea-text: #d3d3d3;

    --esa-clipPath: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.form-inline {
    display: unset !important;
}

#order-standard_cart .apply-credit-container {
    background-color: #0b0c1b !important;
}
#order-standard_cart .cc-input-container {
    background-color: #0b0c1b !important;
    border: 1px solid #212235 !important;
}
#order-standard_cart .paymethod-info {
    color: #ffff;
    font-size: 1.25em;
}
#layers .lu-tiles > * {
    width: 100%;
    min-width: 145px;
}
.popover-user-notifications { z-index: 99999999; }
span.newprod {
    background: rgb(var(--esa-colorArea-main));
    font-size: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 1rem;
    padding: 0 0.3rem;
    border-radius: 100px;
    color: black;
    height: 18px;
}
span.hotprod {
    background: #bd1818;
    font-size: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 1rem;
    padding: 0 0.3rem;
    border-radius: 100px;
    color: black;
    height: 18px;
}
span.purpleprod {
    background: #e911e9;
    font-size: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 1rem;
    padding: 0 0.3rem;
    border-radius: 100px;
    color: black;
    height: 18px;
}
#s10_geninvbutton > .button {
    border: none;
    padding: 0.5rem 1rem;
    border-radius: 0.2rem !important;
    margin-bottom: 10px;
    letter-spacing: .03rem;
    font-size: 1rem;
}
#layers .lu-modal__content {
    background: var(--esa-darkArea-main) !important;
    border: 1px solid var(--esa-darkArea-reset);
    border-radius: 1rem;
}
#s10_geninv {
    display: flex;
    flex-direction: column;
    width: max-content;
    background: var(--esa-darkArea-main);
    border: 1px solid var(--esa-darkArea-reset);
    margin-bottom: 1rem;
    border-radius: 5px;
    padding: 1rem !important;
}
#s10_geninv > .button {
    padding: 0.5rem;
    margin-top: 0.5rem;
    display: inline-block;
    background: #0abb76;
    font-weight: 500;
    border: unset;
    border-radius: 0.2rem;
    font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Poppins", "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
#layers .lu-tile {
    background: #282a49 !important;
    border-color: #2d2f51 !important;
    color: #fff;
    font-weight: 600;
    letter-spacing: .3px;
    font-size: 1rem;
}
#layers .lu-tile:hover {
    border-color: rgb(var(--esa-colorArea-main)) !important;
    box-shadow: 0 0 0 5px rgb(var(--esa-colorArea-main), .2);
    background: rgb(var(--esa-colorArea-main), .5) !important;
    color: #fff;
}
#layers .lu-widget {
    background: #282a49 !important;
    border-color: #2d2f51 !important;
}
.lu-top__title {
    color: #fff;
}
#layers .lu-table tbody th, #layers .lu-table tbody td,
#layers .lu-widget__body,#layers .lu-widget__header,
#layers .lu-t-c__footer {
    border-color: #2d2f51 !important;
}
#layers .lu-widget__body {
    color: #bbbee9;
}
span.lu-table__text {
    color: #fff;
}
#layers .lu-table tbody th, #layers .lu-table tbody td, #layers .lu-table tfoot th, #layers .lu-table tfoot td {
    font-size: .85rem !important;
}
.responsive-tabs-sm .nav-item a:hover {
    background-color: #282a49;
    border-color: #282a49;
    border-bottom: 0;
}
#layers .lu-input-group, #layers .lu-form-control, #layers .lu-form-indicator, #layers .lu-form-check > label .lu-form-indicator {
    background: #1a1b2e !important;
    border-color: transparent !important;
    color: #fff !important;
}
#layers .lu-nav--arrow .lu-nav__item.is-active .lu-nav__link:after {
    background: #2d2f51  !important;
    border-color: #2d2f51  !important;;
}
#layers .lu-t-c__footer .dt-button.active {
    color: #000000 !important;
    background: #0abb76 !important;
}
#layers .lu-t-c__footer .paginate_button.current {
    color: #0abb76 !important;
}
#layers .lu-app .lu-btn--default, #layers .lu-app .lu-btn--danger:not(.submitForm) {
    color: #0abb76 !important;
    filter: drop-shadow(0 0 10px #0abb76);
}
.div-service-status .label.label-placeholder {
    display: none;
}
#layers .lu-modal__body .lu-form-control {
    background: var(--esa-darkArea-reset) !important;
}
#layers .lu-form-label, #layers .lu-form-feedback {
    color: #fff !important;
}
#layers .lu-app .closeModal {
    background: #212235 !important;
    filter: none !important;
    border: unset !important;
    color: #fff !important;
}
.lu-text-faded {
    color: #fff !important;
}
#order-standard_cart .view-cart-items .item-domain {
 color: #0abb76 !important;   
}
label[for="inputNs1prefix"],
label[for="inputNs2prefix"] {
    display: none !important;
}
.view-cart-items button {
    color: #fff;
}
.view-cart-items button:hover {
    color: #0abb76 !important; 
}
#layers .lu-modal__body {
    border-color: var(--esa-darkArea-reset) !important;
}
.h4.lu-m-b-3x.lu-m-t-3x {
    color: #fff;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    -webkit-transition: background-color 50000s ease-in-out 0s, color 5000s ease-in-out 0s;
}
::-webkit-scrollbar {
    width: 10px;
}
::-webkit-scrollbar-thumb {
    background: rgb( var(--esa-colorArea-main) );
}
::-webkit-scrollbar-track {
    background: var(--esa-darkArea-reset);
    border-radius: inherit;
}
.ddos_alert {
    position: relative;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
    background: #24253e;
    clip-path: polygon(calc(100% - 8px) 0, 100% calc(0% + 8px), 100% 100%, calc(0% + 8px) 100%, 0 calc(100% - 8px), 0 0);
    border-radius: 5px;
    margin-bottom: 10px;
}
.ddosAlert_type {
    padding: 7.5px 15px;
    border-radius: 100px;
    background: rgb(201 22 22 / 20%);
    color: #c91010;
    font-weight: 500;
    font-size: 11px;
    letter-spacing: 1px;
    margin-right: 15px;
    line-height: 1;
}
.ddosAlert_highlight--danger {
    text-decoration-color: #ff0909;
    text-decoration-line: underline;
    text-decoration-style: wavy;
    text-decoration-thickness: 0.5px;
    font-weight: 500;
}
.ddosAlert_message {
    color: #fff;
    font-size: 16px;
    line-height: 1;
}
.ddosAlert-container {
    display: flex;
    align-items: center;
}
#ddosAlert_close {
    display: flex;
    align-items: center;
    text-transform: uppercase;
    color: #fff;
    font-size: 13px;
    letter-spacing: 0.3px;
    cursor: pointer;
}
#ddosAlert_close > i {
    margin-right: 5px;
    font-weight: 400;
    line-height: 1;
    color: #c9192e;
    filter: drop-shadow(0 0 5px #c9192e);
    border: 1px solid currentColor;
    width: 14px;
    height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    font-size: 8px;
}
.appButton {
    position: relative;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 5px;
    font-size: 15px;
    font-weight: 600;
    padding: 9px 18px;
    color: inherit;
    user-select: none;
    text-decoration: none;
    text-shadow: none;
    white-space: nowrap;
    transition: all 0.2s linear;
    appearance: none;
    cursor: pointer;
}
.appButton > i {
    margin-right: 5px;
}
.appButton-success {
    background: #2ea44f;
    color: #fff;
    padding: 12px 30px;
    font-weight: 700;
    font-size: 17px;
}
.appButton-shadow {
    --button-Shadow-1: 53, 72, 91;
    --button-Shadow-2: 0, 0, 0;
    box-shadow: 0 0 0 1px rgb(var(--button-Shadow-1), 0.14), 
    0 3px 2px rgb(var(--button-Shadow-2), 0.04), 
    0 7px 5px rgb(var(--button-Shadow-2), 0.02), 
    0 13px 10px rgb(var(--button-Shadow-2), 0.02),
    0 22px 17px rgb(var(--button-Shadow-2), 0.02) !important;
}
.appButton-primary {
    background-color: rgb(var(--esa-colorArea-main), 1);
    color: var(--esa-darkArea-body) !important;
}
.appButton-admin {
    --button-admin: 219, 8, 8;
    background: rgb(var(--button-admin), 0.2);
    border: 1px solid rgb(var(--button-admin), 1);
    color: rgb(var(--button-admin), 1);
    margin-right: 20px;
}
.appButton--flex {
    display: flex;
}
.appButton-large {
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    letter-spacing: 1px;
    width: 200px;
    line-height: 1;
}
.appButton-table {
    padding: unset;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    margin-left: 5px;
}
.appButton-table > i {
    margin: unset !important;
}


.page-container {
    max-width: 1450px;
    position: relative;
    padding: 0 15px;
    margin: 0 auto;
}
body {
    background: var(--esa-darkArea-body);
    color: #bcbcbc;
}
* {
    text-decoration: none !important;
}
.homepage-reset #main-body {
    display: none;
}
.bs\:main {
    -webkit-box-shadow: 0px 3px 6px 0px rgb(0 0 0 / 10%), 0px 1px 3px 0px rgb(0 0 0 / 8%);
    box-shadow: 0px 3px 6px 0px rgb(0 0 0 / 10%), 0px 1px 3px 0px rgb(0 0 0 / 8%);
}
.dp\:flex {
    display: flex;
}
.ai\:start {
    align-items: flex-start;
}
.ai\:center {
    align-items: center;
}
.ai\:end {
    align-items: flex-end;
}
.ai\:stretch {
    align-items: stretch;
}
.as\:start {
    align-self: flex-start;
}
.as\:center {
    align-self: center;
}
.as\:end {
    align-self: flex-end;
}
.as\:stretch {
    align-self: stretch;
}
.jc\:start {
    justify-content: flex-start;
}
.jc\:center {
    justify-content: center;
}
.jc\:end {
    justify-content: flex-end;
}
.jc\:around {
    justify-content: space-around;
}
.jc\:between {
    justify-content: space-between;
}
.fd\:column {
    flex-direction: column;
}
.fd\:row {
    flex-direction: row;
}
.fd\:column-reverse {
    flex-direction: column-reverse;
}
.fd\:row-reverse {
    flex-direction: row-reverse;
}
.fw\:wrap {
    flex-wrap: wrap;
}
.fw\:nowrap {
    flex-wrap: nowrap;
}
.fw\:wrap-reverse {
    flex-wrap: wrap-reverse;
}

/*------ Header -------*/
#header-top {
    position: relative;
    background: var(--esa-darkArea-body);
    padding: 5px 0px;
}
#header-top>.page-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.header-top-right {
    display: flex;
    align-items: center;
}
.cartButton {
    position: relative;
    height: 37px;
    padding: 0 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--esa-darkArea-main);
    border-radius: 5px;
    color: white;
    font-weight: 300;
    margin-left: 5px;
}
.cartButton:hover {
    background: rgb(var(--esa-colorArea-main));
    color: white;
    transition: all 0.20s;
}
.cartButton>.badge {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 10px;
    line-height: 1;
    border: 2px solid var(--esa-darkArea-body);
    background: rgb(var(--esa-colorArea-main));
    color: white;
}
.notifyButton {
    color: white;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: unset !important;
}
.notifyButton:hover {
    color: rgb(var(--esa-colorArea-main));
}
.notifyTrue > i{
    -webkit-animation: ring-animation 5s .2s ease-in-out infinite;
    -moz-animation: ring-animation 5s .2s ease-in-out infinite;
    animation: ring-animation 5s .2s ease-in-out infinite;
}
@-webkit-keyframes ring-animation {
    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-animation {
    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-animation {
    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); }
}
.notifyButton > i {
    color: rgb(var(--esa-colorArea-main));
}
.supportEmail {
    display: flex;
    align-items: center;
}
.supportEmail>i {
    color: rgb(var(--esa-colorArea-main));
    margin-right: 5px;
}
.supportEmail>span {
    color: white;
    line-height: 1;
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.5px;
}
#header-navbar {
    position: relative;
    background: var(--esa-darkArea-main);
    -webkit-box-shadow: 0px 3px 6px 0px rgb(0 0 0 / 10%), 0px 1px 3px 0px rgb(0 0 0 / 8%);
    box-shadow: 0px 3px 6px 0px rgb(0 0 0 / 10%), 0px 1px 3px 0px rgb(0 0 0 / 8%);
    transition: all .4s ease;
    z-index: 999999;
}
#navbar-mobile,
#navbarMobileBtn {
    display: none;
}
#navbarMobileBtn > .line {
    width: 100%;
    height: 2px;
    background: white;
}
#navbarMobileBtn > .line.line-1 {
    width: 25%;
}
#navbarMobileBtn > .line.line-2 {
    width: 50%;
}
#navbarMobileBtn:hover > .line {
    width: 100%;
    transition: ease-in 0.3s;
}
.header-scrollable.header-fixed {
    position: fixed !important;
    width: 100%;
    top: -40px;
    background: var(--esa-darkArea-reset) !important;
    transform: translateY(40px);
    transition: transform .4s;
}
#header-navbar>.page-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 85px;
}
.header-scrollable.header-fixed>.page-container {
    height: 75px !important;
    transition: height .4s;
}
.header-navbar-left {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
}
#navbar {
    display: flex;
    align-items: center;
    height: 100%;
}
#navbar>li {
    height: 100%;
}
#navbar>li>a {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 15px;
}
#navbar>li>a:after,
.header-navbar-right>li>a:after {
    color: rgb(var(--esa-colorArea-main));
    -webkit-filter: drop-shadow(0px 0px 5px rgb(var(--esa-colorArea-main)));
    filter: drop-shadow(0px 0px 5px rgb(var(--esa-colorArea-main)));
}
.header-navbar-right {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.header-navbar-right>li {
    height: 100%;
}
.header-navbar-right>li>a {
    color: white;
    height: 100%;
    display: flex;
    align-items: center;
    font-size: 15px;
    justify-content: center;
}

.section-title-main {
    text-align: center;
}
.section-title-main>h1 {
    font-weight: 600;
    font-size: 30px;
    margin-bottom: unset;
}
.section-title-main>h1>span {
    color: rgb(var(--esa-colorArea-main));
}
.section-title-main>p {
    color: var(--esa-colorArea-text);
    margin: 0;
}
/*--- Wolfy molfy---*/ 
a.client-register {
    background: rgb(var(--esa-colorArea-main));
    padding: 8px 15px;
    border-radius: 50px;
    white-space: nowrap;
    color: white;
    font-weight: 600;
}
.client-name-name {
    pointer-events: none;
}
a.client-button {
    font-weight: 500;
    color: white;
    margin-right: 15px;
}
a.client-button > i {
    color: rgb(var(--esa-colorArea-main));
    -webkit-filter: drop-shadow(0px 0px 5px rgb(var(--esa-colorArea-main)));
    filter: drop-shadow(0px 0px 5px rgb(var(--esa-colorArea-main)));
}
.client-userbarbtn {
    position: relative;
    background: rgb(var(--esa-colorArea-main));
    padding: 8px 19px;
    border-radius: 50px;
    font-weight: 600;
    margin-left: 15px;
    cursor: pointer;
    color: white !important;
    min-width: 110px;
    text-align: center;
}
.client-userbarbtn > i {
    position: absolute;
    right: -5px;
    background: white;
    font-size: 18px;
    border-radius: 50px;
    color: black;
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 50%;
    transform: translateY(-50%);
}
.new-notification {
    position: absolute;
    top: -7px;
    left: -7px;
    background: white;
    color: black;
    padding: 2px 8px;
    font-size: 9px;
    font-weight: 600;
    border-radius: 50px;
}
#user-dropdown {
    position: absolute;
    background: #fff;
    color: white;
    margin-top: 30px;
    border-radius: 10px;
    right: 0;
    transform: translateX(-150px);
    padding: 20px 25px;
    min-width: 320px;
    cursor: auto;
    z-index: 1000;
    visibility: hidden;
    opacity: 0;
    transition: ease-in-out 0.4s;
}
#user-dropdown.active {
    visibility: visible;
    opacity: 1;
    transform: translateX(0px);
    transition: ease-in 0.4s;
}
.user-details {
    border-bottom: 1px solid rgba(234, 238, 241, 0.91);
    margin-bottom: 0px;
    padding-bottom: 15px;
}
.user-details > .user__name {
    text-align: left;
}
.user-details > .user__name > h1 {
    font-size: 17px;
    white-space: nowrap;
    color: black;
    font-weight: 600;
    margin-bottom: unset;
}
.user-details > .user__name > span {
    color: #818181;
    font-weight: 400;
    letter-spacing: 1px;
    font-size: 12px;
}
.user__services {
    position: relative;
    background: rgba(234, 238, 241, 0.71);
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 80px;
    height: 60px;
    margin-left: 20px;
    overflow: hidden;
    color: black;
    z-index: 1;
}
.user__services > i {
    position: absolute;
    color: var(--yellow);
    font-size: 50px;
    left: -19px;
    top: -11px;
    z-index: -1;
    transform: rotate(23deg);
    opacity: 0.5;
}
.user__services > .value {
    font-size: 30px;
    line-height: 1;
}
.user__services > .text {
    text-transform: lowercase;
    font-size: 12px;
    letter-spacing: 0.3px;
    font-weight: 500;
    line-height: 1;
}
.user-links {
    margin: 10px 0px;
}
.user-links > a {
    position: relative;
    font-size: 15px;
    padding: 7px 0px;
    font-weight: 400;
    color: #818181;
}
.user-links > a:hover,
.user-links > a:focus,
.user-links > a:active {
    color: rgb( var(--esa-colorArea-main) );
}
.user-links > a > i {
    margin-right: 5px;
    color: rgb( var(--esa-colorArea-main) );
}
.user-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f1efef;
    border-radius: 5px;
}
.user-actions > a {
    position: relative;
    width: 100%;
    height: 50px;
    font-size: 20px;
    color: #a3a3a3;
    font-weight: 500;
}
.action-tip {
    position: absolute;
    top: 3px;
    right: 21px;
    background: rgb(var(--esa-colorArea-main));
    color: white;
    width: 15px;
    height: 15px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
}
.follow-icon {
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    margin-right: unset;
}
.client-notifications {
    margin-top: 10px;
    background: rgba(234, 238, 241, 0.71);
    border-radius: 5px;
    padding: 10px;
}
.client-notifications.new-notify {
    background: var(--danger);
}
.client-notifications > .client-t > i {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 500;
    color: white;
    background: #fff;
    border-radius: 5px;
    line-height: 1;
    margin-right: 7px;
    padding: 0;
}
/*--- login ba coaie ---*/ 
div#login-page {
    position: fixed;
    width: 100%;
    height: 100%;
    background: var(--esa-darkArea-body);
    z-index: 9999;
    top: 0;
    left: 0;
}
div#login-page > .page-container {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
body[data-action="esagames-enter"] {
    min-height: 100vh;
    max-height: 100vh;
    overflow: hidden;
}
.login-inner-page {
    display: flex;
    align-items: center;
    flex-direction: column;
}
#login-block {
    background: var(--esa-darkArea-main);
    min-width: 360px;
    max-width: 360px;
    border-radius: 5px;
    border: 1px solid var(--esa-darkArea-reset);
}
@media screen and (max-width: 767px) {
    #login-block {
        min-width: 100%;
        max-width: 100%;
    }
}
.login-header {
    color: white;
    text-align: center;
    padding: 20px;
}
.login-header > h3 {
    margin: 0;
}
input.login-control {
    width: 100%;
    padding: 13px;
    background: var(--esa-darkArea-body);
    border: 1px solid var(--esa-darkArea-reset);
    border-radius: 5px;
    color: white;
    outline: 0 !important;
}
input.login-control:hover,
input.login-control:focus {
    border-color: rgb(var(--esa-colorArea-main));
    box-shadow: 0 0 0 0.25rem rgb(var(--esa-colorArea-main), 0.25);
}
.btn-reveal-pw {
    outline: 0;
    padding: 10px 15px;
    border-radius: 5px;
    border: 1px solid var(--esa-darkArea-reset);
    background: var(--area-footer2);
    margin-left: 5px;
    color: white;
}
.login-form {
    padding: 0 30px;
    padding-bottom: 15px;
}
.login-button {
    padding: 10px 30px;
}
.login-button > button {
    width: 100%;
    background: rgb(var(--esa-colorArea-main));
    border: 0;
    padding: 12px;
    border-radius: 5px;
    color: var(--esa-darkArea-body);
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.login-remember {
    padding: 0px 30px;
    padding-bottom: 5px;
}
.login-remember > label {
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: 400;
    color: white;
}
.login-remember > label > input {
    margin-right: 10px;
    cursor: pointer;
}
.login-footer {
    padding: 15px 30px;
    border-top: 1px solid var(--esa-darkArea-reset);
    text-align: center;
    color: white;
}
.login-footer > .l-follow {
    color: rgb(var(--esa-colorArea-main));
    font-weight: 600;
}
.fg-pass {
    color: rgb(var(--esa-colorArea-main));
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    font-weight: 500;
}
.login-input {
    margin-top: 3px;
}
.l-text {
    color: white;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.5px;
}
.login-input-more {
    position: relative;
}
#input-icon {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--area-footer2);
    font-size: 18px;
    border-radius: 3px;
    color: inherit;
    cursor: pointer;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.eye-on:before {
    content: "\ECB5" !important;
}
.login-errors {
    padding: 0 30px;
}
/* ------------------------- *\
 * Swiper Styles
\* ------------------------- */

.header-hero {
    position: relative;
    height: 400px;
}
.header-svg {
    position: absolute;
    bottom: 0px;
    width: 100%;
    overflow: hidden;
    z-index: 12;
}
.header-svg > svg {
    display: block;
    width: calc(141.3%);
    height: 40px;
}
.effect-layer-inner:after, .effect-layer-inner:before {
    content: "";
}
.effect-layer-inner:before {
    background-color: var(--esa-darkArea-body);
    mix-blend-mode: color-dodge;
    z-index: 1;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}
.effect-layer-inner-child {
    display: block;
    background: var(--esa-darkArea-reset);
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 2;
    mix-blend-mode: hard-light;
    opacity: 0.6;
}
.effect-layer-inner:after {
    background-color: var(--esa-darkArea-main);
    mix-blend-mode: hard-light;
    z-index: 3;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    opacity: 0.6;
}
.swiper-inner:before {
    content: "";
    position: absolute;
    background: linear-gradient( rgba(26, 27, 46, 0.4), rgba(20, 21, 38, 0.8) );
    width: 100%;
    height: 100%;
    z-index: 5;
}
.swiper-inner,
.slider-content,
.slider-content > .page-container {
    height: 100%;
    width: 100%;
    z-index: 10;
}
.swiper-image {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.swiper-image > img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}
.slider-title > h1 {
    color: white;
    font-weight: 900;
    letter-spacing: 0.5px;
    font-size: 3.5rem;
    margin-bottom: unset;
}
.slider-desc {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 50px;
    max-width: 500px;
}
.desc-row {
    font-size: 17px;
    font-weight: 600;
}
.desc-row > i {
    margin-right: 5px;
    color: rgb(var(--esa-colorArea-main));
    font-weight: 500;
}
.slider-buttons {
    margin-top: 10px;
}
.slider-buttons > span {
    font-weight: 600;
    margin: 0 10px;
}
.slider-buttons > a {
    padding: 9px 18px;
    border-radius: 5px;
    border: 2px solid transparent;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.slid-solid {
    background: rgb(var(--esa-colorArea-main));
    color: white;
    transition: ease-in-out 0.4s;
}
.slid-solid:hover {
    background: transparent;
    border: 2px solid rgb(var(--esa-colorArea-main)) !important;
    color: rgb(var(--esa-colorArea-main));
    transition: ease-in 0.4s;
}
.slid-outline {
    border: 2px solid rgb(var(--esa-colorArea-main)) !important;
    color: rgb(var(--esa-colorArea-main));
    transition: ease-in-out 0.4s;
}
.slid-outline:hover {
    background: rgb(var(--esa-colorArea-main));
    color: white;
    transition: ease-in 0.4s;
}


/* ------------------------- *\
 * Products
\* ------------------------- */

#products {
    margin-top: 30px;
}
.products-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 20px;
}
@media screen and (max-width: 979px) {
    .products-inner {
        grid-template-columns: repeat(2, 1fr);
}
}
.product-box {
    background: var(--esa-darkArea-main);
    border-radius: 5px;
    padding: 20px 15px;
    border: 1px solid var(--esa-darkArea-reset);
}
.product-head {
    position: relative;
}
.product-title {
    text-align: center;
}
.product-title > h1 {
    color: white;
    margin-bottom: unset;
    font-size: 17px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.product-title > p {
    margin: unset;
    padding: 0 6px;
}
.product-title > h1 > span {
    color: rgb( var(--esa-colorArea-main) );
}
.product-price:before {
    content: "";
    position: relative;
    background: radial-gradient(ellipse at center, rgb(var(--esa-colorArea-main)) 0, var(--esa-darkArea-main) 60%);
    width: 100%;
    height: 1px;
    margin: 10px 0px;
    opacity: 0.7;
}
.product-price:after {
    content: "";
    position: relative;
    background: radial-gradient(ellipse at center, rgb(var(--esa-colorArea-main)) 0, var(--esa-darkArea-main) 60%);
    width: 100%;
    height: 1px;
    margin: 10px 0px;
    opacity: 0.7;
}
.product-price > h1 {
    font-size: 24px;
    color: white;
    margin: unset;
}
.product-price > span {
    color: rgb( var(--esa-colorArea-main) );
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 12px;
}
.product-buy > a {
    background: rgb(var(--esa-colorArea-main));
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--esa-darkArea-main) !important;
    font-weight: 700;
    font-size: 14px;
    padding: 10px 0px;
    border-radius: 5px;
    letter-spacing: 0.5px;
    margin-top: 10px;
}
.product-description > span {
    padding: 5px 0px;
    font-size: 14px;
    letter-spacing: 0.3px;
}


/* ------------------------- *\

 * Gamehosting

\* ------------------------- */

#gamehosting-products {
    position: relative;
    margin-bottom: 50px;
}
.gamehosting-inner {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    grid-gap: 20px;
}
.gamehosting-head {
    margin-bottom: 20px;
}
.gamehosting-head > h3 {
    color: white;
    font-size: 40px;
    font-weight: 600;
    margin: unset;
}
.gamehosting-head div > a {
    border: 2px solid rgb(var(--esa-colorArea-main));
    color: rgb(var(--esa-colorArea-main));
    padding: 7px 20px;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1px;
    transition: ease-in-out 0.3s;
}
.gamehosting-head div > a:first-of-type {
    margin-right: 5px;
}
.gamehosting-head > a:hover {
    background: rgb( var(--esa-colorArea-main) );
    color: white;
    transition: ease-in 0.3s;
}
.gamehost-box {
    position: relative;
    background: var(--esa-darkArea-main);
    border: 2px solid var(--esa-darkArea-main);
}
.gamehost-image {
    width: 100%;
    min-height: 165px;
    max-height: 165px;
}
.gamehost-image > img {
    width: 100%;
    min-height: 165px;
    max-height: 165px;
    object-fit: cover;
}
.gamehost-details {
    padding: 10px;
    padding-bottom: unset;
}
.gamehost-details > h1 {
    margin-bottom: unset;
    color: white;
    font-size: 20px;
    font-weight: 600;
}
.gamehost-details > span {
    font-weight: 600;
    letter-spacing: 0.5px;
}
.gamehost-details > span > b {
    font-weight: 700;
    color: rgb(var(--esa-colorArea-main));
}
.gamehost-buttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    padding-top: unset;
}
.gamehost-buttons > a {
    background: rgb(var(--esa-colorArea-main));
    padding: 8px 18px;
    border-radius: 5px;
    color: white;
    font-weight: 600;
    border: 2px solid transparent;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: ease-in-out 0.3s;
}
.gamehost-buttons > a:hover {
    background: transparent;
    border-color: rgb( var(--esa-colorArea-main) );
    color: rgb( var(--esa-colorArea-main) );
    transition: ease-in 0.3s;
}
.gamehost-buttons > span {
    font-weight: 600;
}
.gamehost-spacer {
    position: relative;
    display: block;
    height: 1px;
    width: 93%;
    background: var(--esa-darkArea-reset);
    margin: 10px auto;
}
/* ------------------------- *\
 * Anti-Ddos
\* ------------------------- */

#anti-ddos {
    background: var(--esa-darkArea-main);
    margin: 50px 0px;
    padding: 50px 0px;
    border-top: 1px solid var(--esa-darkArea-reset);
    border-bottom: 1px solid var(--esa-darkArea-reset);
}
.ddos-title {
    line-height: 1.1;
    margin-bottom: 10px;
}
.ddos-title > h1 {
    color: white;
    font-weight: 600;
    font-size: 36px;
    margin-bottom: unset;
}
.ddos-title > h1 > span,
.ddos-title > h3 > span {
    color: rgb(var(--esa-colorArea-main));
}
.ddos-title > h3 {
    color: white;
    font-size: 18px;
    letter-spacing: 1.5px;
    margin-bottom: unset;
}
.ddos-infos > p {
    margin-bottom: unset;
    font-size: 15px;
    max-width: 900px;
}
.ddos-icon {
    font-size: 67px;
    color: rgb( var(--esa-colorArea-main) );
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgb( var(--esa-colorArea-main) );
    border-radius: 50px;
    line-height: 1;
    animation: pulse 1s infinite;
}
@keyframes pulse {
    0% {
        -moz-box-shadow: 0 0 0 0 rgb( var(--esa-colorArea-main), 0.2);
        box-shadow: 0 0 0 0 rgb( var(--esa-colorArea-main), 0.2);
}
70% {
        -moz-box-shadow: 0 0 0 10px rgb( var(--esa-colorArea-main), 0.5);
        box-shadow: 0 0 0 10px rgb( var(--esa-colorArea-main), 0.5);
}
100% {
        -moz-box-shadow: 0 0 0 0 rgb( var(--esa-colorArea-main), 0.2);
        box-shadow: 0 0 0 0 rgb( var(--esa-colorArea-main), 0.2);
}
}


/* ------------------------- *\

 * Network

\* ------------------------- */

#network {
    background: var(--esa-darkArea-main);
    border-top: 1px solid var(--esa-darkArea-reset);
    padding: 50px 0;
    margin-bottom: -115px;
    padding-bottom: 100px;
}
.network-title {
    line-height: 1.1;
    padding-bottom: 50px;
}
.network-title > h1 {
    color: white;
    font-weight: 600;
    font-size: 36px;
    margin-bottom: unset;
}
.network-title > h1 > span,
.network-title > h3 > span {
    color: rgb(var(--esa-colorArea-main));
}
.network-title > h3 {
    color: white;
    font-size: 18px;
    letter-spacing: 1.5px;
    margin-bottom: unset;
}
.network-sliders {
    position: relative;
}
.network-sliders:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 100px;
    left: 0;
    top: 0;
    background: linear-gradient(to right, var(--esa-darkArea-main), rgb(26 27 46 / 5%));
    z-index: 10;
}
.network-sliders:after {
    content: "";
    position: absolute;
    height: 100%;
    width: 100px;
    right: 0;
    top: 0;
    background: linear-gradient(to left, var(--esa-darkArea-main), rgb(26 27 46 / 5%));
    z-index: 10;
}
@media screen and (max-width: 767px) {
    .network-sliders:before,
    .network-sliders:after {
        display: none;
    }
}
.networkSliders .swiper-wrapper {
    padding: 20px;
}
@media screen and (max-width: 767px) {
    .networkSliders .swiper-wrapper {
        padding: unset;
    }
}
.network-slide {
    position: relative;
    height: 300px !important;
    transition: all 0.25s linear;
    opacity: 0.3;
    border-radius: 10px;
    -webkit-box-shadow: 0 3px 6px 0 rgb(11 12 27 / 70%), 0 1px 3px 0 rgb(11 12 27 / 30%);
    box-shadow: 0 3px 6px 0 rgb(11 12 27 / 70%), 0 1px 3px 0 rgb(11 12 27 / 30%);
}
.netSlide-image {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    transition: ease-in 0.4s;
}
.netSlide-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
    transition: ease-in 0.4s;
}

.network-slide.swiper-slide-active {
    transition: ease-in 0.4s;
    opacity: 1;
}
.netSlide-content {
    position: absolute;
    z-index: 10;
    padding: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
}
@media screen and (max-width: 767px) {
    .netSlide-content {
        padding: 10px;
    }
}
.netSlide-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    opacity: 0;
    transform: translateY(-50px);
    visibility: hidden;
    transition: ease-in-out 0.3s;
    margin-bottom: 20px;
    line-height: 1.2;
}
.network-slide.swiper-slide-active .netSlide-title {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    transition: ease-in 0.5s;
}
.netSlide-title h1 {
    color: #fff;
    font-weight: 900;
    margin: 0;
}
.netSlide-title span {
    font-size: 16px;
    letter-spacing: 1px;
}
.netSlide-title span b {
    color: rgb(var(--esa-colorArea-main));
}
.netSlide-image .effect-layer-inner:before, 
.netSlide-image .effect-layer-inner:after,
.netSlide-image .effect-layer-inner-child {
    border-radius: 10px;
}
.netSlide-desc {
    opacity: 0;
    transform: translateY(50px);
    visibility: hidden;
    transition: ease-in-out 0.3s;
    font-size: 18px;
    text-align: center;
    padding: 0 50px;
}
@media screen and (max-width: 767px) {
    .netSlide-desc { 
        padding: 0 25px;
    }
}
.network-slide.swiper-slide-active .netSlide-desc {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    transition: ease-in 0.5s;
}
/* ------------------------- *\
 * Breadcrumb2
\* ------------------------- */
#breadcrumb {
    position: relative;
}
.bread-inner {
    background: var(--esa-darkArea-main);
    border: 1px solid var(--esa-darkArea-reset);
    padding: 25px;
    margin-top: 15px;
    border-radius: 5px;
}
.bread-items > h1 {
    font-size: 22px;
    color: white;
}
.bread-items > h1 > span {
    color: rgb( var(--esa-colorArea-main) );
}
.bread-links > a {
    font-weight: 500;
    letter-spacing: 0.5px;
    font-size: 14px;
    line-height: 1;
}
.bread-links > a > i {
    line-height: 1;
    margin: 0 5px;
}
.bread-login {
    font-size: 14px;
}
.bread-login > a {
    background: rgb( var(--esa-colorArea-main), 0.2 );
    color: rgb( var(--esa-colorArea-main) );
    font-weight: 500;
    padding: 3px 10px;
    letter-spacing: 0.5px;
    font-size: 12px;
    border-radius: 5px;
}


/* ------------------------- *\
 * Breadcrumb1 - Master
\* ------------------------- */
.master-breadcrumb {
    position: relative;
    background-color: var(--esa-colorArea-mainDarker);
    background-image: linear-gradient(315deg, var(--esa-colorArea-mainDarker) 0%, var(--esa-colorArea-mainOther) 74%);
    height: 250px;
    overflow: hidden;
}
.master-breadcrumb>.page-container {
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    z-index: 10;
}
.master-breadcrumb h1 {
    margin: 0;
    color: white;
}
.master-breadcrumb h1>small {
    display: block;
    font-size: 20px;
    color: var(--teal);
}
#particles-bg {
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
}
#particles-bg>canvas {
    width: 100%;
    position: absolute;
    height: 100%;
}
.table-container {
    background: var(--esa-darkArea-reset);
    border: 1px solid var(--esa-darkArea-main);

    border-radius: 10px;
}
div.dataTables_wrapper div.dataTables_info {
    display: flex;
    padding: 17px;
}
.dataTables_wrapper .dataTables_filter {
    padding: 10px 15px;
}
.dataTables_wrapper .dataTables_filter label .form-control {
    background: url(../images/search1.png) var(--esa-darkArea-body) no-repeat 8px 3px;
    padding: 7px 10px 7px 45px !important;
    height: auto;
    font-size: .9rem;
    border: 1px solid var(--esa-darkArea-main);
    color: white;
}
table.dataTable>thead .sort-arrow {
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
    color: var(--text-color);
}
.tab-center {
    text-align: center;
}
.label-custom {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 7px;
    height: 7px;
    border-radius: 50px;
    margin-right: 5px;
}
.label-text-custom>span {
    font-size: 14px;
}
.status-icon {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    margin: 0 auto;
}
.status-icon-paid {
    color: #5cb85c;
}
.status-icon-cancelled {
    color: #930ce7;
}
.status-icon-unpaid,
.status-icon-collections {
    color: #c11c1c;
}
.status-icon-pending {
    color: #ffd900;
}
.status-icon-refunded {
    color: #0089ff;
}
.invoice-cancelled {
    color: #930ce7 !important;
    text-decoration: line-through !important;
}
.invoice-refunded {
    font-style: oblique;
    color: #0089ff !important;
}

tbody>tr[data-status="tabel-unpaid"]>td {
    background: var(--esa-darkArea-reset);
    border-color: var(--esa-darkArea-main);
}
table.table-list thead th {
    padding: 15px;
    color: white;
    font-size: 14px;
    letter-spacing: 0.3px;
    font-weight: 500;
    white-space: nowrap;
    border-bottom: 1px solid var(--esa-darkArea-main);
}
.dataTables_length {
    border-top: 1px solid var(--esa-darkArea-main);
}
.dataTables_length>label {
    display: flex;
    align-items: center;
    padding: 15px;
    margin-bottom: unset;
}
select.form-control.custom-select-sm {
    background-color: var(--esa-darkArea-body);
    border: 1px solid var(--esa-darkArea-main);
    margin: 0 5px;
    color: white;
}
select.form-control {
    appearance: none;
    -webkit-appearance: none;
    background-image: url(../images/arrow-drop.png);
    background-position-y: 50%;
    background-position-x: calc(100% - 11px);
    background-repeat: no-repeat;
    padding-right: 24px;
    cursor: pointer;
}
div.dataTables_wrapper div.dataTables_paginate {
    padding: 16px;
}
.table-list>tbody>tr:last-of-type>td {
    border-bottom: unset;
}
.service-status-text {
    font-size: 14px;
    font-weight: 500;
}
.domain-ssl {
    line-height: 1;
}
.service-status-icon {
    width: 7px;
    height: 7px;
    border-radius: 50px;
    margin-right: 5px;
    display: inline-flex;
}
.service-status-icon.pending {
    background: #d9534f;
}
.service-status-icon.active,
.service-status-icon.completed {
    background: #5cb85c;
}
.service-status-icon.suspended {
    background: #f0ad4e;
}
.service-status-icon.terminated,
.service-status-icon.cancelled {
    background: #919191;
}
.service-status-icon.fraud {
    background: #026ef5;
}
.service-status-text.pending {
    color: #d9534f;
}
.service-status-text.active,
.service-status-text.completed {
    color: #5cb85c;
}
.service-status-text.suspended {
    color: #f0ad4e;
}
.service-status-text.terminated,
.service-status-text.cancelled {
    color: #919191;
}
.service-status-text.fraud {
    color: #026ef5;
}
.domain-ssl>img {
    width: 12px;
    margin-right: 5px;
}
.ticket-border-left {
    border-left: 1px solid rgb(var(--esa-colorArea-main));
    padding-left: 20px;
    display: block;
}
span.ticket-subject {
    color: white;
    text-transform: capitalize;
    font-size: 13px;
}
span.ticket-number {
    color: rgb(var(--esa-colorArea-main));
    font-size: 11px;
}
.ticket-status-text {
    font-weight: 600;
}
.ticket-status-icon {
    width: 7px;
    height: 7px;
    border-radius: 50px;
    margin-right: 5px;
    display: inline-flex;
}
.ticket-status-text.pending {
    color: #d9534f
}
.ticket-status-text.pending-transfer {
    color: #f0ad4e
}
.ticket-status-text.pending {
    color: #d9534f
}
.ticket-status-text.pending-transfer {
    color: #f0ad4e
}
.ticket-status-text.active,
.ticket-status-text.completed,
.ticket-status-text.open {
    color: #5cb85c
}
.ticket-status-text.suspended {
    color: #f0ad4e
}
.ticket-status-text.customer-reply {
    color: #f60
}
.ticket-status-text.fraud {
    color: #000
}
.ticket-status-text.answered {
    color: #7b4f9d
}
.ticket-status-text.expired,
.status-transferred-away {
    color: #004258
}
.ticket-status-text.grace,
.status-pending-registration,
.status-redemption {
    color: #f60
}
.ticket-status-text.terminated {
    color: #666
}
.ticket-status-text.on-hold {
    color: #369
}
.ticket-status-text.in-progress {
    color: #cc0000
}
.ticket-status-text.closed {
    color: #cc0000;
}
.ticket-status-text.paid {
    color: #5cb85c
}
.ticket-status-text.unpaid {
    color: #d9534f
}
.ticket-status-text.cancelled {
    color: #87939f
}
.ticket-status-text.collections {
    color: #2c3e50
}
.ticket-status-text.refunded {
    color: #f0ad4e
}
.ticket-status-text.payment-pending {
    color: #369
}
.ticket-status-text.delivered {
    color: #369
}
.ticket-status-text.accepted {
    color: #5cb85c
}
#footer-advanced {
    background: var(--esa-darkArea-reset);
    padding: 110px 0px 50px 0px;
    position: relative;
}
.footer-informations {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 10px;
    width: 100%;
}
.footer-contact {
    margin-left: 50px;
}
.footer-column>h3 {
    color: white;
    font-weight: 600;
    font-size: 17px;
}
.footer-column>.__links>a {
    position: relative;
    display: flex;
    align-items: center;
    transition: ease-in-out 0.3s;
    font-size: 13px;
    font-weight: 500;
}
.footer-column>.__links>a:hover {
    color: rgb(var(--esa-colorArea-main));
    transition: ease-in 0.2s;
    letter-spacing: 0.3px;
}
.footer-column>.__links>a:hover::before {
    margin-right: 3px;
    transition: ease-in 0.2s;
}
.footer-column>.__links>a:before {
    content: "\EA6E";
    position: relative;
    font-family: remixicon !important;
    font-size: 15px;
    font-weight: 500 !important;
    color: rgb(var(--esa-colorArea-main));
}
.contact-firma {
    margin-top: 10px;
}
.contact-firma>a {
    background: var(--esa-darkArea-body);
    padding: 12px 15px;
    border-radius: 5px;
    margin-bottom: 10px;
}
.contact-firma>a>.firma {
    line-height: 1.3;
}
.contact-firma>a>.firma>.__text {
    font-weight: 600;
    letter-spacing: 1px;
    font-size: 11px;
    color: white;
    line-height: 1;
    margin-bottom: 2px;
}
.contact-firma>a>.firma>.__gogo {
    font-weight: 500;
    letter-spacing: 0.5px;
    color: rgb(var(--esa-colorArea-main));
    line-height: 1;
    font-size: 14px;
}
.contact-firma>a>.__icon {
    width: 35px;
    height: 35px;
    color: rgb(var(--esa-colorArea-main));
    background: rgb(var(--esa-colorArea-main), 0.2);
    border-radius: 50%;
    font-size: 19px;
    margin-left: 25px;
}
.host-informations {
    margin-top: 25px;
    border-top: 1px solid var(--esa-darkArea-main);
    padding-top: 25px;
}
.company-name {
    color: white;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.7px;
}

.cright-inner>span {
    font-size: 12px;
    margin-right: 11px;
    color: white;
}
.cright-inner>span>b {
    color: var(--esa-colorArea-text);
}
.author__text {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 1px;
    color: white;
}
.author__rights {
    color: rgb(var(--esa-colorArea-main));
    font-weight: 600;
    letter-spacing: 0.5px;
    font-size: 13px;
}

section#header-swiper {
    position: relative;
    height: 350px;
    margin-bottom: 70px;
}
.swiper-container {
    width: 100%;
    height: 100%;
}
.swiper-hero-image {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: -1;
}
.swiper-hero-image > img {
    user-select: none;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.swiper-hero-image:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: var(--esa-darkArea-body);
    opacity: 0.6;
}
.swiper-hero-image:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: var(--esa-darkArea-main);
    opacity: 0.2;
}
.swiper-buttons-bottom {
    position: relative;
    margin-top: -50px;
    z-index: 20;
}
.swiper-buttons-bottom > .page-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 20px;
}
.slide-button {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--esa-darkArea-main);
    border-radius: 6px;
    padding: 10px;
    cursor: pointer;
}
.swiper-hero-content {
    position: relative;
    height: 100%;
}
.swiper-hero-content > .page-container {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 51px;
}
.swiper-hero-title {
    color: white;
    font-weight: 700;
    margin: 0;
    font-size: 30px;
}
.swiper-char-img > img {
    max-width: 400px;
}

.swiper-desc > p {
    margin: 0;
    max-width: 500px;
    font-size: 16px;
}
.swiper-desc > p > b {
    color: rgb(var(--esa-colorArea-main));
}
.swiper-content-buttons {
    display: flex;
    align-items: center;
    margin: 10px 0px;
}
.swiper-content-buttons > a{
    padding: 8px 25px;
    background: var(--esa-colorArea-mainDarker);
    color: white;
    border-radius: 5px;
    margin-right: 10px;
    border: 2px solid transparent;
    transition: ease-in-out 0.2s;
}
.swiper-content-buttons > a:last-of-type {
    background: rgb(var(--esa-colorArea-main),0.2);
    border-color: var(--esa-colorArea-mainDarker);
}
.swiper-content-buttons > a:hover {
    background: rgb(var(--esa-colorArea-main));
    border-color: rgb(var(--esa-colorArea-main));
    color: white;
    transition: ease-in 0.2s;
}
.sidebar {
    margin-right: 20px;
}
/* ------------------------- *\
 * Tickets
\* ------------------------- */

.ticket-header {
    background: var(--esa-darkArea-reset);
    border: 1px solid var(--esa-darkArea-main);
    padding: 20px;
    border-radius: 7px;
    margin-bottom: 20px;
}
.ticket-title > h1 {
    color: white;
    font-size: 30px;
    margin-bottom: unset;
}
.ticket-info > .ticket-id > .tid {
    color: rgb( var(--esa-colorArea-main) );
}
.ticket-info {
    font-size: 15px;
}
.ticket-sep {
    width: 1px;
    height: 15px;
    background: var(--esa-darkArea-main);
    display: inline-block;
    margin: 0 10px;
}
.ticket-status {
    font-size: 15px;
}
.ticket-close {
    border: 0;
    padding: 8px 20px;
    font-size: 14px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    border-radius: 5px;
    background: #dc3545;
    color: white;
    font-weight: 500;
    letter-spacing: 0.5px;
}
.ticket-header-reply {
    border-top: 1px solid var(--esa-darkArea-main);
    padding-top: 10px;
    margin-top: 10px;
}
.tr-title {
    color: white;
    font-size: 14px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    font-weight: 500;
    margin-bottom: unset;
    border-bottom: 1px solid transparent;
    transition: ease-in-out 0.3s;
    padding: 15px;
}
#ticket-body.active > .tr-title {
    border-bottom: 1px solid var(--esa-colorArea-mainOther);
    margin-bottom: 10px;
    padding-bottom: 10px;
    margin-left: 15px;
    margin-right: 15px;
    padding-left: 0px;
    padding-right: 0px;
    transition: ease-in 0.3s;
}
.tr-title > i {
    transition: ease-in-out 0.3s;
}
#ticket-body.active > .tr-title > i {
    transform: rotate(-90deg);
    transition: ease-in 0.3s;
}
#ticket-body {
    background: var(--esa-darkArea-body);
    border-radius: 5px;
}
.ticket-open {
    display: none;
    margin: 15px;
    margin-top: unset;
}
#ticket-body.active > .ticket-open {
    display: block;
}
.ticket-form-control {
    background-color: var(--esa-darkArea-reset) !important;
}
.button-ticket-more {
    border: 0;
    padding: 0 20px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background: var(--esa-darkArea-reset);
    color: white;
    text-transform: uppercase;
    font-size: 10px;
}
span.reply-date {
    font-size: 13px;
    letter-spacing: 0.5px;
}
.ticket-reply {
    border: 1px solid var(--esa-darkArea-reset);
    background: var(--esa-darkArea-main);
    border-radius: 7px;
}
.ticket-reply.staff {
    border-left: 5px solid rgb(204, 0, 0, 0.8);
}
.ticket-reply-customer > #trcustomer {
    width: 55px;
    border: 4px solid var(--esa-darkArea-body);
    border-radius: 50%;
}
.ticket-reply-admin > img {
    width: 60px;
}
.card.view-ticket {
    background: transparent;
    border: unset;
}
.card.view-ticket > .card-body {
    margin-bottom: 20px;
    border-bottom: unset !important
}
.card.view-ticket > .card-body:last-of-type {
    margin-bottom: unset;
}
.ticket-posted-by {
    padding: 10px;
    border-bottom: 1px solid var(--esa-darkArea-reset);
}
.ticket-requestor {
    color: white;
    padding: 10px 20px;
    border-radius: 5px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 11px;
    line-height: 1;
}
.req-name {
    font-size: 17px;
    font-weight: 700;
}
.client-reply {
    color: white;
}
.ticket-rateing {
    border-top: 1px solid var(--esa-darkArea-main);
    padding: 10px 15px;
}
.admin-reply {
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    font-weight: bold;
    background-image: -webkit-linear-gradient(45deg, #cc0000 10%, #ff0000);
}
.rating-message {
    color: white;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 1px;
    line-height: 1;
}
.ticket-message {
    padding: 15px;
}
.ticket-message > p {
    margin: 0;
    font-size: 14px;
}
.ticket-client-ip {
    padding: 15px;
    border-top: 1px solid var(--esa-darkArea-reset);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.ticket-reply .rate-row span.star {
    margin-right: 5px;
    font-size: 14px;
}
.ticket-reply .rate-row span.star.active {
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    font-weight: bold;
    background-color: #ffbc00;
    filter: drop-shadow(0px 0px 6px rgb(255, 188, 0, 0.3));
}
.ticket-reply .rating span.star:hover:before, .ticket-reply .rating span.star:hover~span.star:before, .ticket-reply .rating-done span.star.active:before {
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    font-weight: bold;
    background-color: #ffbc00;
    filter: drop-shadow(0px 0px 6px rgb(255, 188, 0, 0.3));
}
.ticket-icon {
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 25px;
    margin-right: 10px;
}
.ticket-icon-admin {
    color: #cc0000;
}
.ticket-icon-client {
    color: rgb( var(--esa-colorArea-main) );
}
.form-group-buttons {
    padding: 20px;
    margin: 0;
}
input.ticket-button {
    padding: 8px 20px;
    border: 0px;
    border-radius: 5px;
    margin-right: 10px;
    font-weight: 500;
}
.ticket-button-submit {
    background: rgb(var(--esa-colorArea-main));
    color: white;
}
.ticket-button-submit:focus,
.ticket-button-submit:hover {
    box-shadow: 0 0 0 0.2rem rgb(var(--esa-colorArea-main), 0.25);
}
.ticket-button-close {
    background: rgb(220, 53, 69);
    color: white;
}
.ticket-button-close:focus,
.ticket-button-close:hover {
    box-shadow: 0 0 0 0.2rem rgb(220, 53, 69, 0.25);
}
.ticket-status-icon {
    width: 7px;
    height: 7px;
    border-radius: 50px;
    margin-right: 5px;
}
span.ticket-subject {
    color: white;
    text-transform: capitalize;
    font-size: 13px;
}
span.ticket-number {
    color: rgb( var(--esa-colorArea-main) );
    font-size: 11px;
}
.ticket-border-left {
    border-left: 1px solid rgb( var(--esa-colorArea-main) );
    padding-left: 20px;
    display: block;
}
.card-sidebar.widget-reset > .card-footer, 
.card-sidebar.widget-reset > .card-footer button {
    display: none;
}
.sidebar .list-group-item:first-child {
    border-bottom-left-radius: unset;
    border-bottom-right-radius: unset;
}
.sidebar .list-group-item:last-child {
    border-bottom: unset;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
.sidebar .list-group-item[menuitemname="balance-amount"]:hover {
    background-color: unset !important;
}



.cardArea-group .list-group::-webkit-scrollbar-track {
    border-bottom-right-radius: 10px;
    background: var(--esa-darkArea-main);
    border-left: 2px solid var(--esa-darkArea-main);
}
.cardArea-group .list-group::-webkit-scrollbar-thumb {
    border: 1px solid var(--esa-darkArea-main);
    border-radius: 10px;
    border-left: 2px solid var(--esa-darkArea-main);
}
.card[menuitemname="Active Products/Services"] > .list-group > a > .label {
    position: absolute;
    font-size: 0px;
    width: 7px;
    height: 7px;
    margin: 0;
    padding: 0;
    top: 50%;
    transform: translateY(-50%);
    right: 8px;
}
.card[menuitemname="Register a New Domain"] > .card-body {
    padding: 15px;
}
.card[menuitemname="Register a New Domain"] > .card-body > form > .input-group {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0 !important;
}
.card[menuitemname="Register a New Domain"] > .card-body > form > .input-group > input {
    width: 100%;
    border-radius: 5px !important;
    height: 45px;
}
.card[menuitemname="Register a New Domain"] > .card-body > form > .input-group > .input-group-append {
    border-top: 1px solid var(--esa-darkArea-reset);
    margin-top: 10px;
    padding-top: 10px;
    margin-left: 0px;
}
.card[menuitemname="Register a New Domain"] > .card-body > form > .input-group > .input-group-append > input {
    width: 100%;
    border-radius: 5px !important;
}
.card[menuitemname="Register a New Domain"] > .card-body > form > .input-group > .input-group-append > input:first-child {
    margin-right: 10px;
}
.client-home-cards .card-body p {
    margin: unset;
}
.client-home-cards small {
    color: #d1cbcb !important;
    font-size: 10px !important;
    letter-spacing: 0.5px !important;
}
.clientArea-content {
    background: var(--esa-darkArea-main);
    margin-bottom: 20px;
    border-radius: 7px;
    border: 1px solid var(--esa-darkArea-reset);
}
.client-blocks {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: var(--esa-darkArea-main);
    border-radius: 10px;
    
    padding: 25px 0px;
}
#block {
    padding: 0px 25px;
    border-right: 1px solid var(--esa-darkArea-reset);
}
#block:last-child {
    border-right: unset;
}
.block-icon {
    width: 55px;
    height: 55px;
    color: rgb( var(--esa-colorArea-main) );
    font-size: 23px;
    border: 1px solid var(--esa-darkArea-main);
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#block[data-block="invoices"] > .block-icon {
    color: var(--block-invoices);
    border-color: var(--block-invoices);
    transition: ease-in-out 0.3s;
    --block-invoices: #e7992a;
} 
#block[data-block="invoices"]:hover > .block-icon {
    background: var(--block-invoices);
    color: white;
    transition: ease-in 0.3s;
}
#block[data-block="invoices"] > .block-content > .value {
    color: var(--block-invoices);
    --block-invoices: #e7992a;
}

#block[data-block="antiddos"] > .block-icon {
    color: var(--block-antiddos);
    border-color: var(--block-antiddos);
    transition: ease-in-out 0.3s;
    --block-antiddos: #d000ff;
} 
#block[data-block="antiddos"]:hover > .block-icon {
    background: var(--block-antiddos);
    color: white;
    transition: ease-in 0.3s;
}
#block[data-block="antiddos"] > .block-content > .value {
    color: var(--block-antiddos);
    --block-antiddos: #d000ff;
}


#block[data-block="tickets"] > .block-icon {
    color: var(--block-tickets);
    border-color: var(--block-tickets);
    transition: ease-in-out 0.3s;
    --block-tickets: #e3312c;
}
#block[data-block="tickets"]:hover > .block-icon {
    background: var(--block-tickets);
    color: white;
    transition: ease-in 0.3s;
}
#block[data-block="tickets"] > .block-content > .value {
    color: var(--block-tickets);
    --block-tickets: #e3312c;
}
#block[data-block="domains"] > .block-icon {
    color: var(--block-domains);
    border-color: var(--block-domains);
    transition: ease-in-out 0.3s;
    --block-domains: #4ec54e;
}
#block[data-block="domains"]:hover > .block-icon {
    background: var(--block-domains);
    color: white;
    transition: ease-in 0.3s;
}
#block[data-block="domains"] > .block-content > .value {
    color: var(--block-domains);
    --block-domains: #4ec54e;
}
#block[data-block="services"] > .block-icon {
    color: var(--block-services);
    border-color: var(--block-services);
    transition: ease-in-out 0.3s;
    --block-services: #54b7d5;
}
#block[data-block="services"]:hover > .block-icon {
    background: var(--block-services);
    color: white;
    transition: ease-in 0.3s;
}
#block[data-block="services"] > .block-content > .value {
    color: var(--block-services);
    --block-services: #54b7d5;
}
.block-content {
    line-height: 1.1;
}
.block-content > .value {
    font-size: 35px;
    font-weight: 600;
    color: rgb( var(--esa-colorArea-main) );
}
.block-content > .text {
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.5px;
    color: white;
    font-weight: 600;
}



.card-button {
    padding: 6px 12px;
    white-space: nowrap;
    border-radius: 50px;
    color: white;
    font-weight: 500;
    font-size: 11px;
    letter-spacing: 0.5px;
    text-transform: lowercase;
    border: 1px solid transparent;
    transition: ease-in-out 0.3s;
}
.card-button:hover {
    background: transparent;
    letter-spacing: 0.8px;
    transition: ease-in 0.3s;
}
.cardArea-header {
    padding: 15px 20px;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    border-bottom: 2px solid var(--esa-darkArea-main);
}
.cardArea-title > .__title {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.5px;
    line-height: 1;
    color: white;
}
.cardArea-title > .__title > i {
    margin-right: 5px;
}

.card-button:hover.cardButton-gold { border-color: #f0ad4e;color: #f0ad4e;}
.card-button:hover.cardButton-green { border-color: #5cb85c;color: #5cb85c;}
.card-button:hover.cardButton-red { border-color: #d9534f;color: #d9534f;}
.card-button:hover.cardButton-blue { border-color: #5bc0de;color: #5bc0de;}
.card-button:hover.cardButton-orange { border-color: #f60;color: #f60;}
.card-button:hover.cardButton-pink { border-color: #e671b8;color: #e671b8;}
.card-button:hover.cardButton-purple { border-color: #7b4f9d;color: #7b4f9d;}
.card-button:hover.cardButton-lime { border-color: #8cbf26;color: #8cbf26;}
.card-button:hover.cardButton-magenta { border-color: #ff0097;color: #ff0097;}
.card-button:hover.cardButton-teal { border-color: #00aba9;color: #00aba9;}
.card-button:hover.cardButton-turquoise { border-color: #1abc9c;color: #1abc9c;}
.card-button:hover.cardButton-emerald { border-color: #2ecc71;color: #2ecc71;}
.card-button:hover.cardButton-amethyst { border-color: #9b59b6;color: #9b59b6;}
.card-button:hover.cardButton-wet-asphalt { border-color: #004258;color: #004258;}
.card-button:hover.cardButton-midnight-blue { border-color: #2c3e50;color: #2c3e50;}
.card-button:hover.cardButton-sun-flower { border-color: #f1c40f;color: #f1c40f;}
.card-button:hover.cardButton-pomegranate { border-color: #c0392b;color: #c0392b;}
.card-button:hover.cardButton-silver { border-color: #bdc3c7;color: #bdc3c7;}
.card-button:hover.cardButton-asbestos { border-color: #7f8c8d;color: #7f8c8d;}
.cardButton-gold { background-color: #f0ad4e;}
.cardButton-green { background-color: #5cb85c;}
.cardButton-red { background-color: #d9534f;}
.cardButton-blue { background-color: #5bc0de;}
.cardButton-orange { background-color: #f60;}
.cardButton-pink { background-color: #e671b8;}
.cardButton-purple { background-color: #7b4f9d;}
.cardButton-lime { background-color: #8cbf26;}
.cardButton-magenta { background-color: #ff0097;}
.cardButton-teal { background-color: #00aba9;}
.cardButton-turquoise { background-color: #1abc9c;}
.cardButton-emerald { background-color: #2ecc71;}
.cardButton-amethyst { background-color: #9b59b6;}
.cardButton-wet-asphalt { background-color: #004258;}
.cardButton-midnight-blue { background-color: #2c3e50;}
.cardButton-sun-flower { background-color: #f1c40f;}
.cardButton-pomegranate { background-color: #c0392b;}
.cardButton-silver { background-color: #bdc3c7;}
.cardButton-asbestos { background-color: #7f8c8d;}
.cardIcon-gold {color: #f0ad4e;}
.cardIcon-green {color: #5cb85c;}
.cardIcon-red {color: #d9534f;}
.cardIcon-blue {color: #5bc0de;}
.cardIcon-orange {color: #f60;}
.cardIcon-pink {color: #e671b8;}
.cardIcon-purple {color: #7b4f9d;}
.cardIcon-lime {color: #8cbf26;}
.cardIcon-magenta {color: #ff0097;}
.cardIcon-teal {color: #00aba9;}
.cardIcon-turquoise {color: #1abc9c;}
.cardIcon-emerald {color: #2ecc71;}
.cardIcon-amethyst {color: #9b59b6;}
.cardIcon-wet-asphalt {color: #004258;}
.cardIcon-midnight-blue {color: #2c3e50;}
.cardIcon-sun-flower {color: #f1c40f;}
.cardIcon-pomegranate {color: #c0392b;}
.cardIcon-silver {color: #bdc3c7;}
.cardIcon-asbestos {color: #7f8c8d;}

/*---- VPS HOSTING CART ----*/ 
div#vps_hosting-cart {
    display: flex;
}
@media screen and (max-width: 1200px) {
    div#vps_hosting-cart {
        flex-direction: column;
    }
}
@media screen and (max-width: 979px) { 
    div#vps_hosting-cart {
        flex-direction: column;
    }
}
.vps_cart-sidebar {
    min-width: 340px;
    max-width: 340px;
}
@media screen and (max-width: 1200px) {
    .vps_cart-sidebar {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        min-width: 100%;
        grid-gap: 10px;
        margin-right: unset !important;
    }
    .vps_cart-sidebar > .panel[menuitemname="Categories"] > .collapsable-card-body {
        max-height: 120px;
        overflow-y: scroll;
    }
}
@media screen and (max-width: 767px) {
    .vps_cart-sidebar {
        grid-template-columns: repeat(1,1fr);
    }  
}
.vps_hosting-cartInner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 15px;
}
@media screen and (max-width: 1300px) {
    .vps_hosting-cartInner {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 1200px) {
    .vps_hosting-cartInner {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 979px) {
    .vps_hosting-cartInner {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .vps_hosting-cartInner {
        grid-template-columns: repeat(1,1fr);
    }  
}
.vps_hosting-boxHeader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.vps_hosting-boxHeadertitle > h1 {
    color: white;
    font-size: 29px;
    margin:0px;
}
.vps_hosting-cartBox {
    background: var(--esa-darkArea-main);
    border: 1px solid var(--esa-darkArea-reset);
    border-radius: 4px;
}
.vps_hosting-boxPrice {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.vps_hosting-boxPrice:before,
.vps_hosting-boxPrice:after {
    content: "";
    position: relative;
    background: radial-gradient(ellipse at center, rgb(var(--esa-colorArea-main)) 0, var(--esa-darkArea-main) 60%);
    width: 100%;
    height: 1px;
    margin: 10px 0px;
    opacity: 0.7;
}

.vps_hosting-boxPrice > .startingfrom {
    margin-bottom: 5px;
    font-size: 16px;
    letter-spacing: 1px;
}
.vps_hosting-boxPrice > .price {
    display: flex;
    align-items: end;
    line-height: 1;
}
.vps_hosting-boxPrice > .price > span {
    color: rgb(var(--esa-colorArea-main));
    font-size: 26px;
    font-weight: 600;
    margin-right: 5px;
}
.vps_hosting-boxPrice > .price > .price-type {
    color: white;
    font-size: 16px;
    position: relative;
    margin-bottom: 2px;
}
.vps_hosting-boxHeader > img {
    margin: 10px 0px;
}
.vps_hosting-boxHeadertitle {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 10px;
}
.vps_hosting-boxHeadertitle > p {
    margin: 0;
    max-width: 95%;
    padding: 0 25px;
}
.vps_hosting-boxDesc > .product-desc > p {
    text-align: center;
}
.vps_hosting-boxDesc {
    text-align: center;
}
.vps_hosting-boxOrder {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
}
.vps_hosting-boxOrder > a {
    width: 100%;
    padding: 10px;
    color: var(--esa-darkArea-body);
    font-weight: 500;
}
.vps_hosting-boxDesc > .product-desc > p > span > b {
    color: rgb(var(--esa-colorArea-main));
}

/*--- Gamehosting CART ---*/
div#game_hosting-cart {
    display: flex;
}
@media screen and (max-width: 1200px) {
    div#game_hosting-cart {
        flex-direction: column;
    }
}
@media screen and (max-width: 979px) { 
    div#game_hosting-cart {
        flex-direction: column;
    }
}
.game_cart-sidebar {
    min-width: 340px;
    max-width: 340px;
}
@media screen and (max-width: 1200px) {
    .game_cart-sidebar {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        min-width: 100%;
        grid-gap: 10px;
        margin-right: unset !important;
    }
    .game_cart-sidebar > .panel[menuitemname="Categories"] > .collapsable-card-body {
        max-height: 120px;
        overflow-y: scroll;
    }
}
@media screen and (max-width: 767px) {
    .game_cart-sidebar {
        grid-template-columns: repeat(1,1fr);
    }  
}
.game_cart-products {
    width: 100%;
}
.game_hosting-cartInner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 15px;
}
@media screen and (max-width: 1300px) {
    .game_hosting-cartInner {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 1200px) {
    .game_hosting-cartInner {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 979px) {
    .game_hosting-cartInner {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .game_hosting-cartInner {
        grid-template-columns: repeat(1,1fr);
    }  
}
.game_hosting-boxHeader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.game_hosting-boxHeadertitle > h1 {
    color: white;
    font-size: 29px;
    margin:0px;
}
.game_hosting-game {
    width: 100%;
    height: 300px;
    background: var(--esa-darkArea-main);
    border-radius: 5px;
    position: relative;
    overflow: hidden;cursor: pointer;
}
.game_hosting-game:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--esa-darkArea-reset);
    opacity: 0.3;
}
.gameHost-image {
    background: url(../images/gamehost/cs16-image.png) no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    transition: all 0.5s ease 0s;
}
.gameHost-image[data-image="counter-strike 1.6 - csapanel"] {
    background: url(../images/gamehost/cs16.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="counter-strike 1.6 - pterodactyl"] {
    background: url(../images/gamehost/cs16.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="secret laboratory [scp]"] {
    background: url(../images/gamehost/secretlaboratory.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="unturned"] {
    background: url(../images/gamehost/unturned-image.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="csgo ~ 64 ticks"],
.gameHost-image[data-image="csgo ~ 128 ticks"] {
    background: url(../images/gamehost/wolf/csgo.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="multi theft auto"] {
    background: url(../images/gamehost/mta-image.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="san andreas multiplayer"] {
    background: url(../images/gamehost/samp-image.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="minecraft"] {
    background: url(../images/gamehost/minecraft-image.png) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="cs2"] {
    background: url(../images/gamehost/cs2.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="grand theft auto"] {
    background: url(../images/gamehost/wolf/gta5.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="7 days to die"] {
    background: url(../images/gamehost/sevendays-image.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="ark: survival evolved"] {
    background: url(../images/gamehost/arcevolved.jpeg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="ark: survival ascended"] {
    background: url(../images/gamehost/arcascended.jpg) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="team fortress 2"] {
    background: url(../images/gamehost/teamfortress.png) no-repeat;
    background-size: cover;
}
.gameHost-image[data-image="insurgency"] {
    background: url(../images/gamehost/insurgency.jpg) no-repeat;
    background-size: cover;
}
.game_hosting-game:hover > .gameHost-image {
    filter: blur(10px);
    transition: all 0.5s ease 0s;
}

.game_hosting-game:hover .gameHost-hoverPopup {
    transform: translateY(0px);
    opacity: 1;
    visibility: visible;
    transition: all 0.5s ease 0s;
}
.gameHost-hoverPopup {
    position: absolute;
    top: 0;
    background: rgb(26 27 46 / 70%);
    border-radius: 5px;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    padding-bottom: 70px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(100px);
    transition: all 0.5s ease 0s;
}
.gameHost-title {
    padding: 20px;
    border-bottom: 1px solid var(--esa-darkArea-reset);
    line-height: 1;
}
.gameHost-title > h1 {
    color: white;
    font-size: 19px;
    margin: 0;
    line-height: 1;
}
.gameHost-boxDesc {
    padding: 20px;
}
.gameHost-boxDesc > .product-desc2 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 10px;
}
.gameHost-boxDesc > .product-desc2 > li {
    display: flex;
    flex-direction: column;
    align-items: center;
    list-style: none;
    font-weight: 500;
    font-size: 10px;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.gameHost-boxDesc > .product-desc2 > li > span {
    color: rgb(var(--esa-colorArea-main));
    font-weight: 600;
    font-size: 11px;
}
.gameHost-boxFooter {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--esa-darkArea-reset);
    padding: 10px 20px;
    bottom: 0;
    width: 100%;
    height: 70px;
}
.gameHost-price > span {
    color: white;
    font-weight: 600;
    font-size: 20px;
    letter-spacing: 1px;
}
.gameHost-price > .price-type {
    color: rgb(var(--esa-colorArea-main));
    font-weight: 500;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
/*---- VPS HOSTING CART ----*/ 
div#web_hosting-cart {
    display: flex;
}
@media screen and (max-width: 1200px) {
    div#web_hosting-cart {
        flex-direction: column;
    }
}
@media screen and (max-width: 979px) { 
    div#web_hosting-cart {
        flex-direction: column;
    }
}
.web_cart-sidebar {
    min-width: 340px;
    max-width: 340px;
}
@media screen and (max-width: 1200px) {
    .web_cart-sidebar {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        min-width: 100%;
        grid-gap: 10px;
        margin-right: unset !important;
    }
    .web_cart-sidebar > .panel[menuitemname="Categories"] > .collapsable-card-body {
        max-height: 120px;
        overflow-y: scroll;
    }
}
@media screen and (max-width: 767px) {
    .web_cart-sidebar {
        grid-template-columns: repeat(1,1fr);
    }  
}
.web_hosting-cartInner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 15px;
}
@media screen and (max-width: 1300px) {
    .web_hosting-cartInner {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 1200px) {
    .web_hosting-cartInner {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 979px) {
    .web_hosting-cartInner {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .web_hosting-cartInner {
        grid-template-columns: repeat(1,1fr);
    }  
}
.web_hosting-boxHeader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.web_hosting-boxHeadertitle > h1 {
    color: white;
    font-size: 29px;
    margin:0px;
}
.web_hosting-cartBox {
    background: var(--esa-darkArea-main);
    border: 1px solid var(--esa-darkArea-reset);
    border-radius: 4px;
}
.web_hosting-boxPrice {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.web_hosting-boxPrice:before,
.web_hosting-boxPrice:after {
    content: "";
    position: relative;
    background: radial-gradient(ellipse at center, rgb(var(--esa-colorArea-main)) 0, var(--esa-darkArea-main) 60%);
    width: 100%;
    height: 1px;
    margin: 10px 0px;
    opacity: 0.7;
}

.web_hosting-boxPrice > .startingfrom {
    margin-bottom: 5px;
    font-size: 16px;
    letter-spacing: 1px;
}
.web_hosting-boxPrice > .price {
    display: flex;
    line-height: 1;
    flex-direction: column;
    align-items: center;
}
.web_hosting-boxPrice > .price > span {
    color: white;
    font-size: 26px;
    font-weight: 600;
}
.web_hosting-boxPrice > .price > .price-type {
    color: rgb(var(--esa-colorArea-main));
    font-size: 13px;
    position: relative;
    text-transform: uppercase;
    margin-top: 5px;
    font-weight: 600;
    letter-spacing: 1px;
}
.web_hosting-boxHeader > img {
    margin: 10px 0px;
}
.web_hosting-boxHeadertitle {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 10px;
}
.web_hosting-boxHeadertitle > p {
    margin: 0;
    max-width: 95%;
    padding: 0 25px;
}
.web_hosting-boxDesc > .product-desc > p {
    text-align: center;
}
.web_hosting-boxDesc {
    text-align: center;
}
.web_hosting-boxOrder {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
}
.web_hosting-boxOrder > a {
    width: 100%;
    padding: 10px;
    color: var(--esa-darkArea-body);
    font-weight: 500;
}
.web_hosting-boxDesc > .product-desc > p > span > b {
    color: rgb(var(--esa-colorArea-main));
}

body.homepage-contact {
    width: 100%;
    min-height: 100vh;
    max-height: 100vh;
    overflow: hidden;
}
div#esagames-contact {
    position: fixed;
    top: 0;
    left: 0;
    background: var(--esa-darkArea-body);
    width: 100%;
    height: 100%;
    z-index: 9999999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.esagames-contact-inner {
    min-width: 350px;
    background: var(--esa-darkArea-main);
    border: 1px solid var(--esa-darkArea-reset);
    padding: 20px;
    border-radius: 5px;
}
.esa-contact-header {
    text-align: center;
    border-bottom: 1px solid var(--esa-darkArea-reset);
    padding-bottom: 20px;
    margin-bottom: 20px;
}
.esa-contact-header > h1 {
    color: white;
    font-size: 29px;
    text-align: center;
    margin: unset;
}
.esa-contact-row1 {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    gap: 10px;
    margin-bottom: 10px;
}
.esa-contact-rowInput > label {
    color: white;
    margin-bottom: 2px;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 1px;
}
.esa-contact-rowButton {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.esa-contact-rowButton > button {
    width: 100%;
}
.esa-contact-rowInput > textarea {
    max-height: 100px;
    resize: none;
}

.esa-contact-captcha {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px 0px;
}
#google-recaptcha-domainchecker2 {
    margin-bottom: unset !important;
}
.esa-contact-footer {
    border-top: 1px solid var(--esa-darkArea-reset);
    padding-top: 20px;
    margin-top: 20px;
    text-align: center;
}
.esa-contact-footer > h1 {
    color: white;
    font-size: 13px;
    letter-spacing: 1px;
    margin-bottom: unset;
}
.contact-footer-row > span {
    font-size: 11px;
    margin-right: 5px;
}
.contact-footer-row > span > b {
    color: rgb(var(--esa-colorArea-main));
    letter-spacing: 0.5px;
}
.contact-footer-row > span:last-of-type {
    margin-right: unset;
}


.email-verify-inner {
    background-color: var(--esa-darkArea-main);
    padding: 20px;
    border-radius: 5px;
    border: 1px solid var(--esa-darkArea-reset);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
@media screen and (max-width: 979px) {
    .email-verify-inner {
        flex-direction: column;
        align-items: baseline;
    }
    .email-verify-header {
        margin-bottom: 15px;
    }
}
.email-verify-header {
    display: flex;
    align-items: center;
}
.email-verify-header > i {
    width: 55px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    border: 2px dashed var(--danger);
    border-radius: 50px;
    color: var(--danger);
    line-height: 1;
    margin-right: 15px;
}
@media screen and (max-width: 767px) {
    .email-verify-header > i {
        display: none;
    }
    .email-verify-content > h1 {
        font-size: 19px;
    }
    .email-verify-content > p {
        font-size: 13px;
    }
}
.email-verify-content > h1 {
    color: white;
    font-size: 30px;
    margin: 0;
}
.email-verify-content > p {
    font-size: 16px;
    margin: 0;
}
.email-verify-buttons {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
}
button#btnEmailVerificationClose {
    width: 50px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    text-shadow: unset;
    opacity: 1;
    font-weight: 500;
    background: var(--esa-darkArea-body);
    border: 1px solid var(--esa-darkArea-reset);
    padding: unset;
    line-height: 1;
    margin-left: 5px;
}
button#btnResendVerificationEmail {
    background-color: #0abb76;
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#04955c), to(#0abb76));
    background: -webkit-linear-gradient(top, #0abb76, #04955c);
    background: -moz-linear-gradient(top, #0abb76, #04955c);
    background: -ms-linear-gradient(top, #0abb76, #04955c);
    background: -o-linear-gradient(top, #0abb76, #04955c);
    border-radius: 5px;
    height: 39px;
    font-weight: 500;
    letter-spacing: 1px;
    border: 0px !important;
}
.verification-system.email-verification {
    margin-top: 20px;
}
div#mg-hosting-renewals-integration {
    background: var(--esa-darkArea-main);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    border-radius: 5px;
    border: 1px solid var(--esa-darkArea-reset);
    margin: 10px 0px;
}
#CSAPanelBillingOverviewPanel {
    background: var(--esa-darkArea-main);
    flex-direction: column;
    border-radius: 5px;
    border: 1px solid var(--esa-darkArea-reset);
    padding: 20px;
}
hr {
    border-top: 1px solid var(--esa-darkArea-reset) !important;
}
.buttonstogcsapanel {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
}
.csapanel-biling-row > .name {
    color: white;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.5px;
    margin-right: 5px;
}
.csapanel-biling-row > .value {
    color: rgb(var(--esa-colorArea-main));
    font-weight: 600;
}

section#payments-methods {
    position: relative;
    bottom: -55px;
    z-index: 20;
}
@media screen and (max-width: 979px) {
    section#payments-methods {
        display: none;
    }
}
section#payments-methods > .page-container > .payments-inner {
    background: rgb(var(--esa-colorArea-main));
    border-radius: 5px;
    padding: 25px;
    -webkit-box-shadow: 0px 3px 6px 0px rgb(0 0 0 / 10%), 0px 1px 3px 0px rgb(0 0 0 / 8%);
    box-shadow: 0px 3px 6px 0px rgb(0 0 0 / 10%), 0px 1px 3px 0px rgb(0 0 0 / 8%);
}
.payments-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.payments-row > img {
    -webkit-filter: drop-shadow(0px 0px 6px rgb(0 0 0 / 0.4));
    filter: drop-shadow(0px 0px 6px rgb(0 0 0 / 0.4));
}









nav.navbar-primary {
    display: flex;
    align-items: center;
    height: 100%;
}
nav.navbar-primary > li {
    position: relative;
    list-style: none;
    height: 100%;
}
nav.navbar-primary > li > a {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 18px;
    font-size: 15px;
    font-weight: 500;
    color: white;
    letter-spacing: 1px;
}
.navbar-primary > li > a > i {
    font-size: 12px;
    margin-left: 5px;
    color: rgb(var(--esa-colorArea-main));
    filter: drop-shadow(0px 0px 6px rgb(var(--esa-colorArea-main)));
    font-weight: 600;
}
#dropdown-menu {
    position: fixed;
    background: #161728;
    border: 1px solid var(--esa-darkArea-reset);
    border-top: unset;
    width: calc(100% - 25px);
    max-width: 1450px;
    padding: 15px;
    left: 0;
    margin: 0 auto;
    right: 0;
    display: flex;
    transform: translateY(50px);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    z-index: 0;
    opacity: 0;
    visibility: hidden;
    transition: ease-in-out 0.3s;
}
.dropdown-hover:hover #dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: ease-in 0.3s;
    z-index: 10000;
}
.dropdown-row {
    display: flex;
    width: 100%;
}
.dropdown-content {
    width: 100%;
    margin-left: 15px;
}
.dropdown-content > h1 {
    color: white;
    font-size: 20px;
    margin: 0;
}
.dropdown-content > span {
    font-size: 14px;
    color: inherit;
}
.dropdown-content > span > b {
    color: rgb(var(--esa-colorArea-main));
}
.dropdown-row > .icon > i {
    width: 50px;
    height: 50px;
    background: linear-gradient(0deg, var(--esa-darkArea-reset), transparent);
    border: 2px dashed var(--esa-darkArea-reset);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #9b9fe3;
    border-radius: 50%;
    border-bottom: unset;
    transition: all 0.2s linear;
    white-space: nowrap;
}
.dropdown-row:hover > .icon > i {
    background: rgb(var(--esa-colorArea-main));
    border-color: rgb(var(--esa-colorArea-main));
    color: white;
    filter: drop-shadow(0px 0px 8px rgb(var(--esa-colorArea-main), 0.5));
}
.dropdown-group-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 25px;
    grid-row-gap: 30px;
    width: 100%;
}
@media screen and (max-width: 1366px) {
    .dropdown-group-inner {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 990px) {
    .dropdown-group-inner {
        grid-template-columns: repeat(2, 1fr);
    }
}
.dropdown-infos {
    min-width: 250px;
    max-width: 250px;
}
.dropdown-buttons {
    display: flex;
    align-items: center;
    margin-top: 5px;
}
.dropdown-buttons > a {
    white-space: nowrap;
    font-weight: 500;
    color: white;
    border-radius: 2px;
    display: flex;
    align-items: center;
}
.dropdown-buttons > a > i {
    margin-left: 5px;
    font-size: 17px;
}
.dropdown-buttons > a > img {
    width: 20px;
    margin-right: 5px;
    border-radius: 3px;
    padding: 1px;
    line-height: 1;
}
.dropdown-buttons > a:first-of-type {
    margin-right: 15px;
}

.dropdown-left {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-gap: 20px;
}
@media screen and (max-width: 1200px) {
    .dropdown-left {
        grid-template-columns: repeat(1,1fr);
    }
}
.dropdown-right {
    min-width: 270px;
    max-width: 270px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dropdown-content > p {
    max-width: 90%;
    font-size: 15px;
}
.dropdown-right {
    min-width: 300px;
    max-width: 300px;
    margin-left: 100px;
}
.dropdown-right > img {
    width: 250px;
    border-radius: 10px;
}

#dropdown-small {
    position: absolute;
    width: 200px;
    height: auto;
    background: #161728;
    border: 1px solid var(--esa-darkArea-reset);
    border-top: unset;
    left: 0;
    margin: 0 auto;
    right: 0;
    display: flex;
    flex-direction: column;
    transform: translateY(50px);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    z-index: 0;
    opacity: 0;
    visibility: hidden;
    transition: ease-in-out 0.3s;
}
.dropdown-hover:hover #dropdown-small {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: ease-in 0.3s;
    z-index: 10000;
}
div#dropdown-small > a {
    display: flex;
    padding: 8px 15px;
    color: white;
    font-size: 14px;
    font-weight: 500;
}
div#dropdown-small > a:hover {
    background: var(--esa-colorArea-mainOther);
}
div#dropdown-small > a:last-of-type {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
span.dropdown-devider {
    height: 1px;
    width: 100%;
    background: var(--esa-darkArea-reset);
}

.policy {
    background: var(--esa-darkArea-main);
    padding: 20px;
    border: 1px solid var(--esa-darkArea-reset);
    border-radius: 5px;
}
.policy-header > h1 {
    color: white;
    font-weight: 700;
    margin: 0;
    border-bottom: 1px solid var(--esa-darkArea-reset);
    padding-bottom: 10px;
    margin-bottom: 15px;
}
.policy-row {
    border-bottom: 1px solid var(--esa-darkArea-body);
    margin-bottom: 20px;
    padding-bottom: 10px;
}
.policy-row:last-child {
    border-bottom: unset;
    margin-bottom: unset;
    padding-bottom: unset;
}
.policy-row > h1 {
    color: white;
    margin: 0;
    font-size: 25px;
}
.policy-row > h2 {
    color: white;
    margin: 0;
    font-size: 20px;
}
.policy-row > p {
    margin-bottom: 5px;
}


/*---- VPS HOSTING CART ----*/ 
div#dedicated_servers-cart {
    display: flex;
}
.dedicated_servers_inner {
    width: 100%;
}
@media screen and (max-width: 1200px) {
    div#dedicated_servers-cart {
        flex-direction: column;
    }
}
@media screen and (max-width: 979px) { 
    div#dedicated_servers-cart {
        flex-direction: column;
    }
}
.dedicated_cart-sidebar {
    min-width: 340px;
    max-width: 340px;
}
@media screen and (max-width: 1200px) {
    .dedicated_cart-sidebar {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        min-width: 100%;
        grid-gap: 10px;
        margin-right: unset !important;
    }
    .dedicated_cart-sidebar > .panel[menuitemname="Categories"] > .collapsable-card-body {
        max-height: 120px;
        overflow-y: scroll;
    }
}
@media screen and (max-width: 767px) {
    .dedicated_cart-sidebar {
        grid-template-columns: repeat(1,1fr);
    }  
}
.dedicated_servers-products {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-gap: 15px;
}
.dedicated-servers-boxDesc > .product-desc {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
}
@media screen and (max-width: 1150px) {
    .dedicated-servers-boxDesc > .product-desc {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .dedicated-servers-boxDesc > .product-desc {
        grid-template-columns: repeat(1, 1fr);
    }
}
.dedicated_servers-product {
    background: var(--esa-darkArea-main);
    padding: 20px;
    border-radius: 5px;
    border: 1px solid var(--esa-darkArea-reset);
}
.dedicated-servers-boxDesc > .product-desc > br, 
.dedicated-servers-boxDesc > .product-desc > p {
    display: none;
}
.dedicated-row {
    display: flex;
}
.dedicated-content {
    margin-left: 10px;
    display: flex;
    flex-direction: column;
    line-height: 1.5;
}
.dedicated-content > br {
    display: none;
}
.dedicated-content > h1 {
    font-size: 18px;
    color: white;
    margin: unset;
}
.dedicated-content > h1 > b {
    color: rgb(var(--esa-colorArea-main));
    font-size: 22px;
}
.dedicated-icon {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb( var(--esa-colorArea-main) );
    font-size: 18px;
    border-radius: 10px;
    color: var(--esa-darkArea-reset);
}
.dedicated-product-inner {
    display: flex;
}
.dedicated-servers_price {
    min-width: 250px;
    max-width: 250px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-left: 1px solid var(--esa-darkArea-reset);
    padding-left: 20px;
}
.dedicated-servers-boxDesc {
    width: 100%;
}
.dedicated-servers_price .price {
    display: flex;
    align-items: center;
    font-size: 25px;
    margin-bottom: 10px;
    color: white;
}
@media screen and (max-width: 979px) {
    .dedicated-product-inner {
        flex-direction: column;
    }
    .dedicated-servers_price {
        width: 100%;
        border: unset;
        padding-left: unset;
        border-top: 1px solid var(--esa-darkArea-reset);
        padding-top: 20px;
        margin-top: 20px;
    }
}
@media screen and (max-width: 767px) {
    .dedicated-servers_price {
        min-width: 100%;
        max-width: 100%;
    }
    .table-container {
        overflow-x: scroll;
    }
}
.dedicated-servers_price .price > .price-type {
    color: rgb(var(--esa-colorArea-main));
    font-size: 18px;
    margin-left: 10px;
}
.dedicated-servers_price > a {
    width: 100%;
    padding: 8px;
    font-size: 14px;
    color: var(--esa-darkArea-reset);
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.ticket-message > p:not(:only-of-type):not(:last-of-type) {
    margin-bottom: 6px;
}




div#promotions {
    position: relative;
    z-index: 100;
 }
 .promTitle {
    position: relative;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: space-between;
 }
 @media screen and (max-width: 1000px) {  
    .promTitle {
        text-align: left;
    }
 }
 @media screen and (max-width: 767px) {  
    .promTitle {
        text-align: center;
    justify-content: center;
    }
 }
.TitleMiddle > h1 {
    /* background: -webkit-linear-gradient(-70deg, #ff7170 0%, #ffe57f 100%); */
    /* background: -webkit-linear-gradient(-70deg, #ef9191 0%, #f13a3a 100%); */
    background: -webkit-linear-gradient(-70deg, #91e6ef 0%, #3a68f1 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
    font-size: 50px;
    font-weight: 900;
    line-height: 1;
    margin: 0;
}
@media screen and (max-width: 767px) {  
    .TitleMiddle > h1 {
        font-size: 30px;
    }
}
.leftSpooky,
.rightSpooky {
    z-index: 999999;
}
@media screen and (max-width: 1000px) { 
    .leftSpooky,
    .rightSpooky {
        display: none;
    }
}
.leftSpooky .fa-gifts {
    background: -webkit-linear-gradient(-70deg, #91e6ef 0%, #3a68f1 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
    font-size: 70px;
        filter: drop-shadow(0px 0px 24px #91e6ef6e) drop-shadow(0px 0px 19px #3a68f180)
}
.leftSpooky .fa-bells {
    position: absolute;
    bottom: 15px;
    font-size: 35px;
    left: 32px;
    color: #3a68f1;
    filter: drop-shadow(0px 0px 11px black) drop-shadow(0px 0px 33px #3a68f1);
}
.leftSpooky .fa-candy-cane {
    left: 0;
    position: absolute;
    left: -10px;
    bottom: 7px;
    transform: rotate(-95deg);
    font-size: 40px;
    background: -webkit-linear-gradient(-70deg, #91e6ef 0%, #3a68f1 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
    filter: drop-shadow(0px 0px 25px #91e6ef) drop-shadow(0px 0px 1px #3a68f1);
}
.rightSpooky .fa-tree-christmas {
    background: -webkit-linear-gradient(-70deg, #91e6ef 0%, #3a68f1 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
    font-size: 70px;
    filter: drop-shadow(0px 0px 24px #91e6ef6e) drop-shadow(0px 0px 19px #3a68f180);
}
.rightSpooky .fa-candle-holder {
    position: absolute;
    bottom: 22px;
    font-size: 35px;
    right: 40px;
    background: -webkit-linear-gradient(bottom, #ff7170 0%, #ffe57f 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
    filter: drop-shadow(0px 0px 11px black) drop-shadow(0px 0px 33px #ff8372);
}
.rightSpooky .fa-cauldron  {
    position: absolute;
    right: -2px;
    bottom: 14px;
    font-size: 45px;
    background: -webkit-linear-gradient(-70deg, #72ff70 0%, #ffc67f 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
    filter: drop-shadow(0px 0px 3px #72ff70) drop-shadow(0px 0px 20px #72ff70);
}


.effectTitle-1 {
    position: absolute;
    top: 0;
    font-size: 38px;
    color: #0b0c1b;
}
.effectTitle-2 {
    position: absolute;
    bottom: 0;
    left: 53px;
    font-size: 41px;
    color: #0b0c1b;
    transform: rotate(83deg);
}
.effectTitle-3 {
    position: absolute;
    bottom: 0;
    right: 93px;
    font-size: 41px;
    color: #0b0c1b;
    transform: rotate(154deg);
}
.TitleMiddle {
    position: relative;
}
.promOffers {
    position: relative;
    display: flex;
    align-items: center;
    margin-top: 30px;
    background: linear-gradient(to top, var(--esa-darkArea-main), var(--esa-darkArea-body));
    padding: 38px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
@media screen and (max-width: 1404px) {  
    .promOffers {
        padding: 20px;
    }
}
@media screen and (max-width: 767px) { 
    .promOffers {
        flex-direction: column;
    }
} 
.promOffLeft {
    min-width: 250px;
    max-width: 250px;
    display: flex;
    align-items: center;
    flex-direction: column;
    border-right: 1px solid var(--esa-darkArea-reset);
}
@media screen and (max-width: 1404px) {
    .promOffLeft {
        min-width: 200px;
        max-width: 200px;
    }
}
@media screen and (max-width: 767px) {  
    .promOffLeft {
        border-right: unset;
        border-bottom: 1px solid var(--esa-darkArea-reset);
        min-width: 100%;
        max-width: 100%;
        padding-bottom: 20px;
    }
}
.promOffLeft h1 {
    color: #fff;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 1px;
    margin: 0;
    line-height: 1;
}
.promOffLeft span {
    /* background: -webkit-linear-gradient(-70deg, #72ff70 0%, #ffc67f 100%);
    filter: drop-shadow(0px 0px 3px #72ff70) drop-shadow(0px 0px 55px #72ff70); */
    /* background: -webkit-linear-gradient(-70deg, #ff7070 0%, #fb2b2b 100%);
    filter: drop-shadow(0px 0px 3px #fb2b2b) drop-shadow(0px 0px 55px #ff7070); */
    background: -webkit-linear-gradient(-70deg, #91e6ef 0%, #3a68f1 100%);
    filter: drop-shadow(0px 0px 3px #91e6ef) drop-shadow(0px 0px 55px #3a68f1 );
    padding: 10px 30px;
    margin: 10px 0;
    color: var(--esa-darkArea-body);
    font-weight: bold;
    font-size: 20px;
    letter-spacing: 1px;
    border-radius: 5px;
}
.promOffLeft strong {
    color: #fff;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 1.5px;
    margin: 0;
    font-weight: 500;
}

.offerBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--esa-darkArea-reset);
    padding: 10px 20px;
    border-radius: 5px;
}
.offerBox-title {
    border-bottom: 1px solid var(--esa-darkArea-main);
    margin-bottom: 10px;
    padding-bottom: 10px;
    text-align: center;
}
.offerBox-title h1 {
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 1px;
    margin: 0;
}
.offerBox-title span {
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.5px;
}
.offerBox-title span b {
    color: rgb(var(--esa-colorArea-main));
}
.offerBox > a {
    background: rgb(var(--esa-colorArea-main));
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--esa-darkArea-main) !important;
    font-weight: 700;
    font-size: 14px;
    padding: 10px 0px;
    border-radius: 5px;
    letter-spacing: 0.5px;
    width: 100%;
}
.promOffServices {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 30px;
    padding-left: 50px;
}
@media screen and (max-width: 1404px) { 
    .promOffServices {
        grid-gap: 20px;
        padding-left: 25px;
    }
}
@media screen and (max-width: 1200px) { 
    .promOffServices {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 767px) {  
    .promOffServices {
        padding-left: unset;
        padding-top: 25px;
    }
}
@media screen and (max-width: 700px) { 
    .promOffServices {
        grid-template-columns: repeat(1, 1fr);
    }
}