/* @font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Light.eot");
    src: url("../fonts/Gilroy-Light.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Gilroy-Light.woff2") format("woff2"),
        url("../fonts/Gilroy-Light.woff") format("woff"),
        url("../fonts/Gilroy-Light.ttf") format("truetype");
    font-weight: light;
    font-style: normal;
}

@font-face {
    font-family: "DM Sans";
    src: url("../fonts/DMSans-Light.eot");
    src: url("../fonts/DMSans-Light.eot?#iefix") format("embedded-opentype"),
        url("../fonts/DMSans-Light.woff2") format("woff2"),
        url("../fonts/DMSans-Light.woff") format("woff"),
        url("../fonts/DMSans-Light.ttf") format("truetype");
    font-weight: light;
    font-style: normal;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Light.eot");
    src: url("../fonts/Gilroy-Light.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Gilroy-Light.woff2") format("woff2"),
        url("../fonts/Gilroy-Light.woff") format("woff"),
        url("../fonts/Gilroy-Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "DM Sans";
    src: url("../fonts/DMSans-Light.eot");
    src: url("../fonts/DMSans-Light.eot?#iefix") format("embedded-opentype"),
        url("../fonts/DMSans-Light.woff2") format("woff2"),
        url("../fonts/DMSans-Light.woff") format("woff"),
        url("../fonts/DMSans-Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Regular.eot");
    src: url("../fonts/Gilroy-Regular.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Gilroy-Regular.woff2") format("woff2"),
        url("../fonts/Gilroy-Regular.woff") format("woff"),
        url("../fonts/Gilroy-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "DM Sans";
    src: url("../fonts/DMSans-Regular.eot");
    src: url("../fonts/DMSans-Regular.eot?#iefix") format("embedded-opentype"),
        url("../fonts/DMSans-Regular.woff2") format("woff2"),
        url("../fonts/DMSans-Regular.woff") format("woff"),
        url("../fonts/DMSans-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Regular.eot");
    src: url("../fonts/Gilroy-Regular.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Gilroy-Regular.woff2") format("woff2"),
        url("../fonts/Gilroy-Regular.woff") format("woff"),
        url("../fonts/Gilroy-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "DM Sans";
    src: url("../fonts/DMSans-Regular.eot");
    src: url("../fonts/DMSans-Regular.eot?#iefix") format("embedded-opentype"),
        url("../fonts/DMSans-Regular.woff2") format("woff2"),
        url("../fonts/DMSans-Regular.woff") format("woff"),
        url("../fonts/DMSans-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Medium.eot");
    src: url("../fonts/Gilroy-Medium.eot") format("embedded-opentype"),
        url("../fonts/Gilroy-Medium.woff2") format("woff2"),
        url("../fonts/Gilroy-Medium.woff") format("woff"),
        url("../fonts/Gilroy-Medium.ttf") format("truetype");
    font-weight: medium;
    font-style: normal;
}

@font-face {
    font-family: "Dm Sans";
    src: url("../fonts/DMSans-Medium.eot");
    src: url("../fonts/DMSans-Medium.eot") format("embedded-opentype"),
        url("../fonts/DMSans-Medium.woff2") format("woff2"),
        url("../fonts/DMSans-Medium.woff") format("woff"),
        url("../fonts/DMSans-Medium.ttf") format("truetype");
    font-weight: medium;
    font-style: normal;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Medium.eot");
    src: url("../fonts/Gilroy-Medium.eot") format("embedded-opentype"),
        url("../fonts/Gilroy-Medium.woff2") format("woff2"),
        url("../fonts/Gilroy-Medium.woff") format("woff"),
        url("../fonts/Gilroy-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "DM Sans";
    src: url("../fonts/DMSans-Medium.eot");
    src: url("../fonts/DMSans-Medium.eot") format("embedded-opentype"),
        url("../fonts/DMSans-Medium.woff2") format("woff2"),
        url("../fonts/DMSans-Medium.woff") format("woff"),
        url("../fonts/DMSans-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Semibold.eot");
    src: url("../fonts/Gilroy-Semibold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Gilroy-Semibold.woff2") format("woff2"),
        url("../fonts/Gilroy-Semibold.woff") format("woff"),
        url("../fonts/Gilroy-Semibold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: "DM Sans";
    src: url("../fonts/DMSans-Semibold.eot");
    src: url("../fonts/DMSans-Semibold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/DMSans-Semibold.woff2") format("woff2"),
        url("../fonts/DMSans-Semibold.woff") format("woff"),
        url("../fonts/DMSans-Semibold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Semibold.eot");
    src: url("../fonts/Gilroy-Semibold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Gilroy-Semibold.woff2") format("woff2"),
        url("../fonts/Gilroy-Semibold.woff") format("woff"),
        url("../fonts/Gilroy-Semibold.ttf") format("truetype");
    font-weight: semi-bold;
    font-style: normal;
}

@font-face {
    font-family: "DM Sans";
    src: url("../fonts/DMSans-Semibold.eot");
    src: url("../fonts/DMSans-Semibold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/DMSans-Semibold.woff2") format("woff2"),
        url("../fonts/DMSans-Semibold.woff") format("woff"),
        url("../fonts/DMSans-Semibold.ttf") format("truetype");
    font-weight: semi-bold;
    font-style: normal;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Bold.eot");
    src: url("../fonts/Gilroy-Bold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Gilroy-Bold.woff2") format("woff2"),
        url("../fonts/Gilroy-Bold.woff") format("woff"),
        url("../fonts/Gilroy-Bold.ttf") format("truetype");
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "DM Sans";
    src: url("../fonts/DMSans-Bold.eot");
    src: url("../fonts/DMSans-Bold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/DMSans-Bold.woff2") format("woff2"),
        url("../fonts/DMSans-Bold.woff") format("woff"),
        url("../fonts/DMSans-Bold.ttf") format("truetype");
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Bold.eot");
    src: url("../fonts/Gilroy-Bold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Gilroy-Bold.woff2") format("woff2"),
        url("../fonts/Gilroy-Bold.woff") format("woff"),
        url("../fonts/Gilroy-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "DM Sans";
    src: url("../fonts/DMSans-Bold.eot");
    src: url("../fonts/DMSans-Bold.eot?#iefix") format("embedded-opentype"),
        url("../fonts/DMSans-Bold.woff2") format("woff2"),
        url("../fonts/DMSans-Bold.woff") format("woff"),
        url("../fonts/DMSans-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
} */

html {
    /* font-size: calc(15px + (19.75 - 15) * ((100vw - 300px) / (3000 - 300))); */
    font-size: calc(
        13.2846px + (19.75 - 13.2846) * ((100vw - 300px) / (3000 - 300))
    );
}

body {
    -webkit-font-smoothing: antialiased;
    /* font-family: "Gilroy" !important; */
    /* background: #f8f8fb; */
    overflow-x: hidden;
}

* {
    scrollbar-width: thin;
    scrollbar-color: #f1f1f1;
}

::-webkit-input-placeholder {
    color: #696969;
    font-weight: 400;
}

::-moz-placeholder {
    color: #696969;
    font-weight: 400;
}

:-ms-input-placeholder {
    color: #696969;
    font-weight: 400;
}

:-moz-placeholder {
    color: #696969;
    font-weight: 400;
}

::-webkit-scrollbar {
    width: 0px;
    height: 7px;
    border-radius: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 8px;
}

::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 8px;
}

::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
    border-radius: 8px;
}

.container {
    max-width: 100vw;
}

.cc-down {
    color: #a6acbe;
}

.elp {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 179px;
}

/* table {
    background: #ffffff;
    border-radius: 10px;
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 1rem;
    color: #334d6e;
}

table a {
    text-decoration: none;
}

table a:hover {
    text-decoration: none;
}

thead th {
    font-weight: 600;
} */

/* button {
    padding: 0.5em 2em;
    cursor: pointer;
    background: #058ed9;
    border-radius: 5px;
    border: 0;
    color: #fff;
} */
.btn-style {
    font-size: 18px;
    font-weight: 500;
    padding: 18px 18px;
    text-align: center;
    background-color: #058ed9;
    border-radius: 9px;
}
.btn-style2 {
    padding: 15px 10px;
    border-radius: 9px;
    background-color: #f8f8fb;
    color: #222;
}

.text-purp {
    color: #058ed9;
}

a.text-purp:hover {
    transition: all 0.5s;
    color: #6f52ee;
    text-decoration: none;
}

a:hover {
    transition: all 0.5s;
    /* opacity: 0.7; */
    text-decoration: none;
}
/*
button:hover {
    transition: all 0.5s;
    opacity: 0.7;
} */

/* thead {
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0px 3px 14px #a6acbe;
} */

.head-cont {
    padding-top: 3em;
}

.head-text-cont p {
    font-size: 0.88rem;
    line-height: 1rem;
    letter-spacing: 0.01em;
    color: #a6acbe;
}

.head-cont-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
}

.grid-4-col {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 2fr;
    grid-column-gap: 2em;
}

.grid-5-col {
    display: grid;
    grid-template-columns: 2fr 2fr 2fr 2fr 2fr;
    grid-column-gap: 2em;
}

.w-25px {
    width: 25px;
}

thead tr th {
    padding-left: 2em;
    padding-top: 2em;
    padding-bottom: 2em;
    text-transform: uppercase;
    font-weight: 600;
    white-space: nowrap;
    font-size: 0.81rem;
}

thead tr th:nth-child(4),
thead tr th:nth-child(5),
thead tr th:nth-child(6),
thead tr th:nth-child(7),
thead tr th:nth-child(8),
thead tr th:nth-child(9) {
    text-align: right;
}

tbody tr td:nth-child(4),
tbody tr td:nth-child(5),
tbody tr td:nth-child(6),
tbody tr td:nth-child(7),
tbody tr td:nth-child(8),
tbody tr td:nth-child(9) {
    text-align: right;
}

tbody tr td:nth-child(3),
tbody tr td:nth-child(4),
tbody tr td:nth-child(5),
tbody tr td:nth-child(6),
tbody tr td:nth-child(7),
tbody tr td:nth-child(8),
tbody tr td:nth-child(9) {
    color: #231f20;
}

tbody tr td:nth-child(9) a {
    padding-right: 2em;
}

tfoot tr td:nth-child(6) {
    text-align: center;
    place-content: center;
}

/* tbody tr td {
    padding-left: 2em;
    padding-top: 1.5em;
    padding-bottom: 1.5em;
    max-width: 250px;
    word-wrap: break-word;
    white-space: nowrap;
    font-size: 0.81rem;
    line-height: 19px;
    font-weight: normal;
    letter-spacing: 0.01em;
    color: #707683;
} */

.text-gray-tb {
    color: #707683 !important;
}

/* tfoot tr td {
    max-width: 250px;
    word-wrap: break-word;
    white-space: nowrap;
}

tbody tr td:nth-child(2) {
    color: #323c47;
    font-weight: bold;
}

thead tr td:nth-child(2),
tbody tr td:nth-child(2),
tfoot tr td:nth-child(2) {
    width: 25px;
    font-size: 0.93rem;
    line-height: 1.375rem;
    letter-spacing: 0.01em;
    color: #a6acbe;
} */

.sel-cust {
    border: solid 1px #dadce5;
    padding: 1em;
    border-radius: 4px;
    font-weight: 600;
    text-align: center;
    vertical-align: center;
    color: #058ed9;
}

.nav-cont {
    background: #058ed9;
}

.navbar {
    width: 95vw;
    margin-left: 5.5vw;
    height: 100px;
}

.nav-link {
    font-weight: 300;
    font-size: 1rem;
    line-height: 19px;
    font-style: normal;
    letter-spacing: 0.01em;
}

.useravatar-grid {
    display: grid;
    grid-template-columns: 10fr 2fr;
    grid-column-gap: 1em;
    position: relative;
}

.useravatar {
    cursor: pointer;
}

.main-nav-grid {
    display: grid;
    grid-template-columns: minmax(50px, 100px) 1fr;
}

/* .selected {
    border-left: 5px solid #058ed9;
    padding-top: 0.5em;
}

#settings-header-nav .selected {
    border: 0;
    border-bottom: 2px solid #058ed9 !important;
    padding-top: unset;
}

.selected > .nav-link {
    font-weight: 600;
    color: #058ed9 !important;
} */

.mt-2em {
    margin-top: 1.8em;
}

.navbar-nav-grid {
    display: grid;
    grid-template-columns: minmax(50px, 120px) minmax(50px, 225px) minmax(
            50px,
            210px
        );
    grid-column-gap: 0.5em;
}

.nav-link {
    font-size: 1rem;
    color: #058ed9;
}

h1 {
    font-weight: bold;
    font-size: 1.875rem;
    line-height: 36px;
    letter-spacing: 0.01em;
}

h2 {
    font-weight: 600;
    font-size: 1.375rem;
    line-height: 26px;
    color: #000000;
}

h3 {
    font-weight: 600;
    font-size: 1rem;
    line-height: 19px;
    color: #231f20;
}

.fs-8 {
    font-size: 0.5rem !important;
}

.fs-9 {
    font-size: 0.5625rem !important;
}

.fs-10 {
    font-size: 0.625rem !important;
}

.fs-11 {
    font-size: 0.6875rem !important;
}

.fs-12 {
    font-size: 0.75rem !important;
}

.fs-13 {
    font-size: 0.8125rem !important;
}

.fs-15 {
    font-size: 0.9375rem !important;
}

.fs-14 {
    font-size: 0.88rem !important;
}

.fs-16 {
    font-size: 1rem !important;
}

.fs-18 {
    font-size: 1.125rem !important;
}

.lh-20 {
    line-height: 20px;
}

.lh-29 {
    line-height: 29px;
}

.fs-20 {
    font-size: 1.25rem !important;
}

.fs-24 {
    font-size: 1.5rem !important;
}

.fs-26 {
    font-size: 1.625rem !important;
}

.fs-30 {
    font-size: 1.875rem !important;
}

.fs-32 {
    font-size: 2rem !important;
}

.lh-26 {
    line-height: 26px;
}

.fs-28 {
    font-size: 28px !important;
}

.fs-42 {
    font-size: 2.625rem !important;
}

.fs-46 {
    font-size: 2.875rem !important;
}

.fs-48 {
    font-size: 3rem !important;
}

.fs-50 {
    font-size: 3.125rem !important;
}

.fs-plus {
    font-size: 20px !important;
}

.add-text {
    font-style: normal;
    font-weight: 600;
    line-height: 17px;
    letter-spacing: 0.01em;
    padding-right: 1.5em;
}

.add-btn {
    max-width: 266px;
    min-width: 255px;
    height: 50px;
    height: 50px;
    display: grid;
    /* grid-template-columns: 2fr 10fr; */
    font-size: 1rem;
    align-items: center;
    padding: 0.5rem;
}

.lh-24 {
    line-height: 24px;
}

.lh-36 {
    line-height: 36px;
}

.lh-16 {
    line-height: 1rem;
}

.fw-600 {
    font-weight: 600;
}

.fw-700 {
    font-weight: 700;
}

.nav-actions {
    height: 60%;
    border-left: 2px solid #eff4f7;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1em;
    padding-left: 1em;
    padding-right: 3em;
}

.avatar-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1em;
}

.profile-un {
    font-size: 0.75rem;
    line-height: 1.53rem;
    text-align: right;
    letter-spacing: 0.01em;
    color: #a6acbe;
}

.user-org {
    font-size: 0.88rem;
    line-height: 1rem;
    margin-left: auto;
    text-align: right;
    letter-spacing: 0.01em;
    font-weight: 600;
}

.hover:hover {
    transition: all 0.5s;
    opacity: 0.7;
}

.br-0 {
    border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    -ms-border-radius: 0px !important;
    -o-border-radius: 0px !important;
}

.br-8 {
    border-radius: 8px !important;
    -webkit-border-radius: 8px !important;
    -moz-border-radius: 8px !important;
    -ms-border-radius: 8px !important;
    -o-border-radius: 8px !important;
}

.br-9 {
    border-radius: 9px !important;
    -webkit-border-radius: 9px !important;
    -moz-border-radius: 9px !important;
    -ms-border-radius: 9px !important;
    -o-border-radius: 9px !important;
}

.br-10 {
    border-radius: 10px !important;
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    -ms-border-radius: 10px !important;
    -o-border-radius: 10px !important;
}

.br-13 {
    border-radius: 13px !important;
    -webkit-border-radius: 13px !important;
    -moz-border-radius: 13px !important;
    -ms-border-radius: 13px !important;
    -o-border-radius: 13px !important;
}

.br-15 {
    border-radius: 15px !important;
    -webkit-border-radius: 15px !important;
    -moz-border-radius: 15px !important;
    -ms-border-radius: 15px !important;
    -o-border-radius: 15px !important;
}

.br-38 {
    border-radius: 38px !important;
    -webkit-border-radius: 38px !important;
    -moz-border-radius: 38px !important;
    -ms-border-radius: 38px !important;
    -o-border-radius: 38px !important;
}
select.sel-cust {
    background: url("../img/dd_arrow_new.svg") no-repeat;
    background-position: 90% 50%;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: "";
    min-height: 50px;
}

select.sel-cust::-ms-expand {
    display: none;
}

.table-btn {
    background: #2ed47a;
    border-radius: 4px;
    font-weight: 600;
    font-size: 11px;
    line-height: 1rem;
    text-align: center;
    letter-spacing: 0.02em;
    color: #ffffff;
}

/* .table-cont {
    margin-top: 2.5rem;
} */

.tfoot-pagination {
    font-weight: 600;
    color: #a6acbe;
    font-size: 1.125rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.tfoot-links {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10px, 30px));
    justify-items: center;
    grid-column-gap: 0.8em;
    padding-right: 2em;
}

.gray-link {
    color: #a6acbe !important;
}

.gray-link:hover {
    text-decoration: none;
}

#nc-details-modal {
    position: fixed;
    bottom: 50%;
    transform: translateY(50%);
    left: 0;
    right: 0;
    background: white;
    z-index: 128376;
    display: grid;
    grid-template-columns: 1fr;
    padding: 1em 2em;
    width: 347px;
    height: 413px;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
}

#nc-details-modal form {
    display: grid;
    grid-template-columns: 1fr;
    /* grid-row-gap: 1em; */
    grid-template-rows: 40px 50px 123px 100px;
}

#nc-details-modal .steplbl {
    font-style: normal;
    font-weight: bold;
    font-size: 0.88rem;
    line-height: 20px;
    color: #a6acbe;
}

.campaign-modal button {
    color: white;
    font-size: 0.88rem !important;
    border-radius: 10px;
}

.campaign-modal textarea {
    resize: none;
    height: 77px;
}

.campaign-modal input[type="text"],
.campaign-modal textarea {
    background: #f8f8fb !important;
    border: 0;
    border-radius: 5px;
}

.btn {
    font-weight: 600;
    border-radius: 10px;
}

.btn:hover {
    opacity: 0.8;
}

.btn-cancel {
    background: #f8f8fb;
    color: #a6acbe !important;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:visited,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    background: #058ed9;
    background-color: #058ed9 !important;
    border-color: #058ed9 !important;
    color: white;
    border: 0;
    box-shadow: unset;
}

.one-col-grid {
    display: grid;
    grid-template-columns: 1fr;
    grid-row-gap: 0.5em;
}

.two-col-grid {
    display: grid;
    grid-template-columns: 11fr 1fr;
    grid-row-gap: 1em;
}

.two-col-true {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1em;
}

.three-col-true {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 1em;
}

.no-grid-row-gap {
    grid-row-gap: unset;
}

.blur {
    z-index: 3;
    overflow-y: hidden;
    height: 100vh;
    width: 100vw;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    /*background: rgba(166, 172, 190, 0.26);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);*/
}

.side-nav-blur {
    z-index: 3;
    overflow-y: hidden;
    overflow-x: hidden;
    height: 100%;
    width: 100%;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(166, 172, 190, 0.26);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

/* .modal-title {
    font-weight: 600;
    font-size: 1.375rem !important;
    line-height: 26px;
}

.modal-close {
    font-weight: bold;
} */

.donation-form-view {
    position: absolute !important;
    background: #f8f8fb !important;
    padding: 0 !important;
    left: 0 !important;
    right: 25vw !important;
    width: unset !important;
    height: unset !important;
}

.tl-tr-br {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.move-right {
    position: relative;
    left: 1em;
}

.color-orb {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #ff0000;
}

.justify-items-left {
    justify-items: left;
}

.fw-400 {
    font-weight: 400 !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.blue-link {
    color: #0040ff !important;
}

.blue-link:hover {
    text-decoration: none !important;
}

.fw-600 {
    font-weight: 600;
}

.two-col-1-5 {
    display: grid;
    grid-template-columns: 1fr 8fr;
    grid-column-gap: 0.5em;
}

.fw-300 {
    font-weight: 300;
}

.fw-normal {
    font-weight: normal;
}

.d-block-all > * {
    display: block;
}

#layoutform .label {
    font-size: 0.88rem;
    line-height: 20px;
    color: #231f20;
}

#layoutform textarea {
    resize: none;
}

#layoutform .messagefreq .subfieldset {
    display: grid;
    grid-template-columns: 1fr 11fr;
}

.br-6 {
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}

.br-20 {
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

.bg-da {
    background: #dad7fe;
}

.char-counter-grid {
    display: grid;
    grid-template-columns: 11fr 1fr;
    grid-column-gap: 1em;
}

.bg-white-f8 {
    background: #f8f8fb;
}

.br-5 {
    border-radius: 5px !important;
    -webkit-border-radius: 5px !important;
    -moz-border-radius: 5px !important;
    -ms-border-radius: 5px !important;
    -o-border-radius: 5px !important;
}

.w-40 {
    width: 40%;
}

.form-color-picker {
    display: grid;
    grid-template-columns: 3fr 8fr;
    width: 40%;
}

.h-40px {
    height: 40px;
}

.h-fit {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
}

.email-temp-grid {
    display: grid;
    grid-template-columns: 4fr 8fr;
    grid-column-gap: 2em;
}

.fs-22 {
    font-size: 1.375rem !important;
}

.fs-96 {
    font-size: 6rem !important;
}

.op-04 {
    opacity: 0.4;
}

.dm-search {
    background: url("../img/search.svg") no-repeat;
    background-position: 10% 50%;
    padding-left: 5em;
    max-width: 401px;
    font-weight: 600;
    font-size: 0.88rem;
    line-height: 17px;
    letter-spacing: 0.01em;
    border: 1px solid #dadce6;
}

.text-info {
    color: #058ed9 !important;
}

.dm-search::-webkit-input-placeholder {
    color: #c9ced6;
}

.dm-search::-moz-placeholder {
    color: #c9ced6;
}

.dm-search:-ms-input-placeholder {
    color: #c9ced6;
}

.dm-search::-ms-input-placeholder {
    color: #c9ced6;
}

.dm-search::placeholder {
    color: #c9ced6;
}

.dm-func-grid {
    display: grid;
    grid-template-columns: 3fr 3fr 6fr;
    grid-column-gap: 1em;
}

thead tr th:nth-child(4),
thead tr th:nth-child(5),
thead tr th:nth-child(6),
thead tr th:nth-child(7) {
    text-align: center;
}

tbody tr td:nth-child(4),
tbody tr td:nth-child(5),
tbody tr td:nth-child(6),
tbody tr td:nth-child(7) {
    text-align: center;
}

.rot-90 {
    transform: rotate(90deg);
}

.rot-n90 {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transition: 0.3s all ease-in;
    -webkit-transition: 0.3s all ease-in;
    -moz-transition: 0.3s all ease-in;
    -ms-transition: 0.3s all ease-in;
    -o-transition: 0.3s all ease-in;
}

.rot-n180 {
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    transition: 0.3s all ease-in;
    -webkit-transition: 0.3s all ease-in;
    -moz-transition: 0.3s all ease-in;
    -ms-transition: 0.3s all ease-in;
    -o-transition: 0.3s all ease-in;
}

.temp_collapse {
    cursor: pointer;
}

[v-cloak] {
    display: none;
    opacity: 0;
}

tbody.campaignlist_tablebody tr {
    cursor: pointer;
}

tbody.campaignlist_tablebody tr:hover {
    background: #dfe1ea;
}

.navbar-main-grid {
    display: -webkit-box !important;
}

.hod {
    display: none;
}

.hom {
    display: block;
}

.text-muted {
    color: #000000;
    mix-blend-mode: normal;
    opacity: 0.4;
}

.color-gr-a6 {
    color: #a6acbe !important;
}

.d-grid {
    display: grid;
}

.w-fit {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

.hod-hmb {
    display: none;
}

.logout-side-nav {
    display: grid;
    grid-template-columns: 1fr 11fr;
    align-items: center;
    grid-column-gap: 0.5rem;
}

.edit-layout-email-main {
    display: grid;
    grid-template-columns: 1.5fr 2fr;
    grid-column-gap: 30px;
    grid-row-gap: 1.5em;
}

.edit-layout-receipt-main {
    display: grid;
    grid-template-columns: 1.2fr 2.5fr;
    -moz-column-gap: 30px;
    column-gap: 30px;
}

#empty_campaign {
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
    margin-left: auto;
    margin-right: auto;
}

.switch-wrap {
    cursor: pointer;
    background: #fff;
    padding: 3px;
    width: 40px;
    height: 24px;
    border-radius: 12px;
    border: 2px solid #058ed9;
}

.switch-wrap input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.switch {
    height: 100%;
    display: grid;
    grid-template-columns: 0fr 1fr 1fr;
    transition: 0.2s;
}

.switch::after {
    content: "";
    border-radius: 50%;
    background: #ccc;
    grid-column: 2;
    transition: background 0.2s;
}

input:checked + .switch {
    grid-template-columns: 1fr 1fr 0fr;
}

input:checked + .switch::after {
    background-color: #058ed9;
}

.toggle-control {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 1.375rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.toggle-control input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.toggle-control input:checked ~ .control {
    background-color: transparent;
    border: solid #058ed9 2px;
    /* background-color: #058ED9; */
}

.toggle-control input:checked ~ .control:after {
    border: solid #058ed9 2px;
    left: 7px;
    height: 8px;
    width: 8px;
    top: 1px;
}

.toggle-control .control {
    position: absolute;
    top: 3.8px;
    left: 0;
    height: 14px;
    width: 20px;
    border-radius: 12px;
    background-color: transparent;
    transition: background-color 0.15s ease-in;
    border: #a6acbe 2px solid;
    /* position: absolute;
    top: 0;
    left: 0;
    height: 24px;
    width: 40px;
    border-radius: 12px;
    background-color: darkgray;
    transition: background-color 0.15s ease-in; */
}

.toggle-control .control:after {
    content: "";
    position: absolute;
    left: 1px;
    top: 1px;
    width: 8px;
    height: 8px;
    border-radius: 12px;
    background: white;
    transition: left 0.15s ease-in;
    border: #a6acbe 2px solid;
    -webkit-transition: left 0.15s ease-in;
    -moz-transition: left 0.15s ease-in;
    -ms-transition: left 0.15s ease-in;
    -o-transition: left 0.15s ease-in;
}

.dd-settings {
    position: absolute;
    bottom: -4.7em;
    right: 2em;
    background-color: #ffffff;
    padding: 1em 2em;
    display: grid;
    grid-template-columns: 1fr 11fr;
    align-items: center;
    grid-column-gap: 1em;
    border-radius: 0px 0px 10px 10px;
    font-size: 1rem;
    line-height: 1.125rem;
    color: #231f20;
    width: 230px;
}

.dd-settings.no-hover {
    color: #231f20;
}

/*Vue transition */

.fade-enter-active,
.fade-leave-active {
    transition: all 0.5s;
}

.fade-enter,
.fade-leave-to {
    transition: all 0.5s;
    opacity: 0;
}

/* Enter and leave animations can use different */

/* durations and timing functions.              */

.slide-fade-enter-active {
    transition: all 1s ease;
}

.slide-fade-leave-active {
    transition: all 0.1s cubic-bezier(1, 0.5, 0.8, 1);
}

.slide-fade-enter,
.slide-fade-leave-to
/* .slide-fade-leave-active below version 2.1.8 */ {
    transform: translateX(10px);
    opacity: 0;
}

.w-35 {
    width: 35%;
}

.w-50 {
    width: 50%;
}

/*Vue transition End */

.no-hover:hover {
    transition: unset;
    opacity: 1;
    text-decoration: none;
}

.dd_settings_show_sidenav {
    /* border: 2px solid #DADCE6; */
    position: absolute;
    bottom: 0;
    top: 3em;
    right: 0;
    left: 0;
    padding-bottom: 2em;
    grid-template-columns: 1fr 11fr;
    justify-items: center;
    /* background-color: #DADCE6; */
    /* width: 50%; */
    /* padding: 1.5em 1em; */
    margin-left: auto;
    margin-right: 2em;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
}

.cursor-pointer {
    cursor: pointer;
}

.br-14 {
    border-radius: 14px !important;
    -webkit-border-radius: 14px !important;
    -moz-border-radius: 14px !important;
    -ms-border-radius: 14px !important;
    -o-border-radius: 14px !important;
}

.br-15 {
    border-radius: 15px !important;
    -webkit-border-radius: 15px !important;
    -moz-border-radius: 15px !important;
    -ms-border-radius: 15px !important;
    -o-border-radius: 15px !important;
}

.br-29 {
    border-radius: 29px !important;
    -webkit-border-radius: 29px !important;
    -moz-border-radius: 29px !important;
    -ms-border-radius: 29px !important;
    -o-border-radius: 29px !important;
}

.input-error {
    border: 1px solid #ff4c61 !important;
}

.input-error:focus {
    border: 2px solid #ff4c61 !important;
    outline: unset;
}

.indicator_lbl {
    display: none;
    position: absolute;
    /* top: 5em; */
    font-size: 10px;
    transition: all 0.5s ease;
    opacity: 0;
}

.indicator_lbl.show {
    display: block;
    top: 2.5em;
    margin-left: 1em;
    transition: all 0.5s ease;
    opacity: 1;
}

.indicator_lbl.t5 {
    top: 0.5em;
}

.indicator_lbl.error {
    /* display: block; */
    transition: all 0.5s ease;
    opacity: 1;
    color: #ff4c61;
}

.justify-self-center {
    justify-self: center;
}

.border-head {
    border-bottom: 2px solid #eef0f7;
}

/* Paste this css to your style sheet file or under head tag */

/* This only works with JavaScript,
if it's not present, don't show loader */

.no-js #loader {
    display: none;
}

.js #loader {
    display: block;
    position: absolute;
    left: 100px;
    top: 0;
}

.se-pre-con {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url(" {{ asset('admin/assets/img/pulse2.gif') }}") center
        no-repeat #f8f8fb;
}

.swal-button--confirm {
    background-color: #058ed9 !important;
}

.border-c9 {
    border: 1px solid #c9ced6;
}

.add-btn-content-cont {
    display: grid;
    grid-template-columns: 50px 80%;
}

.details-head h1 {
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    word-break: break-word;
    text-overflow: ellipsis;
    padding-right: 1rem;
}

#nc-details-modal.rename-campaign-modal {
    height: 315px;
    width: 430px;
}

.camp-rename {
    height: 50px;
}

#nc-details-modal.rename-campaign-modal form {
    grid-template-columns: 1fr;
    /* grid-row-gap: 1em; */
    grid-template-rows: 40px 50px 140px 100px;
}

#nc-details-modal.rename-campaign-modal form label {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
}

.modal-footer {
    border-top: 0;
}

.modal-footer p {
    color: #a6acbe;
}

.elp {
    max-width: 179px;
}

.main-background-img {
    height: 700px;
    position: relative;
    display: flex;
    align-items: center;
    background-size: cover !important;
    background-position: center !important;
    padding: 30px 0px;
}


.main-background-img::before {
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
}
.bg-main-content {
    position: relative;
    z-index: 2;
    padding: 0px 40px;
}
.main-title-cont {
    font-size: 70px;
    color: #fff;
    font-weight: 700;
    width: 65%;
    padding: 100px 0px;
}
/* .form-control,
.designation-select .designate-dropdown {
    background-color: rgba(54, 63, 86, 0.08) !important;
    border-radius: 9px !important;
    height: 50px !important;
    border: none !important;
    box-shadow: none;
}
.form-control-style {
    background-color: transparent;
    border: 1px solid #a9a9a9;
    height: 50px !important;
    border-radius: 5px;
    width: 100%;
} */
.username-input {
    border-bottom-left-radius: 0px !important;
    border-top-left-radius: 0px !important;
}
/* .form-control:focus {
    box-shadow: none !important;
} */
.input-group-pwd {
    position: relative;
}
.input-group-pwd .input-group-append {
    margin-left: -1px;
    position: absolute;
    bottom: 50%;
    transform: translateY(50%);
    right: 15px;
}
.input-group-pwd .input-group-append button {
    background-color: transparent;
}
.form-select-option {
    position: relative;
}
.form-select-option .form-select {
    -webkit-appearance: none;
}

.form-select-option i {
    position: absolute;
    right: 15px;
    bottom: 50%;
    transform: translateY(50%);
    color: #8f8f8f;
}

.cust-chk-bx {
    display: inline-block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 0;
    cursor: pointer;
    user-select: none;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    color: #363f56;
}

.cust-chk-bx input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.cust-chk-bx input:checked ~ .cust-chkmark {
    background-color: #058ed9;
    border-color: #058ed9;
}

.cust-chkmark {
    position: absolute;
    top: 5px;
    left: 0;
    height: 20px;
    width: 20px;
    border: 1px solid #a3aed0;
    border-radius: 2px;
    background-color: #fff;
    margin-bottom: 0;
    padding: 0;
}

.cust-chk-bx input:checked ~ .cust-chkmark:after {
    display: block;
}

.cust-chk-bx .cust-chkmark:after {
    left: 7px;
    top: 3px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.cust-chkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.order-radio-option input[type="radio"]:checked + label {
    background: none;
    box-shadow: none;
    border: none;
}

.page-bg {
    background: rgba(5, 142, 217, 0.8);
}

.login-page-content .main-title-cont {
    font-size: 40px;
}

.login-with-option {
    margin-top: 30px;
}
.login-with-option .btn-style2 {
    width: calc(33.33% - 10px);
    margin-right: 10px;
    margin-top: 10px;
}
.login-with-option .btn-style2:last-child {
    margin-right: 0px;
}
.login-with-option img {
    vertical-align: top;
}

.login-page-content .main-background-img {
    height: 100%;
}
.reset-password-content .bg-main-content {
    padding: 50px 50px;
}
.reset-password-content .main-title-cont {
    font-size: 40px;
    padding: 60px 0px;
}

.main-title-inr a {
    text-decoration: underline;
}
.navbar-nav .dropdown-menu {
    min-width: 90px;
}
.navbar-nav .dropdown-menu .nav-link {
    padding: 10px !important;
}

.navbar-nav .dropdown-toggle::after {
    border: none !important;
}

/* .navbar-nav .nav-item .nav-link:first-child {
    padding: 17px 17px 17px 0;
} */

.navbar-nav li:last-child {
    margin-right: 0px;
}
.text-link {
    color: #058ed9;
}

.campaigns-card {
    background-color: #058ed9;
}
.tfoot-pagination .tfoot-links li {
    list-style: none;
}
.h-auto {
    height: auto !important;
}
.text-d-underline {
    text-decoration: underline !important;
}

.donattion-price-box {
    background: #ffffff;
    box-shadow: 0px 15px 15px rgba(166, 172, 190, 0.15);
    border-radius: 50px;
}
.sp-colorize-container {
   /* position: absolute;
    height: 20px;
    width: 20px !important;
    bottom: 50%;
    transform: translateY(50%);
    right: 15px;
    border-radius: 50%;
    display: grid;*/
}

.sp-colorize-container input {
    padding-left: 15px !important;
}

.form-alignment-button {
    list-style: none;
    display: flex;
    padding-left: 0px;
}
.form-alignment-button li {
    margin-right: 15px;
}
.form-alignment-button .align-btn {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}
.form-alignment-button .align-btn.active {
    background-color: #eef0f6;
}

.donation-u-image {
    width: 90px;
    height: 90px;
    box-shadow: rgb(166 172 190 / 15%) 0px 15px 15px;
    margin-top: -45px;
}
.donation-user-cont .card {
    margin: 50px 0px;
}

.frm-control {
    padding: 12px 20px;
    background-color: #fff;
    border: 1px solid #058ed9;
    border-radius: 5px;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
}

.frm-control.frm-select {
    -webkit-appearance: none;
}

.frm-select-op {
    position: relative;
}

.frm-select-op i {
    position: absolute;
    bottom: 50%;
    transform: translateY(50%);
    right: 15px;
}
.main-btn-blue {
    padding: 9px 25px;
    background-color: #058ed9;
    font-size: 14px;
    color: #fff;
    border: 1px solid #058ed9;
    border-radius: 10px;
}
.main-btn-white {
    padding: 9px 25px;
    background-color: #fff;
    font-size: 14px;
    color: #058ed9;
    border: 1px solid #058ed9;
    border-radius: 10px;
}
.main-btn-blue2 {
    padding: 6px 20px;
    background-color: #e6f4fb;
    font-size: 14px;
    color: #058ed9;
    border: 1px solid #e6f4fb;
    border-radius: 25px;
    font-weight: 500;
}

.top-search-int {
    height: 40px;
    border: 1px solid rgb(160, 160, 160);
    padding: 8px 8px 8px 45px;
    border-radius: 8px;
    font-size: 14px;
    width: 100%;
    font-weight: 300;
}

.top-search-int:focus-visible {
    outline: none !important;
}

.fundraisers_search.top-search-int {
    width: auto;
}

.campaign-nav-tabs li a {
    color: #a6acbe;
}

/* .preview-form-url label {
    min-width: 140px;
}
.preview-form-url input,
.preview-form-url textarea {
    border-radius: 8px 0px 0px 8px !important;
}
.preview-form-url button.btn-primary {
    border-radius: 0px 8px 8px 0px !important;
}
.preview-form-url textarea {
    margin-bottom: 0px;
}

.preview-form-url .copy-btn {
    padding: 13px !important;
} */

/*--- cust radio css ---*/
.cust-radio-btn [type="radio"]:checked,
.cust-radio-btn [type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}

.cust-radio-btn [type="radio"]:checked + label,
.cust-radio-btn [type="radio"]:not(:checked) + label {
    position: relative;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #363f56;
    padding-left: 25px;
    cursor: pointer;
    margin-bottom: 0;
    display: inline-block;
}

.cust-radio-btn [type="radio"]:checked + label:before,
.cust-radio-btn [type="radio"]:not(:checked) + label:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 17px;
    height: 17px;
    border: 2px solid #a3aed0;
    border-radius: 50%;
}

.cust-radio-btn [type="radio"]:checked + label:after,
.cust-radio-btn [type="radio"]:not(:checked) + label:after {
    content: "";
    width: 9px;
    height: 9px;
    background: linear-gradient(135deg, #868cff 0%, #058ed9 100%), #058ed9;
    position: absolute;
    border-color: #058ed9;
    top: 4px;
    left: 4px;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.cust-radio-btn [type="radio"]:checked + label:before {
    border-color: #058ed9;
}

.cust-radio-btn [type="radio"]:not(:checked) + label:after {
    opacity: 0;
    transform: scale(0);
}

.cust-radio-btn [type="radio"]:checked + label:after {
    opacity: 1;
    transform: scale(1);
}

.supporter-delete {
    background-color: #ffeeeb;
    padding: 12px;
    line-height: 1;
}

.installation-content {
    position: relative;
}
.installation-content .install-button {
    position: absolute;
    bottom: 10px;
    left: 25px;
    background: #ffff;
    right: 25px;
    display: inline-block;
}

/* .default-word-text {
    padding: 5px 10px;
    background: rgba(218, 215, 254, 0.17);
    border-radius: 2px;
    position: relative;
    margin-left: 20px;
    color: #a6acbe;
}
.default-word-text::before {
    content: "";
    position: absolute;
    left: -12px;
    bottom: 50%;
    transform: translateY(50%);
    height: 12px;
    width: 12px;
    background: rgba(218, 215, 254, 0.17);
    clip-path: polygon(0 50%, 100% 100%, 100% 0);
} */

.thank-you-image {
    background-color: #f8f8fb;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 350px;
}

.uploader {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px 12px 0px 0px;
}

.avatar-upload {
    position: absolute;
    bottom: -60px;
    left: 15px;
}

.avatar-upload .avatar-edit {
    position: absolute;
    right: -5px;
    z-index: 1;
    bottom: 10px;
}

.avatar-upload .avatar-edit input {
    display: none;
}

.avatar-upload .avatar-edit input + label {
    display: inline-block;
    width: 30px;
    height: 30px;
    margin-bottom: 0;
    border-radius: 100%;
    background-color: #004aad;
    border: 2.58333px solid #fff;
    cursor: pointer;
    font-weight: normal;
}

.image-upload-wrap .drag-text {
    box-shadow: rgb(166 172 190 / 15%) 0px 15px 15px;
    padding: 15px;
    border-radius: 50%;
    width: 150px;
    height: 150px;
    margin: auto;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.file-upload-content .image-title-wrap {
    position: absolute;
    top: 0;
    right: 90px;
}

.email-editor .card-header a[aria-expanded="false"] i {
    transform: rotate(270deg);
    display: block;
}

.designation-list.list-group-item {
    font-weight: 600;
    margin-bottom: 10px;
    color: #5a5a5a;
    background: #f6f6f6;
    border: unset;
    border-radius: 0px;
}
.designation-list .designation-svg {
    cursor: grab;
    vertical-align: middle;
}
.profile-page-upload {
    display: inline-block;
}

.profile-page-upload .edit-pen {
    position: absolute;
}

.custom-color-picker .color-picker-input {
    width: 20%;
}

.designation-select div {
    font-weight: 500;
    margin-bottom: 10px;
}
.designation-select .designate-dropdown {
    max-width: 100%;
    width: 100%;
    padding: 0 15px;
}

.dropdown.dropdown-rela-option {
    top: 0px;
}
.email-background.bg-white {
    border-radius: 10px;
}

.date[type="date"] {
    background: url("../img/calendar-icon.svg") 95% 50% no-repeat;
    color: #058ed9;
    background-color: #f8f9fa !important;
}

.date[type="date"]::-webkit-inner-spin-button {
    display: none;
}

.date[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;
}

.filter-date-box {
    display: flex;
}
.filter-date-box input {
    width: 25%;
}

.check-o-lang select {
    padding: 5px 15px;
    border: 1px solid #058ed9 !important;
    border-radius: 25px !important;
}

/* .cover_transaction_fee_check {
    width: 25px !important;
    margin-right: 15px !important;
}

.cover_transaction_fee_check {
    width: 25px !important;
    margin: 0 15px 0 0 !important;
} */
/*
.fieldset-grid-change.credit-bank {
    margin-top: 150px !important;
}
.bank-account-step-detail {
    padding-bottom: 150px;
} */

.form_embedded_wrapper input[type="radio"]:checked + label.bank-account-button {
    border: 1px solid #058ed9 !important;
}

.credit-card-step .card_numbg {
    border: transparent !important;
}

.credit-card-step .pro-msg-cont {
    left: 0 !important;
}

.thankyou-page {
    width: 100%;
}

.thankyou-page .thankyou-p-header {
    padding: 40px 40px;
    position: relative;
}

.thankyou-page .thank-close-icon {
    position: absolute;
}

.thankyou-page .thankyou-div-label {
    padding: 20px;
    background-color: #058ed9;
    color: #fff;
    text-align: center;
}

.thank-close-icon {
    position: absolute;
    bottom: 50%;
    transform: translateY(50%);
    right: 30px;
}

.thankyou-page .help_spread p {
    width: 50%;
    margin: auto;
}

.social-media-option {
    width: 35%;
    margin: 30px auto;
}

.social-media-option .social-media-share {
    text-align: left;
}

.social-media-option .social-media-share a {
    color: #363f56;
    font-size: 14px;
}

.social-media-option .social-media-share a img {
    margin-right: 10px;
}

.social-media-option .social-media-share h6 {
    margin-bottom: 15px;
}

.social-media-option .social-media-share:last-child h6 {
    margin-bottom: 0px;
}

.fundraiser-link .form-group {
    display: flex;
    align-items: center;
}
.fundraiser-link .form-group input {
    margin-right: 10px;
}

.groupbox-or {
    border-top: 1px solid #dadada;
    padding: 0 1.4em 1.4em !important;
    margin: 0 40px;
}
.groupbox-or .groupbox-border {
    text-align: center;
    width: auto;
    padding: 0 10px;
    border-bottom: none;
    font-weight: 600;
    font-size: 20px;
    color: #000;
    margin-left: auto;
    margin-right: auto;
}
/* .send-link-social {
    display: flex;
    align-items: center;
    justify-content: center;
}
.send-link-social ul {
    list-style: none;
    padding-left: 0px;
    margin-bottom: 0px;
    display: flex;
    align-items: center;
} */
.send-link-social ul li {
    margin: 0 10px;
}

.send-link-cont {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* background-color: #e8ecee; */
    border-radius: 100px;
}

.supporter-delete-btn {
    padding: 10px 20px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    border: 1px solid #ff4820 !important;
    color: #ff4820;
    border-radius: 10px;
    background-color: transparent;
    min-width: 200px;
}

.supporter-delete-close-btn {
    padding: 10px 20px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    background-color: #183b56;
    border: 1px solid #183b56 !important;
    color: #fff;
    border-radius: 10px;
    min-width: 200px;
}

.setting-modal-cancel-btn,
.setting-modal-dc-btn {
    width: fit-content;
}

.thank-you-image-cont {
    width: 90%;
    margin: auto;
    margin-top: 50px;
    margin-bottom: 50px;
}

.thank-you-image-cont .thankyou-header {
    color: #058ed9;
}

.navbar-toggler-for-mobile {
    padding: 0px;
    text-align: right;
}

.receipt-content-wrap {
    display: flex;
    margin: 40px 30px;
}
/* .receipt-content-wrap .receipt-content-info {
    width: 40%;
    background-color: #058ed9;
    border-radius: 8px 0px 0px 8px;
    color: #fff;
}
.receipt-content-info .receipt-m-title {
    color: #fff;
}

.receipt-content-info ul {
    list-style: none;
    padding-left: 0px;
}

.receipt-content-info ul li {
    padding: 25px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

.receipt-content-info ul li:last-child {
    border-bottom: 0px;
} */

.receipt-content-wrap .receipt-content-desc {
    width: 60%;
    /* border-radius: 0px 8px 8px 0px; */
}

.receipt-content-d-title {
    padding: 43px 25px;
    display: flex;
    border-bottom: 1px solid rgba(0, 0, 0, 0.5);
    justify-content: space-between;
}

.receipt-content-msg-info {
    padding: 50px 25px 50px 25px;
}

.receipt-content-invoice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 25px;
}

@media (max-width: 1199px) {
    .filter-date-box input {
        width: 55%;
    }
    .receipt-content-wrap {
        flex-wrap: wrap;
    }
    .receipt-content-wrap .receipt-content-desc,
    .receipt-content-wrap .receipt-content-info {
        width: 100%;
    }
    .receipt-content-wrap .receipt-content-info {
        border-radius: 8px 8px 0px 0px;
    }
    .receipt-content-wrap .receipt-content-desc {
        border-radius: 0px 0px 8px 8px;
    }
}

@media (max-width: 991px) {
    .main-title-cont {
        font-size: 40px;
        padding: 50px 0px;
    }
    .main-background-img {
        height: 600px;
    }
    .login-page-content .main-title-cont {
        width: 100%;
    }
    .login-page-content .main-title-cont {
        font-size: 30px;
    }
    .login-page-content .bg-main-content {
        padding: 0px 30px;
    }
    .login-page-content .navbar-brand img {
        width: 230px;
    }
    .navbar-nav .socail-icon {
        display: none;
    }
    .donation-u-image {
        width: 90px;
        height: 90px;
        margin-top: -30px;
    }
    .nav .nav-item .nav-toggle {
        word-break: break-all;
    }
    .custom-color-picker .color-picker-input {
        width: 40%;
    }
    .social-media-option {
        width: 60%;
    }
}

@media (max-width: 767px) {
    .main-background-img {
        height: 100%;
    }
    .bg-main-content {
        padding: 0 15px;
    }
    .main-title-cont,
    .login-page-content .main-title-cont {
        font-size: 30px;
        padding: 30px 0px;
    }
    .reset-password-content .main-title-cont {
        font-size: 30px;
        width: 100%;
        padding: 30px 0px;
    }
    .btn-style {
        padding: 10px 15px;
    }
    .navbar-brand img {
        width: 250px;
    }
    .login-page-content .main-title-cont {
        width: 100%;
    }
    .login-page-content .main-background-img {
        padding: 40px 0px;
    }
    .reset-password-content .bg-main-content {
        padding: 30px 30px;
    }
    .login-with-option .btn-style2 {
        width: 125px;
    }
    .donation-user-cont .card {
        margin: 30px 0px;
    }
    .preview-form-url .form-group.d-flex {
        flex-direction: column;
    }
    .preview-form-url label {
        min-width: 100%;
        text-align: left !important;
        margin-right: 0 !important;
    }
    .custom-color-picker .color-picker-input {
        width: 70%;
    }
    .viewcreatecamp-sec {
        flex-direction: column !important;
    }
    .email-layout-cont.danation-receipt .card,
    .receipt-automation-nav.card {
        padding: 15px !important;
    }
    .email-layout-cont.danation-receipt .table-responsive tr th {
        white-space: nowrap;
    }
    .designation-list.list-group-item .dropdown-menu.show {
        left: -32px;
    }
    .fundraisers_search.top-search-int {
        width: 100%;
        margin-bottom: 15px;
    }
    /* .supporter-table th,
    .supporter-table td {
        width: 100% !important;
    } */

    .filter-date-box {
        margin-top: 15px;
    }
    .filter-date-box input {
        width: 100%;
    }
    .fundraiser-link .form-group {
        flex-direction: column;
    }
    .fundraiser-link .form-group input {
        margin-bottom: 15px;
        margin-right: 0px;
    }
    .send-link-social {
        flex-direction: column;
    }
    .send-link-social ul {
        flex-wrap: wrap;
        justify-content: center;
    }
    .supporter-delete-btn,
    .supporter-delete-close-btn {
        min-width: auto;
    }
    .mobile-nav-wrap {
        margin-right: 0px;
    }

    .receipt-content-wrap {
        margin: 25px 15px;
    }

    .receipt-content-d-title {
        padding: 20px 15px;
        flex-wrap: wrap;
    }

    .receipt-content-msg-info {
        padding: 20px 15px 20px 15px;
    }

    .receipt-content-invoice {
        padding: 15px;
        flex-direction: column;
        align-items: flex-start;
    }
    .receipt-content-info ul li {
        padding: 15px;
    }
}

@media screen and (max-width: 1600px) {
    .donation-form-view {
        left: 0 !important;
        right: 15vw !important;
    }
}

@media screen and (max-width: 1160px) {
    .donation-form-view {
        left: 0 !important;
        right: 5vw !important;
    }

    .elp {
        max-width: 210px;
    }
}

@media screen and (max-width: 992px) {
    .side-nav-blur {
        display: blogk;
    }

    .edit-layout-receipt-main {
        grid-template-columns: 1fr;
    }

    .details-nav {
        /*campaign detail page */
        display: grid;
        grid-template-columns: 2fr 3fr 1fr;
        grid-column-gap: 1em;
        grid-row-gap: 1em;
        font-size: 0.75;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }

    .navbar.side-nav-active {
        grid-template-columns: 1fr;
    }

    .elp {
        max-width: 210px;
    }

    .hod {
        display: block;
    }

    .hod-hmb {
        display: block;
    }

    .adjust-sidenav {
        width: 40vw !important;
    }

    .move-down-side {
        /*for sidenav band-aid solution: showing settings dropdown */
        margin-top: 3.5em;
    }

    .edit-layout-btn {
        width: 100%;
    }

    .hide {
        display: none;
    }

    .nav-search {
        display: none;
    }

    .useravatar-grid {
        grid-template-columns: 10fr 2fr;
    }

    .avatar-hom {
        display: none;
    }

    .head-cont-grid {
        grid-template-columns: 1fr !important;
    }

    .ml-auto.ml-0-max-sm {
        margin-left: 0 !important;
    }

    .grid-4-col.filters-grid {
        grid-template-columns: 1fr 1fr;
        grid-row-gap: 1em;
    }

    .tfoot-pagination {
        text-align: center;
        grid-template-columns: 1fr;
        grid-row-gap: 0.5em;
    }

    .tfoot-links {
        justify-content: center !important;
        padding-right: 0;
    }

    /* .table-cont {
        margin-top: -1.5em;
        overflow-x: scroll;
    } */

    .nav-actions {
        grid-template-columns: 1fr 1fr;
        padding-right: 1rem;
        grid-column-gap: 1rem;
        /* width: 108px; */
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        /* margin-left: auto; */
        padding-right: 0;
        padding-right: 1em;
    }

    .nav-actions .dropdown-item {
        padding: 0;
    }

    .navbar {
        width: 87.5vw;
        margin-left: 12.5vw;
        display: grid;
        grid-template-columns: 85% 15%;
    }

    .navbar-main-grid {
        position: fixed;
        left: 15%;
        right: 0%;
        background: white;
        padding: 2em 1em;
        padding-left: 0.4em;
        height: 100%;
        width: 75vw;
        z-index: 11;
        margin-left: auto;
    }

    .navbar-nav-grid {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 30px 50px 40px 40px 40px;
    }

    .nav-link {
        font-size: 1.2rem;
    }

    .mt-0-max-sm {
        margin-top: 0 !important;
    }

    .pl-sm-1-max {
        padding-left: 1em !important;
    }

    .useravatar-grid-sidebar {
        grid-template-columns: 11fr 1fr;
    }

    .text-left-max-sm {
        text-align: left !important;
    }

    .blur2 {
        z-index: 2;
        overflow-y: hidden;
        height: 100vh;
        width: 100vw;
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background: rgba(166, 172, 190, 0.26);
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
    }

    #nc-details-modal {
        position: fixed;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
    }

    .details-nav div.mr-5 {
        margin-right: 0px !important;
    }

    .details-head {
        grid-template-columns: 1fr !important;
    }

    .details-head h1 {
        font-size: 1.75rem;
        text-overflow: ellipsis;
    }
}

@media screen and (max-width: 882px) {
    .edit-layout-email-main {
        grid-template-columns: 1fr;
    }
}

@media screen and (max-width: 768px) {
    .navbar {
        grid-template-columns: 40% 40% 20%;
    }
    .h-fc.hom {
        display: none;
    }
}

@media screen and (max-width: 740px) {
    .adjust-sidenav {
        width: 75vw !important;
    }

    .three-col-true.one-col-mobile {
        grid-template-columns: 1fr;
    }

    .two-col-true.one-col-mobile {
        grid-template-columns: 1fr;
        grid-row-gap: 1.5em;
        /* padding: 20px 0px !important; */
    }

    .dm-func-grid.one-col-mobile {
        grid-template-columns: 1fr;
        grid-row-gap: 1.5em;
    }

    .dm-search {
        min-height: 50px;
        padding-left: 18% !important;
        max-width: unset;
        width: 100%;
    }

    .grid-4-col.filters-grid {
        grid-template-columns: 1fr;
        grid-row-gap: 1em;
    }
}

@media screen and (max-width: 640px) {
    #nc-details-modal {
        width: 90vw;
    }

    #nc-details-modal.new-campaign-modal,
    #nc-details-modal.rename-campaign-modal {
        position: absolute;
    }

    #nc-details-modal.rename-modal form {
        grid-template-rows: 40px 40px 140px 50px;
    }

    .container {
        max-width: 100vw;
        /* overflow-x: hidden; */
    }
}

@media screen and (max-width: 620px) {
    .donation-form-view {
        left: 0 !important;
        right: 0 !important;
    }

    .navbar {
        height: 70px;
    }

    .dd-settings {
        bottom: -4.4em;
        max-width: 167px;
        padding-left: 1em;
    }
    .elp {
        max-width: 80px;
    }
}

@media screen and (max-width: 400px) {
    .nav-user {
        /*width: 135px !important;*/
    }
}

@supports (-webkit-touch-callout: none) {
    /* CSS specific to iOS devices */
    @media screen and (max-width: 740px) {
        .adjust-sidenav {
            width: 86vw !important;
        }
    }

    @media screen and (max-width: 620px) {
        .dd-settings {
            width: -webkit-fit-content;
            width: -moz-fit-content;
            width: fit-content;
            padding-left: 2em;
        }
    }
}

@media screen and (min-width: 992px) {
    .side-nav-blur {
        display: none;
    }
}

/* Dashboard css */

.number-icon .rounded-circle {
    background: rgb(248, 246, 254);
    height: 60px;
    width: 60px;
}
