@import url("../fonts/app/stylesheet.css");
* {
    padding: 0;
    margin: 0;
}

body {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--cDark);
    background: var(--cBodyBg);
    text-align: left;
    font-family: var(--fontReg);
    height: 100%;
}

html {
    height: 100%;
}

a:hover,
a:not([href]),
a {
    text-decoration: none;
    color: var(--cDark);
}

img[src=""],
img:not([src]) {
    display: none;
}

ul,
ol {
    padding: 0;
    list-style: none;
}

.table {
    color: var(--cDark);
}

/************************************/
/****      typography start      ****/
/************************************/
h1, h2, h3, h4, h5, h6 {
    font-family: var(--fontBold);
}

h1 {
    font-size: 40px;
}

h2 {
    font-size: 34px;
}

h3 {
    font-size: 28px;
}

h4 {
    font-size: 22px;
}

h5 {
    font-size: 20px;
}

h6 {
    font-size: 15px;
}

/************************************/
/****       typography end       ****/
/************************************/

/************************************/
/****         form start         ****/
/************************************/
.form-label-group {
    position: relative;
    margin-bottom: var(--inputMB);
    overflow: hidden;
}

.form-label-group .form-control {
    background: var(--inputBg);
    border: 0;
    border-radius: var(--cInputRadius);
    /*font-family: 'sf_ui_displayregular';*/
    height: 50px;
    box-shadow: none;
    border: none!important;
}

input,
select,
textarea {
    color: var(--cDark)!important;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.actLabel,
.sel-box>label,
.form-label-group>input,
.form-label-group>textarea,
.form-label-group>label {
    padding: var(--input-padding-y) var(--input-padding-x);
}

.form-label-group input::-webkit-input-placeholder,
.form-label-group textarea::-webkit-input-placeholder {
    color: var(--cDkLt);
}

.form-label-group input:-ms-input-placeholder,
.form-label-group textarea:-ms-input-placeholder {
    color: var(--cDkLt);
}

.form-label-group input::-ms-input-placeholder,
.form-label-group textarea::-ms-input-placeholder {
    color: var(--cDkLt);
}

.form-label-group input::-moz-placeholder,
.form-label-group textarea::-moz-placeholder {
    color: var(--cDkLt);
}

.form-label-group input::placeholder,
.form-label-group textarea::placeholder {
    color: var(--cDkLt);
}

.form-label-group input:not(.keep-ph)::-webkit-input-placeholder,
.form-label-group textarea:not(.keep-ph)::-webkit-input-placeholder {
    color: transparent;
}

.form-label-group input:not(.keep-ph):-ms-input-placeholder,
.form-label-group textarea:not(.keep-ph):-ms-input-placeholder {
    color: transparent;
}

.form-label-group input:not(.keep-ph)::-ms-input-placeholder,
.form-label-group textarea:not(.keep-ph)::-ms-input-placeholder {
    color: transparent;
}

.form-label-group input:not(.keep-ph)::-moz-placeholder,
.form-label-group textarea:not(.keep-ph)::-moz-placeholder {
    color: transparent;
}

.form-label-group input:not(.keep-ph)::placeholder,
.form-label-group textarea:not(.keep-ph)::placeholder {
    color: transparent;
}

.form-label-group input:not(:placeholder-shown):not(.no-label),
.form-label-group textarea:not(:placeholder-shown):not(.no-label) {
    padding-top: calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));
    padding-bottom: calc(var(--input-padding-y) / 3);
}

.form-label-group.input-sm input:not(:placeholder-shown):not(.no-label),
.form-label-group.input-sm textarea:not(:placeholder-shown):not(.no-label) {
    padding-top: calc(var(--input-padding-y) + var(--input-padding-y) * (1 / 3));
}

/*.form-label-group input:not(:placeholder-shown)~label,
.form-label-group textarea:not(:placeholder-shown)~label {
    padding-top: calc(var(--input-padding-y) / 3);
    padding-bottom: calc(var(--input-padding-y) / 3);
}*/

.form-label-group.bgr .form-control {
    position: relative;
    z-index: 2;
}

.form-label-group.bgr>label {
    z-index: 2;/*for dark theme password input label not appear*/
}

.frt-lst .form-label-group {
    width: 49%;
}

.form-label-group.grp.ssp .form-control {
    padding-left: 0;
}

.form-label-group.grp .form-control {
    display: inline-block;
    width: 85%;
    vertical-align: middle;
}

.form-label-group.grp .form-control {
    background: #e7e7e9;
    border: 0;
    border-radius: var(--cInputRadius);
    color: #030303;
}

.form-control:focus {
    box-shadow: none;
}

.form-control:not(select) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.sel-box {
    border-radius: var(--cInputRadius);
}

.sel-box select {
    width: 100%;
    border: 0;
    background: none;
}

.sel-box select.form-control {
    height: 33px;
    padding: 17px 0 0 13px!important;
    border-width: 0px!important;
    border-style: solid!important;
    width: calc(100% - 13px);
}

/*#hrsSlctCon .form-control:disabled {
    background-color: var(--disabledBg);
}*/

.boxs select.form-control {
    height: 28px;
    padding: 0!important;
    width: 100px!important;
}

.boxs.no-label select.form-control,
.sel-box select.form-control.no-label,
.sel-box.no-label select.form-control {
    /*height: initial;*/
    /*padding: 11px 0 11px 14px!important;*/
    padding: 10px 0 7px 13px!important;
}

.form-label-group>input {
    padding: 0.75rem 0.75rem
}

.actLabel,
.sel-box>label,
.form-label-group>label {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: auto;
    margin-bottom: 0;
    line-height: 1.5;
    color: var(--cDkLt);
    border: 1px solid transparent;
    border-radius: .25rem;
    transition: all .1s ease-in-out;
/*    background-color: var(--inputBg);*/
}

.input-form.color-dark .sel-box::after,
.input-form.color-dark .sel-box>label,
.input-form.color-dark select {
    color: var(--cDark); 
}

.iw {
    background: var(--inputBg);
    border: 0;
    border-radius: var(--cInputRadius);
}

.input-bg .iw {
    background-color: var(--cBodyBg)!important;
    border: 1px solid var(--cBorderColor);
}

.input-bg .iw .form-control {
    background-color: var(--cBodyBg)!important;
}

.iw.error .invalid-feedback {
    display: block;
}

.errorMsg,
.invalid-feedback,
.valid-feedback {
    /*font-family: 'sf_ui_displaysemibold';*/
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: -2.5px 0 0;
    padding: 0 5px 5px 13px;
    font-size: 65%;
}

.form-label-group.error .valid-feedback,
.form-label-group.error .invalid-feedback {
    /*display: none;*/
}

.intl-tel-input.separate-dial-code .selected-flag {
    border-top-left-radius: var(--cInputRadius)!important;
    border-bottom-left-radius: var(--cInputRadius)!important;
    /*overflow: auto;*/
}

.intl-tel-input.separate-dial-code .selected-flag {
    background-color: #e7e7e9!important;
}


.fileBtnWrapper {
    position: relative;
    /*overflow: hidden;*/
    display: block;
    margin: 0 auto;
    width: 120px;
    text-align: center;
}

.fileBtnWrapper input[type="file"] {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
    z-index: 2;
    overflow: hidden;
}

/*.errorMsg {
    font-size: 80%;
    color: var(--cDanger);
    text-transform: uppercase;
    background: transparent;
}*/

.bgr .errorMsg {
    background: #fff;
}

.ab-feedback.error .errorMsg {
    position: absolute;
    /*bottom: -1.45rem;*/
    bottom: -1.20rem;
    left: 0;
}

.ab-feedback.error {
    /*margin-bottom: calc(1rem + 21px);*/
}

.border-danger,
.error:not(body) {
    border: 1px solid var(--cDanger)!important;
}

.border-success,
.success {
    border: 1px solid var(--cSuccess)!important;
}

.errorMsg,
.invalid-feedback {
    color: var(--cDanger);   
}

.successMsg,
.valid-feedback {
    color: var(--cSuccess);   
}

.invalid-tooltip {
    background-color: var(--cDanger);   
}



.field-sec {
    border-radius: 10px;
    border: 1px solid var(--borderColor);
    padding: 10px 10px 0;
}

.sf .invalid-feedback,
.iw.error .invalid-feedback {
    display: block;
}

.form-control.is-invalid,
.was-validated .form-control:invalid,
.form-control.is-valid,
.was-validated .form-control:valid {
    background-image: none;
}

.form-control.is-valid:focus,
.was-validated .form-control:valid:focus {
    border: none;
    box-shadow: none;
}

.form-control.is-invalid:focus,
.was-validated .form-control:invalid:focus {
    border: none;
    box-shadow: none;
}

.was-validated .sel-box.ab-feedback .valid-feedback,
.was-validated .sel-box.ab-feedback .invalid-feedback {
    background: var(--inputBg);
    margin-top: -4px;
    padding-top: 4px;
    border-bottom-left-radius: var(--cInputRadius);
    border-bottom-right-radius: var(--cInputRadius);
}

.valid-feedback {
    color: #007AFF;
    display: none!important;
}

.valid-feedback ion-icon {
    display: inline-block;
    vertical-align: middle;
    margin-top: -3px;
}

.actLabel,
.sel-box select.slctd~label,
.form-label-group input:not(:placeholder-shown)~label,
.form-label-group textarea:not(:placeholder-shown)~label,
textarea:not(:placeholder-shown)~label {
    padding-top: 4px!important;
    padding-bottom: 0!important;
    font-size: 12px!important;
/*    background-color: transparent;*/
    border-top-left-radius: 30px;
    top: -1px;
}

.form-label-group textarea:not(:placeholder-shown)~label,
textarea:not(:placeholder-shown)~label {
    display: block;
    width: 100%;
    background-color: var(--inputBg);
    border-top-left-radius: var(--cInputRadius);
    border-top-right-radius: var(--cInputRadius);
}

.input-sm .actLabel,
.sel-box.input-sm select.slctd~label,
.form-label-group.input-sm input:not(:placeholder-shown)~label,
.form-label-group.input-sm textarea:not(:placeholder-shown)~label {
    padding-top: 3px!important;
    font-size: 11px!important;
}


.boxs select,
.sel-box select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    outline: 0;
    box-shadow: none;
    border: 0 !important;
    /*background: #2c3e50;*/
    background-image: none;
    padding: 5px 0 0 3px!important;
    box-sizing: initial;
}

.boxs select.nl,
.sel-box select.nl {
    padding-top: 0px!important;
}


/* Remove IE arrow */

.boxs select::-ms-expand,
.sel-box select::-ms-expand {
    display: none;
}


/* Custom Select */
.boxs,
.sel-box {
    position: relative;
    min-height: 50px;
}

.boxs select,
.sel-box select {
    flex: 1;
    padding: 0 .5em;
    cursor: pointer;
}

/* Arrow */
.boxs::after,
.sel-box::after {
    content: '';
    font-family: 'Ionicons';
    position: absolute;
    top: 0;
    right: 0;
    padding: 11px 1em 9px;
    /*background: #34495e;*/
    cursor: pointer;
    pointer-events: none;
    -webkit-transition: .25s all ease;
    -o-transition: .25s all ease;
    transition: .25s all ease;
    color: var(--inputIcon);
    font-size: 20px;
}

.lbs a.btn {
    position: absolute;
    top: 18%;
    right: 80px;
    z-index: 10;
}

/*.switch__container {
    margin: 30px auto;
    width: 120px;
}*/

.switch {
    visibility: hidden;
    position: absolute;
    margin-left: -9999px;
}

.switch+label {
    padding: 3px;
    width: 60px;
    height: 35px;
/*    background-color: var(--disabledBg);*/
    border-radius: 60px;
    position: relative;
    cursor: pointer;
    outline: none;
    user-select: none;
}

.switch+label:before,
.switch+label:after {
    display: block;
    position: absolute;
    top: 1px;
    left: 1px;
    bottom: 1px;
    content: "";
}

.switch+label:before {
    right: 1px;
    background-color: var(--cDanger);
    border-radius: 60px;
    transition: background 0.4s;
}

.switch.gr+label:before {
    background-color: var(--gray);
}

.switch+label:after {
    width: 62px;
    background-color: #fff;
    border-radius: 100%;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    transition: all 0.4s;
}

.switch:checked+label:after {
    transform: translateX(60px);
}

.switch:checked+label:after {
    /*transform: translateX(23px);*/
    transform: translateX(calc(100% - 5px));
}

.switch:checked+label:before {
    background-color: var(--cSuccess);
}

.switch+label:after {
    width: 29px;
    height: 29px;
    margin-top: 2px;
    margin-left: 3px;
}

.switch.ldng+label:after {
    background-image: url(../../imgs/loader.svg);
    background-size: cover;
}

.switch.ldng+label:before {
    background-color: var(--cDisabled);
}

.switch.switch-sm+label {
    width: 48px;
    height: 29px;
}

.switch.switch-sm+label:after {
    width: 23px;
    height: 23px;
}

.ch-pos {
    float: none;
    position: absolute;
    /*top: 12px;*/
    top: 16%;
    right: 12px;
}

.box1 {
    margin-bottom: var(--inputMB);
    position: relative;
    background: var(--inputBg);
    border: 0;
    border-radius: 8px;
    padding: 5px 10px;
    min-height: 50px;
}

.box1 span:not(.busi) {
    display: inline-block;
    vertical-align: middle;
    font-size: 1rem;
    color: #8d8d8d;
    font-weight: 400;
    padding-top: 3px;
}


.box1 .txt {
    width: 70%;
    background: none;
    border: 0;
}

.box1 .form-label-group label {
    font-size: 1em;
}

.prc p,
.prc span,
.prc label,
.pdr label,
.prc input {
    display: inline-block;
    vertical-align: middle;
    color: #8d8d8d;
}

.prc label,
.prc p,
.prc input {}

.pdr>label {
    margin-top: 2px;
}

.pdr label {
    vertical-align: initial;
}

.prc label {
    vertical-align: bottom;
}

.ppr {
    padding-top: 2px;
}

.prc p {
    margin-bottom: 0;
}

.prc input {
    border: 0;
    width: 65%;
    background: var(--inputBg)!Important;
    display: inline-block;
    vertical-align: middle;
    padding: 0!important;
}

.iClps {/*inputsCollapse*/
}

.iClps .icHdr {
    background: var(--inputBg);
    border-radius: var(--cInputRadius);
    margin-bottom: var(--inputMB);
    border: 0;
    position: relative;
    cursor: pointer;
    /*display: flex;
    vertical-align: middle;
    align-items: center;*/
}

.iClps .icHdr .form-control {/*inputsCollapse*/
    background: var(--inputBg);
    border: 0;
    border-radius: var(--cInputRadius);
    height: 50px;
    box-shadow: none;
    border: none!important;
    color: var(--cDark)!important;
}

.iClps .icHdr .form-control::after {
    content: '';
    font-family: 'Ionicons';
    position: absolute;
    top: 0;
    right: 0;
    padding: 11px 1em 9px;
    cursor: pointer;
    pointer-events: none;
    -webkit-transition: .25s all ease;
    -o-transition: .25s all ease;
    transition: .25s all ease;
    color: var(--inputIcon);
    font-size: 20px;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.iClps .icHdr.act .form-control::after {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}

.iClps .icHdr ion-icon {
    color: var(--inputIcon)!important;
    font-size: 20px;
}

.iClps .icBdy {
    display: none;
}

.radioCon > div {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 13px;
}

.radioCon > label {
    margin-top: .5rem!important;
}

.radioCon > div > [type="radio"],
.radioCon > div > [type="radio"] {
    position: absolute;
    left: -9999px;
}

.radioCon > div > [type="radio"] + label,
.radioCon > div > [type="radio"] + label
{
    position: relative;
    cursor: pointer;
    margin: 0;
    height: 100%;
    width: 100%;
}

.radioCon > div > [type="radio"] + label:before,
.radioCon > div > [type="radio"] + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 25px;
    height: 25px;
    border: 1px solid var(--cDark);
    border-radius: 100%;
    background: var(--cBodyBg);
}

.radioCon > div > [type="radio"] + label:after,
.radioCon > div > [type="radio"] + label:after {
    content: '';
    width: 17px;
    height: 17px;
    background: var(--cDark);
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.radioCon > div > [type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}

.radioCon > div > [type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.btnSubmitConFxd {
    position: fixed;
    bottom: 0;
    z-index: 10;
    width: 100%;
    max-width: 600px;
}

.switch-input {
    min-height: 50px;
}

.switch-input input {
    display: none;
    padding-top: calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));
    padding-bottom: calc(var(--input-padding-y) / 3);
}

.switch-input-shown input {
    display: block;
}

.switch-input-shown label {
    padding-top: calc(var(--input-padding-y) / 3);
    padding-bottom: calc(var(--input-padding-y) / 3);
    font-size: 12px;
}

.custom-control {
    position: relative;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    min-height: 2rem;
    padding-left: 2rem;
    margin-right: 0;
    cursor: pointer;
}

.rem-pass {
    max-width: 160px;
    margin: 0 auto;
}

.rem-pass .custom-control {
    display: inline-block;
    margin-right: 0px;
    vertical-align: middle;
}

.write-note {
    background: var(--inputBg);
    border-radius: var(--cInputRadius);
    padding: 0;
    position: relative;
    height: 50px;
    margin-bottom: var(--inputMB);
}

.write-note input {
    display: inline-block;
    vertical-align: middle;
    width: 90%;
    border: 0;
    background: no-repeat;
}

.write-note button {
    background: var(--cDark);
    color: var(--cDarkInvert);
    margin-top: 0px;
    font-size: 15px;
    display: block;
    border: 0;
    border-radius: 20px;
    padding: 5px 12px;
    position: absolute;
    top: 8px;
    right: 5px;
    z-index: 10;
}

.custom-control-input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.custom-control-input:checked~.custom-control-indicator {
    background-color: #030303;
    border: 4px solid #fff;
}

.custom-control-input:active~.custom-control-indicator {
    color: #fff;
    background-color: var(--inputBg)
}

.custom-control-input:disabled~.custom-control-indicator {
    cursor: not-allowed;
    background-color: #eceeef
}

.custom-control-input:disabled~.custom-control-description {
    color: #636c72;
    cursor: not-allowed
}

.ionCheck ion-icon,
.custom-control-indicator {
    position: absolute;
    top: .25rem;
    left: 0;
    display: block;
    width: 1.6rem;
    height: 1.6rem;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: 50% 50%;
    background-size: 50% 50%
}

.custom-checkbox .custom-control-indicator {
    border-radius: 50%;
}

.custom-checkbox .custom-control-input:checked~.custom-control-indicator {
    background: #030303
}

.custom-checkbox .custom-control-input:indeterminate~.custom-control-indicator {
    background: #fff
}

.custom-checkbox.cb .custom-control-indicator {
    box-shadow: 0 0 0 1px #030303;
    border: initial;
}

.custom-checkbox.cb .custom-control-input:checked~.custom-control-indicator {
    border: 4px solid #fff;
}

.custom-radio .custom-control-indicator {
    border-radius: 50%
}

.custom-radio .custom-control-input:checked~.custom-control-indicator {
    background: #fff
}

.custom-controls-stacked {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
}

.custom-controls-stacked .custom-control {
    margin-bottom: .25rem
}

.custom-controls-stacked .custom-control+.custom-control {
    margin-left: 0
}

.ionCheck ion-icon {
    display: none;
    width: 2rem;
    height: 2rem;
    left: -3px;
    top: 3px;
    overflow: hidden;
    border-radius: 50%;
    background: initial;
}

.ionCheck ion-icon.radioOff {
    display: block;
}

.custom-checkbox.ionCheck .custom-control-input:checked~ion-icon.checkCircle {
    display: none;
}

.custom-checkbox.ionCheck .custom-control-input:checked~ion-icon.checkCircle {
    display: block;
}

.newcheck .custom-control {
    margin-bottom: 0;
}

.pop-check .custom-control {
    margin: 10px 0;
    padding-left: 1.6rem;
}

.pop-check .ck-left {
    margin-top: 13px;
}

.pop-check {
    padding-top: 0;
    padding-bottom: 0;
}

.pop-check .bornon .custom-control {
    margin-top: 15px;
}

.check-bx .custom-control-label {
    width: 1.5rem;
    height: 1.5rem;
}

.custom-control-label {
    position: relative;
    margin-bottom: 0;
    vertical-align: top;
}

.check-bx .custom-control-label::before {
    border: 1px solid #E6E7E9;
}

.custom-radio .custom-control-label::before {
    border-radius: 50%;
}

.custom-control-label::before,
.custom-file-label,
.custom-select {
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

@media (prefers-reduced-motion: reduce) {
    .custom-control-label::before,
    .custom-file-label,
    .custom-select {
        transition: none;
    }
}

.custom-control-label::before {
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.radiobt .custom-control-indicator {
    border: 1px solid #030303;
    top: 7px;
}

.rem-pass .sp3 {
    display: inline-block;
    vertical-align: middle;
}

.chbox .bornon .custom-control {
    margin-bottom: 0;
}

.rrl .custom-control {
    margin-top: 7px;
}

.range {
/*    width: 300px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);*/
    padding-top: calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));
    padding-bottom: calc(var(--input-padding-y) / 3);
}

.range input {
    width: 100%;
    cursor: pointer;
    opacity: 0;
    padding: 0!important;
}

.range::-ms-tooltip {
    display: none;
}

.range .range-track {
    width: 100%;
    height: 4px;
    background: var(--inputBg);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    border-radius: var(--cInputRadius);
}

.range .range-track-inner {
    width: 0;
    height: 100%;
    background: var(--cDark);
}

.range .range-thumb {
    width: 28px;
    height: 28px;
    background: var(--cBodyBg);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0%, -50%);
    pointer-events: none;
    box-shadow: var(--boxShadow);
}

.form-label-group.input-sm .form-control {
    height: 40px;
}

.form-label-group.input-sm label {
    padding: 8px var(--input-padding-x);
    font-size: 15px;
}

.has-search.input-sm .form-control-feedback {   
    height: 40px;
    font-size: 22px;
    top: 0;
}

.input-sm.sel-box select.form-control {
    padding: 17px 0 0 13px!important;
    height: 23px;
}

.sel-box.input-sm {
    min-height: 40px;
}

.input-sm.sel-box::after {
    padding: 4px 1em 5px;
}

.idCardInput {
    background-color: var(--inputBg);
    border-radius: var(--cInputRadius);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    border: 1px solid var(--cBorderColor);
}

.idCardInput input[type="file"] {
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
    z-index: 2;
    overflow: hidden;
}

.idCardInput > div {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.idCardInput > div label {
    margin: 0;
}

.idCardInput > div img {
    width: 30px;
    margin-left: 10px;
}
/************************************/
/****          form end          ****/
/************************************/

/************************************/
/****       app alert start      ****/
/************************************/
div.appAlrtMdl {
    padding-right: 0!important;
}
div.appAlrtMdl input {
    height: 25px;
}
div.appAlrtMdl.inAct {
    z-index: 0;
}

div.appAlrtMdl.modal-static .modal-dialog {
    -webkit-transform: initial;
    transform: initial;
}

div.appAlrtMdl .modal-dialog {
    justify-content: center;
}

div.appAlrtMdl .modal-content {
    float: left;
     width: 280px; 
    background-color: var(--aaBg);
    border-radius: 15px;
    line-height: 1.3;
}

div.appAlrtMdl #aaIcon {
    text-align: -webkit-center;
}

div.appAlrtMdl #aaHdng {
    text-align: -webkit-center;
    padding: 10px 0 0;
    font-size: 17px;
    font-family: var(--fontSemiBold);
}

div.appAlrtMdl #aaMsg {
    min-height: 30px;
    padding: 0 10px 15px;
    /* word-break: break-all; */
    font-size: 14px;
}

div.appAlrtMdl #aaFtr {
    border-top: 1px solid var(--aaBc);
    text-align: -webkit-center;
}

.appAlrtMdl button {
    width: 100%;
    padding: 10px 0;
    margin: 0;
    background: transparent!important;
    font-family: var(--fontReg);
}

div.appAlrtMdl #aaFtr.hasRiBtn button {
    width: 50%;
    float: left;
    /*border-top-left-radius: 0;*/
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

div.appAlrtMdl #aaFtr.hasRiBtn button:first-child {
    border-right: 1px solid var(--aaBc)!important;
}

.appAlrtMdl button#aaLe,
.appAlrtMdl button#aaLe a {
    color: var(--aaBlue);
}

.appAlrtMdl button#aaRi,
.appAlrtMdl button#aaRi a {
    color: var(--aaGreen);
}

.appAlrtMdl .aaInputCon {
    margin-top: 10px;
}

.appAlrtMdl .aaInput input {
    padding: 2.5px 5px;
    height: auto;
    margin-bottom: 5px;
    border-radius: 5px;
    border: 1px solid var(--cBorderColor);
    background: var(--inputBg);
    width: 100%;
    display: block;
    line-height: 1.5;
    outline: initial;
    box-shadow: initial;
}

.appAlrtMdl .aaInput:last-child input {
    margin-bottom: 0px;
}

/************************************/
/****        app alert end       ****/
/************************************/

/************************************/
/****    footer menu start       ****/
/************************************/

.footer-menu h2 {
    /*color: #030303!important;
    font-size: 16px;
    text-transform: uppercase;
    text-align: left;
    padding-top: 7px;
    max-width: 600px;
    margin: 0 auto;
    padding-left: 5%;
    padding-bottom: 7px;
    border-top: 1px solid #ccc;*/
}

.footer-menu {
    text-align: center;
    padding: 0px 0 3px 0;
    position: fixed;
    left: 0;
    width: 100%;
    bottom: 0;
    background: var(--inputBg);
    z-index: 20;
    border-top: 1px solid var(--cDkLt);
}

.footer-menu li {
    width: calc(100% / 5);
    list-style: none;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
}

.footer-menu li .dot-after:after {
    top: 0;
    right: 1px;
}

.footer-menu li a,
.footer-menu li a:hover {
    text-decoration: none;
}

.footer-menu li a {
    display: block;
    color: var(--cDkLt);
    font-size: 10px;
    font-family: var(--fontMd);
}

.footer-menu li ion-icon {
    display: block;
    margin: 0 auto;
    font-size: 30px;
}

.footer-menu li.act ion-icon,
.footer-menu li.act a,
.footer-menu li:hover a,
.footer-menu li:hover ion-icon {
    color: var(--cDark);
}

.footer-menu ul {
    margin-bottom: 0;
    padding-top: 5px;
    max-width: 600px;
    margin: 0 auto;
}

/*.menu2-hdr {
    padding-top: 10px;
}*/

.menu2-bdy>li:first-child {
    padding-top: 15px;
}

.menu2-bdy>li {
    padding: 0 15px 15px;
}

.menu2-bdy>li {
    -ms-flex-align: center!important;
    align-items: center!important;
    -ms-flex-pack: start!important;
    justify-content: flex-start!important;
}

/*#sidebar-container .list-group .menu2-bdy>li a:last-child {
    border-bottom: initial!important;
}*/

.menu2-bdy .list-group-item:first-child {
    border-top-left-radius: 7.5px;
    border-top-right-radius: 7.5px;
}

.menu2-bdy .list-group-item:last-child {
    border-bottom-right-radius: 7.5px;
    border-bottom-left-radius: 7.5px;
}

.menu2-notch {
    position: absolute;
    top: 4px;
    width: 100%;
    text-align: center;
    height: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.menu2-notch span {
    line-height: 0;
    padding: 5px 0;
    cursor: pointer;
}

.menu2-notch span i {
    height: 5px;
    background: var(--cDkLt);
    display: inline-block;
    width: 40px;
    border-radius: 4px;
}

.p-fm {
    padding-bottom: 70px;
}

.sitePuHome .p-fm {
    padding-bottom: 130px;
}

/************************************/
/****     footer menu end        ****/
/************************************/

/************************************/
/****        others start        ****/
/************************************/
.btn:hover,
.btn:active,
.btn:focus,
.btn:visited,
.btn {
    background: var(--cDark);
    color: var(--cDarkInvert);
    border: 0!important;
    box-shadow: none!important;
}

.btn {
    /*margin-top: 20px;*/
    font-size: 17px;
    display: block;
    float: none;
    width: 100%;
    /*margin-bottom: 15px;*/
    padding: 12.5px;
    border-radius: var(--cInputRadius);
    text-decoration: none !important;
    font-family: var(--fontSemiBold);
}

.btn-xs {
    padding: 2.5px 10px;
    display: inline-block;
    border-radius: 20px;
    font-size: 13px!important;
    width: auto;
    margin: 0;
}

.btn-sm {
    padding: 5px 15px;
    display: inline-block;
    border-radius: 20px;
    font-size: 15px;
    width: auto;
    margin: 0;
}

.btn-md {
    padding-left: 30px;
    padding-right: 30px;
    display: inline-block;
    font-size: 13px;
    width: auto;
    margin: 0;
}

.btn-rounded {
    border-radius: 20px;
}

.btn.btn-transparent {
    background: transparent;
    border-color: transparent;
}

.btn.btn-bordered {
    background: var(--cBodyBg);
    border: 1px solid var(--cDark)!important;
    color: var(--cDark)!important;
}

.btn.btn-bordered-transparent {
    background: transparent;
    border: 1px solid var(--cDark)!important;
    color: var(--cDark);
}

.btn.btn-bordered.btn-success {
    background: var(--cBodyBg);
    border: 1px solid var(--cSuccess)!important;
    color: var(--cSuccess)!important;
}

.foot-fxd {
    position: fixed;
    bottom: 0;
    width: calc(100% - 30px);
    max-width: 600px;
    /*margin: 0;*/
    text-align: center;
    color: var(--cDkLt);
    margin-bottom: .5rem;
}

.owl-carousel .owl-item img.def-hide,
.def-hide {
    display: none !important;
}

.eye {
    position: relative;
}

.eye i {
    color: var(--lGray);
    font-size: 30px;
    position: absolute;
    top: 12px;
    right: 12px;
}

.eye.bgr .ion {
    cursor: pointer;
    z-index: 10;
}

.tooltip-inner {
    background: var(--cDark);
    color: var(--cDarkInvert);
}

.bs-tooltip-auto[x-placement^=left] .arrow::before, .bs-tooltip-left .arrow::before {
    border-left-color: var(--cDark);
}

.del-opt {
    margin-top: 10px;
    margin-bottom: 5px;
}

.del-opt .dlt {
    border: 0;
    background: none;
    outline: none;
}

.del-opt .dlt[has="close"] {
    color: var(--cDanger);
}

.del-opt .dlt[has="open"] {
    color: var(--cSuccess);
}

.input-bg,
.input-bg:focus,
.input-bg:active,
.input-bg:hover {
    background-color: var(--inputBg);
}

/* .color-dark:hover, */
.color-dark {
    color: var(--cDark)!important;
}

ion-icon,
ion-icon > path,
ion-icon > title {
  pointer-events: none;
}

.ion-md {
    font-size: 26px!important;
}

.ion-lg {
    font-size: 30px!important;
}

.ion-xl {
    font-size: 34px!important;
}
.btnShare:hover ion-icon,
.btnShare:hover span{
    color: var(--lGray) !important;
}
/************************************/
/****         others end         ****/
/************************************/

/************************************/
/****  dark header/footer start  ****/
/************************************/
/*body.deviceDark .header.position-fixed,
body.deviceDark #mchHdrCon {
    background: var(--dk_cBodyBg);
    color: var(--dk_cDark);
}

body.deviceDark #mchHdrCon .btn:not(.btn-transparent) {
    background: var(--dk_cDark);
    color: var(--dk_cDarkInvert);
}

body.deviceDark #mchHdrCon ion-icon {
    color: var(--dk_cDark);
}

body.deviceDark .footer-menu {
    background: var(--dk_inputBg);
}

body.deviceDark .footer-menu li.act ion-icon,
body.deviceDark .footer-menu li.act a,
body.deviceDark .footer-menu li:hover a,
body.deviceDark .footer-menu li:hover ion-icon {
    color: var(--dk_cDark);
}

body.deviceDark .bussiness-details,
body.deviceDark .menu2 .list-group {
    background: var(--dk_cBodyBg)!important;
    color: var(--dk_cDark);
}

body.deviceDark .bussiness-details a,
body.deviceDark #shortcut-container .list-group a:not(.anchor),
body.deviceDark #sidebar-container .list-group a:not(.anchor) {
    color: var(--dk_cDark);
    background: var(--dk_inputBg);
    border-bottom: 1px solid var(--dk_cDarkInvert)!important;
}

body.deviceDark .bussiness-details .btnShare {
    background: var(--dk_inputBg);
    color: var(--dk_cDark);
}*/

/************************************/
/****   dark header/footer end   ****/
/************************************/

/************************************/
/****  light header/footer start ****/
/************************************/
/*body.deviceLight .header.position-fixed,
body.deviceLight #mchHdrCon {
    background: var(--lt_cBodyBg);
    color: var(--lt_cDark);
}

body.deviceLight #mchHdrCon .btn:not(.btn-transparent) {
    background: var(--lt_cDark);
    color: var(--lt_cDarkInvert);
}

body.deviceLight #mchHdrCon ion-icon {
    color: var(--lt_cDark);
}

body.deviceLight .footer-menu {
    background: var(--lt_inputBg);
}

body.deviceLight .footer-menu li.act ion-icon,
body.deviceLight .footer-menu li.act a,
body.deviceLight .footer-menu li:hover a,
body.deviceLight .footer-menu li:hover ion-icon {
    color: var(--lt_cDark);
}

body.deviceLight .bussiness-details,
body.deviceLight .menu2 .list-group {
    background: var(--lt_cBodyBg)!important;
    color: var(--lt_cDark);
}

body.deviceLight .bussiness-details a,
body.deviceLight #shortcut-container .list-group a:not(.anchor),
body.deviceLight #sidebar-container .list-group a:not(.anchor) {
    color: var(--lt_cDark);
    background: var(--lt_inputBg);
    border-bottom: 1px solid var(--lt_cDarkInvert)!important;
}

body.deviceLight .bussiness-details .btnShare {
    background: var(--lt_inputBg);
    color: var(--lt_cDark);
}*/
/************************************/
/****   light header/footer end  ****/
/************************************/

/************************************/
/****        shimmer start       ****/
/************************************/
.shimmer {
    position: relative;
    display: block!important;
    overflow: hidden;
}

.shimmer * {
    visibility: hidden!important;
    opacity: 0;
}

.shimmer:after {
    content: ' ';
    background: var(--inputBg);
    background-image: linear-gradient(to right, var(--inputBg) 0%, var(--shimmerShine) 20%, var(--inputBg) 40%, var(--inputBg) 100%);
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-animation-duration: 1.5s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-name: shimmer;
    -webkit-animation-timing-function: linear;
    position: absolute;
    z-index: 1060;
    height: 100%;
    width: 100%;
    left: 0;
    bottom: 0;
    border-radius: 2.5px;
}

@-moz-keyframes shimmer {
  0% {
    background-position: -300px 0;
  }
  
  100% {
    background-position: 1000px 0; 
  }
}

@-webkit-keyframes shimmer {
  0% {
    background-position: -300px 0;
  }
  
  100% {
    background-position: 1000px 0; 
  }
}

@-o-keyframes shimmer {
  0% {
    background-position: -300px 0;
  }
  
  100% {
    background-position: 1000px 0; 
  }
}

@-ms-keyframes shimmer {
  0% {
    background-position: -300px 0;
  }
  
  100% {
    background-position: 1000px 0; 
  }
}

@keyframes shimmer {
  0% {
    background-position: -300px 0;
  }
  
  100% {
    background-position: 1000px 0; 
  }
}
/************************************/
/****         shimmer end        ****/
/************************************/

#body-row {
    margin-left: 0;
    margin-right: 0;
}

.clear {
    clear: both;
    float: none;
}

.d-none:not(.ni) {
    display: none!important;
}

.checkoutSection .form-label-group {
    margin-bottom: 0;
}

.form-signin {
    width: 100%;
    margin: 0 auto;
}

.formcon span {
    /*color: #030303;*/
    font-size: 16px;
    display: block;
}

.formcon p {
    color: var(--cDkLt);
    font-size: 16px;
    margin-bottom: 0;
    display: inline-block;
}

.formcon {
    margin-bottom: 15px;
}

.footer {
    padding-bottom: 70px;
}

#sidebar-container,
#shortcut-container {
    min-height: inherit;
    padding: 0;
    position: fixed;
    bottom: -100%;
    left: 0;
    width: 100%;
    z-index: 25;
    top:0;
    height: 100%;
    /*height: calc(100% - 55px);*/
    /*background: rgba(0, 0, 0, 0.8);*/
    background: var(--cBackdrop);
}

#sidebar-container,
#shortcut-container {
    min-height: calc(100% - 53px);
    padding: 0;
}

/* Sidebar sizes when expanded and expanded */

.sidebar-expanded {
    /*width: 230px;*/
    display: none;
}

/*.sidebar-collapsed {
    width: 60px;
}*/


/* Menu item*/

#shortcut-container .list-group a:not(.anchor),
#sidebar-container .list-group a:not(.anchor) {
    background: var(--inputBg);
    height: 50px;
    color: var(--cDark);
    border-bottom: 1px solid var(--cDarkInvert)!important;
}


/* Submenu item*/

#sidebar-container .list-group .sidebar-submenu a {
    height: 45px;
    padding-left: 30px;
}

.sidebar-submenu {
    font-size: 0.9rem;
}


/* Separators */

.sidebar-separator-title {
    height: 35px;
}

.sidebar-separator {
    height: 25px;
}

.logo-separator {
    height: 60px;
}


/* Closed submenu icon */

#sidebar-container .list-group .list-group-item[aria-expanded="false"] .submenu-icon::after {
    content: "\f3d0";
    font-family: ionicons;
    display: inline;
    text-align: right;
    padding-left: 10px;
}


/* Opened submenu icon */

#sidebar-container .list-group .list-group-item[aria-expanded="true"] .submenu-icon::after {
    content: " \f3d1";
    font-family: ionicons;
    display: inline;
    text-align: right;
    padding-left: 10px;
}

.list-group-item {
    border: 0!important;
}

#sidebar-container i {
    font-size: 20px;
}

.sidebar-collapsed {
    width: 100%;
    bottom: 0!important;
    display: block !important;
}

.sidebar-collapsed .sidebar-submenu {
    display: none;
}

.sidebar-collapsed .d-none,
.sidebar-collapsed .sidebar-submenu.show {
    display: block;
}

.menu2 {
    max-width: 600px;
    margin: 0 auto;
    border-radius: 0 10px 0 10px;
    position: relative;
    bottom: 0px;
    height: 100%;
    z-index: 26;
}

.menu2 .list-group {
    position: absolute;
    width: 100%;
    bottom: 0;
    border-radius: 15px 15px 0px 0px !important;
    background: var(--cBodyBg);
}

.shortcut_icon {
    background: #efefef;
    text-align: center;
    padding: 14px 0px;
    border-radius: 50%;
    width: 55px !important;
    height: 55px !important;
    margin: 0!important;
    position: relative;
    /*padding: 0!important;*/
}

.shortcut_icon img {
    width: 25px;
    height: auto;
}

.shortcut_icon i {
    position: absolute;
    background: var(--green2);
    color: white;
    border-radius: 50%;
    width: 16px!important;
    height: 16px;
    margin: 0!important;
    padding: 0 4px;
    bottom: 0px;
    right: 0px;
    /*bottom: -1px;*/
}

.iconpop {
    position: relative;
}

.iconpop .tip {
    position: absolute;
    top: 1px;
    right: 8px;
    font-size: 32px;
}

.main-contents {
    max-width: 600px;
    margin: 0 auto;
    height: 100%;
    padding-top: 10px;
}

.sel-box + .tip {
    position: absolute;
    top: 0;
    right: 45px;
    padding: 6px;
    font-size: 25px;
    z-index: 2;
}

/************* Junaid Ahmed Khan *************/


/*helpers start*/

.no-select {
    -webkit-touch-callout: none; /* iOS Safari */ 
    -webkit-user-select: none; /* Safari */ 
    -khtml-user-select: none; /* Konqueror HTML */ 
    -moz-user-select: none; /* Firefox */ 
    -ms-user-select: none; /* Internet Explorer/Edge */ 
    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */ 
}

.pt-15p {
    padding-top: 15px;
}

.plr-15p {
    padding-left: 15px;
    padding-right: 15px;
}

.mr-5p {
    margin-right: 5px;
}

.mr-15px {
    margin-right: 15px;
}

.mb-7hp {
    margin-bottom: 7.5px!important;
}

.mt-7hp {
    margin-top: 7.5px!important;
}

.txt-dklt {
    color: var(--cDkLt)!important;
}

.txt-dk {
    color: var(--lt_cDark)!important;
}

.txt-cdk {
    color: var(--cDark)!important;
}

.txt-light {
    color: var(--cLight)!important;
}

.txt-success {
    color: var(--cSuccess)!important;
}

.txt-danger {
    color: var(--cDanger)!important;
}

.txt-info {
    color: var(--cInfo)!important;
}

.txt-yellow {
    color: var(--cYellow)!important;
}

.txt-lgray {
    color: var(--cLight)!important;
}

.bg-success,
a.bg-success:focus, a.bg-success:hover, button.bg-success:focus, button.bg-success:hover {
    background: var(--cSuccess)!important;
}

.bg-danger,
a.bg-danger:focus, a.bg-danger:hover, button.bg-danger:focus, button.bg-danger:hover {
    background: var(--cDanger)!important;
}

.bg-yellow,
a.bg-yellow:focus, a.bg-yellow:hover, button.bg-yellow:focus, button.bg-yellow:hover {
    background: var(--cYellow)!important;
}

.bg-info,
a.bg-info:focus, a.bg-info:hover, button.bg-info:focus, button.bg-info:hover{
    background: var(--cInfo)!important;
}

.bg-backdrop {
    background: var(--cBackdrop);
}

.bg-dklt {
    background: var(--cDkLt)!important;
}

.tagline {
    font-size: var(--tls);
}

.ff-b {
    font-family: var(--fontBold);
}

.ff-l {
    font-family: var(--fontLight);
}

.ff-md {
    font-family: var(--fontMd);
}

.ff-t {
    font-family: var(--fontThin);
}

.ff-black {
    font-family: var(--fontBlack);
}

.ff-r {
    font-family: var(--fontReg);
}

.ff-h {
    font-family: var(--fontHeavy);
}

.ff-sb {
    font-family: var(--fontSemiBold);
}

.ff-ul {
    font-family: var(--fontUltralight);
}

.f-xs {
    font-size: var(--fontSizeXs);
}

.f-sm {
    font-size: var(--fontSizeSm);
}

.f-md {
    font-size: var(--fontSizeMd);
}

.f-lg {
    font-size: var(--fontSizeLg);
}

.f-45p {
    font-size: 45px;
}

.f-35p {
    font-size: 35px;
}

.f-22p {
    font-size: 22px;
}

.f-19p {
    font-size: 19px;
}

.f-12p {
    font-size: 12px;
}

.f-11p {
    font-size: 11px;
}

.border-rad-19 {
    border-radius: 19px
}

.border-light {
    border-color: var(--cLight)!important;
}

.ios-blur {
    filter: blur(var(--iosBlurPx));
    -webkit-filter: blur(var(--iosBlurPx));
}

.h100prc {
    height: 100%;
}

.input-mb {
    margin-bottom: var(--inputMB);
}

.input-ml {
    margin-left: var(--inputMB);
}

.input-mr {
    margin-right: var(--inputMB);
}

.input-mt {
    margin-top: var(--inputMB);
}


/*.bg-light {
    background: var(--cLight)!important;
    background-color: var(--cLight)!important;
}*/

.slider-h {
    height: 450px!important;
}

.slider-h-ni {
    height: 450px;
}

.c-thumb {
    height: 110px!important;
    width: 110px!important;
}

.border-def {
    border-color: var(--cBorderColor);
}

.object-fit-contain {
    object-fit: contain!important;
}

.object-fit-cover {
    object-fit: cover!important;
}

.input-radius {
    border-radius: var(--cInputRadius);
}

.img-radius {
    border-radius: var(--cImgRadius);
}

/* Chrome, Safari, Edge, Opera */
input.like-text[type=number]::-webkit-outer-spin-button,
input.like-text[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input.like-text[type=number] {
  -moz-appearance: textfield;
}

.nof:focus {/*no outline on focus*/
    outline: initial!important;
}

.loadingRotate {
  -webkit-animation: rotation 2s infinite;
  animation: rotation 2s infinite;
}

.fadeOut-1s {
  -webkit-animation: fadeOut 1s ease;
  animation: fadeOut 1s ease;
}

@-webkit-keyframes rotation {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0rem;
  }
  25% {
    margin-left: 0.8rem;
  }
  75% {
    margin-left: -0.8rem;
  }
  100% {
    margin-left: 0rem;
  }
}

@-webkit-keyframes shake1 {
  0% {
    transform: translate(0);
  }
  25% {
    transform: translate(0.8rem);
  }
  75% {
    transform: translate(-0.8rem);
  }
  100% {
    transform: translate(0rem);
  }
}

.dot-after {
    position: relative;
}

.dot-after:after {
    content: '';
    height: 10px;
    width: 10px;
    border-radius: 50%;
    top: 7.5px;
    right: -1px;
    position: absolute;
}

.dot-after.dot-danger:after {
    background-color: var(--cDanger)!important;
}

.dot-after.dot-success:after {
    background-color: var(--cSuccess)!important;
}

.wu:after {/*wait until*/

}

.dot {
    background: #000000;
    width: 5px;
    height: 5px;
    display: inline-block;
    border-radius: 50%;
}

.shake {
    animation: shake 0.3s ease-in-out 0s 3;
}

.shake1 {
    animation: shake1 0.3s ease-in-out 0s 3;
}

.conSm {
    max-width: 420px;
    margin: auto;   
}
/*helpers end*/



*.loading,
.loading-sec,
button.disabled {
    position: relative;
    overflow: hidden;
}

button.disabled {
    color: transparent!important;
    opacity: .65;
}

*.loading:not(body) {
    background: transparent!important;
    padding: 25px!important;
}

*.loading:not(body):after,
.loading-sec:after,
button.disabled:after {
    content: " ";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../../imgs/loader.svg);
    background-repeat: no-repeat;
    background-position: center;
    /*background-color: #ffffff82;*/
    /*background-color: #6f6f6f82;*/
    background-size: contain;
}

*.loading:after {
    background-color: transparent!important;
}

.loading-sec:after {
    background-size: 70px 70px;
    background-color: var(--trnBg)!important;
    z-index: 10;
}


.ovrHdn {
    overflow: hidden;
}

.showPopup,
.curPointer {
    cursor: pointer;
}

.popup {
    position: fixed;
    height: calc(100% + 51px);
    background: var(--cBodyBg);
    z-index: 20;
    padding: 0;
    width: 100%;
    overflow: auto;
    padding-bottom: 20px;
    padding-top: 1px;
}

.pop-ah {
    height: auto;
}

.popup:not(.nt) {
    /*transition: 0.3s;*/
    transition: all .3s ease-in-out;
}

.hidePopup {
    cursor: pointer;
}

.popup:not(.pop-r):not(.pop-l):not(.pop-t):not(.pop-bs) {
    top: 120%;
}

.popup.on:not(.pop-r):not(.pop-l):not(.pop-t):not(.pop-bs):not(.ios) {
    /*top: 0;*/
    top: -1px;
}

.popup.on.ios {
    top: 35px!important;
}

.popup.pop-r,
.popup.pop-l,
.popup.pop-t {
    bottom: 0;
}

.popup.pop-bs {/*bottom sticky*/
    bottom: -120%;
    border-top-left-radius: var(--cBtnRadius);
    border-top-right-radius: var(--cBtnRadius);
}

.popup.pop-r {
    top: 0;
    left: 100%;
}

.popup.pop-r.on {
    left: 0;
}

.popup.pop-l {
    /*right: 100vw;*/
    right: 100%;
}

.popup.pop-l.on {
    right: 0;
}

.popup.pop-t {
    bottom: 100%;
}

.popup.pop-t.on {
    bottom: 0;
}

.popup.pop-bs.on {
    bottom: 0;
}

.popup .popupHdr .top-head,
.popup .popupHdr .top-head ul {
    height: 100%;
}

.popup .main-contents {
    padding: 0;
}

.sc1hdr,
.popup .popupHdr {
    height: 50px;
    padding: 8.5px 0;
}

.popup.iosf .popupHdr {
    /*border-bottom: 1px solid #e5e5e5;*/
    background-color: var(--inputBg);
}

.popup .popupBdy {
    min-height: calc(100% - 85px);
}

.popup .popupBdy.h-fill {
    height: calc(100% - 85px);
}

.popup .popupBdy.h-100 {
    min-height: 100%;
}

.popup.h-100 {
    height: calc(100% + 1px)!important;
}

.sc1hdr,
.popup .popupHdr {
    border-bottom: 1px solid transparent;
    background-color: transparent;
    width: 100%;
    margin: 0;
}

.sc1hdr .top-head {
    width: 100%;
}

.sc1hdr .top-head ul,
.popup .top-head ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sc1hdr .top-head ul li,
.popup .top-head ul li {
    display: flex;
    /*align-items: center;*/
}

.sc1hdr .top-head ul>li>a,
.sc1hdr .top-head ul>li>a>span,
.sc1hdr .top-head ul>li>span>span,
.sc1hdr .top-head ul>li>span,
.popup .top-head ul>li>span,
.popup .top-head ul>li>span>span {
    font-size: 17px;
}

.sc1hdr .top-head ul li:nth-child(1),
.sc1hdr .top-head ul li:nth-child(3),
.popup .top-head ul li:nth-child(1),
.popup .top-head ul li:nth-child(3) {
    width: 27%;
    cursor: pointer;
}

.backk,
.popup .top-head ul>li>span {
    display: flex;
    text-decoration: none!important;
}

.backIco,
.sc1hdr .top-head ul>li>span>i.ion,
.sc1hdr .top-head ul>li>a>i.ion,
.popup .top-head ul>li>span>i.ion {
    font-size: 31px;
    /*vertical-align: middle;*/
}

.backIco,
.sc1hdr .top-head ul > li:nth-child(1) > span > i.ion,
.sc1hdr .top-head ul > li:nth-child(1) > a > i.ion,
.popup .top-head ul > li:nth-child(1) > span > i.ion {
    margin-right: var(--pNAM);
}

.nextIco,
.sc1hdr .top-head ul > li:nth-child(3) > span > i.ion,
.sc1hdr .top-head ul > li:nth-child(3) > a > i.ion,
.popup .top-head ul > li:nth-child(3) > span > i.ion {
    margin-left: var(--pNAM);
}

.backk i {
    color: #030303;
    font-size: 31px;
    /*vertical-align: middle;*/
    /*display: inline-block;*/
}


.sc1hdr .top-head ul li span,
.sc1hdr .top-head ul li a,
.popup .top-head ul li span {
    /*border: 1px transparent;*/
    display: flex;
    height: 100%;
    align-items: center;
}

.popup.iosf .top-head ul li:nth-child(1) span,
.popup.iosf .top-head ul li:nth-child(3) span {
    color: var(--iosBlue);
}

.sc1hdr .top-head ul li:nth-child(2),
.popup .top-head ul li:nth-child(2) {
    text-align: center;
    width: 46%;
    justify-content: center;
}

.sc1hdr .top-head ul li:last-child,
.popup .top-head ul li:last-child {
    text-align: right;
    justify-content: flex-end;
}

.sc1hdr .top-head ul,
.popup .top-head ul {
    padding: 0 15px;
}

.popup.ios {
    border-radius: 15px 15px 0 0;
    height: calc(100% - 30px);
}

.popup.on.ios .popupBdy {
    height: calc(100% - 35px);
    overflow: auto;
}

.popup-backdrop {
    position: fixed;
    background: var(--cBackdrop);
    top: -1px;
    height: 100%;
    width: 100%;
    opacity: 0.75;
    z-index: 3;
}

.popup .top-head ul.no-ttl li,
.sc1hdr .top-head ul.no-ttl li {
    width: 50%;
}

.sc1hdr .top-head .helpp {
    font-size: 16px;
    font-weight: 400!important;
    padding: 2px 14px;
}

.sc1hdr .top-head .helpp span {
    vertical-align: middle!important;
    display: inline-block!important;
    font-size: 15px!important;
    margin: 0!important;
}

.sc1hdr .top-head .helpp i,
.sc1hdr .top-head .helpp span {
    display: inline-block!important;
}

.was-validated .ab-feedback {
    /*margin-bottom: calc(1rem + 21px);*/
}

.was-validated .ab-feedback .valid-feedback,
.was-validated .ab-feedback .invalid-feedback {
    /*  position: absolute;
  bottom: -1.45rem;
  left: 0;*/
}



.m-w-init {
    max-width: initial;
}

.h-init {
    height: initial;
}

.bgGray {
    background: #fff url(../imgs/bg1.png) repeat-x top left;
    height: 100%;
}

/*.chPTxtRed p,
.txtRed {
    color: var(--red)!important;
}

.chPTxtGreen p,
.txtGreen .ion-ios-checkmark-circle,
.txtGreen {
    color: var(--green)!important;
}

.txtGreen2 {
    color: var(--green2)!important;
}

.txtBlue {
    color: var(--blue)!important;
}

.bgRed {
    background: var(--red)!important;
}

.bgGreen {
    background: var(--green)!important;
}

.bgGreen2 {
    background: var(--green2)!important;
}

.bgBlue {
    background: var(--blue)!important;
}

.cBgSuccess {
    background: var(--cSuccess)!important;
}

.cTxtDkLt {
    color: var(--cDkLt);
}*/

/**** Select stylings start ****/


/* Transition */


/*.sel-box:hover::after {
  color: #f39c12;
}*/


/*floating label*/


/*
.sel-box label {
  color: rgba(0,0,0, 0.26);
  font-size: 18px;
  font-weight: normal;
  position: absolute;
  pointer-events: none;
  left: 0;
  top: 10px;
  transition: 0.2s ease all;
}
.sel-box select.slctd ~ label, .sel-box select.slctd ~ label {
  color: #2F80ED;
  top: -20px;
  transition: 0.2s ease all;
  font-size: 14px;
}
*/

/**** IOS select stylings end ****/


/*.dis-con,*/
.dis-con select {
    opacity: 0.4!important;
    cursor: not-allowed;
}


/*width:*/

.w-75pr {
    width: 75%;
}
.w-70pr {
    width: 70%;
}
.w-25pr {
    width: 25%;
}
.w-90pr {
    width: 90%;
}

.w-auto {
    width: auto!important;
}


/*width;*/




.list-group.reg {
    background: white;
    border-radius: 15px 15px 0px 0px;
}

.menu2 .reg .titile {
    padding: 10px 25px 10px 20px;
    background: var(--inputBg);
    border-radius: 15px 15px 0px 0px;
    text-align: center;
}

.menu2 .reg .titile .done {
    cursor: pointer;
    color: var(--blue);
}

.menu2 .reg .content {
    padding: 10px 25px 15px 25px;
}

.connected {
    background: #3db30099;
    padding: 11px;
    color: white;
    margin: 30px;
    border-radius: 8px;
}

.connected i {
    font-size: 20px;
    margin-left: 6px;
}

.dlt {
    cursor: pointer;
}

.dlt-icon {
    height: 26px;
}

.dlt-text {
    color: #FF0000;
    cursor: pointer;
}

.no-result {
    height: calc(100% - 110px);
    justify-content: center;
    align-items: center;
    display: flex;
    font-size: 30px;
    font-family: var(--fontBold);
    color: var(--aaBc);
}

.select2-container--default .select2-selection--multiple {
    background-color: #e7e7e9!important;
    border: none !important;
}

.select2-container {
    height: 60px !important;
}

span.select2-selection.select2-selection--multiple {
    padding: 22px 5px 1px 13px!important;
}

.collection-dlt {
    position: absolute;
    z-index: 2;
    right: 40px;
    top: 9px;
    height: 26px;
    cursor: pointer;
}

.loadingRotate {
    -webkit-animation: rotation 2s infinite;
    animation: rotation 2s infinite;
}

@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
/************************************/
/****         blog start         ****/
/************************************/
.comment,
.comment-reply{
    right: 15px;
    top: 9px;
}
.comment ion-icon,
.comment-reply ion-icon{
    font-size: 30px !important;
}
.comment-list li .comment-ref span,
.comment-list li .user{
    font-size: 20px;
    color: var(--lt_cDkLt);
}
.comment-list li .dltUser{
    top: -7px;
    right: -7px;
}
.comment-list li{
    background: var(--inputBg);
    border-radius: var(--cInputRadius);
    padding : 1.2em;
}
.siteDark .blog-list p,
.siteDark .blog-list h1,
.siteDark .blog-list span{    
    color: var(--cDark);
}
.blog-list p{    
   text-transform: initial !important;
}
.blog-list .blog-img img{
    border-radius: 10px;
}
/************************************/
/****         blog start         ****/
/************************************/

/************************************/
/****     share website start    ****/
/************************************/

.share-site{
    position: fixed;
    bottom: 70px;
    width: 100%;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    z-index: 1;
}
.share-site div{
    background: var(--inputBg);
    padding: 10px 25px;
    border-radius: 20px;
} 
/************************************/
/****     share website end      ****/
/************************************/

/************************************/
/****    ios scrollbar start     ****/
/************************************/
.ios-sb::-webkit-scrollbar {
    width: 8px;
}
 
/* Track */
.ios-sb::-webkit-scrollbar-track {
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
 
/* Handle */
.ios-sb::-webkit-scrollbar-thumb {
    opacity:0.1;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgb(0 0 0 / 11%);
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 11%);
}

/************************************/
/****     ios scrollbar end      ****/
/************************************/