::-webkit-scrollbar {
    width: 2px;
}

::-webkit-scrollbar-thumb {
    border-right: 5px #e2e5ed solid;
    border-top: 10px solid #e2e5ed;
    border-left: 5px solid #e2e5ed;
    border-bottom: 10px solid #e2e5ed;
}

.listtable::-webkit-scrollbar,
.activesession::-webkit-scrollbar,
.services::-webkit-scrollbar {
    height: 5px;
    width: 0;
    border: none;
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 10;
    src: url(fonts/DanaFaNum-Hairline.89d0d72d.woff2) format("woff2"), url(fonts/DanaFaNum-Hairline.56f4017f.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 100;
    src: url(fonts/DanaFaNum-Thin.bd95ee52.woff2) format("woff2"), url(fonts/DanaFaNum-Thin.d2c8e63e.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 200;
    src: url(fonts/DanaFaNum-UltraLight.a233677d.woff2) format("woff2"), url(fonts/DanaFaNum-UltraLight.49816d8d.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 300;
    src: url(fonts/DanaFaNum-Light.4b56cf57.woff2) format("woff2"), url(fonts/DanaFaNum-Light.b4654343.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 500;
    src: url(fonts/DanaFaNum-Medium.f18adbeb.woff2) format("woff2"), url(fonts/DanaFaNum-Medium.c0e09d9d.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 600;
    src: url(fonts/DanaFaNum-DemiBold.b3dd3a3b.woff2) format("woff2"), url(fonts/DanaFaNum-DemiBold.c5778399.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 800;
    src: url(fonts/DanaFaNum-ExtraBold.b003f3e0.woff2) format("woff2"), url(fonts/DanaFaNum-DemiBold.c5778399.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 900;
    src: url(fonts/DanaFaNum-Black.cc6fbb11.woff2) format("woff2"), url(fonts/DanaFaNum-Black.20366cdf.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 930;
    src: url(fonts/DanaFaNum-ExtraBlack.49a4085e.woff2) format("woff2"), url(fonts/DanaFaNum-ExtraBlack.a14503ed.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 960;
    src: url(fonts/DanaFaNum-Heavy.6c0dd9d7.woff2) format("woff2"), url(fonts/DanaFaNum-Heavy.73469322.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 990;
    src: url(fonts/DanaFaNum-Fat.2c857c09.woff2) format("woff2"), url(fonts/DanaFaNum-Fat.bc9f7ab3.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 700;
    src: url(fonts/DanaFaNum-ExtraBold.b003f3e0.woff2) format("woff2"), url(fonts/DanaFaNum-ExtraBold.598f35b2.woff) format("woff")
}

@font-face {
    font-family: danaFaNum;
    font-style: normal;
    font-weight: 400;
    src: url(fonts/DanaFaNum-Regular.2ab3f22c.woff2) format("woff2"), url(fonts/DanaFaNum-Regular.26c4524d.woff) format("woff")
}

@font-face {
    font-family: dana;
    font-style: normal;
    font-weight: 10;
    src: url(fonts/DanaFaNum-Hairline.89d0d72d.woff2) format("woff2"), url(fonts/DanaFaNum-Hairline.56f4017f.woff) format("woff")
}

@font-face {
    font-family: 'yekan';
    src: url('fonts/DanaFaNum-Regular.2ab3f22c.woff2') format('woff2');
}

body {
    --light-blue: #F5F6F9;
    --blue: #586bff;
    --dark-blue: #23417d;
    --green: #0ac974;
    --white: #fff;
    --red: #ff4747;

    direction: rtl;
    background: var(--light-blue);
    font-family: 'danaFaNum';
    margin: 0;
    padding: 0;
    font-family: 'yekan';
    color: #212529;
    -webkit-text-size-adjust: 100%;
    overflow: overlay;
    user-select: none;
}

* {
    font-family: 'danaFaNum' !important;
    -webkit-tap-highlight-color: transparent;
    box-sizing: border-box;
    transition: all .2s ease;
}

a {
    text-decoration: none !important;
}

span {
    display: inline-block;
}

input,
button,
textarea,
select {
    outline: none;
    border: none;
    background-color: var(--light-blue);
    color: var(--dark-blue);
    padding: 0 10px;
}

h6,
h5,
h4,
h3,
h2,
h1,
p {
    margin: 0;
    font-weight: normal;
}

strong {
    font-weight: 900;
}

li,
ul {
    list-style: none;
}

.alert {
    border: none;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    position: relative;
    flex-direction: column;
    gap: 10px
}

.alert ul {

    padding-right: 0;
}

.alert-success {
    background: #e5f3eb;
    color: #006150;
}

.alert-danger {
    background: #ffe0e0;
    color: #8d3d3d;
}

.alert-warning {
    color: #804d3e;
    background-color: #fcf3e3;
}


.alert-warning .btn-default {
    color: #333 !important;
    background-color: #ebdeb9 !important;
    border-color: #adadad !important;
}

.backgroundMenu {
    z-index: -11;
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    background: rgb(0 22 105 / 29%);
    backdrop-filter: blur(20px);
    opacity: 0;
}

.showMenu .backgroundMenu {
    z-index: 11;
    opacity: 1;
}

.showMenu section .right {
    right: 20px;
    top: 20px;
}

header {
    background: var(--white);
    width: 100%;
    height: 80px;
    box-shadow: #64748b1f 0 1px 5px;
}

nav {
    max-width: 1200px;
    margin: auto;
    height: 100%;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 10px;
}

.responsivemenu {
    width: 100px;
    display: flex;
    align-items: center;
}

.nav-icon-1 {
    width: 30px;
    height: 30px;
    position: relative;
    transition: .1s;
    cursor: pointer;
    display: inline-block;
    z-index: 12;
    scale: .8;
}

.nav-icon-1 span {
    width: 5px;
    height: 5px;
    background-color: var(--dark-blue);
    display: block;
    border-radius: 50%;
    position: absolute;
}

.nav-icon-1:hover span {
    transform: scale(1.2);
    transition: 350ms cubic-bezier(.8, .5, .2, 1.4);
}

.nav-icon-1 span:nth-child(1) {
    left: 0;
    top: 0;
}

.nav-icon-1 span:nth-child(2) {
    left: 12px;
    top: 0;
}

.nav-icon-1 span:nth-child(3) {
    right: 0;
    top: 0;
}

.nav-icon-1 span:nth-child(4) {
    left: 0;
    top: 12px;
}

.nav-icon-1 span:nth-child(5) {
    position: absolute;
    left: 12px;
    top: 12px;
}

.nav-icon-1 span:nth-child(6) {
    right: 0;
    top: 12px;
}

.nav-icon-1 span:nth-child(7) {
    left: 0;
    bottom: 0;
}

.nav-icon-1 span:nth-child(8) {
    position: absolute;
    left: 12px;
    bottom: 0;
}

.nav-icon-1 span:nth-child(9) {
    right: 0;
    bottom: 0;
}

.nav-icon-1.open {
    transform: rotate(180deg);
    cursor: pointer;
    transition: .2s cubic-bezier(.8, .5, .2, 1.4);
}

.nav-icon-1.open span {
    border-radius: 50%;
    transition-delay: 200ms;
    transition: .5s cubic-bezier(.8, .5, .2, 1.4);
}

.nav-icon-1.open span:nth-child(2) {
    left: 6px;
    top: 6px;
}

.nav-icon-1.open span:nth-child(4) {
    left: 6px;
    top: 18px;
}

.nav-icon-1.open span:nth-child(6) {
    right: 6px;
    top: 6px;
}

.nav-icon-1.open span:nth-child(8) {
    left: 18px;
    bottom: 6px;
}

nav .logo {
    width: 40px;
}

nav h1 {
    font-weight: 700;
    color: var(--dark-blue);
    font-size: 20px;
}

.headerbrand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

footer {
    bottom: 0;
    width: 100%;
    text-align: center;
    padding: 20px;
    font-size: 15px;
    color: var(--dark-blue);
    font-weight: 200;
    margin-top: auto;
}

footer a {
    padding: 0 10px;
    color: var(--dark-blue);
    font-weight: 500;
}

section {
    display: flex;
    margin: auto;
    margin-top: 50px;
    max-width: 1200px;
    gap: 30px;
    padding-bottom: 50px;
}

section .right {
    background: var(--white);
    width: 400px;
    border-radius: 15px;
    padding: 30px;
    height: max-content;
    z-index: 12;
}

section .left {
    width: 100%;
    border-radius: 15px;
    display: flex;
    gap: 30px;
    flex-direction: column;
}

section .top {
    height: 150px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

section .top-right {
    border-radius: 15px;
    padding: 20px;
    background: linear-gradient(45deg, #5980cd, #2b4d91);
    position: relative;
    color: var(--white);
    overflow: hidden;
    height: 100%;
}

section .top-left {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

section .bottom {
    width: 100%;
    border-radius: 15px;
    background: var(--white);
    padding: 30px;
}

section .bottom h2 {
    font-weight: 700;
    font-size: 17px;
    color: var(--dark-blue);
    position: relative;
    margin-bottom: 50px;
}

section .bottom h2:before {
    position: absolute;
    content: '';
    width: 4px;
    height: 20px;
    background: var(--green);
    right: -30px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    top: 50%;
    transform: translate(0, -50%);
}

.wallet {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.wallet>i {
    position: absolute;
    left: 10px;
    font-size: 130px;
    opacity: .1;
    rotate: 150deg;
    top: -45px;
}

.wallet h3 {
    font-weight: 700;
    font-size: 17px;
    position: relative;
}

h3:before {
    position: absolute;
    content: '';
    width: 4px;
    height: 20px;
    background: var(--white);
    right: -20px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    top: 50%;
    transform: translate(0, -50%);
}

.wallet>div {
    display: flex;
    margin-top: auto;
}

.add-funds {
    display: flex;
    margin-right: auto;
    color: var(--white);
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.add-funds:hover {
    gap: 15px;
}

.add-funds i {
    font-size: 25px;
}

.wallet-amount {
    display: flex;
    align-items: center;
    color: #ffffffbf;
    gap: 10px;
}

.wallet-amount strong {
    color: var(--white);
    font-weight: 700;
    font-size: 20px;
}

.side-profile {
    display: flex;
    gap: 20px;
}

.profile-pic {
    width: 60px;
    height: 60px;
    border-radius: 15px;
    background: #eceef3;
}

/* 
  .profile-details {
    display: flex;
    flex-direction: column;
  } */

.telegrambot {
    display: flex;
    gap: 20px;
    color: #546991;
    align-items: center;
    font-size: 14px;
}

.telegrambot:before {
    content: '';
    position: absolute;
    z-index: -1;
    width: 250px;
    height: 80px;
    border: 2px solid #546991;
    border-radius: 13px;
    bottom: -15px;
    left: -15px;
}

.telegrambot strong {
    margin-right: auto;
    font-family: cursive !important;
    font-size: 16px;
    letter-spacing: 3px;
}

.telegrambot i {
    font-size: 25px;
    cursor: pointer;
}

.profile-details .name {
    font-weight: 700;
    font-size: 16px;
    color: var(--dark-blue);
    padding-top: 7px;
}

.profile-details .phone {
    font-weight: 400;
    font-size: 14px;
    color: #6d80a8;
    margin-top: 8px;
}

.invite {
    background: linear-gradient(45deg, transparent, #c1c6dd26);
    width: 100%;
    height: 50px;
    margin-top: 30px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    padding-right: 20px;
    gap: 20px;
    position: relative;
    overflow: hidden;
}

.invite i {
    font-size: 22px;
    color: var(--dark-blue);
}

.invite h3 {
    color: var(--dark-blue);
    font-weight: 500;
    padding-top: 3px;
    font-size: 15px;
}

.invite .iconoir-nav-arrow-left {
    font-size: 16px;
    background: #eceef59c;
    border-radius: 50%;
    margin-right: auto;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #23417da3;
}

.top-left>div {
    background: var(--white);
    border-radius: 15px;
    padding: 20px;
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.top-left>div>div {
    display: flex;
    align-items: center;
    gap: 10px;
}

.top-left a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    border-radius: 5px;
    background: var(--light-blue);
    color: var(--dark-blue);
    font-size: 14px;
    margin-top: auto;
    font-weight: 500;
    padding: 0 10px;
}

.top-left a:hover {
    background: #e8eaf1;
}

.top-left h4 {
    color: var(--dark-blue);
    font-weight: 700;
    position: relative;
    font-size: 15px;
}

.top-left h4:before {
    position: absolute;
    content: '';
    width: 4px;
    height: 20px;
    background: var(--green);
    right: -20px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    top: 50%;
    transform: translate(0, -50%);
}

.top-left h5 {
    background: var(--light-blue);
    height: 30px;
    width: 30px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--dark-blue);
    margin-right: auto;
    padding-top: 3px;
}

nav .left-nav {
    margin-right: auto;
    display: flex;
    gap: 40px;
    align-items: center;
    justify-content: center;
}

.left-nav .cart-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

nav .left-nav i {
    font-size: 22px;
    color: #23417dcf;
    justify-content: center;
    cursor: pointer;
}

nav .flag {
    width: 30px;
    border-radius: 50%;
    cursor: pointer;
}

.menu > ul {
    padding: 0;
    height: 400px;
    overflow-y: scroll;
}

.menu li {
    padding: 15px 0;
    position: relative;
    font-size: 13px;
}

.menu hr {
    border-top: 1px solid#23417d08;
    width: 90%;
}

.menu li h3 {
    padding-top: 5px;
    font-size: 15px;
}

.menu li a {
    display: flex;
    align-items: center;
    gap: 20px;
    color: var(--dark-blue);
    opacity: .8;
}

.menu li.active a {
    opacity: 1;
    gap: 20px;
}

.menu li.inside:hover a {
    color: var(--dark-blue);
    gap: 30px;
}

.menu li a i {
    font-size: 22px;
    opacity: .7;
}

.menu li.active h3 {
    color: var(--dark-blue);
    font-weight: 900;
}

.menu li.active i {
    color: #002267;
    opacity: 1;
}

.menu li:hover i {
    color: #002267;
    opacity: 1;
}

.menu li:hover a {
    opacity: 1;
}

.menu li.active:before {
    content: '';
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    left: 30px;
    background: var(--green);
    opacity: 0;
}

.domiandropdown{
    height: 0px;
    overflow: hidden;
    transition: all .3s ease;
}
.domiandropdown.clicked{
        height: 150px;
}
.right .settings {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
    margin-top: 30px;
}

.right .settings a {
    background-color: #eceff7;
    display: flex;
    border-radius: 8px;
    align-items: center;
    justify-content: center;
    height: 55px;
    cursor: pointer;
}

.right .settings a.logout {
    background-color: #ffecec;
}

.right .settings a.night {
    background-color: #d3d3ff59;
}

.right .settings a.setting {
    background-color: #a6ff9f59;
}

.right .settings i {
    font-size: 25px;
}

.service {
    height: 60px;
    border-radius: 10px;
    display: grid;
    grid-template-columns: 0fr 1fr 1fr 1fr 1fr;
    align-items: center;
    padding: 0 30px;
    gap: 50px;
}

.service .domain {
    font-size: 16px;
    color: var(--dark-blue);
    font-weight: 500;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.service .login-cpanel {
    font-size: 20px;
    color: #ff4900;
    font-style: italic;
    font-weight: bold;
    cursor: pointer;
    margin-right: auto;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: unset;
}

.service:nth-child(even) {
    background: var(--light-blue);
}

.service-bar {
    display: grid;
    grid-template-columns: 0fr 1fr 1fr 1fr 1fr;
    font-size: 13px;
    color: #345597bd;
    padding: 0 30px;
    gap: 50px;
    margin-bottom: 20px;
}

.service-bar span {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.service-bar span:last-child {
    margin-right: auto;
}

.iconoir-log-out {
    color: var(--red);
}

.iconoir-half-moon {
    color: #1d2b49;
}

.iconoir-settings {
    color: #2b9179;
}

.service>a {
    display: flex;
}

.service i {
    color: #23417d85;
    font-size: 17px;
}

.service i:hover {
    color: var(--dark-blue);
}

.service h5 {
    width: 100%;
    text-align: center;
    color: var(--dark-blue);
    font-size: 15px;
    letter-spacing: 2px;
}

.service-bar i {
    color: transparent;
}

.homeservice {
    max-height: 391px;
    overflow: scroll;
}

.services .status {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.service .status span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.service .status.green span {
    -webkit-animation: active 0.15s infinite;
}

.service .status.orange span {
    -webkit-animation: warning 0.15s infinite;
}

.service .status.red span {
    -webkit-animation: inactive 0.15s infinite;
}

/* profile */
.whiteboard {
    background: var(--white);
    width: 100%;
    border-radius: 15px;
    padding: 30px;
    position: relative;
}

.profilepic {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
    position: relative;
    margin-bottom: 20px;
    position: absolute;
    top: 20px;
    left: 20px;
}

.profilepic:hover a {
    opacity: 1;
}

.profilepic img {
    width: 100%;
    height: 100%;
    z-index: 1;
}

.profilepic a {
    width: 100%;
    height: 100%;
    background: #000c3553;
    z-index: 2;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 30px;
    opacity: 0;
}

fieldset {
    position: relative;
    padding: 0;
    margin: 0;
    border: none;
    overflow: visible;

}

fieldset input {
    width: 100%;
    padding-bottom: 10px;
    border-bottom: 1px solid #49558b1f;
    font-size: 16px;
    cursor: text;
    background: #fff;
    padding-top: 20px;

    &::-webkit-input-placeholder {
        transition: color 300ms ease;
    }

    &:not(:focus)::-webkit-input-placeholder {
        color: transparent;
    }
}

fieldset label {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translate(0, -50%);
    font-size: 15px;
    color: #607D8B;
    pointer-events: none;
}

fieldset input:focus~label,
fieldset input:valid~label {
    font-size: 13px;
    top: 0;
    padding: 0 15px;
    right: -10px;
}

.whiteboard.profile .profileedit {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 30px;
    margin-bottom: 30px;
    margin-top: 90px;
}

fieldset hr {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 2px;
    border: none;
    background: #607D8B;
    font-size: 1px;
    will-change: transform, visibility;
    transition: all 200ms ease-out;
    transform: scaleX(0);
    visibility: hidden;
    z-index: 10;
}

fieldset input:focus~hr {
    transform: scaleX(1);
    visibility: visible;
}

.verification {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin: 30px 0;
}

.verification div,
.verification form {
    width: 100%;
    height: 150px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-size: 30px;
    color: var(--dark-blue);
    flex-direction: column;
    gap: 10px;
}

.profileedit input[type="submit"]:hover {
    background: #10bd70;
}

.verification .upload {
    flex-direction: column;
    gap: 20px;
    position: relative;
}

.verification .upload .commingsoon {
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(0 40 189 / 11%);
    backdrop-filter: blur(7px);
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    border-radius: unset;
    z-index: 1;
    top: 0;
    color: var(--dark-blue);
    font-weight: 700;
    font-size: 25px;

}

.verification .upload:hover {
    border-color: #23417d40;
}

.verification form strong {
    padding: 10px;
}


.verification .status0 {
    border: 2px dashed #e9eaf1;
    color: #af8c25;
}

.verification .status1 {
    color: #197139;
    border: 2px dashed #e9eaf1;
}

.verification .status2 {
    color: #8d1919;
    border: 2px dashed #e9eaf1;
    cursor: pointer;
}

.verification .statusnone {
    border: 2px dashed #e9eaf1;
    cursor: pointer;
}


.verification .upload:hover .commingsoon {
    opacity: 1;
}

.verification img {
    width: 100%;
    filter: hue-rotate(358deg) grayscale(.3) contrast(0.7);
}

.verification h6 {
    font-size: 16px;
}

.ranking {
    width: 70px;
    position: absolute;
    left: 30px;
    top: 30px;
}

section .left h2 {
    font-weight: 700;
    font-size: 17px;
    color: var(--dark-blue);
    position: relative;
    margin-bottom: 30px;
}

section .left h2:before {
    position: absolute;
    content: '';
    width: 4px;
    height: 20px;
    background: var(--green);
    right: -30px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    top: 50%;
    transform: translate(0, -50%);
}

.marketing-optin {
    display: flex;
    text-align: right;
    direction: rtl;
    gap: 20px;
}

.marketing-optin p {
    color: #4a526f;
    display: flex;
    align-items: center;
}

.alert {

    margin-bottom: unset;
}

.form-control {
    height: 40px;
}

.form-control:focus {
    box-shadow: unset !important;
}

.profileedit input[type="submit"] {
    background: var(--green);
    height: 50px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    width: 100%;
    text-align: center;
    cursor: pointer;
    border: none;
    width: 80%;
    margin: auto;
}

.bootstrap-switch {
    line-height: 5px !important;
    border-color: #dce1f1 !important;
}

.profileedit button:hover {

    gap: 15px;
}

.profileedit button i {
    font-size: 25px;
}

.flag-container {
    display: none;
}

/* addfund */
.whiteboard.addfunds {
    background: var(--white);
    width: 100%;
    border-radius: 15px;
}

.addfund {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    width: 100%;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 20px;
    margin: 50px auto;
}

.addfund>div {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    font-size: 15px;
    font-size: 15px;
    color: var(--dark-blue);
}

.addfund>div:nth-child(2),
.addfund>div:nth-child(5) {
    border-left: 1px solid #e7e9ff;
    border-right: 1px solid #e7e9ff;
}

.addfund>div>div:last-child {
    font-weight: 700;
    font-family: var(--fontara-font), danaFaNum !important;
    display: flex;
    align-items: center;
    justify-content: center;
   
}
#tabOverview .addfund>div>div:last-child {
    padding-right: 12%; 
}
.service-details .copy-btn{
    background: transparent;
}

.addfund>div>div:first-child {
    opacity: .7;
}

.whiteboard.addfunds form {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin: 50px auto;
    max-width: 500px
}

.whiteboard.addfunds form>div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px
}

.whiteboard.addfunds form input {
    width: 100%;
    height: 50px;
    padding: 20px;
    border-radius: 7px;
    font-size: 18px;
}

.whiteboard.addfunds form select {
    width: 100%;
    height: 50px;
    padding: 0 20px;
    border-radius: 7px;
    font-size: 15px;
}

.whiteboard.addfunds form button {
    width: 100%;
    height: 50px;
    border-radius: 7px;
    background-color: var(--blue);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    gap: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.whiteboard.addfunds form label {
    padding: 10px;
    display: block;
    color: #6f75a3;
    font-size: 14px;
    font-weight: 400;
}

.whiteboard.addfunds form button i {
    font-size: 30px;
}

.whiteboard.addfunds h4.amount {
    text-align: center;
    color: #23417d94;
    margin: 10px;
}

.whiteboard.addfunds h4.amount strong {
    padding: 5px;
    font-size: 18px;
    color: var(--dark-blue);
}

/* affiliates */
.afiilate-stats {
    display: grid;
    gap: 30px;
    grid-template-columns: 1fr 1fr 1fr;
}

.afiilate-stats div {
    width: 100%;
    height: 145px;
    background: linear-gradient(45deg, #5980cd, #2b4d91);
    border-radius: 15px;
    padding: 20px;
    color: #fff;
    position: relative;
    display: flex;
    flex-direction: column;
}

.afiilate-stats h3 {
    position: relative;
    font-weight: 700;
}

.afiilate-stats div i {
    position: absolute;
    left: -30px;
    font-size: 100px;
    opacity: .2;
    transform: translate(0px, -50%);
    top: 50%;
}

.afiilate-stats div:hover i {
    left: 30px;
}

.afiilate-stats h4 {
    font-weight: 300;
    font-size: 20px;
    margin-top: auto;
    color: #ffffffbf;
}

.afiilate-stats h4 strong {
    font-size: 30px;
    padding: 10px;
    font-weight: 600;
    color: #fff;
}

.affiliates-link {
    position: relative;
    padding: 50px 0;
}

.affiliates-link h4 {
    width: max-content;
    margin: auto;
    border: 2px dashed #dfe1e9;
    padding: 0 30px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    z-index: 2;
    position: relative;
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--dark-blue);
    font-size: 18px;
    cursor: pointer;
    text-align: center;
}

.affiliates .text-muted {
    margin-top: 80px;
}

.affiliates .withdrawrequest.disabled {
    pointer-events: none;
    opacity: 0.3;
}

.affiliates-link h3 {
    -webkit-text-fill-color: transparent;
    background: linear-gradient(180deg, #9fa6bd38, #00000000);
    -webkit-background-clip: text;
    font-weight: 900;
    text-transform: uppercase;
    top: 15px;
    font-size: 50px;
    position: absolute;
    width: max-content;
    left: 50%;
    transform: translate(-50%, 0);
}

.kocholoobala h2 {
    margin-bottom: 0 !important;
}

.affiliates-link i {
    font-size: 40px;
    cursor: pointer;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translate(0px, -50%);
    top: 50%;
    color: var(--dark-blue);
    right: -70px;
    width: 50px;
    height: 50px;
    opacity: .7;
}

.affiliates-link i:hover {
    opacity: 1;
}

.affiliates-link h3::before {
    display: none;
}

.affiliates .withdrawrequest {
    position: absolute;
    left: 30px;
    top: 30px;
    background: #ebeef5;
    width: 200px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    border-radius: 7px;
    color: var(--dark-blue);
    font-size: 14px;
    font-weight: 500;
}

.affiliates .withdrawrequest i {
    font-size: 22px;
}

.affiliate {
    margin: 80px auto 50px auto;
}

/* sendticket */
input[type="file"]:focus,
input[type="file"]:active {
    outline: none;
}

.guest {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.registered {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 30px;
}

.sendticket label {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 14px;
    color: #7082a7;
}

.sendticket input,
.sendticket select {
    height: 50px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}

.sendticket textarea {
    resize: vertical;
    width: 100%;
    margin: 30px 0;
    border-radius: 5px;
    font-size: 15px;
    padding: 20px;
    border: 2px solid #e7dfff75;
    background: #fff;
}

.ticket-attachments-message {
    color: var(--green);
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 20px 0;
}

.ticket-attachments-message i {
    font-size: 30px;
    color: var(--green);
}

input#inputAttachments {
    padding: 0;
    background: transparent;
    font-family: calibri;
    width: 200px;
    padding: 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border: 2px dashed #bec5eb;
    text-align: center;
    cursor: pointer;
    color: var(--dark-blue);
    font-size: 0;
    height: 50px;
    position: relative;
}

input#inputAttachments:before {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    color: var(--dark-blue);
    content: 'پیوست فایل';
    font-family: 'danaFaNum';
    font-weight: 600;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

input#inputAttachments:after {
    content: '';
    position: absolute;
    width: 50px;
    height: 20px;
    top: 0;
    right: 0;
    background: #fff;
}

.footer-ticket {
    display: flex;
}

.footer-ticket button {
    margin-right: auto;
    width: 200px;
    border-radius: 5px;
    background: linear-gradient(45deg, #5980cd, #2b4d91);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
}

.footer-ticket button:hover {
    gap: 15px;
}

.footer-ticket button i {
    font-size: 26px;
}

/* confrom ticket */
.confrimticket {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

section .left .confrimticket>h2 {
    margin-bottom: 0;
}

.confrimticket h4 {
    text-align: center;
    color: #00c17a;
}

.confrimticket h4 a {
    font-weight: 800;
    color: #00774b;
    text-decoration: none;
    padding: 10px;
    letter-spacing: 5px;
}

.confrimticket p {
    text-align: center;
    color: var(--dark-blue);
    opacity: 0.6;
}

.confrimticket>a {
    width: 200px;
    margin: auto;
    display: flex;
    gap: 10px;
    color: var(--dark-blue);
    border: 2px dashed var(--blue);
    border-radius: 5px;
    height: 50px;
    align-items: center;
    justify-content: center;
    font-weight: 600;
}

.confrimticket a i {
    font-size: 20px;
}

/* cart */
.affiliates input[type="search"] {
    display: none !important;
}

#order-standard_cart .whiteboard {
    margin-top: 30px;
}

.pay-cart {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 10px;
    align-items: center;
    justify-content: center;
}

.viewcartt .order-summary .total-due-today #totalDueToday {
    margin-top: 0;
    position: unset;
}

#order-standard_cart .order-summary .recurring-charges {
    color: #fff !important;
}

#order-standard_cart .order-summary .subtotal {
    padding: 0 0 10px 0 !important;
}

#applyPromo form div {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

#inputPromotionCode {
    text-align: center;
    letter-spacing: 2px;
}

#inputPromotionCode::placeholder {
    font-size: 12px;
}

#applyPromo form div * {
    height: 50px;
}

#order-standard_cart .order-summary .total-due-today-padded {
    margin: 0 !important;
}

#order-standard_cart .order-summary .subtotal {
    border-bottom: 1px solid #3653a9;
}

.tab-content .promo {
    width: 100%;
}

.tab-content .prom button {
    height: 50px;
    border: none;
    background: var(--green);
    color: #fff;
    border-radius: 7px;
}

#order-standard_cart .order-summary .total-due-today-padded {
    display: flex;
    align-items: center;
    justify-content: center;
}

#order-standard_cart .order-summary .total-due-today .amt {
    font-size: 20px !important;
}

#order-standard_cart label .iradio_square-blue {
    position: absolute;
    right: 10px;
}

#order-standard_cart label {
    border: 2px dashed #d1d8eb;
    display: flex;
    padding: 0;
    margin: 0 !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    position: relative;
    border-radius: 5px;
    height: 50px;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #63708b !important;
    padding: 0;
    margin: 0;

    cursor: pointer;
}

#order-standard_cart label.active {
    border: 2px solid #246cc5;
    color: #174489 !important;
}

#order-standard_cart .domain-checker-result-headline {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    font-size: 18px !important;
    font-weight: 400;
    color: var(--dark-blue);
    opacity: .7;
    margin-bottom: 0px !important;
}

.spotlight-tld .invalid,
.spotlight-tld .unavailable {
    margin-bottom: 0 !important;
}

.domain-lookup-other-loader {
    font-size: 16px;
    padding-top: 5px;
}

.domain-input-group {

    margin: 0;
}

.shopp .btnDomainContinue {
    display: none !important;
}

#order-standard_cart {
    padding: 0 !important;
}

#order-standard_cart .field,
#order-standard_cart .form-control {
    border-radius: 5px;
    height: 50px;
    letter-spacing: 1px;
    color: #21224b;
    font-weight: 600;
    font-size: 16px;
}

#order-standard_cart .field,
#order-standard_cart .form-control {
    letter-spacing: 1px;
    color: #21224b !important;
    font-weight: 600;
    font-size: 16px;
}

.domainfield {
    display: grid;
    grid-template-columns: 3fr 1fr;
    gap: 20px;
}

.domainfield button[type="submit"] {
    border: none;
}

#order-standard_cart .domain-input-group {
    margin: 0;
}

.domain-selection-options {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
    margin: 30px 0;
}

.forblur #owndomaintld,
.forblur #owndomainsld,
.forblur .input-group {
    filter: blur(4px);
    cursor: no-drop;
}

.forblur .tooltip {
    opacity: 0;
}

.forblur input[type="text"] {
    pointer-events: none;
}

.fourcycle {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 20px;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.fourcycle>label {
    height: 100px !important;
    background: transparent !important;
    border: 2px dashed #002e951f !important;
    width: 100% !important;
    padding: 10px !important;
}

.domain-input-group:before {
    display: none;
}

.domainInputGroup {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 20px;
}

.domain-input-group.clearfix {
    height: unset;
    margin-top: 30px !important;
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
}

#order-standard_cart .secondary-cart-sidebar {
    float: unset !important;
    width: 100% !important;
    min-height: unset !important;
    padding-right: unset !important;
    padding-left: unset !important;
}

.cart-sidebar {
    display: none;
}

#order-standard_cart .summary-container {
    background-color: transparent !important;
    border-radius: unset !important;
    padding: unset !important;
}

#order-standard_cart .cart-body {
    width: 100% !important;
    float: unset !important;
    padding: unset !important;
}

#order-standard_cart .secondary-cart-body {
    width: 100% !important;
    float: unset !important;
    padding: unset !important;
}

#order-standard_cart .order-summary {
    background-color: transparent !important;
    border-bottom: unset !important;
    border-radius: 0 !important;
    margin: 0 !important;
}

#order-standard_cart .top {
    height: unset;
}

#order-standard_cart .top-left {
    grid-template-columns: 1fr;
}

.top-left>div>div .tab-content {
    height: 100%;
}

/* invoice */
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: unset !important;
}

.viewcartt .top {
    grid-template-columns: 2fr 1fr;
}

.activesession {
    display: flex;
    gap: 30px;
    align-items: center;
    color: var(--dark-blue);
    justify-content: right;
    opacity: .9;
    height: 60px;
    background: #f1f4ff;
    border-radius: 3px;
    border: 3px solid #bfcce326;
    padding: 10px 20px;
    font-size: 13px;
    padding-top: 0 15px;
    font-weight: 600;
}

.activesession a {
    margin-right: auto;
    color: red;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -5px;

}

.activesession span {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

.activesession span i {
    padding-bottom: 5px;
    opacity: .3;
}

#order-standard_cart .view-cart-promotion-code {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 3px;
    font-size: 17px;
    font-weight: 600;
    color: #2b895f;
    padding: 0 !important;
    padding-top: 5px !important;
    border: 2px dashed #d5e1dc !important;
}

#order-standard_cart.viewcartt .whiteboard {
    margin-top: 0;
}

.viewcartt .summary-container>div span:last-child {
    float: left;
    font-size: 14px !important;
    font-weight: 600;
}

.viewcartt .summary-container>div span:first-child {
    font-size: 14px !important;
    font-weight: 300;
    opacity: .8;
}

button.close {
    width: 50px;
    height: 50px;
    font-size: 10px;
    color: #ff5757;
    opacity: 1;
    position: absolute;
    top: 10px;
    right: 10px;
}

span#recurring>span {
    display: flex;
    gap: 10px;
    justify-content: left;
    text-align: left;
}

.SingleSignOn p {
    color: var(--dark-blue);
    opacity: 0.7;
    font-weight: 500;
    margin-right: 0;
    font-size: 14px;
}

#frmSingleSignOn {
    margin-top: 30px;
}

#ssoStatusTextEnabled {
    color: #176341;
    opacity: 0.8;
    font-weight: 600;
    margin-right: 20px;
}

#ssoStatusTextDisabled {
    color: #631717;
    opacity: 0.8;
    font-weight: 600;
    margin-right: 20px;
}

span#recurring>span>span:first-child {
    width: max-content;
}

.viewcartt .summary-container {
    display: flex;
    flex-direction: column;
    gap: 15px;
}


.viewcartt .order-summary .subtotal {
    padding: 0 !important;
    border-bottom: 0 !important;
}

.btn .caret {
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translate(0px, -50%);
}

.domainproide button {
    font-size: 15px;
    font-weight: 400;
    color: var(--dark-blue);
    padding: 3px 10px;
    padding-top: 6px;
    min-width: 100px;
    position: relative;
}

.domainproide ul {
    box-shadow: 0 6px 12px rgb(0 0 113 / 12%);
    border: 1px solid rgb(0 29 95 / 14%);
}

.domainproide li {
    padding: 5px 0;
}

.domainproide li a {
    color: var(--dark-blue);
    opacity: .8;
}

#totalDueToday {
    flex-direction: row;
    gap: 20%;
    margin-top: 30px;
    font-size: 15px;
}

*[class^='iconoir-'],
*[class*=' iconoir-'] {
    font-size: 22px;
}

.inputEppcode {
    border: 1px solid #e0e5ff !important;
    text-align: center;
    letter-spacing: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    padding: 10px;
    min-width: 300px;
    color: var(--dark-blue);
    font-weight: 700;
    font-size: 18px;
    padding-top: 15px;
    border-radius: 5px;
    direction: ltr;
    width: 300px;
}

.regperiod {
    display: flex;
    gap: 20px;
    color: #75778b;
}

.irnic {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-top: 20px;
    position: relative;
}

.irnic a {
    font-weight: 500;
    padding: 0 10px;
    font-size: 15px;
    font-family: sans-serif !important;
}

#order-standard_cart .irnic input.form-control {
    border: 1px solid #e0e5ff !important;
    text-align: center;
    letter-spacing: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    padding: 10px;
    min-width: 300px;
    color: var(--dark-blue) !important;
    font-weight: 700;
    font-size: 18px;
    padding-top: 15px;
    border-radius: 5px;
    width: 300px;
    background: var(--light-blue);
}

.buynow {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    border: 2px dashed var(--dark-blue);
    border-radius: 5px;
    width: 250px;
    color: var(--dark-blue);
    font-weight: 500;
    font-size: 15px;
    gap: 20px;
    margin: auto;
    margin-top: 30px;
}

.regperiod span {
    text-align: right;
    color: var(--dark-blue);
    font-size: 15px;
}

#order-standard_cart .sub-heading span.domainnamee {
    font-size: 18px;
    font-weight: 600;
    color: var(--dark-blue);
    letter-spacing: 2px;
}

.inputEppcode::placeholder {
    letter-spacing: 0;
    text-align: left;
    font-size: 15px;
    font-weight: 400;
}

.eppicon {
    font-size: 30px;
    position: absolute;
    right: 15px;
    top: 10px;
    opacity: .5;
    color: #5f70b1;
}

.eppcode {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-top: 20px;
    position: relative;
}

#order-standard_cart .field-help-text {
    color: #9197bb !important;
}

.myNewUserSignup {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 30px;
}

.myNewUserSignup>div {

    position: relative;
}

#btnCompleteOrder i {
    font-size: 23px;
}

.myNewUserSignup #inputEmail {

    text-align: left;
    direction: ltr;
}

.myNewUserSignup>div i {
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    right: 20px;
    font-size: 25px;
    color: var(--dark-blue);
    opacity: .7;
    z-index: 1;
}

.myNewUserSignup>div input {
    height: 50px;
    display: flex;
    padding-left: 20px;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding-right: 60px;
    font-weight: 500;
    border-radius: 5px;
}

.myNewUserSignup>div input::placeholder {
    color: #869bc1;
    font-size: 15px;
    font-weight: 400;
}

.myNewUserSignup>div input:active,
.myNewUserSignup>div input:focus {

    border: 2px solid var(--blue);
}

#order-standard_cart .checkbox-inline {
    width: 100%;
    text-align: right;
    margin-top: 30px !important;
}

#order-standard_cart .checkbox-inline a {
    padding: 0 10px;
    font-weight: 700;
    color: var(--dark-blue);
}

#order-standard_cart .apply-credit-container span {

    font-weight: unset !important;
}

#order-standard_cart .account-select-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: none !important;
    gap: 20px;
}

#order-standard_cart .account-select-container div.account {
    background: unset !important;
    border: unset !important;
    padding: 0 !important;
}

#applyCreditContainer>p>span {
    font-size: 20px;
    padding: 0 10px;
    color: var(--dark-blue);
}

#applyCreditContainer>p {
    text-align: center;
    color: var(--dark-blue);
    font-weight: 800;
    opacity: .7;
}

#order-standard_cart .apply-credit-container {
    border-radius: 10px !important;
    padding: 0 !important;
    margin: 0 !important;
    margin-top: 30px !important;
    background: transparent !important;
}

#alertOverdueInvoice .pull-right,
#alertUnpaidInvoice .pull-right {
    left: 10px;
}

.orderconfirmation span {
    font-weight: 800;
    color: #006d50;
    text-decoration: none;
    padding: 0 20px;
    letter-spacing: 5px;
    font-size: 20px;

}

.cantiniu {
    width: 200px;
    margin: auto;
    display: flex;
    gap: 10px;
    color: var(--dark-blue);
    border: 2px dashed var(--blue);
    border-radius: 5px;
    height: 50px;
    align-items: center;
    justify-content: center;
    font-weight: 600;
}

.creditoptions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.credit-invoice {
    display: grid;
    grid-template-columns: 1fr 2fr 2fr;
    gap: 30px;
    text-align: center;
}

.credit-invoice strong {
    display: flex;
    align-items: center;
    font-weight: 500;
    color: var(--blue);
    justify-content: center;
    font-size: 15px;
}

.credit-invoice input {
    text-align: center
}

.verifEmail #btnEmailVerificationClose i {
    font-size: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--red);
}

.verifEmail {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
}

.verifEmail #btnEmailVerificationClose {
    color: #6c7993;
    width: 100px;
}

#btnResendVerificationEmail i {
    font-size: 17px;
}

.verifEmail p {
    width: 100%;
}

.twofa-setup button.close {
    right: unset;
    left: 20px;
    top: 20px;
}

.twofa-setup .modal-body>p {
    color: var(--dark-blue);
    opacity: .8;
    font-size: 15px;
    text-align: justify;
}

.twofa-setup form>p {
    color: var(--dark-blue);
    opacity: .8;
}

.twofa-setup .twofa-module {
    display: none;
}

.twofa-setup .modal-footer {
    display: none;
}

.twofa-setup form p input[type="button"] {
    ont-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 5px solid #567dc9;
    color: #fff;
    background: linear-gradient(45deg, #5980cd, #2b4d91);
    width: 100%;
    height: 60px;
    border-radius: 3px;
    font-size: 17px;
    padding-right: 40px;
    margin-top: 10px;
}

.resendEmailVerif {
    width: 100%;
    background: #8ce9ba;
    height: 50px;
    border: 2px solid #45c78b;
    border-radius: 5px;
    color: #22513a;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.popover-user-notifications ul li i.far,
.popover-user-notifications ul li i.fas {
    float: right;
}

nav .cart-btn {
    position: relative;
}

.popover-user-notifications ul li a:hover {
    color: #515e91 !important;
    background-color: #f4f5fb;
}

.popover-user-notifications ul li:first-child a {
    margin-top: 0;
}

.popover-user-notifications ul li a {

    margin: 10px 0;
    border-radius: 5px;
}

nav .badge {
    position: absolute;
    font-size: 22px;
    left: 50%;
    top: -12px;
    font-weight: 400;
    display: flex;
    background: #228569b8;
    color: #fff;
    width: 20px;
    top: -10px !important;
    height: 20px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    right: 6px;
    transform: translate(-50%, 0);
    position: absolute !important;
}

.popover.bottom>.arrow {
    display: none;
}

.popover-user-notifications ul li {
    padding: 0;
    border-bottom: 1px solid #e8ecfb !important;
}

.iconoir-send-dollars {
    font-size: 25px;
}

#accountNotifications {
    padding: 0;
    background: transparent;
    overflow: visible;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

#applyPromo {
    margin-top: 20px !important;
}

#applyPromo a.removepromo {
    height: 50px;
    margin-top: 20px;
    background: #ff00000d;
    color: #611616;
    border: 1px solid #6116161f;
}

#promoheight {

    height: fit-content;
}

#order-standard_cart .btn-checkout {
    width: 100%;
    background: #ffffff24;
    border: 2px solid #ffffff4d;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 50px;
    flex-direction: row-reverse;
    font-size: 15px;
}

#order-standard_cart .btn-checkout:hover {
    gap: 15px;
}

.viewcartt .item small {
    padding: 5px;
    margin: 5px;
    font-size: 11px;
    font-weight: 500;
    color: #333;
    background: #f1f2f7;
    border-radius: 3px;
    display: inline-block;
}

.viewcartt .itemtitle {
    color: var(--dark-blue);
    position: relative;
    font-weight: 600;
    font-size: 15px;
}

.viewcartt .iteminfo {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.viewcartt .item {
    display: grid;
    grid-template-columns: 3fr 1fr;
    gap: 30px;
    position: relative;
    padding: 20px 0 !important;
    border-bottom: 1px solid #d1d7ed82;

}

.viewcartt .item:first-child {
    padding-top: 0 !important;
}

.viewcartt .item:last-child {
    padding-bottom: 0 !important;
    border-bottom: none;
}

.viewcartt .itemtitle a {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    font-size: 20px;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #0e9d5c;
    left: 40px;
    padding: 0;
    margin: 0;
}

.viewcartt .itemtitle button {
    width: 20px;
    height: 20px;
    position: absolute;
    left: 10px;
    top: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: red;
    font-size: 25px;
    padding: 0;
    margin: 0;
}

.viewcartt .itemdomain {
    color: #348485;
    font-weight: 600;
    font-size: 15px;
    letter-spacing: 1px;
}

.viewcartt .itemprice {
    display: flex;
    flex-direction: column;
    gap: 5px;
    font-size: 16px;
    font-weight: 700;
    color: var(--dark-blue);
    position: relative
}

.viewcartt .cycle {
    font-weight: 400;
}

.viewcartt .itemprice:before {
    content: '';
    width: 1px;
    position: absolute;
    background: #d1d7ed82;
    right: -20px;
    top: 0;
    height: 50px;
}

.viewcartt .view-cart-items .item:nth-child(even) {
    background-color: #fff !important;
}

.viewcartt .view-cart-items {
    margin: 0 !important;
    border-bottom: none !important;
}

#accountNotifications .popover-user-notifications ul li:first-child a {
    margin-top: 0;
}

#order-standard_cart .field,
#order-standard_cart .form-control {
    border: 1px solid #e0e5ff !important;
}

#applyPromo button {
    border: 1px solid #e0e5ff;
    border-radius: 5px;
}

#applyPromo button:hover {
    border: 1px solid #8790c3;
    border-radius: 5px;
}

#accountNotifications:active,
#accountNotifications:focus,
#accountNotifications:active.focus {
    outline: unset !important;
    box-shadow: none !important;
}

.left-nav .mr-auto {
    padding: 0;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    flex-direction: row-reverse;
    position: relative;
}

.left-nav>a,
.left-nav>div {
    display: flex;
    align-items: center;
    justify-content: left;
}

.left-nav img {
    width: 25px;
}

.popover-user-notifications ul li:last-child a {

    margin-bottom: 0;
}

.popover-user-notifications ul li:last-child {
    border: none !important;
}

.popover.bottom {
    margin-top: 35px;
    box-shadow: none;
    border-radius: 10px;
    border-color: #d5ddf3;
    padding: 10px;
}

.client-alerts a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.popover-user-notifications ul li .message {
    margin: 0 !important
}

.info-circle-blue {
    color: blue;
    font-size: 20px;
}

.info-circle-green {
    color: green;
    font-size: 20px;
}

.info-circle-red {
    color: red;
    font-size: 20px;
}

.info-circle-orange {
    color: orange;
    font-size: 20px;
}

.domainDetails {
    margin: 80px auto 50px auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 20px;
}

.domainDetails>div {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    font-size: 15px;
    font-size: 15px;
    color: var(--dark-blue);
}

.pull-right {
    position: absolute;
}

.pull-right a:first-child {
    padding: 7px 11px;
    border: 2px solid black;
    background: transparent;
    font-weight: 600;
    font-size: 14px;
}

.alert-danger a.btn:first-child {
    border: 2px solid #690000;
    color: #690000;
}

.ticketID {

    font-size: 15px;
    font-weight: 600;
}

.dataTables_wrapper .dataTables_length {
    background: transparent;
}

div.dataTables_wrapper div.dataTables_info {
    display: none
}

.pagination>.active>a {
    background: transparent;
    color: #444b7b;
    border: none;
}

#tableInvoicesList_info {
    display: none;
}

table.table-list thead th {
    opacity: 1;
    color: #979cb5;
}

.dataTables_wrapper table.table-list thead th.sorting_asc,
.dataTables_wrapper table.table-list thead th.sorting_desc {
    font-weight: 700;
    background: transparent;
    color: #4b5793;
    opacity: 1;
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after {
    top: 35px !important;
    right: 10px !important;
}

#tableDomainsList img {
    width: 30px;
}

.dataTables_wrapper table.table-list thead th {
    border-bottom: 1px solid #d2d2f5;
}

.dataTables_wrapper table.table-list thead th:nth-child(even) {
    border-bottom: 1px solid #d2d2f5;
}

div.dataTables_wrapper div.dataTables_length label {
    float: left;
}

.status {
    border: unset;
    background: unset;
    font-weight: 500;
}

.dataTables_wrapper .dataTables_filter label .form-control {
    width: 200px;
    height: 50px;
    padding: 0 20px;
    position: absolute;
    left: 30px;
    top: 30px;
    border-radius: 5px;
    background: #fff;
    border: 2px dashed #23417d24;
}

.generate-password {
    width: 100%;
    background: #d5e8e9;
    border: 1px solid #c7d8d9;
    height: 40px;
    color: #34474b;
}

.pagination>.disabled>a,
.pagination>.disabled>a:focus,
.pagination>.disabled>a:hover,
.pagination>.disabled>span,
.pagination>.disabled>span:focus,
.pagination>.disabled>span:hover {
    background: unset;
    border: unset;
}

.table-container {
    padding: 0;
}

@media (min-width: 768px) {
    .form-horizontal .control-label {
        padding-top: 12px;
    }
}

.using-password-strength label {
    font-weight: 500;
}

/* viewticket */
.viewticket textarea {
    resize: vertical;
    width: 100%;
    border-radius: 5px;
    font-size: 15px;
    padding: 20px;
    border: 2px solid #e7dfff75;
    background: #fff;
}

textarea::placeholder {
    color: #afaed3;
}

.viewticket .footer-ticket {
    flex-direction: column;
    height: 160px;
}

.viewticket .footer-ticket button {
    height: 50px;
    margin-top: auto;
}

.viewticket input#inputAttachments {
    margin-top: auto;
}

.viewticket .answer {
    display: flex;
    gap: 30px;
}

.viewticket .closeing {
    margin-right: auto;
    height: 50px;
    background: #ff6c6c;
    border-radius: 5px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    width: 50px;
    width: 200px;
    font-size: 15px;
    gap: 10px;
}

.sender-details {
    display: flex;
    width: max-content;
    gap: 20px;
}

.sender-details>div {
    display: flex;
    flex-direction: column;
}

.sender-details h4 {
    color: var(--dark-blue);
    font-weight: 600;
    font-size: 15px;
}

.sender-details img {
    width: 50px;
    height: 50px;
    border-radius: 10px;
}

.sender-details h6 {
    color: var(--dark-blue);
    opacity: .8;
    margin-top: auto;
    font-size: 13px;
}

.messages>div {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.message .attachments {
    color: #fff;
    margin-top: 20px;
}

.message .attachments ul {

    padding: 0;
    margin: 0;
}

.message .attachments ul li a {
    color: #1a20737a;
}

.messages .message {
    width: 500px;
    background: linear-gradient(45deg, #5980cd00, #70a0ff33);
    padding: 20px;
    line-height: 27px;
    color: var(--dark-blue);
    text-align: right;
    border-radius: 10px;
    font-size: 15px;
    overflow-wrap: break-word;

}

.messages .message p {
    font-weight: 400;
    direction: rtl;
}

.messages {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.admin {
    direction: ltr;
}

.user .message {
    background: linear-gradient(45deg, #59cdc200, #3fbfa745);
    color: #1a3127;
}

/* services */
table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 60px;
}

.services input[type="search"] {
    width: 200px;
    height: 50px;
    padding: 0 20px;
    position: absolute;
    left: 30px;
    top: 30px;
    border-radius: 5px;
    background: #fff;
    border: 2px dashed #23417d24;
    box-shadow: none;
}

th {
    font-size: 14px;
    color: var(--dark-blue);
    opacity: .5;
    font-weight: 400;
    height: 50px;
    text-align: center;
    width: 25%;
    padding-bottom: 20px;
}

td {
    text-align: center;
    color: var(--dark-blue);
    font-size: 15px;
    position: relative;
}

.services .service-name {
    font-weight: 600;
    font-size: 17px;
}

.services .service-time {
    letter-spacing: 2px;
}

.services .service-status {
    font-size: 30px;
    padding-top: 16px;
    width: 15%;
    font-size: 25px;
}

.services .service-status i {
    left: 50%;
    top: 50%;
    margin: auto;
    position: absolute;
    transform: translate(-50%, -50%);
}

.iconoir-info-empty {
    color: #ffca00;
}

.iconoir-delete-circle {
    color: #ff5454;
}

.iconoir-check-circle {
    color: #00b57c;
}

.services th:last-child {
    width: 20%;
}

.services tbody tr {
    padding: 0 30px;
    height: 65px;
}

.services tbody tr:nth-child(odd) {
    background: var(--light-blue);
}

/* .listtable {
    margin: 60px 0 30px 0;
  } */

.pagination {
    display: flex;
    gap: 20px;
    padding-right: 0;
}

.pagination li a {
    color: var(--dark-blue);
    opacity: .4;
    font-size: 15px;
    border: none;
}

.pagination li a i {
    font-size: 20px;
}

.pagination li.active a {
    opacity: 1;
    font-weight: 600;
    font-weight: 500;
}

.pagination li:hover a {
    opacity: 1;
}

.service-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
}

div.dataTables_wrapper div.dataTables_filter {

    height: 0;
}

.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
    background-color: unset;
    border-color: unset;
    color: #000b5f;
}

.product-pricing {
    float: right;
    color: #8c9bb7;
    font-size: 15px;
    font-weight: 400;
    width: 100%;
    margin-bottom: 30px;
    margin-top: 20px;
}

.sidebar-collapsed {
    display: none;
}

.shopp #products {
    margin: 0 !important;
}

.shopp .whiteboard {
    margin-top: 0 !important;
    position: relative;
    overflow: hidden;
}

.shopp #product1:before {
    content: '';
    position: absolute;
    background: url(../img/iran.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 150px;
    height: 100px;
    left: -8px;
    top: -8px;
    opacity: .2;
}

.shopp #product3:before {
    content: '';
    position: absolute;
    background: url(../img/germany.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 150px;
    height: 100px;
    left: -10px;
    top: -10px;
    opacity: .5;
}

.chooseProduct {
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #d5d7e1;
    color: #fff;
    background-color: #678ce3;
    border-color: #678ce3;
    width: 100%;
    height: 50px;
    border-radius: 5px;
    font-size: 15px;
}

.chooseProduct:hover {
    gap: 20px;
}

.colmd6 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.product-pricing .price {
    font-weight: 900;
    font-size: 25px;
    text-align: center;
    display: block;
    color: #385a9f;
}

.shopp .iconoir-shopping-bag-plus {
    font-size: 23px;
    padding-bottom: 6px;
}

.product-pricing .pricepriode {

    float: left;
}

.table-list>tbody>tr>td a.border-left {
    border-left: unset !important;
}

.service-footer #tableServicesList_length {
    margin-right: auto;
}

#tableServicesList strong {
    font-weight: 700;
}

.table-list>tbody>tr:nth-child(even)>td {
    background-color: #f8f9fdab;
}

.service-footer #tableServicesList_length label {
    color: #23417d8c;
    font-weight: 400;
}

.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {

    border-top: 1px solid #eff0fd;
}

.dataTables_wrapper .dataTables_length label .form-control {
    padding: 0;
    border: none;
    box-shadow: none;
    margin: 0 10px;
}

.service-footer select {
    background: #fff;
    opacity: 1;
    color: var(--dark-blue);
    font-weight: 600;
    margin: 0 20px;
}

.service-footer #tableServicesList_length span {
    margin: 0 10px;
    color: var(--dark-blue);
    font-weight: 600;
}

/* product detail */
.service-info {
    padding: 20px;
    background: linear-gradient(45deg, #5980cd, #2b4d91);
}

.invoice-col {
    position: unset;
}

.dotted-animation {
    top: 5px;
    right: -5px;
    position: absolute;
}

.dotted-animation .animate-circle {
    position: absolute;
    top: -20px;
    right: -4px;
    height: 25px;
    width: 25px;
    z-index: 10;
    border: 5px solid #4466f2;
    border-radius: 70px;
    -webkit-animation: 1s ease-out infinite heartbit;
    animation: 1s ease-out infinite heartbit;
}

.dotted-animation .main-circle {
    width: 6px;
    height: 6px;
    border-radius: 30px;
    background-color: #4466f2;
    position: absolute;
    right: 6px;
    top: -10px;
}

@-webkit-keyframes heartbit {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 0
    }

    25% {
        -webkit-transform: scale(.1);
        transform: scale(.1);
        opacity: .1
    }

    50% {
        -webkit-transform: scale(.5);
        transform: scale(.5);
        opacity: .3
    }

    75% {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        opacity: .5
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
}

@keyframes heartbit {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 0
    }

    25% {
        -webkit-transform: scale(.1);
        transform: scale(.1);
        opacity: .1
    }

    50% {
        -webkit-transform: scale(.5);
        transform: scale(.5);
        opacity: .3
    }

    75% {
        -webkit-transform: scale(.8);
        transform: scale(.8);
        opacity: .5
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
}

.invoice-container {
    margin: 0;
    padding: 0;
    border: none;
}

.paid {
    background: #00cf2c14;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    padding: 15px 30px;
    color: #30976d;
}

.invoicee {
    border: none;
    margin: 0;
    box-shadow: none;
}

.invoicee .table-condensed>tbody>tr>td,
.invoicee .table-condensed>tbody>tr>th,
.invoicee .table-condensed>tfoot>tr>td,
.invoicee .table-condensed>tfoot>tr>th,
.invoicee .table-condensed>thead>tr>td,
.invoicee .table-condensed>thead>tr>th {
    padding: 15px;
    border: none;
}

#inputNewPassword1,
#inputNewPassword2 {
    letter-spacing: 0;
}

#paymentGatewaysContainer {
    margin-top: 30px;
}

#paymentGatewaysContainer .iradio_square-blue {
    margin-left: 20px;
}

#frmCheckout .progress {
    height: 4px;
    position: absolute;
    bottom: 3px;
    margin: 0;
    left: 50%;
    transform: translate(-50%, 0);
    width: 97%;
}

input[type="email"]::placeholder,
input[type="tel"]::placeholder {
    text-align: right;
    direction: rtl;
}

#frmCheckout .generate-password {
    width: 50px;
    height: 50px;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    position: absolute;
    left: 0;
    top: -3px;
    padding: 0;
    margin: 0;
}

#frmCheckout .generate-password i {
    position: unset;
    transform: unset;
}

#btnCompleteOrder {
    width: 220px;
    margin: auto;
    display: flex;
    gap: 10px;
    color: var(--dark-blue);
    border: 2px dashed var(--blue);
    border-radius: 5px;
    height: 50px;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    position: absolute;
    bottom: 30px;
    left: 30px;
}

#btnCompleteOrder:hover {
    gap: 15px;
}

.invoice-container .payment-btn-container {
    margin-top: 25px;
}

.invoice4box {
    display: grid;
    grid-template-columns: 1fr 1fr;
    color: #405179;
    gap: 30px;
}

.myMasspy strong {
    font-weight: 600;
}

.myMasspy table {
    margin: 0;
}

.masspay-total td {
    border-top: none !important;
}

.myMasspy td {
    padding: 15px !important;
    border: none;
}

.myMasspy .bg-info {
    background-color: #f7f9ff;
}

.masspayMethod {
    display: grid;
    gap: 30px;
    height: 50px;
    grid-template-columns: 1fr 1fr;
}

.myMasspy th {
    border: none !important;
}

tr.masspay-invoice-detail td {
    font-size: 12px !important;
}

tr.masspay-total td {
    background-color: transparent !important;
}

.invoicedet form {
    margin: 0;
}

.invoicedet {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    font-size: 14px;
    text-align: center;
}

.invoicedet div:nth-child(odd) i {
    font-size: 25px;
}

.invoicedet>div {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.invoicedet div:nth-child(even) {
    font-weight: 600;
}

.invoicedet div:nth-child(odd) {
    font-weight: 400;
}

.invoice4box strong {
    width: 100%;
    display: block;
    text-align: center;
    font-weight: 400;
    color: #8697bf;
    font-size: 15px;
}

#bandwidthUsage,
#diskUsage {
    color: var(--dark-blue);
    opacity: .8;
}

.cptools {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    gap: 30px;
}

.cptools a {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px dashed var(--dark-blue);
    border-radius: 5px;
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-blue);
    background: #eaecf3;
    position: relative;
    overflow: hidden;
}

.cptools a:hover {
    background: #dce0ef;
}

.cptools i {
    position: absolute;
    opacity: .5;
    font-size: 25px;
    right: 15px;
}

.cptools a:hover i {
    opacity: .1;
    font-size: 100px;
    right: 0;
}

.cptools a.active {
    background: #dce0ef;
}

.cptools a.active i {
    opacity: .1;
    font-size: 100px;
    right: 0;
}

.cpanel-usage-stats .limit-near {
    position: absolute;
    left: 30px;
    top: 10px;
    color: var(--dark-blue);
    opacity: .6;
}

.form-stacked label {
    position: unset;
    font-weight: 500;
    color: var(--dark-blue);
    opacity: .8;
    padding: 10px 0;
}

.canclereq {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.canclereq>div {
    display: grid;
    grid-template-columns: 2fr 3fr
}

.cancleHost {
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    font-weight: 500;
    color: #fff;
    height: 45px;
    font-size: 14px;
    width: 100%;
    border: 2px solid #ff6262;
    background: transparent;
    margin-top: 20px;
}

.cancleHost:hover {
    background: #ff6262;
    color: #fff;
    border: 2px solid #ffffff8a;
}

.upgradeHost {
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    font-weight: 500;
    color: #fff;
    height: 45px;
    font-size: 14px;
    width: 100%;
    border: 2px solid #ffffff40;
    background: transparent;
    margin-top: 20px;
}

.upgradeHost:hover {
    background: #00000024;
    color: #fff;
    border: 2px solid #ffffff8a;
}

.cpanlModulebutton {
    background: #ffffff21;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    font-weight: 500;
    color: #fff;
    height: 45px;
    font-size: 14px;
    width: 100%;
    transition: all .2s ease;
}

.cpanlModulebutton:hover {
    background: #ffffff38;
}

.cpanlModulebutton span {
    font-style: italic;
    font-weight: 900;
    color: #ff8b54;
    font-size: 21px;
    padding-top: 3px;
}

.invoiceLogo {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    color: var(--blue);
    font-weight: 900;
    font-size: 20px;
}

.invoiceLogo h4 {
    font-weight: 800;
    font-size: 20px;
}

.DownloadvaPrint {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    width: 100%;
    gap: 30px;
    height: 50px;
}

.DownloadvaPrint i {
    font-size: 18px;
}

#frmPayment input[type="submit"] {
    width: 210px;
    height: 50px;
    border-radius: 5px;
    border: 2px dashed #2a59b7;
    color: #00339b;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #f5f7ff;
    font-weight: 600;
    float: left;
}

.paymentgif {
    max-width: 500px;
    width: 100%;
    margin: auto;
    display: block;
}

.paymentBtnInVoice form {
    margin: 0 !important;
}

.paymentBtnInVoice input {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    gap: 10px;
    color: #275548;
    width: 100%;
    height: 50px;
    border: 2px dashed #43bf82;
    background: #e8fff8;
}


.masspayMethod * {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f9ff;
    border: 1px solid #d5deff;
    font-weight: 600;
    gap: 10px;
    color: #334d8b;
    border-radius: 5px;
    width: 80%;
    margin: 0 auto;
}

.masspayMethod input:hover {
    border: 1px solid #334d8b;
    background-color: #e9f2ff;
}

.DownloadvaPrint a {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f9ff;
    border: 1px solid #d5deff;
    font-weight: 600;
    gap: 10px;
    color: #334d8b;
}

.btn-default:hover {
    color: #30426b !important;
    background-color: #e9f2ff !important;
    border-color: #9cafd3 !important;
}

.btn-default.active.focus,
.btn-default.active:focus,
.btn-default.active:hover,
.btn-default:active.focus,
.btn-default:active:focus,
.btn-default:active:hover,
.open>.dropdown-toggle.btn-default.focus,
.open>.dropdown-toggle.btn-default:focus,
.open>.dropdown-toggle.btn-default:hover,
.btn-default.focus,
.btn-default:focus {
    border: unset;
    outline: unset;
}

.invoice-container td.total-row {
    background-color: unset;
}

.invoicee tbody tr:nth-child(odd) {
    background-color: #f9fafd;
}

.invoicee>.panel-body {
    padding: 0;
}

.transactions-container .table-condensed {
    margin-top: 30px;
}

.transactions-container td {
    padding: 15px !important;
}

.invoicee .table-condensed {
    margin: 0;
}

.cancelled {
    color: #9ca1c7;
}

.draft {
    color: #9ca1c7;
}

.invoice-status {
    position: absolute;
    left: 23px;
    top: 20px;
    margin: 0 !important;
    font-weight: 600 !important;
}

.unpaid {
    color: #c72b2b;
    background: #ff000014;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    padding: 15px 30px;
}

.service-info h3 {
    font-weight: 700;
    color: #fff;
    font-size: 17px;
    position: relative;
}

.twofaBtn {
    margin: auto;
    width: 50%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    gap: 10px;
    max-width: 300px;
}

.twofaBtn i {
    font-size: 20px;
}

.service-usage {
    padding: 20px;
}

p.twofa-config-link {
    color: #4f5a83;
    text-align: center;
    font-weight: 400;
}

.paginate_button.next a,
.paginate_button.left a,
.paginate_button.previous a {
    font-family: cursive !important;
    margin-top: -3px;
}

.announcement-single .article-items {
    color: #34bbaa !important;
}

.newTicket i {
    font-size: 25px;
}

#tableTicketsList tr {

    height: 60px;
}

.newTicket {
    width: 210px;
    height: 50px;
    position: absolute;
    left: 30px;
    top: 30px;
    border-radius: 5px;
    border: 2px dashed #2a59b7;
    color: #00339b;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #f5f7ff;
    font-weight: 600;
}

.announcement-single .title {
    font-size: 17px !important;
    color: #3967c3;
    font-weight: 600 !important;
    margin: 10px 0;
    display: block;
}

.announcement-single p {
    line-height: 2em;
    color: #798ab1;
    margin: 0 !important;
}

.cpstat {
    padding-top: 5px;
    opacity: .8;
}

.cpanel-usage-stats {
    padding: 0 !important;
}

.whiteboard.service-usage h2:before,
.whiteboard.service-info h3::before {
    right: -20px;
}

.cpanel-feature-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 30px;
    padding-bottom: 20px;
    max-height: 210px;
    overflow: scroll;
}

.cpanel-feature-row::before {
    display: none;
}

.cpanel-feature-row>div a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
    color: #7a8bab;
    font-weight: 500;
    width: max-content;
    margin: auto;
}

.cpanel-feature-row>div img {
    opacity: .8;
    width: 45px;
}

.service-billing .affiliate,
.service-details .affiliate {
    margin: 30px auto 10px auto;
}

.service-details>span {

    position: absolute;
    left: 30px;
    top: 30px;
    font-weight: 600;
    font-size: 18px;
    color: #0eaf68;
}

.service-info .domain {
    color: #fff;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: max-content;
    margin: 0 auto 20px auto;
    letter-spacing: 1px;
    font-family: sans-serif !important;
    font-size: 15px;
    margin-top: 15px;
}

.domain-pricing {
    margin-top: 80px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 20px;

}

#order-standard_cart .domain-checker-unavailable {
    margin: 20px 0;
}

.domain-pricing .tldprice {
    display: flex;
    height: 70px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    position: relative;

}

.domainreg #searchDomainInfo .domain-lookup-result button {
    position: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 300px !important;
    background: #f2f4ff;
    border: 2px dashed var(--dark-blue);
    height: 50px;
    color: var(--dark-blue);
    margin: auto;
    margin-bottom: 30px;
}

.domainreg #searchDomainInfo .domain-lookup-result button span {
    font-size: 14px;
    font-weight: 700;
    color: var(--dark-blue);
    padding-top: 0 !important;
}

#order-standard_cart #spotlightTlds {
    background-color: transparent;
}

.domain-pricing strong {
    -webkit-text-fill-color: transparent;
    background: linear-gradient(180deg, #0017594a, #3b3d6b21, #868da100);
    -webkit-background-clip: text;
    font-weight: 700;
    text-transform: uppercase;
    top: -2px;
    font-size: 30px;
    position: absolute;
    width: max-content;
    left: 50%;
    transform: translate(-50%, 0);

}

.tldprice strong:contains("pyho.ir") {
    display: none;
}

.RegisterDomainSearch {
    gap: 0px;
    border: 2px solid #a6acc6;
    border-radius: 10px;
    display: grid;
    grid-template-columns: 3fr 1fr;
    height: 60px;
    width: 100%;
    max-width: 500px;
    margin: auto;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
}

.RegisterDomainSearch input {
    border: none !important;
    border-radius: 0;
    background: transparent;
    text-align: center;
    opacity: 1;
    font-weight: 500;
    font-size: 17px;
    letter-spacing: 2px;
}

.RegisterDomainSearch input::placeholder {
    font-size: 14px;
    font-weight: 400;
    opacity: .7;
    letter-spacing: 1px;
}

.RegisterDomainSearch button {
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 130px;
    color: #202960;
    background: #e9ecf6;
    border: 0;
    border-radius: 5px;
}

.domain-pricing {
    height: 395px;
    overflow-y: scroll;
    overflow-x: hidden;
}

.domain-pricing span {
    color: #495c81;
    font-size: 17px;
    font-weight: 700;
}

.domain-checker-container {
    background: linear-gradient(45deg, #5980cd, #2b4d91) !important;
}

#order-standard_cart #spotlightTlds {
    margin: 0;
    padding: 0;
}

.spotlight-tld-container-4 {

    padding-bottom: 0;
}

.service-info .domain i {
    opacity: .5;
    font-size: 18px;
}

.service-info .buttons {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
    gap: 20px;
}

.service-info .buttons a {
    background: #ffffff21;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    font-weight: 500;
    color: #fff;
    height: 45px;
    font-size: 14px;
}

.service-info>div:first-child {

    margin-top: 20px;
}

.service-info .buttons a:hover {
    background: #ffffff30;
}

.service-info .buttons .login span {
    font-style: italic;
    font-weight: 900;
    color: #ff8b54;
    font-size: 25px;
}

.service-info .buttons i {
    font-size: 20px;
}

section .top.servicedetails {
    height: unset;
    grid-template-columns: 3fr 5fr;
}

/* security */
section .left .connect-google h2,
section .left .twofa h2 {
    margin-bottom: 20px;
}

#tabReglock form input {
    font-weight: 600;
    padding: 15px 30px;
    border: none;
    font-size: 15px;
}

.nameServers {
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1fr 1fr;
}

.nameServers input {
    border-color: #dde3f1;
    color: var(--dark-blue);
    font-weight: 600;
    border: 2px dashed #dde3f1;
    height: 50px;
    direction: ltr;
    text-align: left;
    padding: 20px;
    margin-top: 20px;
}

.submitNS {
    margin: auto;
    display: block;
    margin-top: 20px;
    background: none;
    border: none;
    color: #1f915e;
    font-weight: 800;
    min-width: 200px;
    height: 50px;
    margin: auto;
    margin-top: 30px;
}

.submitNS:hover {
    color: #fff;
    background-color: #38b994;
}

.listtable .top {

    height: unset;
}

#tableDomainsList {
    min-width: 650px !important;
}

.nsRadio {
    display: grid;
    grid-template-columns: 1fr 1fr;
    text-align: center;
    margin: 20px 0;
}

.tooltip-inner {
    width: max-content;
    padding: 10px 20px;
    border-radius: 20px;
    font-weight: 600;
    letter-spacing: 1px;
}

.tooltip.left .tooltip-arrow {

    right: 1px;
}

.popover-user-notifications ul li.none {
    font-weight: 500;
    color: #494a77;
}

.ssl-info .tooltip {
    display: none !important
}

.domain-input-group .tooltip-inner {

    border-radius: 6px;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    border: none;
    box-shadow: none;
}

.nsRadio label {

    font-weight: 500;
    color: #4c5177;
}

.nsRadio input {
    margin: 0 15px;
}

.connect-google p,
.twofa p {
    color: #1a2a4bab;
}

.domainTools {

    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 600;
}

.domainTools a {
    background: #fff;
    height: 50px;
    display: initial;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    border: 2px solid #fff;
}

.domainTools a:hover {
    border-color: #058;
}

.connect-google button {
    width: 300px;
    height: 60px;
    border: 2px dashed var(--dark-blue);
    border-radius: 5px;
    font-size: 15px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin: 40px auto 20px auto;
    cursor: pointer;
}

.twofa a {
    width: 300px;
    height: 60px;
    border: 2px dashed #ffffff;
    border-radius: 5px;
    font-size: 15px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin: 40px auto 20px auto;
    cursor: pointer;
    background: var(--green);
    color: #fff;
}

.twofa a i {
    font-size: 30px;
    margin-top: -5px;
}

.twofa a:hover {
    gap: 30px;
}

.connect-google button:hover {
    gap: 30px;
}

.connect-google button img {
    height: 30px;
    width: 30px;
}

.active-sessions .session {
    background: #f5f6f9;
    height: 60px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    gap: 40px;
    border-radius: 5px;
    font-weight: 500;
    font-size: 14px;
    border: 2px solid var(--dark-blue);
    color: var(--dark-blue);
    padding-top: 4px;
}

.active-sessions .session span {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-direction: row-reverse;
}

.active-sessions .session i {
    font-size: 22px;
    margin-top: -5px;
    opacity: .5;
}

.active-sessions .logout {
    color: var(--red);
    margin-right: auto;
    margin-top: 10px;
}

.active-sessions .logout i {
    opacity: 1;
    font-size: 25px;
}

/* select domain for host */
.radioContainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.domainOptions {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.domainOptions label {
    border: 2px dashed #e1e1f5;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    color: var(--dark-blue);
    height: 60px;
    cursor: pointer;
}

.domainOption.selected {
    font-weight: 500;
    border: 2px solid var(--blue);
}

.domainOption:hover {
    border-color: var(--blue);
}

.domain-input-group {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 20px;
    direction: ltr;
    height: 60px;
}

#frmProductDomain .option {
    margin-top: 50px;
    display: none;
}

#order-standard_cart #frmProductDomain .option {
    display: block;
}

#frmProductDomain .option.show {
    display: block;
}

#frmProductDomain input,
#frmProductDomain select {
    height: 60px;
    padding: 20px;
}

.domain-selection-options select,
.domain-selection-options input {
    width: 100%;
}

#order-standard_cart #frmProductDomain select {
    text-align: center;
    cursor: pointer;
    padding: 0 10px;
    border: 2px solid #7590c5 !important;
}

#frmProductDomain button {
    background: linear-gradient(45deg, #5980cd, #2b4d91);
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    border-radius: 5px;
    cursor: pointer;
    font-weight: 500;
}

#order-standard_cart .field,
#order-standard_cart .form-control {

    box-shadow: none;
}

#frmProductDomain #owndomaintld {
    text-align: center;
    border: 2px solid #7590c5 !important;
}

#domainSuggestions,
.more-suggestions,
.domain-suggestions-warning {
    display: none !important;
}

.spotlight-tld .domain-lookup-spotlight-loader {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
    width: 35px;
    height: 35px;
    padding: 0;
}

.domainTlds {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 20px;
}

.spotlight-tld {
    padding: 0 !important;
    height: 100px !important;
    color: var(--dark-blue) !important;
    border-color: #e7e8f5 !important;
    border-radius: 10px !important;
}

.btnDomainContinue {
    width: 210px;
    height: 50px;
    border-radius: 5px;
    border: 2px dashed #2a59b7;
    color: #00339b;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #e5e9ff;
    font-weight: 600;
    margin: auto;
}

#primaryLookupResult strong {
    font-weight: 800;
    text-decoration: none;
    padding: 10px;
    letter-spacing: 1px;
}

#order-standard_cart .domain-checker-available {
    color: #00774b !important;
    margin: 20px 0;
}

.cartdomain {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    direction: rtl;
}

#primaryLookupSearching {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
}

#order-standard_cart .domain-checker-result-headline,
#order-standard_cart .domain-lookup-primary-results .headline {
    font-size: 19px !important;
}

.domain-lookup-result button {
    height: 40px;
    border-radius: 5px !important;
    border: none;
    align-items: center;
    justify-content: center;
    display: flex;
    position: absolute;
    bottom: 15px;
    width: auto !important;
    left: 15px !important;
    right: 15px !important;
}

.domain-lookup-result button span {
    display: block;
    font-size: 13px;
    font-weight: 500;
    padding-top: 3px;
}

.domain-lookup-result button span i {
    position: absolute;
    right: 10px;
    top: 9px;
    font-size: 20px;
}

.spotlight-tld .tldname {
    position: absolute;
    top: 15px;
    right: 15px;
    padding: 0 !important;
    direction: ltr;
    font-weight: 800 !important;
    font-size: 15px;
    letter-spacing: 1px;
    color: var(--dark-blue);
}

.spotlight-tld .btn:not(.domain-contact-support) {
    background-color: #dde2f1 !important;
    color: #000433 !important;
}

.spotlight-tld .price {
    position: absolute;
    top: 15px;
    padding: 0 !important;
    left: 15px;
    font-size: 13px;
    font-weight: 500 !important;
}

#order-standard_cart .transfer-eligible,
#order-standard_cart .transfer-not-eligible {

    border-radius: 5px;
}

#order-standard_cart .transfer-eligible {
    color: #3c765c !important;
    background-color: #d8f0e9b5 !important;
    border-color: #d8f0e9b5 !important;
}

/*_____________________________________ register form ___________________________*/
.dataTables_empty {
    color: #fff;
    padding-top: 120px !important;
}

td.dataTables_empty:before {
    content: '';
    position: absolute;
    background: aliceblue;
    left: 50%;
    transform: translate(-50%, 0);
    top: 20px;
    background-size: cover;
    background-repeat: no-repeat;
    width: 120px;
    height: 120px;
    background-image: url(../img/empty.png);
}

.material input::placeholder {
    color: #fff;
}

.myregisterform {
    background-color: #373a47;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    overflow: scroll;
    z-index: 100;
}

.myregisterform input.form-control[type='tel']#inputPhone {
    background: #26272f;
    border: none;
    height: 50px;
}

.intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input,
.intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input[type=tel] {
    border: none;
    box-shadow: none;
    padding: 0;
}

.myregisterform form {
    padding: 0;
    width: 600px;
    margin: auto;
}

.myregisterform .fourregister {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 25px;
}

.myregisterform .fourregister input {
    height: 50px;
    text-align: right;
    font-size: 16px;
    width: 100%;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
    background: #26272f;
    color: #ffffffe0;
}

.myregisterform .generate-password {
    border: none;
    background: transparent;
    width: 60px;
    color: green;
    height: 47px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 0;
}

.myregisterform .checkbox a {
    padding: 0 40px 0 10px;
    margin: 30px 0;
    color: white;
    font-weight: 600;
}

.myregisterform button[type='submit'] {
    transition: all .2s ease !important;
    transition-property: background-color, box-shadow;
    box-shadow: 0 4px 8px 0 rgba(0, 25, 85, .1);
    text-transform: uppercase;
    outline: none !important;
    color: #fff;
    background: transparent;
    border: 2px solid cornflowerblue;
    margin: 0 !important;
    font-weight: 600;
    font-size: 15px;
    width: 100%;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    height: 60px;
}

.myregisterform #containerPassword {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 25px;
}

.passfieldd {
    position: relative;
}

.myregisterform .progress {
    position: absolute;
    height: 4px;
    padding: 0;
    margin: 0;
    background-color: #26272f;
    width: 98%;
    left: 50%;
    transform: translate(-50%, 0);
    bottom: 2px;
}

#tabChangepw #containerPassword {
    display: grid;
    grid-template-columns: 2fr 2fr 1fr;
    gap: 20px;
}

#tabChangepw #containerPassword input {
    position: relative;
    vertical-align: top;
    width: 100%;
    font-size: 14px;
    height: 50px;
    outline: none;
    box-shadow: none;
    background: #f5f8ff;
    border-radius: 5px;
    border: 1px solid #dfe6ff;
    color: var(--dark-blue);
    letter-spacing: 4px;

}

#tabChangepw .progress {
    position: absolute;
    height: 4px;
    padding: 0;
    margin: 0;
    width: 98%;
    left: 50%;
    transform: translate(-50%, 0);
    bottom: 2px;
    background: transparent;
    box-shadow: none;
}

#tabChangepw .generate-password {
    border: none;
    background: transparent;
    width: 60px;
    color: green;
    height: 47px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 0;
}

#tabChangepw .iconoir-key {
    font-size: 25px;
    color: var(--dark-blue);
}

.myregisterform #containerPassword input {
    font-size: 16px;
    height: 50px;
    background: #26272f;
    color: #ffffffe0;
    border: none;
    border-radius: 2px;
}

#tabChangepw #containerPassword input[type='submit'] {
    color: #fff;
    opacity: 1;
    letter-spacing: 0;
    border: none;
    background: linear-gradient(45deg, #5980cd, #2b4d91);
}

#tabChangepw #containerPassword input::placeholder {
    letter-spacing: 0;
}

.myregisterform .iconoir-key {
    font-size: 25px;
    color: #4effce;
}

.myregisterform .checkbox {
    font-weight: 400 !important;
    color: #bfbfbf !important;
    font-size: 13px;
    margin: 30px 0;
}

.myregisterform .sub-heading span {
    padding: 0 30px !important;
    background: #373a47 !important;
    font-size: 12px !important;
    color: #d9dceb !important;
    font-weight: 500;
}

.myregisterform .sub-heading {
    border-top: 1px solid #000 !important;
    margin-top: 40px !important;
    margin-bottom: 40px !important;
}

.myregisterform input[type='tel'],
.myregisterform input[type='email'] {
    text-align: left;
    direction: ltr;
    position: relative;
}

.myregisterform input[type='tel']::placeholder,
.myregisterform input[type='email']::placeholder {
    text-align: right;
    direction: rtl;
}

input[type='tel'],
input[type='email'] {
    text-align: left;
    direction: ltr;
}

input[type='tel']::placeholder,
input[type='email']::placeholder {
    text-align: right;
    direction: rtl;
}

.emailStatus.verified {
    color: #1d6349;
    display: flex;
    gap: 15px;
    font-size: 15px;
    font-weight: 500;
}

.emailStatus.notverified {
    color: #891b1b;
    display: flex;
    gap: 15px;
    font-size: 15px;
    font-weight: 500;
}

.emailStatus span {
    font-weight: 700;
    font-size: 16px;
}

.emailStatus input {
    margin-right: auto;
    width: 150px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px dashed var(--blue);
    border-radius: 3px;
    background: #f0f3ff;
    font-size: 14px;

}

.input-group-addon:first-child {
    padding: 0 30px;
    font-size: 15px;
    border-right: none !important;
    background: #f3f5ff8c;
    border-color: #e0e5ff;
    color: #8999b9;
}

#order-standard_cart .domainInputGroup .input-group input {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-left: 0 !important;
    letter-spacing: 1px;
    color: #21224b;
    font-weight: 600;
    font-size: 16px;
}

.myregisterform input:-webkit-autofill,
.myregisterform input:-webkit-autofill:hover,
.myregisterform input:-webkit-autofill:focus,
.myregisterform input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #26272f inset !important;
}

.myregisterform input:-webkit-autofill {
    -webkit-text-fill-color: #ffffffe0 !important;
}

.myregisterform input {
    transition: none !important;
    z-index: 2
}

.myregisterform input::placeholder {
    color: #ffffffad;
    font-size: 14px;
}

.myregisterform .login-title {
    color: #fff;
    margin-top: 5vh;
    font-size: 40px;
    position: relative;
    text-transform: capitalize;
    margin-bottom: 0;
    display: block;
    text-align: center;
    font-weight: 800;
}

.myregisterform .login-title span {
    -webkit-text-fill-color: transparent;
    background: linear-gradient(180deg, #c7ccdd4f, transparent);
    -webkit-background-clip: text;
    position: relative;
    text-transform: uppercase;
    font-size: 38px;
    top: -80px;
    font-weight: 300;
    display: block;
    margin-top: 6px;
    color: #a6b3b9;
}

.myregisterform button[type='submit']:hover {
    background: #5489ff;
    border-color: #5489ff;
    color: #fff;
}

.myregisterform #containerPassword .generate-password,
.myregisterform #containerPassword .progress {
    z-index: 3;
}

.myregisterform .registernav {
    display: flex;
    width: 1170px;
    margin: auto;
    padding: 25px 0;
}

.myregisterform .registernav1 {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
    direction: rtl;
}

.myregisterform .registernav2 {
    border: 2px dashed #6daeff;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    color: #75f9ff;
    height: 60px;
    transition: all .2s ease;
    font-size: 17px;
    width: max-content;
    padding: 0 65px;
    margin-right: auto;
}

.myregisterform img {
    width: 45px;
}

.myregisterform p {
    color: #ffe261;
    direction: ltr;
    font-weight: 400;
    font-size: 16px;
    direction: rtl;
}

.myregisterform .jstel {
    position: relative;
}

.myregisterform input[type='tel'] {
    letter-spacing: 5px;
}

.myregisterform input[type='tel']::placeholder {
    letter-spacing: 0 !important;
}

#loginbymobile {
    color: #ffffff;
    background: transparent;
    font-weight: 300;
    border: 2px dashed cornflowerblue;
    margin: 0;
    width: 100%;
    font-weight: 400;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
}

.myregisterform .alert {
    margin-top: 30px;
}

/* ______________________________ login page ___________________________________ */

.col-md-6 {
    float: right;
}

.custom-login-page-v2 {
    background-color: #373a47 !important;
    height: 100%;
    display: block;
    height: 100vh;
    font-family: Poppins, Helvetica, Arial, sans-serif;
}

.custom-login-page-v2 .login-page-header {
    padding: 25px 0;
}

.custom-login-page-v2 .login-page-header .navbar-brand.nobg {
    padding: 0;
    position: relative;
    z-index: 2;
    float: right;
    margin-right: auto;
    height: auto;
    background: transparent;
}

.custom-login-page-v2 .login-page-header .navbar-brand.nobg .w-logo {
    width: 35px;
    display: inline-block;
}

.custom-login-page-v2 .login-page-header .navbar-brand.nobg .w-text {
    display: inline-block;
    margin-left: 10px;
    font-size: 12px;
    font-weight: 700;
    color: #ffe261 !important;
    letter-spacing: 0.5px;
    font-weight: 400;
    font-size: 16px;
}

.custom-login-page-v2 .login-page-header .header-link span {
    font-size: 11px;
    display: inline-block;
    padding: 8px;
    font-weight: 300;
    text-transform: capitalize;
    color: #474763;
}

.custom-login-page-v2 .login-page-header .header-link a {
    font-size: 12px;
    color: #2196F3;
    font-weight: 300;
    text-transform: capitalize;
    text-decoration: underline;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-title {
    font-weight: 100;
    font-size: 25px;
    text-transform: capitalize;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-title span {
    display: block;
    font-size: 14px;
    margin-top: 6px;
    color: #a6b3b9;
    text-transform: lowercase;
    font-weight: 100;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-form input.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
    width: 100%;
    height: 44px;
    border-radius: 2px;
    -o-box-shadow: 0 2px 2px 0 rgba(0, 25, 85, .04), 0 0 0 1px rgba(0, 25, 85, .1);
    -ms-box-shadow: 0 2px 2px 0 rgba(0, 25, 85, .04), 0 0 0 1px rgba(0, 25, 85, .1);
    box-shadow: 0 2px 2px 0 rgba(0, 25, 85, .04), 0 0 0 1px rgba(0, 25, 85, .1);
    background-color: #fff;
    font-size: 12px;
    font-weight: 200;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #001955;
    border: 2px solid #f0f2f3;
    border-radius: 4px;
    margin-top: 0;
    margin-bottom: 15px;
    text-align: left;
    direction: ltr;
    font-weight: 400;
}

.btn-social.btn-google#btnGoogleSignin1 {
    padding: 0;
    background: transparent;
    box-shadow: none;
    border: 0;
    margin: 0;
}

.nameserversdom {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    align-items: center;
    justify-content: center;
    gap: 20px;
    display: grid;
    direction: ltr;
    grid-auto-flow: dense;
    direction: rtl;
    grid-auto-flow: dense;
    direction: rtl;
}

.nameserversdom input {
    text-align: center;
}

.nameserversdom input {
    font-size: 14px !important;
    font-weight: 600 !important;
}

.submitdns {
    width: 50%;
    height: 50px;
    border-radius: 5px;
    border: 2px dashed #2a59b7;
    color: #00339b;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #e5e9ff;
    font-weight: 600;
    margin-top: 30px;
    max-width: 200px;
    margin-right: auto;
}

.forgotpw-txt {
    display: block;
    line-height: 18px;
    vertical-align: middle;
    transition: .3s ease;
    font-size: 16px;
    text-align: right !important;
    padding: 20px 0;
    color: #b0b9c3;
    text-decoration: none;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-form .btn-primary {
    transition-property: background-color, box-shadow;
    background: #607D8B;
    box-shadow: 0 4px 8px 0 rgba(0, 25, 85, .1);
    display: block;
    width: 100%;
    margin-top: 40px;
    font-weight: 100;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    border-radius: 4px;
    font-size: 11px;
    border: 0;
    outline: none !important;
}

.custom-login-page-v2 .login-wrapper .login-form-container #registration input.form-control,
.custom-login-page-v2 .login-wrapper .login-form-container #registration input.field,
.custom-login-page-v2 .login-wrapper .login-form-container #registration select.form-control {
    width: 100%;
    height: 44px;
    border-radius: 2px;
    -o-box-shadow: 0 2px 2px 0 rgba(0, 25, 85, .04), 0 0 0 1px rgba(0, 25, 85, .1);
    -ms-box-shadow: 0 2px 2px 0 rgba(0, 25, 85, .04), 0 0 0 1px rgba(0, 25, 85, .1);
    box-shadow: 0 2px 2px 0 rgba(0, 25, 85, .04), 0 0 0 1px rgba(0, 25, 85, .1);
    background-color: #fff;
    font-size: 12px;
    font-weight: 200;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #001955;
    border: 2px solid #f0f2f3;
    border-radius: 4px;
    margin-top: 0;
}

.custom-login-page-v2 .login-wrapper .login-form-container .form-group {
    position: relative;
}

.custom-login-page-v2 .login-wrapper .login-form-container .generate-password.coowhmpss {
    position: absolute;
    border: 0;
    top: 11px;
    background: transparent;
    text-align: center;
    font-size: 10px;
    padding: 0;
}

.custom-login-page-v2 #registration .sub-heading {
    margin-top: 30px;
    margin-bottom: 40px;
    border-top: 1px solid #ebecf1;
}

.custom-login-page-v2 #registration .sub-heading span {
    padding: 0 18px;
    background: #f7f9fc;
    font-size: 14px;
    color: #444;
}

.custom-login-page-v2 .progress {
    height: 4px;
    background-color: transparent;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    position: absolute;
    left: 2px;
    right: 2px;
    margin: 0;
    bottom: 2px;
    border-radius: 10px;
}

.custom-login-page-v2 .password-strength-meter p {
    font-size: 11px;
    font-weight: 100;
    color: #91a3ac;
    margin-top: 10px;
}

.custom-login-page-v2 .marketing-email-optin {
    margin: 0 0 20px 0;
    padding: 10px 20px 20px;
    background-color: #eff1f4;
    border-radius: 5px;
}

.custom-login-page-v2 .marketing-email-optin h4 {
    font-weight: 100;
    font-size: 16px;
    text-transform: capitalize;
}

.custom-login-page-v2 .marketing-email-optin p {
    display: block;
    font-size: 11px;
    margin-top: 6px;
    color: #a6b3b9;
    text-transform: lowercase;
    font-weight: 100;
}

/*_____________________________________________________________ dialog box _____________________________________________________________*/
.modal-title {
    font-weight: 600;
    font-size: 15px;
    color: var(--dark-blue);
}

#phonelogin-modal .modal-header p {
    display: none;
}

#phonelogin-modal .modal-body .form-group label {
    font-size: 15px;
    font-weight: 400;
    background: #fff;
    padding: 0 20px;
    right: 40px;
    position: absolute;
    top: 20px;
    color: var(--dark-blue);
}

#phonelogin-modal .modal-body .form-group input:active,
#phonelogin-modal .modal-body .form-group input:focus {
    border: 2px solid var(--dark-blue);
}

#phonelogin-modal .modal-body .form-group input {
    border: 2px solid #ccd6e9;
    text-align: center;
    font-weight: 600;
    font-size: 18px;
    height: 60px;
    letter-spacing: 3px;
    color: var(--dark-blue);
    direction: ltr;
}

#phonelogin-modal .modal-footer button[type="button"] {
    display: none;
}

#phonelogin-modal #loginByPhonesubmit:hover {
    background-color: #415c99;
    border-color: #415c99;
}

#phonelogin-modal #loginByPhonesubmit {
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #d5d7e1;
    color: #fff;
    background-color: #4c6db9;
    border-color: #4c6db9;
    width: 100%;
    height: 60px;
    border-radius: 5px;
    font-size: 17px;
}

#loginbymobile:hover,
.custom-login-page-v2 .login-wrapper .login-form-container .login-form .btn-primary:hover {
    color: #fff !important;
    background-color: cornflowerblue !important;
    border-color: cornflowerblue !important;
}

#phonelogin-modal .modal-footer {
    border-top: none;
}

#phonelogin-modal .modal-body {
    padding-bottom: 0;
}

i.spinner {
    -webkit-animation: spin 4s infinite linear;
    font-size: 20px;
}

.irs-bar-edge {
    background: #6b91ff !important;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    height: 5px !important;
    width: 7px !important;
}

.irs-bar {
    height: 5px !important;
    background: #6b91ff !important;
}

.irs-from,
.irs-to,
.irs-single {
    color: #ffffff !important;
    background: #6b91ff !important;
    -moz-border-radius: 4px;
    border-radius: 3px !important;
    width: 30px;
    height: 30px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: 13px !important;
    top: -15px !important;
    padding-top: 5px !important;
}

.irs-line-right {
    height: 5px !important;
    background: #eaebfd !important;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;

}

.irs-line-mid {

    background: #eaebfd !important;
    height: 5px !IMPORTANT;
}

.irs-line-left {
    background: #eaebfd !important;
    height: 5px !IMPORTANT;
}

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

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

.configProduct #order-standard_cart .form-control {
    letter-spacing: 0;
}

.configProduct #order-standard_cart .form-control label {
    height: unset;
    width: max-content;
    font-size: 15px;
    font-weight: 400;
    color: #6c718d;
    border: none;
}

.configProduct .confiGrid {
    display: grid;
    grid-template-columns: 1fr 4fr;
    gap: 20px;
}

.configProduct .firstGridConfig {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;

}

.configProduct .firstGridConfig .nowIP label:last-child {
    border: 2px dashed #d1d8eb !important;
    width: 100% !important;
    height: 50px !important;
}

.configProduct .firstGridConfig .nowIP .icheckbox_square-blue {
    position: absolute !important;
    right: 20px;
}

.configProduct .firstGridConfig #inputBillingcycle {

    width: 100%;
}

#productConfigurableOptions {

    padding-left: 30px;
}

#orderSummary h3 {
    position: relative;
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 30px;
}

#order-standard_cart .order-summary .loader {
    position: absolute !important;
    top: 50% !important;
    height: 120% !important;
    padding-right: 0 !important;
    color: #fff !important;
}

#orderSummaryLoader {
    width: 110%;
    height: 120%;
    position: absolute;
    background: rgb(0 0 0 / 2%);
    border-radius: 16px;
    backdrop-filter: blur(60px);
    -webkit-backdrop-filter: blur(5px);
    z-index: 2;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    top: 50%;
}

.top-right.secondary-cart-sidebar .product-name {
    position: absolute;
    left: 30px;
    top: 20px;
    font-weight: 500;
    font-size: 17px;
    opacity: .3;
}

.top-right.secondary-cart-sidebar .product-group {
    display: none;
}

.top-right #btnCompleteProductConfig {
    background: #fff;
    color: var(--dark-blue);
    display: flex;
    width: 200px;
    align-items: center;
    justify-content: center;
    height: 50px;
    gap: 10px;
    font-size: 18px;
    font-weight: 600;
    margin-top: 30px;
    float: left;
    border-radius: 7px;
}

.top-right #btnCompleteProductConfig i {

    font-size: 22px;
    padding-bottom: 4px;
}

.top-right .total-due-today span:last-child {
    display: none;
}

.top-right .total-due-today .amt {
    position: absolute;
    right: 60px;
    bottom: 25px;
    font-size: 25px;
    font-weight: 700;
}

section .secondary-cart-sidebar {
    height: unset;
}

#frmConfigureProduct .whiteboard {
    margin-top: 30px;
}

#frmConfigureProduct .myconfigoptions {
    display: grid;
    font-size: 14px;
    gap: 20px 100px;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    justify-content: center;
    text-align: center;
}

#frmConfigureProduct .myconfigoptions div {
    display: grid;
    align-items: center;
    justify-content: center;
    grid-template-columns: 1fr 1fr;
    text-align: center;
    gap: 0 20px;
}

#frmConfigureProduct .summary-totals {
    font-size: 14px;
    display: grid;
    gap: 20px 100px;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    justify-content: center;
    text-align: center;
}

#frmConfigureProduct .summary-totals div {
    display: grid;
    align-items: center;
    justify-content: center;
    grid-template-columns: 1fr 1fr;
    text-align: center;
    gap: 0 20px;
}

.top-right #btnCompleteProductConfig:hover {
    gap: 15px
}

#frmConfigureProduct .myconfigoptions div span:last-child,
#frmConfigureProduct .summary-totals div span:last-child {
    font-weight: 800;
}

#frmConfigureProduct .myconfigoptions div span:first-child,
#frmConfigureProduct .summary-totals div span:first-child {
    opacity: .8;
}

#orderSummaryLoader i {

    font-size: 40px;
}

#productConfigurableOptions label {
    display: flex;
    align-items: center;
    justify-content: center;
    top: -6px;
    text-align: center;
    width: 100% !important;
    right: -10px;
    color: var(--dark-blue) !important;
    font-weight: 500 !important;

}

.configProduct #order-standard_cart .sub-heading span {
    font-weight: 600;
    padding: 0 30px;
    color: var(--dark-blue);
}

.configProduct #order-standard_cart .sub-heading {
    border-top: 1px solid #dfe3ef;
    margin-top: 50px;
    margin-bottom: 50px;
}

.configProduct #order-standard_cart label {
    height: unset;
    width: max-content;
    font-size: 15px;
    font-weight: 400;
    color: #6c718d;
    border: none;
}

.irs-min,
.irs-max {
    color: #7985a7 !important;
    line-height: 1.333;
    text-shadow: none;
    top: -15px;
    padding: 1px 3px;
    background: #eff3f9 !important;
    -moz-border-radius: 4px;
    border-radius: 3px !important;
    width: 30px;
    height: 30px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: 13px !important;
    top: -15px !important;
    padding-top: 5px !important;
}

.irs-from:after,
.irs-to:after,
.irs-single:after {

    border-top-color: transparent !important;
}

#productConfigurableOptions label {
    padding-bottom: 30px;
}

.irs-grid-text {
    bottom: 10px !important;
    color: #cdd8e9 !important;
    font-size: 10px !important;
}

.irs-grid-pol {
    background: #dae3f1 !important;
}

#recurringMonthly {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringMonthly .cost {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringQuarterly {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringQuarterly .cost {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringSemiAnnually {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringSemiAnnually .cost {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringAnnually {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringAnnually .cost {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringBiennially {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringBiennially .cost {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringTriennially {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

#recurringTriennially .cost {
    font-size: 14px !important;
    font-weight: 600;
    opacity: 1;
    color: #fff;
}

.irs-single {
    z-index: 2;
    cursor: pointer !important;
    top: -15px !important;
}

.irs-slider {
    display: none !important;
}

.irs:hover .irs-single {
    top: 11px !important;
    border-radius: 50% !important;
    border: 2px solid #4c70b3;

}

@media (min-width: 768px) {
    .modal-dialog.generatepassword {
        width: 490px;
    }
}

.modal-dialog.generatepassword .modal-title {
    font-size: 15px;
    font-variation-settings: "wght" 500, "dots" 3 !important;
}

.modal-dialog.generatepassword .modal-header .close i {
    transform: rotate(45deg);
    display: block;
}

.modal-header .close {
    float: left;
    font-size: 30px;
    font-weight: 500;
    color: #ff6666;
    opacity: 1;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
}

.modal-header {
    padding: 20px 30px;
    border-radius: 10px 10px 0 0;
}

#inputGeneratePasswordOutput {
    width: 100%;
    color: #495057;
    border-radius: 5px;
    background: #f4f4f9;
    font-size: 18px;
    text-align: center;
    font-weight: 700;
    letter-spacing: 5px;
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
}

.passgenerate {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 30px;
}

.modal-body,
.modal-footer {
    padding: 30px;
}

#btnGeneratePasswordInsert {
    font-size: 14px;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #d5d7e1;
    color: #fff;
    background-color: #5867dd;
    border-color: #5867dd;
    width: 100%;
    height: 50px;
    border-radius: 5px;
}

.passgenerate i {
    font-size: 18px;
}

#btnGeneratePasswordSubmit {
    width: 100%;
    height: 50px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #d5d7e1;
}

.custom-login-page-v2 .login-wrapper .login-form-container #registration .btn-primary {
    transition-property: background-color, box-shadow;
    box-shadow: 0 4px 8px 0 rgba(0, 25, 85, .1);
    display: block;
    text-transform: uppercase;
    border-radius: 4px;
    outline: none !important;
    color: #dbdbdb;
    background: transparent;
    border: 2px solid cornflowerblue;
    margin: 0 !important;
    width: 100%;
    font-weight: 600 !important;
    height: 60px;
    font-size: 15px !important;
}

.custom-login-page-v2 {
    background-color: #373a47 !important;
    height: 100%;
    display: block;
    height: 100vh;
    font-family: Poppins, Helvetica, Arial, sans-serif;
    position: fixed;
    width: 100%;
    left: 0;
    z-index: 100;
    top: 0;
}

.custom-login-page-v2 .login-page-header {
    display: flex;
    align-items: center;
    justify-content: center;
}

.logincontainer {
    max-width: unset;
    border-radius: 30px;
    width: 100%;
    background: #fff;
    padding: 30px;
}

.logincontainer h1 {
    font-weight: 700;
    font-size: 17px;
    color: var(--dark-blue);
    position: relative;
    margin-bottom: 30px;
}

.logincontainer h1:before {
    position: absolute;
    content: '';
    width: 4px;
    height: 20px;
    background: var(--green);
    right: -30px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    top: 50%;
    transform: translate(0, -50%);
}

.logincontainer>p {
    font-size: 15px;
    color: var(--dark-blue);
    text-align: center;
    border: 2px dashed #e2e5ef;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 60px;
    border-radius: 5px;
    margin-bottom: 30px;
}

.logincontainer>form {
    max-width: 500px;
    margin: auto;
}

.logincontainer form input[type="email"] {
    border: 2px solid #ccd6e9;
    font-weight: 600;
    font-size: 18px;
    height: 60px;
    color: var(--dark-blue);
    direction: ltr;
    text-align: left;

}

.logincontainer form label {
    border: 2px solid var(--dark-blue);
    font-weight: 600;
    font-size: 18px;
    height: 60px;
    color: var(--dark-blue);
    direction: ltr;
    text-align: left;
}

.logincontainer .form-group.text-center {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.logincontainer>form input[type="submit"] {
    background: transparent;
    border: 2px solid cornflowerblue;
    margin: 0 !important;
    width: 100%;
    font-size: 13px;
    font-weight: 600 !important;
    height: 50px;
    color: var(--dark-blue);
    font-weight: 500;
}

.logincontaine #resetbymobile {
    color: #ffffff;
    background: transparent;
    font-weight: 300;
    border: 2px dashed cornflowerblue;
    margin: 0;
    width: 100%;
    font-weight: 400;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    color: var(--dark-blue);
    font-weight: 500;
}

.custom-login-page-v2 .login-page-header {
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-login-page-v2 .login-page-header {
    padding: 25px 0;
}

.custom-login-page-v2 .login-page-header .navbar-brand.nobg {
    float: right;
}

.custom-login-page-v2 .login-page-header .navbar-brand.nobg {
    padding: 0;
    position: relative;
    z-index: 2;
    float: right;
    margin-right: auto;
    height: auto;
    background: transparent;
}

.custom-login-page-v2 .login-page-header .navbar-brand.nobg .w-logo {
    width: 35px;
    display: inline-block;
}

.custom-login-page-v2 .login-page-header .navbar-brand.nobg .w-text {
    margin-right: 10px;
    margin-left: 0;
}

.custom-login-page-v2 .login-page-header .navbar-brand.nobg .w-text {
    color: #ffe261 !important;
    font-weight: 400;
    font-size: 16px;
    font-family: 'iransansxv';
}

.text-right.header-link {
    text-align: left;
}

.custom-login-page-v2 .login-page-header .header-link a {
    border: 2px dashed #6daeff;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    color: #75f9ff;
    width: 100%;
    font-size: 1.1rem;
    height: 60px;
    transition: all .2s ease;
    text-decoration: none;
    font-size: 17px;
    width: max-content;
    padding: 0 65px;
    margin-right: auto;
}

.login-custom-layout {
    margin-top: 5vh;
}

.login-wrapper {
    display: flex;
    height: 100%;
    padding-top: 25px;
}

.login-wrapper .login-form-container {
    width: 100%;
    max-width: 550px;
    position: relative;
    margin: auto;
}

.login-wrapper .login-form-container .login-title {
    display: block;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    text-transform: uppercase;
    color: #474763;
    margin-bottom: 40px;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-title {
    font-weight: 300;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-title {
    color: #fff;
    font-size: 40px;
    position: relative;
    font-weight: 700;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-title span {
    display: block;
    font-size: 14px;
    margin-top: 6px;
    color: #a6b3b9;
    text-transform: lowercase;
    font-weight: 100;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-title span {
    -webkit-text-fill-color: transparent;
    background: linear-gradient(180deg, #c7ccdd4f, transparent);
    -webkit-background-clip: text;
    position: relative;
    text-transform: uppercase;
    font-size: 38px;
    top: -80px;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-title span {
    font-weight: 300;
}

.underterminal {
    content: '';
    position: absolute;
    border-radius: 10px;
    width: 600px;
    height: 300px;
    background: linear-gradient(109.61deg, #53586b 0%, #373a47 85%);
    box-shadow: none;
    margin: auto;
    margin-top: 7vh;
    left: 45%;
    transform: translate(-50%, 0);
    top: 125px;
    display: block;
}

.login-form-container .login-form {
    background: #26272f;
    box-shadow: 0 0 50px rgb(0 0 0 / 28%);
    border-radius: 6px;
    position: relative;
    padding: 70px 20px 20px 20px;
    text-align: left;
}

.login-wrapper .login-form-container .login-form input::placeholder {
    text-align: right;
    font-size: 15px !important;
    opacity: .7;
}

.login-wrapper .login-form-container .login-form .bashh {
    position: absolute;
    left: 0;
    color: #50ffae;
    top: 10px;
    width: 100px;
    height: 10px;
    direction: ltr;
    font-size: 17px;
}

.login-wrapper .login-form-container .login-form input.form-control {
    background-color: #26272f !important;
    border: none !important;
    color: pink !important;
    padding-left: 80px;
    font-size: 17px !important;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-title {
    color: #fff;
    font-size: 40px;
    position: relative;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-title span {
    -webkit-text-fill-color: transparent;
    background: linear-gradient(180deg, #c7ccdd4f, transparent);
    -webkit-background-clip: text;
    position: relative;
    text-transform: uppercase;
    font-size: 38px;
    top: -80px;
}

.custom-login-page-v2 .login-wrapper .login-form-container .login-form .btn-primary {
    background: transparent;
    border: 2px solid cornflowerblue;
    margin: 0 !important;
    width: 100%;
    font-size: 13px;
    font-weight: 600 !important;
    height: 50px;
}

.terminal>i {
    position: absolute;
    color: #afb2bd;
    font-size: 20px;
    left: 25px;
    font-weight: 500;
    direction: ltr;
    top: 13px;
}

.terminal>h6 {
    position: absolute;
    color: #c5c8d4;
    top: 15px;
    left: 60px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 2px;
}

.terminal>.dot:nth-child(3),
.terminal>.dot:nth-child(4),
.terminal>.dot:nth-child(5) {
    width: 10px;
    height: 10px;
    position: absolute;
    top: 15px;
    border-radius: 50%;
    background-color: #595b64;
}

.terminal>.dot:nth-child(3) {
    background-color: #ff523c;
    right: 15px;
}

.terminal>.dot:nth-child(4) {
    background-color: #ffca6b;
    right: 35px;
}

.terminal>.dot:nth-child(5) {
    background-color: #2dc779;
    right: 55px;
}

.custom-login-page-v2 input:-webkit-autofill,
.custom-login-page-v2 input:-webkit-autofill:hover,
.custom-login-page-v2 input:-webkit-autofill:focus,
.custom-login-page-v2 input:-webkit-autofill:active {
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: pink !important;
    transition: background-color 5000s ease-in-out 0s !important;
    box-shadow: inset 0 0 20px 20px #23232329 !important;
}

.custom-login-page-v2 .logins {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 30px;
}

.underterminal {
    content: '';
    position: absolute;
    border-radius: 10px;
    width: 600px;
    height: 300px;
    background: linear-gradient(109.61deg, #53586b 0%, #373a47 85%);
    box-shadow: none;
    margin: auto;
    margin-top: 7vh;
    left: 45%;
    transform: translate(-50%, 0);
    top: 115px;
    display: block;
}

h5.login-title:before {
    content: '';
    position: absolute;
    left: 50%;
    top: -4px;
    width: 300px;
    height: 200px;
    background: linear-gradient(45deg, #007eff, #ffdd00);
    filter: blur(130px);
    transform: translate(-50%, 0);
    opacity: .6;
    top: -22px;
    rotate: 20deg;
    top: -40px;
}

.custom-login-page-v2 .login-page-header {
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-login-page-v2 .login-page-header .header-link a {
    border: 2px dashed #6daeff;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    color: #75f9ff;
    width: 100%;
    font-size: 1.1rem;
    height: 60px;
    transition: all .2s ease;
    text-decoration: none;
    font-size: 17px;
    width: max-content;
    padding: 0 65px;
    margin-right: auto;
    font-weight: 400;
}

.custom-login-page-v2 .login-page-header .header-link a:hover,
.myregisterform .registernav2:hover {
    border: 2px solid #5993db;
    background: #5993db;
    color: #fff;
}

.custom-login-page-v2 .login-page-header .navbar-brand.nobg .w-text {
    color: #ffe261 !important;
    font-weight: 400;
    font-size: 16px;
    font-family: 'iransansxv';
}

.custom-login-page-v2 #registration .sub-heading span {
    padding: 0 25px;
    background: #3d454c;
    font-size: 10px;
    color: #d9dceb;
}

.custom-login-page-v2 #registration .sub-heading {
    border-top: 1px solid #000000;
}

.custom-login-page-v2 #registration .feather {
    color: #4effce;
    font-size: 19px;
}

#registration .accepttos {
    width: 20px;
    height: 20px;
    cursor: pointer;
    top: -6px;
}

.custom-login-page-v2 .login-wrapper .login-form-container #registration input.form-control,
.custom-login-page-v2 .login-wrapper .login-form-container #registration input.field {
    color: #fff;
    font-size: 15px;
    border: none;
    background: #26272f;
}

.custom-login-page-v2 .login-wrapper .login-form-container #registration input.form-control::placeholder {
    text-align: right;

}

.custom-login-page-v2 .login-wrapper .login-form-container #registration .intl-tel-input.separate-dial-code .selected-flag {
    background-color: #26272f;
    color: #b9b9b9;
}

#registration .intl-tel-input .country-list {
    box-shadow: 0 0 50px rgb(0 0 0 / 23%);
    background-color: #4a4d65;
    border: 1px solid #4a4d65;
}

#registration .intl-tel-input .country-list .country {
    margin: 0;
    background: #4a4d65;
    color: #c7c7c7;
}

#registration .intl-tel-input .country-list .country.highlight {
    background-color: rgb(152 255 217 / 16%);
}

#registration .intl-tel-input .country-list .divider {
    border-bottom: 1px solid #3b2f2f;
    background: #4a4d65;
}

.custom-login-page-v2 #registration input:-webkit-autofill,
.custom-login-page-v2 #registration input:-webkit-autofill:hover,
.custom-login-page-v2 #registration input:-webkit-autofill:focus,
.custom-login-page-v2 #registration input:-webkit-autofill:active {
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: white !important;
    transition: background-color 5000s ease-in-out 0s !important;
    box-shadow: inset 0 0 20px 20px #26272f !important;
}

.custom-login-page-v2 #registration #inputEmail {
    text-align: left;
}

.generatepassword .control-label {
    text-align: right;
    padding: 10px 30px 0 10px;
    font-weight: 400;
    font-size: 13px;
}

.forgotpw-txt {
    display: block;
    line-height: 18px;
    vertical-align: middle;
    transition: .3s ease;
    font-size: 16px;
    text-align: right !important;
    padding: 20px 0;
    color: #b0b9c3;
    text-decoration: none;
}

.custom-login-page-v2 .forgotpw-txt:hover {
    color: #dfe6ed;
}

.custom-login-page-v2 .login-wrapper .login-form-container .form-group {
    position: relative;
}

.Breadcrumb {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    margin-bottom: 20px;
    margin-top: 20px;
    margin-right: auto;
    margin-left: auto;
    width: 93%;
}

.Breadcrumb:before {
    content: '';
    width: 100%;
    height: 2px;
    z-index: -1;
    background: var(--dark-blue);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    opacity: .1;
}

.Breadcrumb div,
.Breadcrumb a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.Breadcrumb span {
    width: 35px;
    height: 35px;
    background: #e0e4ed;
    border-radius: 50%;
    border: 10px solid #f5f6f9;
}

.Breadcrumb .active span {
    background: #587bff;
}

.Breadcrumb p {
    color: #aeb5c5;
    position: absolute;
    left: 50%;
    bottom: -20px;
    transform: translate(-50%, 0);
    font-size: 13px;
}

.Breadcrumb .active p {
    color: var(--dark-blue);
    font-weight: 600;
}

@-webkit-keyframes active {
    0% {
        background: #00bd5fab;
    }

    100% {
        background: #00bd5f;
    }
}

@-webkit-keyframes inactive {
    0% {
        background: #ff3131c4;
    }

    100% {
        background: #ff3131;
    }
}

@-webkit-keyframes warning {
    0% {
        background: #ffb731c0;
    }

    100% {
        background: #ffb731;
    }
}

.nightMode {
    --light-blue: #24273d;
    --blue: #586bff;
    --dark-blue: #ffffff;
    --green: #0ac974;
    --white: #303555;
    --red: #ff4747;
}

.nightMode .menu li a i {
    opacity: .7;
}

.nightMode ul::-webkit-scrollbar-thumb {
    border-right: 5px var(--light-blue) solid;
    border-top: 10px solid var(--light-blue);
    border-left: 5px solid var(--light-blue);
    border-bottom: 10px solid var(--light-blue);
}

.nightMode .profile-details .phone,
.nightMode .service-bar span,
.nightMode .service i {
    color: #b5bed1;
}

h3.phone::before {
    display: none;
}

.nightMode .top-left a:hover {
    background-color: #5980cd;
}

.nightMode section .top-right,
.nightMode .wallet-amount strong,
.nightMode .add-funds,
.nightMode nav h1,
.nightMode .service i:hover {
    color: var(--dark-blue);
}

.nightMode h3:before {
    background: var(--dark-blue);
}

.table-responsive {
    border: none !important
}

.nightMode .right .settings a.night,
.nightMode .right .settings a.logout,
.nightMode .right .settings a.setting {
    background-color: var(--light-blue);
}

.nightMode .right .settings .iconoir-half-moon {
    color: yellow;
}

.nightMode .right .settings .iconoir-settings {
    color: #00ffc3;
}

.nightMode .right .settings a {
    border: 2px solid transparent;
}

.nightMode .right .settings .logout:hover {
    border-color: var(--red);
}

.nightMode .right .settings .setting:hover {
    border-color: #00ffc3;
}

.nightMode .right .settings .night:hover {
    border-color: yellow;
}

.nightMode .invite {
    background: linear-gradient(45deg, transparent, #24273d);
}

.nightMode .menu li.active i {

    color: #fff;
    opacity: 1;
}

.nightMode .invite .iconoir-nav-arrow-left {
    background: #24273d;
    color: #ffffffa3;
}

.nightMode .withoutService span {
    color: #a7b9d9;
}

.nightMode .iconoir-bell::before {
    color: #fff;
}

.nightMode .dotted-animation .animate-circle {
    border: 5px solid #ffffff;
}

.nightMode .dotted-animation {
    background: #fff;
}

.nightMode .left-nav .cart-btn {
    background: transparent;
    color: #FFF;
    border-color: #24273d;
    border: 2px solid #42486f;
    font-weight: 300;
}

.nightMode nav .left-nav i {
    color: #fff;
}

.nightMode .cptools a {
    background: none;
    border-color: #3e4261;
}

.nightMode .cptools a.active {
    background: #303555;
}

.nightMode fieldset input {
    background: #2c314f;
}

.nightMode .marketing-optin p {
    color: #cbd2ed;
}

.nightMode .emailStatus.verified {}

.nightMode .emailStatus.verified {
    color: #52cb8f;
}

.nightMode .telegrambot strong {
    color: #ffffff;
}

.nightMode .bootstrap-switch .bootstrap-switch-label {
    background: transparent;
}

.nightMode .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default {
    background: #f9a8a8;
}

.nightMode .activesession {
    background: #3b4169;
}

.nightMode p.twofa-config-link {
    color: #c2c9e1;
}

.nightMode .progress {
    background-color: #24273d;
}

.nightMode .chpass-oldPass .generate-password {
    background: #575e89;
    color: #ffffffe0;
}

.nightMode .menu li:hover i {
    color: #fff;
    opacity: 1;
}

.nightMode .Breadcrumb span {
    border-color: var(--light-blue);
    background: #3c4063;
}

.nightMode .product-pricing .price {
    color: #e5edff;
}

.nightMode #order-standard_cart .field,
.nightMode #order-standard_cart .form-control {
    background: var(--light-blue);
    color: var(--dark-blue) !important
}

.nightMode #order-standard_cart label.active {
    border: 2px solid #ffffff;
    color: #ffffff !important;
}

.nightMode .input-group-addon:first-child {
    background: var(--light-blue);
}

.nightMode .btnDomainContinue {
    background: var(--light-blue);
    color: var(--dark-blue);
    border-color: #ffffff78;
}

.nightMode .top-right #btnCompleteProductConfig {
    background: var(--white);
    border: 2px solid #00e5a3;
    color: #39ff93;
}

.nightMode #order-standard_cart .field,
.nightMode #order-standard_cart .form-control {
    color: var(--dark-blue) !important;
}

.nightMode #order-standard_cart label {
    color: #bacae9 !important;
}

.nightMode .primary-bg-color {
    background-color: var(--white);
}

.nightMode #order-standard_cart .view-cart-items .item {
    background-color: transparent;
}

.nightMode .viewcartt .item small {
    background: var(--light-blue);
    color: var(--dark-blue);
}

.nightMode .viewcartt .itemdomain {
    color: #54b8b9;
}

.nightMode .Breadcrumb .active span {
    background: #587bff !important;
}

.nightMode #order-standard_cart .checkbox-inline {
    color: #ffffffb3;
}

.nightMode .pagination>.active>a,
.nightMode .pagination>.active>a:focus,
.nightMode .pagination>.active>a:hover,
.nightMode .pagination>.active>span,
.nightMode .pagination>.active>span:focus,
.nightMode .pagination>.active>span:hover {
    color: #ffffff;
}

.nightMode .dataTables_wrapper .dataTables_length label .form-control {
    background: transparent;
    color: #fff;
}

.nightMode .dataTables_wrapper .dataTables_filter label .form-control {
    background: transparent;
    border-color: #4d547d;
}

.nightMode table.table-list thead th {
    background-color: transparent;
}

.nightMode .table-list>tbody>tr:nth-child(even)>td {
    background-color: #383d61;
}

.nightMode .table-list>tbody>tr>td {
    background-color: #303555;
}

.nightMode .table>tbody>tr>td,
.nightMode .table>tbody>tr>th,
.nightMode .table>tfoot>tr>td,
.nightMode .table>tfoot>tr>th,
.nightMode .table>thead>tr>td,
.nightMode .table>thead>tr>th {
    border-top: 1px solid #1d2031;
}

.nightMode #tabChangepw #containerPassword input {
    background: transparent;
}

.nightMode .user .message {
    color: #f3fffa;
}

.nightMode .viewticket textarea {
    background: var(--white);
}

.nightMode input#inputAttachments:after {
    background: var(--white);
}

.nightMode .invoice-container {
    background: var(--white);
}

.nightMode .invoice4box {
    color: #ffffffad;
}

.nightMode .panel {
    background-color: var(--white);
}

.nightMode .invoicee tbody tr:nth-child(odd) {
    background-color: #383d5f;
}

.nightMode .DownloadvaPrint a {
    background: #444b77;
    border: 2px dashed #1d2031;
    color: #fff;
}

.nightMode .paymentBtnInVoice input {
    color: #ffffff;

    background: #43bf8287;
    border: 2px solid #8cfff3;
}

.nightMode .unpaid {
    color: #ff6363;
}

.nightMode .whiteboard.addfunds form input {
    background: var(--light-blue);
    border-color: var(--light-blue);
    color: #fff;
}

.nightMode .whiteboard.addfunds h4.amount {
    color: #d8e2f594;
}

.nightMode .whiteboard.addfunds form label {
    color: #c5c7d3;
}

.nightMode .affiliates .withdrawrequest {
    background: var(--light-blue);
}

.nightMode .afiilate-stats div i {
    color: var(--light-blue);
}

.nightMode .dotted-animation .main-circle {
    background-color: #b5c4ff;
}

.nightMode td.dataTables_empty:before {
    display: none;
}

.nightMode .dataTables_empty {
    padding-top: 60px !important;
}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.nightMode {}

.responsivemenu {
    display: none
}

.page404 img {
    width: 100%;
    display: block;
    margin: auto;
    max-width: 400px;
}

.page404 h4 {
    font-weight: 700;
    color: var(--dark-blue);
    opacity: .9;
    text-align: center;
    margin-top: 20px;
}

.page404 .buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    float: left;
    gap: 20px;
    margin-top: 30px;
}

.page404 .buttons a {
    border-radius: 5px;
    border: 2px dashed #2a59b7;
    color: #00339b;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f7ff;
    font-weight: 500;
    height: 50px;
    padding: 0 20px;
    width: 200px;
}


.listtable {
    overflow: scroll;
}

.dataTable {
    min-width: 600px !important;
}

.lightbox {
    display: none;
}

.withoutService img {
    width: 200px;
    margin: auto;
    display: block;
    margin-top: -50px;
}

.withoutService span {
    display: block;
    text-align: center;
    margin-top: -20px;
    color: #5d7297;
    font-weight: 600;
}



.header-cart-btn {
    background: #f2f5ff;
    border: 1px solid #bec3d3;
    height: 40px;
    gap: 10px;
    padding: 15px;
    border-radius: 2px;
}

.chpass-oldPass {
    display: grid;
    grid-template-columns: 3fr 1fr;
    gap: 30px;
    height: 50px;
}

.chpass-oldPass .generate-password {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    border-radius: 5px;
    border: 2px solid #cedeff;
    color: #00339b;
    background: #f5f7ff;
    font-weight: 600;
    height: 50px;
}

#nonMatchingPasswordResult {
    color: var(--red)
}

.chpass-newpass {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    margin-top: 30px;
    height: 50px;
}


.chpass-newpass input {
    width: 100%;
    height: 100%;
}

#changePassPage .progress {
    margin-bottom: 30px;
    height: 4px;
}

.chpass-submit {
    width: 210px;
    height: 50px;
    border-radius: 5px;
    border: 4px solid #acf5c2;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: var(--green);
    font-weight: 600;
    float: left;
}

@media (max-width: 1250px) {
    .right {
        position: fixed;
        z-index: 1;
        width: 300px !important;
        left: -100%;
        bottom: 100px;
    }

    .right.active {
        right: 30px;
    }

    section .left {
        width: 90%;
        margin: auto;
    }

    .services {
        overflow-y: scroll;
    }

    nav {
        width: 90%;
    }

    .responsivemenu {
        display: flex;
    }
}

@media (max-width: 992px) {
    section .top {
        grid-template-columns: 1fr 2fr;
    }

    .whiteboard.profile .profileedit {
        grid-template-columns: 1fr 1fr;
    }

    nav h1 {
        display: none;
    }

    .registered {
        grid-template-columns: 1fr;
    }

    .affiliates-link h4 {
        font-size: 15px;
        padding: 20px;
    }

    .affiliates-link h3 {
        font-size: 35px;
    }

    .DownloadvaPrint {
        width: 100%;
    }
}

@media (max-width: 756px) {
    section .top {
        grid-template-columns: 1fr;
        height: 300px;
    }

    nav .logo {
        display: none;
    }

    .service .domain {
        width: 100px;
    }

    .service-bar span {
        width: 70px;
    }

    .addfund {
        grid-template-columns: 1fr;
        gap: 0;
        margin: 30px 0;
    }

    .affiliates .addfund>div:nth-child(2) {
        border: 0;
    }

    .viewticket .answer {
        flex-direction: column;
    }

    .viewticket input#inputAttachments {
        width: 100%;
        margin-top: 0;
    }

    .viewticket .footer-ticket button {
        width: 100%;
        margin-top: 0;
    }

    .viewticket .footer-ticket {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
        height: unset;
    }

    .messages .message {
        width: 100%;
    }

    .lastaddfund {
        display: none !important
    }

    .iconoir-copy {
        display: none;
    }

    .afiilate-stats {
        grid-template-columns: 1fr;
    }

    .invoice4box {
        grid-template-columns: 1fr;
    }

    .affiliates-link h4 {
        overflow: hidden;
    }

    .dataTables_wrapper table.table-list thead th {
        font-size: 12px;
    }

    .activesession {
        overflow-y: scroll;
    }

    .cptools {
        gap: 10px;
    }

    .cptools a {
        font-size: 13px;
    }

    .cptools i {
        display: none;
    }

    .Breadcrumb p {
        display: none;
    }


}

@media (max-width: 576px) {
    .showMenu section .right {
        position: fixed;
        left: 50%;
        width: 90% !important;
        left: 0;
        border-radius: 0;
        border-top-right-radius: 15px;
        position: fixed;
        bottom: 0;
        top: unset;
        right: unset;
    }

    .left-nav .cart-btn {
        font-size: 12px;

    }

    .whiteboard.profile .profileedit {
        grid-template-columns: 1fr;
    }

    .verification {
        grid-template-columns: 1fr;
    }

    input[type='search'] {
        display: none !important;
    }

    .cpanel-feature-row {
        grid-template-columns: 1fr 1fr;
    }

    #cPanelAwstats {
        display: none;
    }

    .newTicket {
        width: 120px;
    }

    .pagination {

        gap: 10px;
    }

    .dataTables_wrapper .dataTables_length label {
        padding-right: 0;
        padding-left: 0;
    }

    div.dataTables_wrapper div.dataTables_paginate {
        padding-right: 0;
        padding-left: 0;
    }

    .whiteboard.addfunds form>div {
        grid-template-columns: 1fr;
    }

    .affiliates-link h3 {
        font-size: 25px;
    }

    .affiliates-link h4 {
        font-size: 12px;
        padding: 10px;
        height: 50px;
        width: 100%;
    }

    .top-left h4 {
        font-size: 13px;
    }

    .top-left a {
        font-size: 13px;
    }

    .wallet h3 {
        font-size: 13px;

    }

    section .left h2 {
        font-size: 13px;
    }

    nav .left-nav {
        gap: 20px
    }

    .service h5 {
        min-width: 120px;
    }

    .addfund>div:nth-child(2) {
        border-left: 0;
    }

    td.dataTables_empty:before {
        display: none;
    }

    .dataTables_empty {
        padding-top: 10px !important;
    }

    .affiliates .withdrawrequest.disabled {
        font-size: 12px;
        padding: 5px;
        gap: 10px;
        width: 170px;
        top: 20px;
        left: 20px;
    }

    .affiliates .withdrawrequest i {
        font-size: 19px;

    }

    .service:nth-child(even) {
        width: max-content;
    }

    .twofaBtn {
        width: 90%;
    }

    .telegrambot {
        display: grid;
    }

    .ranking {
        width: 60px;
        left: 20px;
        top: 20px;
    }

    .bootstrap-switch {
        height: 30px;
    }

    .profilepic {
        width: 70px;
        height: 70px;
    }

    .chpass-oldPass .btn-default.generate-password span {
        display: none;
    }

    #order-standard_cart .products {
        grid-template-columns: 1fr;
    }

    .domainInputGroup {
        grid-template-columns: 1fr;
    }

    #order-standard_cart label {
        font-size: 12px !important;
    }

    #order-standard_cart label .iradio_square-blue {
        z-index: -1;
        visibility: hidden;
    }

    .forblur .input-group {
        display: none;
    }

    #frmProductDomain button {
        height: 50px;
    }

    #productConfigurableOptions {
        padding-left: 0;
    }

    .configProduct .confiGrid {
        gap: 10px
    }

    .configProduct .firstGridConfig {
        grid-template-columns: 1fr;
    }

    .configProduct .nowIP {
        margin-top: 20px;
    }

    .sub-heading span {
        font-size: 14px;
    }

    #frmConfigureProduct .myconfigoptions {
        gap: 20px 20px
    }

    #frmConfigureProduct .myconfigoptions div {
        gap: 5px
    }

    #frmConfigureProduct .summary-totals {
        gap: 20px 20px
    }

    .top-right .total-due-today .amt {
        position: unset;
    }

    .top-right #btnCompleteProductConfig {
        margin-top: 20px;
        width: 100%;
    }

    .top-right .total-due-today span:last-child {
        display: block;
    }

    .total-due-today {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: row-reverse;
        gap: 20px;
        margin-top: 30px;
    }



    .viewcartt .top {
        grid-template-columns: 1fr;
    }

    #order-standard_cart .top {
        display: flex;
        flex-direction: column-reverse;
    }

    section .left {
        width: 95%;
    }

    #order-standard_cart .btn-checkout {
        padding: 15px 25px;
        font-size: 14px;
    }

    .pay-cart {
        gap: 10px;
    }

    .viewcartt .item {
        grid-template-columns: 1fr;
        gap: 20px
    }

    .whiteboard {
        padding: 20px;
    }

    section .left h2:before {
        right: -20px;
    }

    .viewcartt .itemprice {
        flex-direction: row;
        margin-right: auto;
        text-align: center;
    }

    .viewcartt .itemprice:before {
        display: none;
    }

    .myNewUserSignup {
        grid-template-columns: 1fr;
    }

    #btnCompleteOrder {
        position: unset;
        width: 100%;
    }

    .Breadcrumb {
        width: 90%;
        margin: 0 auto;
        margin-top: -10px;
    }

    section .top.servicedetails {
        grid-template-columns: 1fr;
    }

    .alert .pull-right {
        position: unset;
    }

    .alert {
        text-align: center;
    }

    section {
        margin-top: 40px;
    }

    .service-details .affiliate,
    .service-billing .affiliate {
        grid-template-columns: 1fr 1fr;
        gap: 30px 10px;
    }

    .service-details .addfund>div:nth-child(2),
    .service-details .addfund>div:nth-child(5),
    .service-billing .addfund>div:nth-child(2),
    .service-billing .addfund>div:nth-child(5) {
        border: none;
    }

    #tabChangepw #containerPassword {
        grid-template-columns: 1fr;
    }

    .cpanel-usage-stats {
        width: max-content;
        margin: auto;
    }

    .myregisterform form {

        width: 90%;
    }

    .myregisterform .fourregister {
        grid-template-columns: 1fr;
    }

    .myregisterform #containerPassword {
        grid-template-columns: 1fr;
    }

    .myregisterform .login-title span {
        font-size: 24px;
        margin-top: 32px;
    }

    .myregisterform .login-title {
        font-size: 26px;
        margin-top: 20px;
        margin-bottom: -20px;
    }

    .myregisterform button[type='submit'] {
        margin-bottom: 20px !important;
    }

    .myregisterform .registernav1 {
        display: none;
    }

    .myregisterform .registernav {
        width: max-content;
    }

    .myregisterform .registernav2 {
        height: auto;
        padding-top: 35px;
        padding-bottom: 15px;
        margin-top: -50px;
    }

    .custom-login-page-v2 .login-page-header .header-link a {
        height: auto;
        padding-top: 35px;
        padding-bottom: 15px;
        margin-top: -50px;
    }

    .custom-login-page-v2 .login-page-header .navbar-brand.nobg {
        display: none;
    }

    .custom-login-page-v2 .login-wrapper .login-form-container .login-title {
        font-size: 30px;
        margin-bottom: 0;
    }

    .custom-login-page-v2 .login-wrapper .login-form-container .login-title span {
        font-size: 34px;
        padding-top: 14px;
    }

    .login-form-container .login-form {
        padding: 70px 20px 30px 20px;

    }

    .underterminal {
        margin-top: 45px;
    }
}

/* genereal (no media css) */
.ReserPasswordFields {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 30px;
    margin: 50px auto;
    max-width: 550px;
}

#primaryLookupSearching {
    padding-bottom: 20px;
}

#btnDomainContinue {
    margin-bottom: 20px;
}

.UpgradeSubmitButton {
    width: 200px;
    height: 50px;
    border-radius: 5px;
    border: 2px dashed #2a59b7;
    color: #00339b;
    gap: 10px;
    background: #f5f7ff;
    font-weight: 600;
    margin-left: 0;
    float: left;
    align-items: center;
    display: flex;
    justify-content: center;
}

.upgradeFieldinForm {
    border: 1px solid #bfc6cd;
    border-radius: 3px;
    height: 40px;
    width: 40px;
    text-align: center;
}

.CustomeUpgrade table tbody tr td:first-child {
    font-weight: 600;
}


.CustomeUpgrade table tbody tr td:nth-child(1),
.CustomeUpgrade table tbody tr td:nth-child(2),
.CustomeUpgrade table tbody tr td:nth-child(4) {
    padding-top: 19px;
}

.UpgradeInvoice tr.masspay-total td {
    font-weight: 600 !important;
}
.ChangeforgetedPassword{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.ChangeforgetedPasswordForm{
    max-width: 500px;
    margin: auto;
}

.ChangeforgetedPasswordForm .progress{
    height: 4px;

}
.ChangeforgetedPasswordForm input[type='submit']{
    max-width: 200px;
    width: 100%;
    height: 40px;
    margin: auto;
    display: block;
}

#btnTransferDomain{
margin: auto;
    max-width: 200px;
    width: 100%;
    display: block;
    margin-top: 20px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}