html {
    scrollbar-color: #f26247 #15191f;
    scrollbar-raidus: 10px;
}

[dir="rtl"] [alt="home"],
[dir="rtl"] [alt="weight-machine"] {
    position: relative;
    bottom: 30px;
    left: 8px;
    right: inherit;
}

[dir="rtl"] .card-body.calulator-feature-container .flex {
    display: block;
}

    [dir="rtl"] .card-body.calulator-feature-container .flex div {
        float: right;
    }

[dir="rtl"] .card-body.calulator-feature-container .flex {
    display: block;
}

    [dir="rtl"] .card-body.calulator-feature-container .flex div {
        float: right;
    }

[dir="rtl"] .card-body.addresses-feature-container .flex {
    display: block;
    text-align: right;
}

    [dir="rtl"] .card-body.addresses-feature-container .flex div {
        float: right;
    }

[dir="rtl"] .shipp-btn {
    font: normal normal bold 10px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-gray-color);
    text-transform: capitalize;
    outline: none;
    border: none;
    border-radius: 0px;
    height: 30px;
    position: absolute;
    left: 9px;
    top: 8.5px;
    padding: 0 8px;
    right: inherit;
}

[dir="rtl"] #btnModalFilter {
    padding: 0;
    border-radius: 0px;
    margin-left: 3px;
    right: -51px !important;
}

[dir="rtl"] .tab-view-btn,
[dir="rtl"] .list-view-btn {
    width: 100%;
    height: 30px;
    background: #fff;
    border-radius: 0px;
    opacity: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 5px;
    float: right;
}

[dir="rtl"] .detail-btn {
    font: normal normal 600 12px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0 !important;
    color: var(--jak-gray-color);
    float: right;
    border-radius: 0px;
    outline: none;
    border: none;
    background-color: transparent;
    padding: 5px 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 90px;
    height: 27px;
    position: absolute;
    left: 9px;
    bottom: 12px;
    right: inherit;
}

[dir="rtl"] .search-switch {
    display: inline-block;
    justify-content: space-between;
    align-items: center;
}

    [dir="rtl"] .search-switch .col-3 {
        float: right;
    }

[dir="rtl"] span.phone-icon {
    left: 1rem;
    right: inherit;
}

[dir="rtl"] .loginFOrgotpswd span.phone-icon {
    left: inherit;
    right: 1px;
}

[dir="rtl"] #btncCode li:first-child {
    float: right;
}

    [dir="rtl"] #btncCode li:first-child img {
        right: -2px !important;
        top: 10px;
    }
/* [dir="rtl"] #btncCode li:last-child img {
  float: left;
  left: 10px !important;
  right: inherit !important;
} */

[dir="rtl"] #signinSub span.btn-icon img {
    transform: scaleX(-1);
}

[dir="rtl"] #signinEmail span.btn-icon img {
    transform: scaleX(-1);
}

[dir="rtl"] a.flex .create-icon img {
    transform: scaleX(-1);
}

body {
    background: url(../imgs/background.PNG);
    background-color: #11151a;
}

body,
html {
    height: 100vh;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.appbg {
    background: #F5F5F5; 
    background-repeat: repeat;
    background-attachment: fixed;
    background-size: cover;
}

input::placeholder {
    color:var(--jak-gray-color)!important;
}

.loader {
    user-select: none!important;
}

#blurContainer {
    height: 100vh;
    width: 100%;
    position: absolute;
    background-image: url("../imgs/jak-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-color: var(--jak-blue-color);
}

#greyContainer {
    height: 100vh;
    width: 100%;
    position: absolute;
    opacity: 0.8;
}

a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

a {
    color: #0366d6;
    text-decoration: none;
}

sup {
    font: normal normal normal 10px/24px 'Söhne', 'Open Sans';
    vertical-align: top;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

@keyframes buttonAnimation {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

.footer {
    /*position: absolute;*/
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    background: var(--background-primary);
    line-height: 60px; /* Vertically center the text there */
}

/* home page  */

.center-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

::placeholder {
    text-align: left;
    font: normal normal normal 16px/22px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #fff;
    opacity: 0.4;
}

.message {
    text-align: center;
    font: normal normal normal 14px/20px 'Söhne Buch', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-sub-heading);
    width: 28rem;
    margin-top: 1rem;
}

.resetpwd h4.lets-start-title {
    margin-top: 2.5rem;
}

.resetpwd p.message {
    margin-top: 0rem;
    margin-bottom: 18px;
}

.resetpwd input#pPassword,
.resetpwd #pRPassword {
    width: 430px;
}

.backgroundContainer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.logo {
    overflow: visible !important;
}

.signInContainer,
.resetContainer,
.letsStartContainer,
.otpContainer,
.personalDetailsContainer,
.idDetailsContainer,
.congratsContainer,
.almostDoneContainer,
.selectPlanContainer,
.finalStepContainer,
.newPasswordContainer {
    position: relative;
    background-color: var(--background-primary);
    border-radius: 0px;
    display: flex;
    flex-direction: column;
    /* justify-content: center; */
    align-items: center;
    width: 600px;
    padding: 1rem 0;
    height: 600px;
    margin: 0 auto;
}

.signInContainer {
    margin: 0 auto
}

.sign-in-label {
    color: #000;
}

.user-icon,
.password-icon {
    position: relative;
    right: 1.5rem;
}

.create-icon {
    /*margin: auto;*/
    margin-left: 0.5rem;
    position: relative;
    bottom: 1px;
}

.close-btn {
    position: absolute;
    right: 16px;
    top: 16px;
}

    .close-btn img {
        height: 18px;
        cursor: pointer;
    }

.back-btn {
    position: absolute;
    left: 16px;
    top: 16px;
    height: 24px;
    z-index: 1;
    cursor: pointer;
}

#btnSkip {
    outline: none;
    background: none;
    color: var(--jak-blue-color);
    border: none;
    font: normal normal 600 16px/20px 'Söhne', 'Open Sans';
    text-transform: capitalize;
    letter-spacing: normal;
    height: 24px;
}

.btn-label {
    text-align: center;
    font: normal normal 600 16px/19px 'Söhne Halbfett', 'Open Sans';
    letter-spacing: 0px;
    color: #FFF;
    text-transform: capitalize;
    margin: auto 0;
    margin-left: 6px;
}

.sign-in-btn,
.btn {
    border: none;
    background: var(--jak-blue-color);
    border-radius: 0;
    display: flex;
    justify-content: space-between;
    width: 460px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: inherit;
    height: 50px;
    padding: 8px !important;
}

#signinEmail {
    position: relative;
    top: 0rem;
    margin-bottom: 2rem;
    background: #fff;
    border: 2px solid var(--jak-blue-color);
    color: var(--jak-blue-color);
}

#signinEmail .btn-label {
    color: var(--jak-blue-color);
}

.form-container input#txtem {
    width: 410px;
}

#signinSub {
    position: relative;
    top: 0rem;
    margin-bottom: 0.5rem;
}

.btn-icon {
    margin: auto 0;
}

.label {
    text-align: center;
    font: normal normal 600 20px/36px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    text-transform: capitalize;
    margin: 1rem 0;
}

.letsStartContainer.loginstart .progress {
    margin-left: 20px;
    width: 455px;
}

.otpContainer.test .progress {
    width: 457px;
}

.otpContainer .otp-container.test {
    display: flex;
    justify-content: space-evenly;
    margin: 7rem 0 2rem;
    width: 31rem;
}

input#txtmobileno {
    width: 327px !important;
    margin-right: 25px;
}

.otp-container .otpInput {
    width: 100px;
    height: 100px;
}

.create-account-label {
    color: var(--jak-blue-color);
    font-size: 14px;
    margin-bottom: 5px;
    font: normal normal 600 14px/15px 'Söhne Halbfett', 'Open Sans';
}

.forgot-password-label {
    font: normal normal normal 14px/20px 'Söhne Buch', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-gray-color);
}

.reset-option {
    font: normal normal 600 14px/20px 'Söhne Halbfett', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-blue-color) !important;
}

.account-label {
    font: normal normal normal 12px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-gray-color);
    margin: 0.8rem 0 3px 0;
}

/* Reset Password */

.resetContainer.message {
    color: #000;
    width: 15rem;
    font-size: 14px;
    text-align: center;
}

.title,
.almost-done-title {
    text-align: center;
    font: normal normal 600 20px/24px 'Söhne Kräftig', 'Open Sans';
    letter-spacing: 0px;
    color: #000000;
    position: absolute;
    top: 2rem;
}

/* lets start */

.lets-start-title {
    text-align: center;
    font: normal normal 600 20px/24px 'Söhne Kräftig', 'Open Sans';
    letter-spacing: 0px;
    color: #000000;
    margin-top: 1.5rem;
}

.form-wrapper {
    display: flex;
}

.letsStartContainer .send-otp-btn {
    position: relative;
    top: 2rem;
    left: 0;
}

.letsStartContainer .note {
    width: 21rem;
    color: #000;
    font-size: 14px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
    margin-top: 1.3rem;
    text-align: center;
}

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background-color: #000;
    opacity: 0.8 !important;
}

    .loader img {
        position: relative;
        left: 43%;
        top: 34%;
        /* width: 200px; */
        max-width: 35%;
    }

.letsStartContainer .form-feild {
    padding-left: 0;
    position: relative;
}

    .letsStartContainer .form-feild:nth-child(2) {
        padding-left: 10px;
        position: relative;
    }

.letsStartContainer .progress {
    top: 0rem;
    margin: 1rem;
}

.otpContainer .progress .bar {
    width: 5rem;
}

.code-feild,
.number-feild {
    font: normal normal normal 16px/22px 'Söhne', 'Open Sans';
}

.code-feild {
    width: 8rem !important;
}

#mNumber {
    width: 330px !important;
}
/* .number-feild {
  width: 12.5rem !important;
} */
.phone-icon,
.dropdown-icon {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    /* background-color: #010102; */
}

/* enter otp  */

.resetContainer .message {
    color: var(--jak-sub-heading);
    width: 17rem;
    text-align: center;
    margin-top: 1.5rem;
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
}

.resetContainer .input-feild {
    width: 225px !important;
    position: relative;
    left: 47%;
    transform: translateX(-50%);
}

    .resetContainer .input-feild.txt2 {
        width: 410px !important;
        position: inherit;
        left: inherit;
        transform: inherit;
    }

/* .form-container span.float {
    background: #010102;
} */

.resend-option {
    display: flex;
    justify-content: center;
}

.resend {
    color: #000;
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
}

    .resend:hover,
    .resend-link,
    .resend-link-pwd:hover {
        text-decoration: none;
        color: #000;
    }

.resend-link,
.resend-link-pwd {
    color: #000;
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
}

.timer {
    color: #000;
    font: normal normal 600 14px/20px 'Söhne', 'Open Sans';
    padding-left: 0.5rem;
}

.otp-container {
    display: flex;
    justify-content: space-evenly;
    margin: 7rem 0 2rem;
    width: 100%;
    direction: ltr !important;
}

.signotp .otp-container {
    display: flex;
    justify-content: space-evenly;
    margin: 6rem 0 1rem;
    width: 31rem;
}

.otp {
    width: 3.5rem;
    height: 3.5rem;
    background-color: var(--background-dark);
    border-radius: 0px;
    text-align: center;
    color: #000;
    caret-color: var(--primary-darker);
    font-size: 28px;
    border: none;
    outline: none;
}

.signotp .message {
    color: #000;
    width: 23rem;
    text-align: center;
    position: relative;
    top: 5rem !important;
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
}

.otpContainer .message {
    color: #000;
    width: 23rem;
    text-align: center;
    position: relative;
    top: 6rem;
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
}

    .otpContainer .message span {
        text-align: center;
        font: normal normal 600 20px/36px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        text-transform: none;
        width: 100%;
        display: block;
        margin-bottom: 7px;
    }

    .otpContainer .message span.subHeading {
        font: normal normal 400 14px/normal 'Söhne', 'Open Sans';
    }

.next-btn,
.pay-btn {
    position: relative;
    top: 4rem;
    left: 50%;
    transform: translatex(-50%);
}

#btnOtp {
    margin-top: 2rem;
}

.idDetailsContainer .message {
    color: #000;
    text-align: center;
    margin-top: 6rem;
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
}

.idDetailsContainer .form-group input {
    width: 460px;
    letter-spacing: 0px;
}

.uploadFilesContainer {
    border-radius: 0px;
    width: 458px;
    height: 160px;
    position: relative;
    top: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 35px;
    border: 1px dashed var(--jak-blue-color);
}

.upload-icon {
    position: relative;
    top: 0.7rem;
}

.idDetailsContainer .note {
    text-align: center;
    font: normal normal normal 16px/22px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    width: 276px;
    margin: 0 auto;
}

@-moz-document url-prefix() {
    .additonal-options-container.shippingpre.mobilebutns .shippingpre1 {
        float: left;
        display: flex;
    }

    .idDetailsContainer .note {
        margin-top: -14px !important;
    }

    #img-preview {
        top: -75px !important;
    }
}

.idDetailsContainer .progress .bar {
    width: 10rem;
}

.Upload-bg.btnShipPayment {
    background: #bc361c 0% 0% no-repeat padding-box;
    height: 35px;
    padding: 7px;
    display: block;
    font: normal normal normal 14px/19px 'Söhne', 'Open Sans';
}

    .Upload-bg.btnShipPayment img {
        float: right;
        margin-top: 5px;
    }

p.upload-invoice-tag {
    display: inline;
    margin: 0 5px 0 0;
    float: left;
    font: normal normal normal 14px/19px 'Söhne', 'Open Sans';
}

#img-preview {
    width: 99%;
    height: 158px;
    border-radius: 0;
    position: absolute;
    top: -74px;
    left: 50%;
    transform: translateX(-50%);
}

.idDetailsContainer button#btnID {
    margin-top: 8px;
}

.change-img {
    position: unset;
    width: 100%;
    bottom: -98px;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    height: 36px;
    text-align: center;
}

    .change-img .change-label {
        font: normal normal 600 12px/21px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        text-align: center;
        margin-bottom: 0;
        display: inline-block;
    }

/* delivery address */
.deliveryAddressContainer,
.retailCenterContainer {
    width: 986px;
    position: relative;
    background-color: var(--background-primary);
    border-radius: 0px;
    padding: 1rem 0;
    height: 600px;
}

    .retailCenterContainer .deliveryAddressContainer .progress {
        top: 3.5rem;
    }

    .deliveryAddressContainer .progress .bar {
        width: 15rem;
    }

    .deliveryAddressContainer .message {
        margin-top: 9rem !important;
    }

    .deliveryAddressContainer .btn {
        left: 50%;
        width: 348px;
    }

.form-container input#txtpassword {
    width: 410px;
}

a.account-label.chkLangMain {
    font-size: 19px !important;
    display: flex !important;
    text-decoration: none;
    font-family: ''Jali Arabic', sans-serif';
    justify-content: center;
    font-weight: 400;
}

.idDetailsContainer .progress {
    /* margin-left: -27px; */
    width: 460px;
}

.personalDetailsContainer .progress,
.personalDetailsContainer .btn {
    width: 460px;
    margin-left: 0px !important;
}

.addressContainer {
    padding: 0 20px;
    display: block;
    width: 41%;
    background-color: var(--background-primary);
    height: 100%;
    position: absolute;
    top: 0;
    flex-direction: column;
    align-items: center;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

    .addressContainer .message {
        text-align: center;
        font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        width: 100%;
    }

    .addressContainer .title {
        position: relative !important;
    }

    .addressContainer .scroll .scroll-hide {
        position: relative;
        left: 5px;
        width: 360px;
        padding-right: 10px;
    }

.search-container {
    position: relative;
    left: 49%;
    transform: translateX(-50%);
    width: 345px;
    height: 3rem !important;
    font: normal normal normal 16px/22px 'Söhne', 'Open Sans';
}

.retailCenterContainer .mapAreaContainer {
    width: 56%;
    height: 523px;
    margin-right: 25px;
}

.mapAreaContainer {
    width: 50%;
    height: 100%;
    position: absolute;
    top: 51px;
    right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-shadow {
    box-shadow: 0px -5px 8px 16px var(--background-primary);
}

.retailCenterContainer .addressContainer .progress {
    top: 3.5rem !important;
}

    .retailCenterContainer .addressContainer .progress .bar {
        width: 17.5rem;
    }

.retailCenterContainer .message {
    margin-top: 4rem;
}

.retailCenterContainer .btn {
    box-shadow: 0px -5px 8px 16px var(--background-primary);
    left: 49%;
}
/* input feilds  */

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.form-container {
    display: flex;
    position: relative;
    width: 454px;
}

.form-group {
    position: relative;
    width: 300px;
    max-width: 100%;
    margin-bottom: 0 !important;
}

.input-feild {
    width: 345px;
    background-color: var(--jak-input-bg);
    margin: 0.5rem 0;
    padding: 0.5rem;
    border: none;
    outline: none;
    border-radius: 0px;
    color: #000;
    height: 54px;
    caret-color: var(--primary-darker);
}

.form-group input {
    border: none;
    color: #000;
    font: normal normal 600 16px/22px 'Söhne Buch', 'Open Sans';
    display: block;
    background-color: var(--jak-input-bg);
    padding-left: 12px;
    padding-bottom: 0;
    width: 345px;
    height: 50px;
    padding-top: 0px;
}

[dir="rtl"] a.account-label.chkLangMain img {
    margin-right: 4px;
}

[dir="rtl"] .form-group label,
[dir="rtl"] input:placeholder-shown + .form-control-placeholder {
    color: var(--text-lighter);
    font: normal normal normal 12px/22px 'Söhne', 'Open Sans';
    position: absolute;
    pointer-events: none;
    top: 0;
    transform: translate(12px, 24px);
    transition: all 0.2s ease-in-out;
    right: 26px;
    opacity: 0.4;
}

[dir="rtl"] input + .form-control-placeholder,
[dir="rtl"] .form-group input:focus + label {
    color: var(--text-lighter);
    font: normal normal normal 12px/17px 'Söhne', 'Open Sans';
    transform: translate(12px, 12px);
}

.finalStepContainer input:placeholder-shown + .form-control-placeholder {
    color: var(--text-lighter);
    font: normal normal normal 14px/22px 'Söhne', 'Open Sans';
    position: absolute;
    pointer-events: none;
    top: -8px;
    transform: translate(12px, 24px);
    transition: all 0.2s ease-in-out;
    left: 28px;
    opacity: 0.4;
}

.form-group label,
input:placeholder-shown + .form-control-placeholder {
    color: var(--text-lighter);
    font: normal normal normal 14px/22px 'Söhne', 'Open Sans';
    position: absolute;
    pointer-events: none;
    top: 0;
    transform: translate(12px, 24px);
    transition: all 0.2s ease-in-out;
    left: 0px;
    opacity: 0.4;
}

.form-group input:valid,
.form-group input:focus {
    outline: none;
}

    input + .form-control-placeholder,
    .form-group input:focus + label {
        color: var(--text-lighter);
        font: normal normal normal 12px/17px 'Söhne', 'Open Sans';
        transform: translate(12px, 12px);
    }

.finalStepContainer .form-group label,
.finalStepContainer input:placeholder-shown + .form-control-placeholder {
    color: var(--text-lighter);
    font: normal normal normal 16px/22px 'Söhne', 'Open Sans';
    position: absolute;
    pointer-events: none;
    top: 0;
    transform: translate(35px, 15px);
    transition: all 0.2s ease-in-out;
    left: -20px;
    opacity: 0.4;
}

.finalStepContainer input + .form-control-placeholder {
    color: var(--text-lighter);
    font: normal normal normal 12px/17px 'Söhne', 'Open Sans';
    transform: translate(31px, 7px);
    /* background: gold; */
    transition: none;
}

.finalStepContainer .form-group input:focus + label {
    color: var(--text-lighter);
    font: normal normal normal 12px/17px 'Söhne', 'Open Sans';
    transform: translate(12px, 12px);
}

[dir="rtl"] .float {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    /* background-color: var(--background-dark); */
    height: 54px;
    width: 3.2rem;
    border-top-right-radius:0;
    border-bottom-right-radius:0;
    right: inherit;
}

[dir="rtl"] .form-container .float,
.form-container .float {
    height: 50px;
}

.float {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background-color: var(--jak-input-bg);
    height: 54px;
    width: 3.2rem;
    border-top-right-radius:0;
    border-bottom-right-radius:0;
}

.icon {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    -webkit-text-fill-color: #000;
    box-shadow: 0 0 0 30px var(--jak-input-bg) inset !important;
    border-radius: 0px;
    caret-color: var(--primary-darker);
    /* border: 4px solid #010102; */
    padding-left: 7px;
}

/* congrates screen  */
.congrates-img {
    position: relative;
    top: 1rem;
}

h1 {
    text-align: center;
    font: normal normal normal 24px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-blue-color);
    font-weight: 600;
    margin: 1rem 0;
}

.card-container {
    width: 22rem !important;
}

.cards-types {
    width: 18rem;
    display: flex;
    justify-content: space-around;
    margin: 1rem;
}

.flex {
    display: flex;
}

.expiry,
.cvv {
    width: 11rem !important;
}

.cvv-container {
    position: relative;
    left: 0rem;
}

.expiry-container {
    position: relative;
    left: 11rem;
}

#adCardNumber {
    height: 54px !important;
    text-align: left;
    font-size: 16px !important;
    width: 452px !important;
}

#adCVV {
    height: 54px !important;
    text-align: left;
    font-size: 16px !important;
}

.almostDoneContainer span.float.mt-3 {
    background: transparent;
    margin: 14px 7px;
    height: auto;
    top: 18px;
    display: inline-block;
}

.multisteps-form__content .almostDoneContainer span.float.mt-3 {
    background: transparent;
    margin: 14px 7px;
    height: auto;
    top: 18px;
    display: inline-block;
}

input#adName {
    width: 452px !important;
}

button#btnTryAgain {
    margin-top: 0rem;
}

.plan-title2
.checkbox-container
.circular-checkbox-container
.round:checked ~ .checkmark {
    background-color: #1c7e23;
    position: absolute;
    top: -24px;
    left: 11px;
}

.checkbox-container .circular-checkbox-container .round:checked ~ .checkmark {
    background: var(--jak-blue-color);
    border: none;
}

.retail-details-container
.checkbox-container
.circular-checkbox-container
.round:checked ~ .checkmark {
    background: var(--jak-blue-color);
    border: none;
}

button#btnSaveRetail::after {
    right: 12px;
    bottom: 11px;
    width: 6px;
    height: 10px;
    border: 0.5px solid #000;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    content: "";
    position: absolute;
}

button#btnSaveRetail:before {
    content: "";
    width: 19px;
    height: 19px;
    background: #d33e23;
    position: absolute;
    right: 6px;
    bottom: 5px;
    border-radius: 66px; /* border: 1px solid; */
}

.checkbox-container .circular-checkbox-container .checkmark:after {
    left: 8px;
    top: 4px;
}
.checkbox-container .circular-checkbox-container .checkmark.pickupLocation:after {
    left: 7px;
    top: 3px;
}
/* retail center  */
.retail-details-container {
    background-color: #fff;
    margin: 0 1.3rem 0.5rem;
    border-radius: 0px;
    padding: 8px;
    display: flex;
    justify-content: space-between;
    margin: 0;
    margin-bottom: 1rem;
    border: 1px solid var(--jak-light-gray);
}

.f-righ .checkbox-container {
    /* width: 10%; */
    position: absolute;
    left: 324px;
    top: -99px;
}

.checkbox-container {
    width: 10%;
    position: absolute;
    right: 13px;
}

.retailAdd span.dist-retail {
    font: normal normal normal 11px/14px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-blue-color);
    opacity: 1;
}

.retailAdd span.con_number {
    font: normal normal normal 11px/14px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    direction: ltr;
    color: var(--jak-blue-color);
    opacity: 1;
    padding-left: 15px;
    float: right;
    width: 29%;
    text-align: right;
}

p.retailAdd {
    margin-top: 10px;
    display: flex;
    width: 328px;
    /* position: absolute; */
    flex: 0 0 50%;
}

    p.retailAdd img {
        width: 11px;
        margin-left: -18px;
        position: absolute;
        margin-top: 0px;
    }

.retail-areaname {
    font: normal normal 600 16px/20px 'Söhne', 'Open Sans';
    color: #000;
    margin-bottom: 0px;
    margin-top: 4px;
    width: 90%;
}

.distance {
    font: normal normal normal 12px/20px 'Söhne', 'Open Sans';
    color: #000;
    letter-spacing: 0px;
    color: #ee5e43;
}

.retail-address {
    font: normal normal normal 12px/18px 'Söhne', 'Open Sans';
    color: var(--text-light);
    margin-bottom: 0;
    margin-top: 0px;
    width: 86px;
    display: inline-block;
    margin-left: 11px;
}

/* almost done screen  */

.almostDoneContainer .message {
    margin-top: 5rem;
}

.almostDoneContainer .progress {
    top: 4.5rem !important;
}

    .almostDoneContainer .progress .bar {
        width: 100% !important;
    }

.almostDoneContainer .next-btn {
    top: 2rem !important;
}

/* select plan screen  */

.selectPlanContainer p {
    margin: 0;
}

.selectPlanContainer .message {
    margin-top: 3.5rem;
}

.selectPlanContainer .flex {
    border-bottom: 1px solid #000;
}

.selectPlanContainer .progress .bar {
    width: 12.5rem;
}

.plan-container {
    box-shadow: 0px 4px 10px 10px var(--background-dark);
    /* border-radius: 0px; */
    width: 400px !important;
    margin-top: 1.5rem;
    border: 1px solid var(--secondary-dark);
}

.addressContainer textarea#daAddress {
    margin-bottom: 0;
}

.plan-container2 {
    border-radius: 0px;
    width: 168px;
    margin-top: 1.5rem;
    border: 1px solid var(--secondary-dark);
    background: transparent linear-gradient(283deg, #fdd8be 0%, #6ad5d0 0%, #194162 100%) 0% 0% no-repeat padding-box;
}

.plan-container,
.summary-container {
    box-shadow: 0px 4px 9px #11151a;
    /* border-radius: 0px; */
    width: 345px;
    margin-top: 1.5rem;
    border: 1px solid var(--secondary-dark);
}

.plan-title2 {
    font: normal normal 600 16px/19px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    background: transparent linear-gradient(100deg, #0d304d 0%, #073c60 100%) 0% 0% no-repeat padding-box;
    margin: 0;
    padding: 1rem;
    position: relative;
    font: normal normal 600 13px/16px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    text-transform: capitalize;
}

.plan-container2 p.currency {
    margin: 0;
}

.plan-container2 p.validity {
    margin: 0;
}

.plan-container2 .price {
    font: normal normal 600 43px/53px 'Söhne', 'Open Sans';
    color: #000;
    padding-left: 0.5rem;
    margin: 0;
}

.card-body.storage-card-UAE .countryheader {
    background: transparent linear-gradient(263deg, #1cb15f 0%, #0e502c 100%) 0% 0% no-repeat padding-box;
    padding: 5px 11px;
    border-radius: 0px 0px;
}

.card-body.storage-card-UK .countryheader {
    background: transparent linear-gradient(263deg, #1cb15f 0%, #0e502c 100%) 0% 0% no-repeat padding-box;
    padding: 5px 11px;
    border-radius: 0px 0px;
}

.card-body.storage-card-BH .countryheader {
    background: transparent linear-gradient(263deg, #ffffff 0%, #e3e3e3 100%) 0% 0% no-repeat padding-box;
    padding: 5px 11px;
    border-radius: 0px 0px;
}

.card-body.storage-card-US .countryheader {
    background: transparent linear-gradient(263deg, #e94b35 0%, #75261b 100%) 0% 0% no-repeat padding-box;
    padding: 5px 11px;
    border-radius: 0px 0px;
}

.storage-card-BH .card-body.storage-card-UAE .countryheader {
    background: transparent linear-gradient(263deg, #ffffff 0%, #e3e3e3 100%) 0% 0% no-repeat padding-box;
    box-shadow: var(--jak-shadow);
    border-radius: 0px 0px;
    opacity: 1;
}

.storage-card-BH .card-body.storage-card-UK .countryheader {
    background: transparent linear-gradient(263deg, #ffffff 0%, #e3e3e3 100%) 0% 0% no-repeat padding-box;
    box-shadow: var(--jak-shadow);
    border-radius: 0px 0px;
    opacity: 1;
}
.storage-card .card-body.storage-card .countryheader {
    background: transparent linear-gradient(263deg, #ffffff 0%, #e3e3e3 100%) 0% 0% no-repeat padding-box;
    box-shadow: var(--jak-shadow);
    border-radius: 0px 0px;
    opacity: 1;
}
.countryheader img {
    width: 50px;
    height: 26px;
}

.countryheader span.lbl {
    font: normal normal 10px/17px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff !important;
    width: 62%;
    position: absolute;
    margin: 1px 7px;
}

.cntryadd .card-body .card-body {
    padding: 0px !important;
    background: #fff;
    box-shadow:none;
    border-radius: 0px;
    opacity: 1;
    height: 400px;
}

.cntryadd .ad_moredetails {
    float: right;
    padding: 0;
    display: block;
}

.col-6.flex.ad_moredetails span {
    float: right;
    margin-top: 13px;
    margin-right: 7px;
}

.footercard label.label-head {
    margin: 0;
}

.ad_moredetails span {
    text-align: left;
    font: normal normal 10px/25px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #f7fafc;
    background: transparent;
    opacity: 1;
    height: 26px;
    padding: 0 8px;
}

.card-body .user_address {
    padding: 0 15px 8px;
}

.plan-title {
    font: normal normal 600 16px/19px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    background: transparent linear-gradient( 261deg, var(--secondary-dark) 0%, var(--secondary-darker) 100% ) 0% 0% no-repeat padding-box;
    margin: 0;
    padding: 1rem;
    position: relative;
}

ul {
    margin: 0.5rem 0;
}

.features > li {
    font: normal normal 600 14px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    font-weight: 400;
    position: relative;
    left: 2.5rem;
    padding: 0.1rem;
}

.price {
    font: normal normal 600 36px/49px 'Söhne', 'Open Sans';
    color: #000;
    padding-left: 1rem;
}

.currency {
    font: normal normal 600 14px/19px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    text-transform: capitalize;
    padding: 0.5rem 0 0 0.5rem;
}

.validity {
    font: normal normal 300 14px/19px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    text-transform: capitalize;
    padding: 0 0 0 0.5rem;
}

.selectPlanContainer .next-btn {
    top: 1rem !important;
    box-shadow: 0px -5px 8px 16px var(--background-primary);
}

.storage-card-BH .copy-address.copy-address-BH {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #010102;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    margin-top: 11px;
    z-index: 100;
}

.storage-card-UAE .copy-address.copy-address-UAE {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    margin-top: 11px;
    z-index: 100;
}

.storage-card-UK .copy-address.copy-address-UAE {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    margin-top: 11px;
    z-index: 100;
}

.storage-card-US .copy-address.copy-address-US {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    margin-top: 11px;
    z-index: 100;
}
.storage-card .copy-address.copy-address-US {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    margin-top: 11px;
    z-index: 100;
}
.col-12.addcenter {
    padding: 0 30px;
}

span.header-line img {
    height: 35px;
    border-radius: 100%;
    width: 35px;
    float: left;
    margin-right: 6px;
    margin-top: -2px;
}

.kmowmr {
    font: normal normal 16px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    margin: 25px 0 15px 0;
}

span.splitamt {
    float: right;
    font: normal normal 600 16px/21px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    margin-top: 15px;
    display: inline-block;
}

span.bthead {
    font: normal normal 14px/21px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    text-align: left;
    width: 100%;
    display: block;
    margin: 0px 0 2px 0px;
    float: left;
    text-transform: capitalize;
}

span.btsbhead {
    font: normal normal 12px/16px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    font: normal normal 12px/16px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    text-transform: none;
    opacity: 1;
    text-align: left;
    display: block;
    float: left;
}

.sgnin input#mNumber {
    width: 324px !important;
}

button#ReqForPhotos {
    background: transparent linear-gradient(268deg, #2886b1 0%, #156a91 100%) 0% 0% no-repeat padding-box;
    width: 345px;
    height: 99px;
    height: 99px;
    padding: 15px;
    text-transform: capitalize;
    border-radius: 0px;
    float: left;
    margin: 0 15px 15px 0;
}

select#shippingUnit {
    height: 45px;
    background: var(--jak-input-bg);
    border-radius: 0px;
    opacity: 1;
    cursor: pointer;
    border: none;
    margin-top: 27px;
    width: 68px;
    margin-left: 15px;
    font: normal normal normal 16px/22px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-gray-color);
    opacity: 1;
    padding: 0.375rem 0.5rem;
}

select#shippingTo,
select#shippingFrom {
    background: #fff;
    border-radius: 0px;
    opacity: 1;
    width: 100%;
    height: 84px;
    text-align: center;
    font: normal normal normal 14px/80px 'Söhne', 'Open Sans' !important;
    letter-spacing: 0px;
    color: #fff;
    opacity: 0.8;
    border: none;
}

    select#shippingTo,
    select#shippingFrom option {
        text-align: left;
        padding: 20px;
        color: white;
        display: block;
    }

button#ReqForPhotos img,
#btnSplit img,
#btnInspect img,
#btnDistroy img {
    height: 20px;
    margin-left: 70px;
    float: left;
    margin-left: -15px !important;
    top: -7px;
    position: relative;
    left: 16px;
}

#btnSplit {
    width: 345px;
    height: 99px;
    height: 99px;
    padding: 10px;
    text-transform: capitalize;
    background: transparent linear-gradient(269deg, #d69b43 0%, #a0640d 100%) 0% 0% no-repeat padding-box;
}

.tab-view-btn a:hover,
.list-view-btn a:hover,
a.slect_packlink:hover,
.fltrdays a:hover {
    text-decoration: none;
    cursor: pointer;
}

.bottom-listfooter .downld a:hover,
.bottom-listfooter .trck a:hover {
    text-decoration: none;
    cursor: pointer;
    color: inherit;
}

.newlistcrd .card-header.BGusa {
    background: transparent linear-gradient(263deg, #e94b35 0%, #75261b 100%) 0% 0% no-repeat padding-box;
    border: none;
    border-radius: 0px 0 0 0;
}

.newlistcrd .card-header.BGqatar p.package-id,
.newlistcrd .card-header.BGqatar .package-from {
    color: #010102;
}

.package-details-body .font-data.card-header.BGuae,
.newlistcrd .card-header.BGuae {
    background: transparent linear-gradient(263deg, #1cb15f 0%, #0e502c 100%) 0% 0% no-repeat padding-box;
    border-radius: 0px 0 0 0;
}

.package-details-body .font-data.card-header.BGqatar,
.newlistcrd .card-header.BGqatar {
    background: transparent linear-gradient(263deg, #ffffff 0%, #e3e3e3 100%) 0% 0% no-repeat padding-box;
    border-radius: 0px 0 0 0;
}

.dtlsvalues span.crdlbl {
    text-align: left;
    font: normal normal 300 10px/16px 'Söhne Buch', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-gray-color);
    opacity: 1;
    width: 100%;
    display: block;
}

.bottom-listfooter {
    display: flex;
    flex-wrap: inherit;
}

    .bottom-listfooter .downld {
        font: normal normal 600 10px/12px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        text-transform: capitalize;
        opacity: 1;
    }

    .bottom-listfooter .trck {
        font: normal normal 600 10px/12px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        text-transform: capitalize;
        opacity: 1;
    }

.bottom-listfooter {
    display: flex;
    flex-wrap: inherit;
    background: #fff;
    height: 45px;
    padding: 12px 10px;
    border-radius: 0 0 0 0;
}

.downld img,
.trck img {
    float: left;
    margin: 4px;
}

.upload-invoice-modaldiv#ModalDialog {
    height: 670px !important;
}

.row.mb-5.tab-view-container.listviewcntr {
    background: white;
    box-shadow: none;
    border-radius: 0px;
    opacity: 1;
    padding: 8px;
    width: 100%;
}

.empty-section-text {
    color: #000;
}

.empty-section-text:hover {
    color: var(--jak-blue-color);
}

.package-details-body .font-data.card-header {
    background: #fff;
}

.col-12.dtlsvalues.list > div {
    padding: 0 6px 0 3px;
    flex-grow: 2;
    margin: 2px 0;
}

.bottom-listfooter .downld {
    font: normal normal 600 10px/12px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-blue-color);
    text-transform: capitalize;
    opacity: 1;
}

.dtlsvalues .downld {
    font: normal normal 600 10px/12px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-blue-color);
    text-transform: capitalize;
    opacity: 1;
}

.bottom-listfooter .trck {
    font: normal normal 600 10px/12px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-blue-color);
    text-transform: capitalize;
    opacity: 1;
    width: 87%;
}

.dtlsvalues .trck {
    font: normal normal 600 10px/12px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-blue-color);
    text-transform: capitalize;
    opacity: 1;
}

.fltrdays a {
    font: normal normal 14px/13px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    opacity: 1;
    border-right: 1px solid #d4d5d7;
    margin: 0 5px;
    display: inline-block;
    padding-right: 13px;
}

.newlistcrd .card-header {
    height: 46px;
}

.fltrdays a.fltractive {
    font: normal normal 600 14px/13px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-blue-color) !important;
    opacity: 1;
}

.downld.uploadpackageInvocie:hover,
.bottom-listfooter .trck {
    cursor: pointer;
}

.newlstcntr .dtlsvalues .crdvalue {
    text-align: left;
    font: normal normal normal 13px/normal 'Söhne Buch', 'Open Sans' !important;
}

p.total-val.crdvalue sup {
    font: normal normal normal 9px/15px 'Söhne', 'Open Sans';
}

.dtlsvalues .crdvalue {
    text-align: left;
    font: normal normal normal 14px/24px 'Söhne', 'Open Sans' !important;
    letter-spacing: 0px;
    color: #000;
    opacity: 1;
}

.col-12.fltrdays {
    text-align: left;
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #d4d5d7;
    opacity: 1;
    margin: 25px 0;
}

.cntryadd label.label-head {
    text-align: left;
    font: normal normal 10px/14px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-gray-color);
    opacity: 1;
}

.row.mt-1.footercard span.usr-phone {
    font: normal normal normal 14px/14px 'Söhne', 'Open Sans';
    letter-spacing: -0.03px;
    color: #ffffff;
    opacity: 1;
    width: 80%;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    height: 15px;
}

.cntryadd .usr-address {
    text-align: left;
    font: normal normal normal 14px/24px 'Söhne', 'Open Sans';
    letter-spacing: -0.03px;
    color: #000;
    opacity: 1;
}

.row.mt-1.footercard {
    background: #fff;
    width: 100%;
    margin: 0px;
    border-radius: 0px 0px 0;
    height: 45px;
    position: absolute;
    bottom: 0;
}

.cntryadd .card-header.modal-hdr-bg.bb-1 {
    background: #1f242b !important;
}

.cntryadd .card-body {
    background: #1f242b;
}

.selectPlanContainer .checkbox-container {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-100%);
}

.selectPlanContainer .scroll .scroll-hide {
    max-height: 17rem !important;
    padding-right: 8px;
    position: relative;
    left: 3px;
}

div#dvPlan-1,
.selectPlanContainer .btn {
    width: 453px !important;
    margin-left: 0px;
}

.selectPlanContainer .progress {
    width: 450px;
    margin-left: -7px;
}

#div-addareawidth .progress {
    width: 346px;
}

.retailCenterContainer .progress {
    width: 360px !important;
    margin-left: 3px;
}

input#rtSearch {
    width: 364px;
    margin-left: 0px;
}

#planList {
    position: relative;
}

/* final step screen  */

.final-step-title {
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
    color: #000;
    margin-top: 3.25rem;
}

.apply-btn,
#btnApplyFilter {
    background: var(--jak-blue-color);
    border-radius: 0px;
    color: #fff;
    outline: none;
    border: none;
    height: 2.8rem;
    width: 7rem;
    position: relative;
    top: 5px;
    right: 4.2rem;
    font: normal normal 600 16px/19px 'Söhne', 'Open Sans';
}

.title.one-last-step {
    top: 1.5rem;
}

#btnOLS {
    margin-top: -20px;
}

    .apply-btn p {
        margin: auto;
    }

.finalStepContainer .summary-container {
    width: 460px;
    margin: 1.2rem auto 0;
    border: 0;
}

.form-container.loginFOrgotpswd {
    margin-left: -7px;
}

.congratsContainer h1 {
    margin-top: 2rem;
}

.congratsContainer h3.message {
    margin-top: 0;
}

.flex.total-amt span {
    font: normal normal 600 18px/24px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    text-transform: capitalize;
    opacity: 1;
}

.flex.total-amt #TotalPriceTxt {
    font: normal normal bold 18px/24px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    text-transform: capitalize;
    opacity: 1;
}

.summary-container {
    width: 345px;
    margin-top: 0.75rem;
    padding: 0.5rem 0 0.25rem 0;
}

    .summary-container .flex {
        justify-content: space-between;
        margin: 0 0.8rem;
    }

        .summary-container .flex span {
            font: normal normal normal 16px/22px 'Söhne', 'Open Sans';
            letter-spacing: 0px;
            color: #000;
            text-transform: capitalize;
            margin: 0.25rem 0;
            direction: ltr;
        }

.pay-btn {
    top: 0;
    box-shadow: 0px -5px 8px 16px var(--background-primary);
}

.total-amt {
    /* background-color: var(--jak-blue-color); */
    margin: 0 !important;
}

    .total-amt span {
        margin: 1rem !important;
    }

.finalStepContainer .footnote {
    text-align: center;
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
    color: #737477;
    /* width: 31rem; */
    /* padding: 0 7rem; */
}

.finalStepContainer .message {
    margin-top: 8px !important;
}

.message.coupon-apply {
    display: flex;
    margin-bottom: 0.5rem;
    justify-content: center;
    gap: 20px;
    padding: 0 1.25rem;
}

input#olsCouponCode {
    margin: 0 0 0 25px;
    width: 460px;
    margin-left: 18px;
}

button#btnOLSApply {
    right: 49px;
}

.security {
    font: normal normal 600 14px/20px 'Söhne', 'Open Sans';
    color: var(--jak-blue-color);
    text-align: center;
    margin: 0.5rem 0;
}

.finalStepContainer .scroll .scroll-hide {
    max-height: 15rem !important;
    position: relative;
    left: 6px;
}

.finalStepContainer .progress {
    top: 4.5rem !important;
    width: 460px;
}

    .finalStepContainer .progress .bar {
        width: 25rem;
    }

/* personal details screen  */

.personalDetailsContainer .message {
    margin-top: 6rem;
}

.personalDetailsContainer .scroll .scroll-hide .form-group input {
    width: 460px;
}

.personalDetailsContainer .scroll .scroll-hide {
    max-height: inherit;
    position: relative;
    left: 0px;
    padding-right: 8px;
}

.personalDetailsContainer .progress .bar {
    width: 7.5rem;
}

.personalDetailsContainer .square {
    right: 10rem;
    top: 1.5rem;
}

.terms {
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
    color: #000;
    margin-left: 32px;
    display: block;
}

span.close-btnretail {
    position: absolute;
    right: -580px;
    margin: 9px;
    cursor: pointer;
}

.terms span {
    color: var(--jak-blue-color);
}

.terms-and-condition {
    /* margin-top: 1rem; */
    /*margin-left: -12px;*/
}

.col-12.text-center.empty-section {
    margin: auto;
}

.scroll .scroll-hide {
    max-height: 15rem;
    overflow: auto;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    overflow-x: hidden !important;
}

    .scroll .scroll-hide::-webkit-scrollbar {
        width: 0.4rem;
        height: 0.4rem;
    }

    .scroll .scroll-hide::-webkit-scrollbar-track {
        box-shadow: inset 0 0 6px var(--background-dark);
    }

    .scroll .scroll-hide::-webkit-scrollbar-thumb {
        border-radius: 0px;
        background: transparent linear-gradient(260deg, var(--primary-dark) 0%, var(--primary-darker) 100%) 0%;
    }

.progress {
    height: 0.4rem;
    width: 430px;
    border-radius: 1rem;
    background-color: var(--background-dark);
    position: relative;
    top: 5rem;
}

    .progress .bar {
        height: 0.3rem;
        background-color: var(--jak-blue-color);
        width: 2.5rem;
        border-radius: 1rem;
    }

/* checkbox  */

.square {
    position: relative;
}

    .square label {
        background-color: var(--background-dark);
        border-radius: 20%;
        cursor: pointer;
        height: 20px;
        left: 0;
        position: absolute;
        top: 0;
        width: 20px;
    }

        .square label:after {
            border: 2px solid #fff;
            border-top: none;
            border-right: none;
            content: "";
            height: 4px;
            left: 5px;
            position: absolute;
            top: 7px;
            transform: rotate(-45deg);
            width: 12px;
            opacity: 0;
        }

    .square input[type="checkbox"] {
        visibility: hidden;
    }

        .square input[type="checkbox"]:checked + label {
            background-color: var(--jak-blue-color);
        }

            .square input[type="checkbox"]:checked + label:after {
                opacity: 1;
            }

/* circular checkbox  */

.circular-checkbox-container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .circular-checkbox-container .round {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

.checkmark {
    position: absolute;
    top: 0;
    left: 5px;
    height: 25px;
    width: 25px;
    background-color: #262626;
    border-radius: 0px;
}

.checkmark.pickupLocation {
    position: absolute;
    top: 0;
    left: 5px;
    height: 20px;
    width: 20px;
    background-color: var(--jak-input-bg);
    border-radius: 50%;
}

[dir="rtl"] .checkmark {
    left: 330;
}

.circular-checkbox-container:hover .round ~ .checkmark {
    background-color: #262626;
}

.circular-checkbox-container .round:checked ~ .checkmark {
    background-color: #1c7e23;
}

.addressContainer .progress {
    width: 330px;
    top: 3.5rem;
}

.curentcity {
    margin-top: 67px;
    position: absolute;
    margin-bottom: 6px;
    display: block;
    font: normal normal normal 14px/26px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    text-align: center;
    width: 335px;
    margin: 70px auto 6px;
}

#div-addareawidth {
    width: 39%;
    /* background: darkcyan; */
    display: block;
}

.accountretailpopo .curentcity span {
    width: 43%;
    display: flex;
    font: normal normal bold 20px/20px 'Söhne', 'Open Sans';
    text-align: center;
    margin: auto;
    margin-top: 2px;
    justify-content: center;
}

.curentcity span {
    width: 43%;
    display: flex;
    font: normal normal bold 18px/20px 'Söhne', 'Open Sans';
    text-align: center;
    margin: auto;
    margin-top: 2px;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.circular-checkbox-container .round:checked ~ .checkmark:after {
    display: block;
}

.circular-checkbox-container .checkmark:after {
    left: 10px;
    top: 5px;
    width: 6px;
    height: 12px;
    border: 0.5px solid #fff;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.circular-checkbox-container .checkmark.pickupLocation:after {
    left: 10px;
    top: 5px;
    width: 6px;
    height: 12px;
    border: 0.5px solid #fff;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* new password generate screen  */
.newPasswordContainer .message {
    width: 13rem !important;
    margin-top: 6rem;
}

.newPasswordContainer .change-btn {
    top: 5rem !important;
}

/* short-hand stylings */
.m-auto {
    margin: auto;
}

.flex {
    display: flex;
}

.center-x {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.send-otp {
    margin-top: 2rem;
}

.signotp h4.title {
    top: 10rem;
    color: #000000;
}

@media only screen and (max-width: 425px) {
    .row.add_visacrdcntr .checkmark {
        position: absolute;
        top: 0;
        left: -17px;
    }

    .acc_saveadd + .accedtaddress {
        height: 100% !important;
    }

    div#filterModal .modal-header .close {
        right: 33px !important;
    }

    div#pageModal #ModalDialog .modal-header.helphdr,
    div#pageModal #ModalDialog .modal-body.pack-help.pt-0,
    div#pageModal #ModalDialog .modal-footer.helphdr.pt-0 {
        width: 300px !important;
        margin: auto;
    }

        div#pageModal #ModalDialog .modal-body.pack-help.pt-0 .form-container,
        div#pageModal #ModalDialog .modal-body.pack-help.pt-0 input,
        div#pageModal #ModalDialog .modal-body.pack-help.pt-0 textarea {
            width: 100% !important;
            /* margin: auto; */
        }

    .help-card .help-content {
        font: normal normal 600 11px/22px 'Söhne', 'Open Sans';
        color: #000;
    }

    .text.iconcntr.col-md-3:before {
        border: none;
    }

    .bottom-listfooter button.btnTrack-now {
        margin-top: -2px;
        font: normal normal 600 11px/14px 'Söhne', 'Open Sans' !important;
        width: 73px;
        text-align: left;
        padding: 0;
        display: block;
    }

    div#ModalOverlayDialog {
        max-width: 300px !important;
        /* padding: 0; */
    }

    .splitbuttonstocardft button#ship-yourself-btn {
        width: 330px !important;
    }

    .letsStartContainer.loginstart #mNumber {
        width: 200px !important;
    }

    .sgnbtncntr button#btnMobile {
        width: 300px;
    }

    .loginFOrgotpswd input#txtmobileno {
        width: 200px !important;
        margin-right: 25px;
    }

    .signInContainer,
    .resetContainer,
    .letsStartContainer,
    .otpContainer,
    .personalDetailsContainer,
    .idDetailsContainer,
    .congratsContainer,
    .almostDoneContainer,
    .selectPlanContainer,
    .finalStepContainer,
    .newPasswordContainer {
        width: 90vw;
    }

    .form-container {
        display: flex;
        position: relative;
        width: 300px;
    }

    .form-group input {
        width: 300px !important;
    }


    .progress {
        width: 300px;
        position: absolute;
        top: 8rem !important;
    }

    .letsStartContainer .note {
        font-size: 13px;
    }

    .number-feild {
        width: 11rem !important;
    }

    .message,
    .idDetailsContainer .message {
        font-size: 12px;
        margin-top: 2rem !important;
    }

    .change-img {
        bottom: -86px;
    }

    .selectPlanContainer .scroll .scroll-hide {
        max-height: unset !important;
        position: relative;
    }

    .apply-btn {
        right: 5rem;
    }

    .plan-container,
    .summary-container {
        margin-top: 12px;
        position: relative;
        left: 2px;
        width: 295px;
    }

    .finalStepContainer .scroll .scroll-hide {
        max-height: 19rem !important;
    }

    .cards-types {
        margin-top: 2rem;
    }

    .almostDoneContainer .flex {
        width: 600px;
    }

    .almostDoneContainer .expiry,
    .almostDoneContainer .cvv {
        width: 140px;
    }

    .addressContainer .scroll .scroll-hide {
        position: relative;
        width: 280px;
        left: 3px;
        padding-bottom: 4rem;
        bottom: 6px;
    }

    .deliveryAddressContainer .btn {
        left: 50%;
        bottom: 8px;
    }

    .scroll .scroll-hide {
        max-height: 10rem;
    }

    .addressContainer {
        width: 100%;
    }

    .search-container {
        width: 285px !important;
        top: 10px;
    }

    .addressContainer {
        width: 100% !important;
    }

    .mapAreaContainer {
        width: 100%;
        height: 45%;
        position: absolute;
        top: 81px;
        right: 0;
        border-radius: 0;
    }

    .deliveryAddressContainer,
    .retailCenterContainer {
        width: 320px;
        height: 600px;
    }

    .mobile-view {
        height: 625px !important;
    }

    .mmt-19 {
        margin-top: 19rem;
    }

    .retailCenterContainer .btn {
        left: 50%;
        position: absolute !important;
        bottom: 8px;
    }

    .congrates-img {
        width: 16rem;
        margin-top: 2rem;
    }

    .resetContainer .input-feild {
        width: 295px !important;
    }

    .retailCenterContainer .btn {
        box-shadow: 0px -5px 8px 8px var(--background-primary);
    }

    .retailCenterContainer .message {
        margin-top: 24rem;
    }

    .retailCenterContainer .addressContainer .progress {
        top: 4.5rem !important;
    }

    #mNumber {
        width: 182px !important;
    }
}

/* navbar styling */

.s2d-navbar {
    background-color: var(--navbar-dark);
    border-radius: 0px;
}

    .s2d-navbar .navbar-nav .s2d-nav-link {
        color: var(--nav-link);
        font: normal normal 600 16px/20px 'Söhne', 'Open Sans';
        margin-left: 40px;
        display: flex;
    }

/* dashboard styling */
.user-greet {
    margin: 24px 0;
}

#package-container,
#shipment-container,
#features-container {
    margin: 16px 0;
}

#features-container {
    margin-top: 24px;
}

#package-container .flex-container,
#shipment-container .flex-container {
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}

#user-name {
    font: normal normal 400 24px/29px 'Söhne Buch', 'Open Sans';
    color: #000000;
}

#shipment-title,
#shipments-title,
#packages-title,
#items-in-title,
#package-history-title,
#shipment-history-title {
    font: normal normal 600 16px/20px 'Söhne', 'Open Sans';
    color: var(--jak-gray-color);
}

.packages-body-scroll {
    max-height: 75vh;
    overflow: auto;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    overflow-x: hidden !important;
}

    .packages-body-scroll::-webkit-scrollbar {
        width: 0.4rem;
        height: 0.4rem;
    }

    .packages-body-scroll::-webkit-scrollbar-track {
        box-shadow: inset 0 0 6px var(--background-dark);
    }

    .packages-body-scroll::-webkit-scrollbar-thumb {
        border-radius: 0px;
        background: transparent linear-gradient(260deg, var(--primary-dark) 0%, var(--primary-darker) 100%) 0%;
    }

#auto-ship-container {
    background: var(--background-primary) 0% 0% no-repeat padding-box;
    border-radius: 0px;
    width: 118px;
    height: 117px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    right: 9px;
    top: -5px;
    justify-content: space-evenly;
}

.card-body {
    background-color: #fff;
    padding: 7px 15px !important;
}

.card-header {
    background-color: var(--jak-green-color);
    padding: 7px 15px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.txt-center {
    text-align: center;
}

.package-id,
.shipment-id,
.item-id {
    margin: 0;
    font: normal normal 600 12px/17px 'Söhne', 'Open Sans';
    color: #000;
}

.package-id.multiShipment {
    color: var(--jak-sub-heading);
}

.multiShipTrack {
    color: #000;
    font-weight: 400;
}

.package-from,
.shipment-from,
.item-name {
    margin: 0;
    font: normal normal 12px/17px 'Söhne Buch', 'Open Sans';
    color: var(--jak-sub-heading);
}

.received-title,
.shipment-title,
.total-val-title,
.weight-title,
.total-weight-title,
.estimate-title,
.total-declared-title,
.total-item-title,
.order-total-title {
    margin: 0;
    font: normal normal 300 12px/24px 'Söhne', 'Open Sans';
    color: var(--jak-gray-color);
}

.auto-ship-title,
.auto-ship-days {
    font: normal normal normal 10px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #000;
    text-transform: capitalize;
}

.receved-date,
.shipment-date,
.estimate-date,
.total-val,
.weight-val,
.total-weight-val,
.total-declared-val,
.total-item-val,
.order-total-val {
    margin: 0;
    font: normal normal normal 16px/24px 'Söhne', 'Open Sans' !important;
    color: #000;
}

.receved-date.crdvalue.forceltr.currencyValue {
    font: normal normal normal 14px/24px 'Söhne', 'Open Sans' !important;
}

.package-received-date {
    font: normal normal 400 14px/21px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    background: var(--jak-input-bg);
    width: fit-content;
    padding: 5px 10px;
    position: relative;
    left: -38px;
}

.package-received-status {
    font: normal normal normal 14px/21px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
}

.package-count {
    float: right;
    background: #f05133 0% 0% no-repeat padding-box;
    width: 19px;
    height: 18px;
    border-radius: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.item-detail-header {
    background: transparent linear-gradient( 93deg, var(--status-green-dark) 0%, var(--status-green-light) 100% ) 0% 0% no-repeat padding-box;
    border-radius: 0px 0 0px 0px;
}

    .item-detail-header:nth-child(2) {
        background: transparent linear-gradient(93deg, #a5270f 0%, #e44e30 100%) 0% 0% no-repeat padding-box;
    }

.time-line {
    padding-bottom: 16px;
      border-left: none;
    padding-left: 24px;
    /* filter: grayscale(1); */
    position: relative;
    list-style-type: none;
}

.retailAdd span.dist-retail {
    font: normal normal normal 11px/14px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-blue-color);
    opacity: 1;
    padding-left: 21px;
}

input#pCheckbox:checked {
    height: 50px;
    /*width: 50px;*/
    border: 1px solid var(--jak-blue-color);
}

    input#pCheckbox:checked + label + .bgcolor {
        height: 20px;
        width: 20px;
        position: absolute;
        background: var(--jak-blue-color);
        left: 5px; /* z-index: 1000; */
    }

.idDetailsContainer p.notemessge {
    margin-top: 20px;
    color: #ffffffb3;
}

.personalDetailsContainer {
    height: 620px !important;
}

input#pCheckbox + label {
    height: 18px;
    width: 18px;
    border: 1px solid var(--jak-light-gray);
    position: absolute;
    margin-left: 6px;
    background: var(--jak-input-bg);
}

input#pCheckbox:checked + label {
    width: 14px;
    height: 8px;
    position: absolute;
    top: 4px;
    left: 2px;
    border: 4px solid #fff;
    border-top: none;
    border-right: none;
    background: transparent;
    opacity: 1;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    z-index: 100;
}

input#pCheckbox {
    z-index: 1000;
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.retailAdd span.con_number {
    font: normal normal normal 11px/14px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-blue-color);
    opacity: 1;
    float: right;
    width: 35%;
}

p.retailAdd {
    margin-top: 10px;
}

.time-line-icon {
    background: url(../svg/shipmentHistory.svg);
    height: 40px;
    background-repeat: no-repeat;
    position: absolute;
    width: 30px;
    left: -15px;
    background-color: var(--background-primary);
    top: 36px;
    padding: 8px;
    border: 1px solid var(--jak-light-gray);
}

.btnpack-detail {
    font: normal normal 600 12px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-gray-color);
    width: auto;
}

.btnorder-details {
    border: none !important;
    background-color: transparent !important;
    outline: none !important;
    font: normal normal normal 12px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-blue-color) !important;
    text-transform: capitalize;
    position: relative;
    top: 13px;
}

.btntotal-items {
    border: none !important;
    background-color: transparent !important;
    outline: none !important;
    font: normal normal normal 12px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-blue-color) !important;
    text-transform: capitalize;
    position: relative;
    top: 13px;
}

.detail-btn {
    font: normal normal 600 10px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-gray-color);
    float: right;
    border-radius: 0px;
    outline: none;
    border: none;
    background-color: transparent;
    padding: 5px 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 90px;
    height: 27px;
    position: absolute;
    right: 9px;
    bottom: 12px;
}

.addressBtn button.detail-btn {
    font: normal normal 500 12px/20px 'Söhne Kräftig', 'Open Sans';
    background: transparent;
    color: var(--jak-blue-color);
    white-space: nowrap;
}

.view-all-btn {
    margin: 0;
    color: var(--jak-blue-color);
    font: normal normal 600 12px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
}

.shipp-btn {
    background: #DDEBFF;
    font: normal normal 500 10px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #1359BC;
    text-transform: capitalize;
    outline: none;
    border: none;
    border-radius: 0px;
    height: auto;
    position: absolute;
    right: 9px;
    top: 8.5px;
    padding: 0 8px;
}

#ship-back-btn,
#ship-yourself-btn {
    font: normal normal 600 15px/normal 'Söhne Halbfett', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    text-transform: none;
    background: var(--jak-blue-color);
    border-radius: 0px;
    width: 100%;
    height: 54px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
    padding: 16px;
    border: 1px solid var(--jak-blue-color);
    outline: none;
}

#ship-yourself-btn {
    background: var(--jak-blue-color);
    border: none;
    color: white;
}

.feature-title {
    font: normal normal 600 16px/19px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    padding-top: 8px;
}

    .feature-title + .content {
        font: normal normal 300 12px/16px 'Söhne', 'Open Sans';
        color: #000;
    }

.addresses-feature-container {
    background: transparent linear-gradient( 258deg, var(--status-blue-dark) 0%, var(--status-blue-darker) 100% ) 0% 0% no-repeat padding-box;
    border-radius: 0px;
    height: 140px;
}

[alt="home"],
[alt="weight-machine"] {
    position: relative;
    bottom: 30px;
    right: 8px;
}

.addresses-feature-btn,
.tips-feature-btn,
.calulator-feature-btn {
    border-radius: 0px;
    outline: none;
    border: none;
    height: 35px;
    font: normal normal 600 12px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #000;
    text-transform: capitalize;
    background: #ffffff28;
}

    .addresses-feature-btn p {
        font: normal normal 600 12px/15px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        text-transform: capitalize;
    }

.calulator-feature-container {
    background: #387c2b 0% 0% no-repeat padding-box;
    border-radius: 0px;
    height: 140px;
}

.calulator-feature-btn {
    position: relative;
    bottom: 10px;
}

.tips-feature-container {
    background: url("../imgs/card_banner.png");
    border-radius: 0px;
    height: 140px;
    background-repeat: no-repeat;
    background-size: cover;
}

.tips-feature-btn {
    width: 147px !important;
    position: absolute;
    bottom: 11px;
}

.search-switch {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#input-listSrch,
#inputTablistSrch {
    background: var(--background-dark);
    width: 379px;
    height: 50px;
    outline: none;
    border: navajowhite;
    border-radius: 0px;
    caret-color: #ee5e43;
    padding: 15px;
    color: #000;
    font: normal normal bold 16px/20px 'Söhne', 'Open Sans';
}

.tab-view-btn,
.list-view-btn {
    width: 100%;
    height: 30px;
    background: #fff;
    border-radius: 0px;
    opacity: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3px 10px;
    float: right;
    white-space: nowrap;
}

.tab-view-btn a,
.list-view-btn a {
    letter-spacing: normal;
}
 
.tab-view-btn.sort, .list-view-btn.sort {
    width: 65px;
    text-transform: capitalize;
}

.tab-view-btn.sort a, .list-view-btn.sort a {
    letter-spacing: normal;
}

.tab-view-container {
    justify-content: space-between;
}

.delivered-btn,
.returned-btn,
.split-btn,
.shipped-btn,
.attention-required-btn,
.in-review-btn,
.incomming-btn,
.completed-btn,
.destroyed-btn,
.shipment-requested-btn {
    /* height: 50px; */
    border-radius: 0px;
    border: none;
    /* width: 100%; */
    /* font: normal normal 600 14px/22px 'Söhne', 'Open Sans'; */
    letter-spacing: normal;
    color: var(--jak-gray-color);
    text-align: left;
    display: flex;
    text-transform: capitalize;
    justify-content: center;
    align-items: center;
    padding: 0 8px;
    background: transparent linear-gradient( 268deg, var(--status-blue-dark) 0%, var(--status-blue-light) 100% ) 0% 0% no-repeat padding-box;
}

.delivered-tab-btn,
.shipped-tab-btn,
.attention-tab-required-btn,
.in-review-tab-btn,
.incomming-tab-btn,
.completed-tab-btn,
.destroyed-tab-btn,
.shipment-tab-requested-btn {
    height: 50px;
    border-radius: 0px;
    border: none;
    width: 100%;
    font: normal normal 600 14px/22px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-gray-color);
    text-align: left;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 13px;
    display: flex;
    justify-content: space-between;
}

    .delivered-btn span,
    .delivered-tab-btn span,
    .shipped-tab-btn span,
    .shipped-btn span,
    .attention-tab-required-btn span,
    .attention-required-btn span,
    .in-review-btn span,
    .in-review-tab-btn span,
    .incomming-btn span,
    .incomming-tab-btn span {
        font: italic normal normal 12px/22px 'Söhne', 'Open Sans';
        letter-spacing: 0.12px;
        color: #f7fafd;
    }

.incomming-btn,
.incomming-tab-btn {
    background: #DAF8D5;
}

.in-review-btn,
.in-review-tab-btn {
    background: #FFF1CD;
    color: #B18516!important;
}

.attention-required-btn,
.attention-tab-required-btn {
    background: #FFDBDC;
    color: #CD171A;
}

.shipped-btn,
.shipped-tab-btn {
    background: #DDEBFF;
    color: var(--jak-blue-color);
}

.returned-btn .delivered-btn,
.delivered-tab-btn {
    background: transparent linear-gradient(90deg, #205a15 0%, #377a2b 100%) 0% 0% no-repeat padding-box;
}

#btnModalFilter {
    padding: 0;
    background: none;
    border-radius: 0px;
    margin-right: 12px;
    border: none;
}

.tab-view-btn a,
.list-view-btn a {
    font: normal normal 12px/38px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    text-transform: capitalize;
}

/* Shipping calculator modal */
#shipping-calculator-modal {
    background-color: var(--background-primary);
    height: 600px;
}

.from-tilte,
.to-tilte {
    font: normal normal normal 12px/24px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #000;
    text-transform: capitalize;
}

.ship-box {
    background: var(--background-dark) 0% 0% no-repeat padding-box;
    border-radius: 0px;
}

    .ship-box p {
        font: normal normal normal 15px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
    }

    .ship-box span {
        font: normal normal normal 11px/15px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
    }

.package-title {
    font: normal normal normal 12px/24px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #000;
    text-transform: capitalize;
}

[name="shipWeight"] {
    background: var(--jak-input-bg);
    font: normal normal 600 20px/27px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-gray-color);
    text-align: center;
    height: 45px;
    border: none;
}

    [name="shipWeight"]:focus {
        background: var(--jak-input-bg);
        outline: none;
        border: none;
        color: #000 !important;
    }

.weight-types {
    font: normal normal 600 14px/24px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    margin-left: 8px;
}

.quantity-left-minus,
.quantity-right-plus {
    width: 54px !important;
    height: 45px !important;
    font: normal normal 36px/27px 'Söhne', 'Open Sans';
    background: var(--jak-input-bg);
    border-radius: 0;
    color: #000;
    border: 1px solid var(--jak-light-gray);
    outline: none;
}

.quantity-right-plus {
    border-radius:0;
}

#btnCal,
#btnCalAgain {
    height: 54px;
    background: var(--jak-green-color);
    border-radius: 0px;
    border: none;
    outline: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font: normal normal 600 16px/19px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    text-transform: capitalize;
    padding: 14px;
}

    #btnCal p {
        font: normal normal 600 16px/19px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        text-transform: capitalize;
        margin: 0;
    }

.modal-footer,
.modal-header {
    background-color: var(--background-primary) !important;
    border: none;
}

.modal-header {
    border-radius:0;
}

#ModalTitle {
    font: normal normal 600 18px/22px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    /* text-transform: capitalize; */
}

.ship-cal-body {
    height: 660px;
    overflow: auto;
    overflow: -moz-scrollbars-none;
    -ms-overflow-style: none;
    overflow-x: hidden !important;
    background-color: var(--background-primary);
    height: 375px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

    .shipping-details-view::-webkit-scrollbar,
    .ship-cal-body::-webkit-scrollbar,
    .shipment-modal-body::-webkit-scrollbar {
        width: 0.4rem;
        height: 0.4rem;
    }

    .shipping-details-view::-webkit-scrollbar-track,
    .ship-cal-body::-webkit-scrollbar-track,
    .shipment-modal-body::-webkit-scrollbar-track {
        box-shadow: inset 0 0 6px var(--background-dark);
    }

    .shipping-details-view::-webkit-scrollbar-thumb,
    .ship-cal-body::-webkit-scrollbar-thumb,
    .shipment-modal-body::-webkit-scrollbar-thumb {
        border-radius: 0px;
        background: transparent linear-gradient(260deg, var(--primary-dark) 0%, var(--primary-darker) 100%) 0%;
    }

.close {
    color: #000 !important;
    z-index: 1;
}

.select2-container--default
.select2-selection--single
.select2-selection__rendered {
    background-color: var(--background-dark);
    outline: none;
    border: none;
}

.weight-type-container {
    display: flex;
    justify-content: space-evenly;
    margin: auto;
}

.weight-type {
    display: flex;
    justify-content: space-between;
}

.selected-details-container label {
    font: normal normal normal 16px/22px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    text-transform: capitalize;
}

/* shipments */
#divList {
    margin-top: 30px;
}

.shipment-heading,
.package-heading {
    text-align: left;
    font: normal normal 600 20px/24px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    opacity: 1;
    margin-top: 30px;
}

.total-shipment-count,
.total-package-count {
    font: normal normal normal 16px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
}

[data-filter="all"] a,
[data-filter="inTransit"] a,
[data-filter="outForDelivery"] a,
[data-filter="shipmentDelayed"] a,
[data-filter="shipped"] a,
[data-filter="newest"] a,
[data-filter="oldest"] a {
    font: normal normal 600 14px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000 !important;
    margin-right: 20px;
}

.sort-filter-heading,
.upload-invoice-title {
    font: normal normal 600 20px/20px Montserrat !important;
    letter-spacing: 0px !important;
    color: #000000 !important;
    text-transform: capitalize !important;
}

.upload-invoice-title {
    position: relative;
    top: -2.5rem;
}

#filterModalContent {
    background-color: var(--background-primary);
}

.filter-label {
    font: normal normal normal 16px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    margin-bottom: 1rem;
}

#ClearAllfilter {
    right: 0 !important;
    text-transform: capitalize;
    /* display: flex; */
    /* justify-content: space-between; */
    align-items: center;
    text-align: left;
    width: 100%;
    padding: 16px;
    /* background: transparent linear-gradient(
        260deg, var(--primary-dark) 0%, var(--primary-darker) 100%) 0% 0% no-repeat padding-box; */
    background: #292f38 0% 0% no-repeat padding-box;
    border: none;
    margin-left: 4px;
    color: #fff;
    font: normal normal 16px/19px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    text-transform: capitalize;
    text-align: center;
}

#btnApplyFilter {
    right: 0 !important;
    text-transform: capitalize;
    align-items: center;
    text-align: center;
    padding: 16px;
    margin-top: 3px;
}

.modal-body {
    background-color: var(--background-primary) !important;
}

.modal-content {
    background-color: transparent !important;
    border: none !important;
}

/* info overlay designs */
.point-up {
    position: absolute;
    top: 40px;
}

.card {
    border: 1px solid transparent !important;
}

#shipment-info {
    position: relative;
}

.info-type-img {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 16px;
    height: 40px;
    top: -23px;
}

.info-label {
    font: normal normal 600 12px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #000;
    text-align: center;
}

.info-content {
    text-align: center;
    font: normal normal normal 14px/21px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-gray-color);
}

.quick-tips {
    background: var(--card-header) 0% 0% no-repeat padding-box;
    border-radius: 0px;
    height: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .quick-tips span {
        font: normal normal 600 10px/12px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #000;
    }

.info-footnote {
    text-align: center;
    font: normal normal normal 14px/21px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: var(--jak-gray-color);
}

#info-menu {
    background: var(--card-header) 0% 0% no-repeat padding-box;
    border-radius: 0px;
}

#info-list {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-bottom: 120px;
}

    #info-list div {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        top: 10px;
    }

.info-item-label {
    font: normal normal normal 10px/16px 'Söhne', 'Open Sans';
    color: var(--nav-link);
}


label.preferintro {
    text-align: center;
    font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    width: 100%;
    margin-bottom: 20px;
}
/* Status  */

@media (min-width: 1200px) {
    .upload-btns p.notemessge {
        font-size: 14px;
        color: var(--jak-gray-color);
        font-style: italic;
    }

    .additonal-options-container.mobilebutns.pdtls {
        width: 100%;
        margin-top: 12px;
        margin-bottom: 10px;
        display: inline-block;
    }

    .shippingpreacc label.circular-checkbox-container {
        top: -27px;
        right: 5px;
    }

    .cntrpreren {
        width: 500px;
    }

    .shippingpreacc label.ml-1.language {
        font: normal normal 600 14px/21px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        margin-left: 0px !important;
    }

    .inputcntr input {
        display: none;
    }

    .inputcntr {
        width: 240px !important;
        height: 94px !important;
        background: transparent linear-gradient(267deg, #2886b1 0%, #156a91 100%) 0% 0% no-repeat padding-box;
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        margin: 5px;
        float: left;
    }

        .inputcntr:nth-child(2) {
            background: transparent linear-gradient(268deg, #d69b43 0%, #a0640d 100%) 0% 0% no-repeat padding-box;
        }

        .inputcntr:nth-child(3) {
            background: transparent linear-gradient(69deg, #0e502c 0%, #1cb15f 100%) 0% 0% no-repeat padding-box;
        }

        .inputcntr:nth-child(4) {
            background: transparent linear-gradient(112deg, #77271b 0%, #e74a34 100%) 0% 0% no-repeat padding-box;
        }

    .additonal-options-container.mobilebutns {
        width: 510px;
        margin: 126px auto;
        float: left;
        margin: 125px 10px 25px 10px;
    }

    .selectPlanContainer .shippingpre1 .checkbox-container {
        top: 47px;
        right: 15px;
    }

    .shiprefrence p.terms {
        margin-left: 34px;
    }

    .selectPlanContainer .shippingpre1 .checkbox-container span.checkmark {
        position: absolute;
        top: -35px;
        right: 54px;
    }

    .adminpreferein input {
        display: block !important;
        width: 25px;
        height: 25px;
        position: absolute;
        z-index: 100;
        left: 10px;
        top: 20px;
        opacity: 0;
    }

    span.btn-secondary.btnPayment.shippingpre1:nth-child(2) {
        background: transparent linear-gradient(268deg, #d69b43 0%, #a0640d 100%) 0% 0% no-repeat padding-box;
    }

    span.btn-secondary.btnPayment.shippingpre1:nth-child(3) {
        background: transparent linear-gradient(69deg, #0e502c 0%, #1cb15f 100%) 0% 0% no-repeat padding-box;
    }

    span.btn-secondary.btnPayment.shippingpre1:nth-child(4) {
        background: transparent linear-gradient(112deg, #77271b 0%, #e74a34 100%) 0% 0% no-repeat padding-box;
    }

    .additonal-options-container.shippingpre.mobilebutns .shippingpre1 {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        margin: 5px;
        float: left;
        padding: 7px;
    }

    .adminpreferein input {
        display: none;
    }

    .bottom-listfooter .trck {
        width: 96px;
    }

    .container.right .container {
        max-width: 100% !important;
    }
}

.color-link {
    color: var(--status-blue-dark);
    font-size: 14px;
}

.incoming-status {
    background: #DAF8D5;
}

.in-transit-status {
    background: transparent linear-gradient(90deg, #337427 0%, #52a743 100%) 0% 0% no-repeat padding-box;
}

.shipment-delayed-status {
    background: transparent linear-gradient( 267deg, var(--status-red-light) 0%, var(--status-red-dark) 100% ) 0% 0% no-repeat padding-box;
}

.out-for-delivery-status {
    background: transparent linear-gradient( 90deg, var(--status-green-darker) 0%, var(--status-green-lighter) 100% ) 0% 0% no-repeat padding-box;
}

.shipped-status {
    background: transparent linear-gradient( 268deg, var(--status-blue-dark) 0%, var(--status-blue-light) 100% ) 0% 0% no-repeat padding-box;
}

.in-review-status {
    background: transparent linear-gradient( 81deg, var(--status-orange-dark) 0%, var(--status-orange-light) 100% ) 0% 0% no-repeat padding-box;
}

.action-required-status {
    background: transparent linear-gradient( 268deg, var(--status-blue-dark) 0%, var(--status-blue-light) 100% ) 0% 0% no-repeat padding-box;
}

.default-status {
    background: transparent linear-gradient( 268deg, var(--status-blue-dark) 0%, var(--status-blue-light) 100% ) 0% 0% no-repeat padding-box;
}

.package-delayed-status {
    background: transparent linear-gradient( 267deg, var(--status-red-light) 0%, var(--status-red-dark) 100% ) 0% 0% no-repeat padding-box;
}

span.pro_head:before {
    content: "";
    height: 0.5px;
    background: linear-gradient( 90deg, #3b3b3b, #3b3b3b 55%, transparent 25%, transparent 100% );
    background-size: 10px 5px;
    border: none;
    width: 83%;
    display: inline-block;
    margin-top: 46px;
    position: absolute;
    top: -35px;
    left: 81px;
}

.sidebar-nav li a.active-label:before {
    content: "";
    height: 2px;
    width: 42%;
    background-color: var(--jak-blue-color) !important;
    position: absolute;
    bottom: -4px;
    border-radius: 0px;
    top: 29px;
}

.pg_heading {
    text-align: left;
    font: normal normal 600 20px/24px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    opacity: 1;
    margin: 33px 0px 18px 0px;
}

@media (min-width: 1200px) {
    .retailCenterContainer.dfgfg {
        height: 500px;
    }

    .container.right {
        max-width: 1280px !important;
        position: relative;
    }
}

/* empty section designs */
.empty-section {
    margin-top: 180px;
}

.empty-section-text a:hover,
.empty-section-text:hover {
    color: var(--jak-blue-color);
    text-decoration: none;
}

.empty-section-text {
    font: normal normal normal 16px/33px 'Söhne', 'Open Sans';
}

/* upload section designs  */

/* more option screen designs */

span.header-line {
    font: normal normal 600 18px/25px 'Söhne', 'Open Sans';
    color: #000;
    flex: 1;
}

span.pro_head {
    margin-bottom: 11px;
    margin-top: 1px;
    font: normal 14px/20px 'Söhne', 'Open Sans' !important;
    color: #000;
}

.header-line + #btnChange {
    font: normal normal 600 12px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-blue-color);
    text-transform: capitalize;
    cursor: pointer;
}

.bdr-none {
    border: none !important;
}

.bg-none {
    background: none !important;
}

.modal-hdr-bg {
    background-color: var(--background-secondary) !important;
    border-bottom: none;
}

.bb-1 {
    border-bottom: 1px solid var(--border-bottom);
}

.mbb-1 {
    border-bottom: 1px solid var(--border-bottom-secondary) !important;
}

.br-none {
    border-radius: 0 !important;
}

.bbr-4 {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.btr-8 {
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0 !important;
}

.bbr-8 {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.br-4 {
    border-radius: 0px;
}

.br-12 {
    border-radius: 0px;
}

.py-card {
    padding-top: 16px !important;
    padding-bottom: 0 !important;
}
/*POP UP MODALS DIMENSIONS*/
.shipping-calculator-modal {
    height: 662px;
    width: 503px;
}

.info-overlay-modal {
    height: 512px;
    width: 371px;
}

.fliter-modal {
    height: 557px;
    width: 678px;
}

.shipment-tracking-modal {
    height: 640px;
    width: 735px;
}

.packages-detail-modal {
    height: 609px;
}

.upload-invoice-modal {
    height: 683px !important;
    width: 735px !important;
}

.help-modal {
    height: 539px;
    width: 450px;
}

.active-label {
    color: var(--jak-green-color) !important;
}

.range-slider {
    width: 100%;
    position: relative;
}

.div-range-value {
    position: absolute;
    top: -10px;
    display: flex;
    width: 100%;
    justify-content: space-between;
}

    .div-range-value span {
        font-size: 11px;
        color: #99a0aa;
    }

.range-slider__range {
    -webkit-appearance: none;
    width: 100%;
    height: 4px;
    border-radius: 0px;
    background: #d7dcdf;
    outline: none;
    padding: 0;
    margin: 0;
}

    .range-slider__range::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #f05133;
        cursor: pointer;
        -webkit-transition: background 0.15s ease-in-out;
        transition: background 0.15s ease-in-out;
    }

.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    background-color: #f05133;
    -webkit-transform: translateX(0.75rem);
    transform: translateX(0.75rem);
    height: 20px;
    width: 20px;
    border-radius: 50%;
    position: relative;
    top: 2px;
    margin-left: 1px;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: #794038;
    background-color: #f45d4167;
    height: 14px;
    top: 5px;
}

.custom-switch .custom-control-label::after {
    background-color: #b9b9b9;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    position: relative;
    top: 2px;
    margin-left: -5px;
}

.empty-notification-img {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

/* Request photos  */
.card-type-label {
    font: normal normal 300 18px/20px 'Söhne', 'Open Sans';
    color: #000;
    text-transform: capitalize;
}

.add-card-label {
    font: normal normal 600 14px/19px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
}

.add-card-content {
    font: normal normal normal 12px/17px 'Söhne', 'Open Sans';
    color: #000;
}

.card-number {
    font: normal normal 600 16px/22px 'Söhne', 'Open Sans';
    color: #000;
}

.preferred-label {
    font: normal normal 300 18px/20px 'Söhne', 'Open Sans';
    color: #000;
    text-transform: capitalize;
}

a#btnModalFilter.shortfltr {
    float: right;
    right: 0;
}

.request-label,
.shipback-label {
    font: normal normal 600 16px/19px 'Söhne', 'Open Sans';
    color: #000;
    text-transform: capitalize;
}

.request-content,
.shipback-content {
    font: normal normal 300 14px/20px 'Söhne', 'Open Sans';
    color: #000;
}

.request-fee-label,
.shipping-method-label {
    font: normal normal 600 18px/24px 'Söhne', 'Open Sans';
    color: #000;
    text-transform: capitalize;
}

.request-fee-val {
    font: normal normal bold 18px/24px 'Söhne', 'Open Sans';
    color: #000;
    text-transform: capitalize;
}

.add-card-container {
    width: 230px;
    display: inline-block;
    padding-top: 5px;
}

.consolide-modal-footer {
    box-shadow: 0 -6px 8px var(--background-dark);
    padding: 16px;
}

.consolide-msg {
    font: normal normal normal 12px/20px 'Söhne', 'Open Sans';
    color: #000;
}

.no-items-label {
    font: normal normal normal 16px/20px 'Söhne', 'Open Sans';
}

.v-center {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ready-to-send-btn {
    /* height: 50px; */
    /* background: transparent linear-gradient(90deg, #A36100 0%, #E59119 100%) 0% 0% no-repeat padding-box; */
    /* border-radius: 0px; */
    /* opacity: 1; */
    background: #DAF8D5;
    color:#338625;
    border-radius: 0px;
}

.shipment-requested-btn {
    background: transparent linear-gradient( 268deg, var(--status-blue-dark) 0%, var(--status-blue-light) 100% ) 0% 0% no-repeat padding-box;
}

button.split-btn {
}

button.accordions-view.clspack-status.split-btn {
    background: transparent linear-gradient( 268deg, var(--status-blue-dark) 0%, var(--status-blue-light) 100% ) 0% 0% no-repeat padding-box;
}

button.accordions-view.clspack-status.returned-btn {
    background: transparent linear-gradient( 268deg, var(--status-blue-dark) 0%, var(--status-blue-light) 100% ) 0% 0% no-repeat padding-box;
}

button.accordions-view.clspack-status.destroyed-btn {
    background: transparent linear-gradient( 268deg, var(--status-blue-dark) 0%, var(--status-blue-light) 100% ) 0% 0% no-repeat padding-box;
}

button.accordions-view.clspack-status.completed-btn {
    background: transparent linear-gradient(90deg, #205a15 0%, #377a2b 100%) 0% 0% no-repeat padding-box;
}

.tab-view-container .delivered-btn,
.tab-view-container .shipped-btn,
.tab-view-container .attention-required-btn,
.tab-view-container .in-review-btn,
.tab-view-container .incomming-btn,
.tab-view-container .completed-btn,
.tab-view-container .destroyed-btn,
.tab-view-container .split-btn,
.tab-view-container .ready-to-send-btn,
.tab-view-container .returned-btn,
.tab-view-container .shipment-requested-btn {
    height: 50px;
    border-radius: 0px;
    border: none;
    width: 100%;
    font: normal normal 600 14px/22px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    text-transform: capitalize;
    color: var(--jak-gray-color);
    text-align: left;
    display: inherit;
    justify-content: center;
    align-items: center;
    padding: 0 8px;
    margin: 8px 0;
}

.tab-view-container button span.btn-icon {
    float: right;
}

#pageOverlayModal > .card {
    border: none !important;
}

.swal2-popup {
    background-color: var(--background-primary) !important;
}

.swal2-styled.swal2-cancel {
    text-transform: capitalize;
    border-radius: 0!important;
    background-color: #e6644c;
    width:100%;
}

.swal2-html-container {
    color: #000;
    opacity: 1;
    font: normal normal 600 16px/20px 'Söhne', 'Open Sans';
}

.language {
    font: normal normal 600 16px/22px 'Söhne', 'Open Sans';
}

.plan-type {
    border-bottom: 1px solid #5f6971;
}

.full-width-map {
    height: 570px !important;
    top: -75px;
}

#btnInspect:disabled,
button#btnSplit:disabled,
#ReqForPhotos:disabled,
#btnDistroy:disabled {
    opacity: 0.35;
}

.btnWithShipLabel img {
    float: right;
}

.btnshiplabel img {
    float: right;
    position: absolute;
    right: 26px;
}

.trck.btnActionreq.actionresolve {
    color: #ee5e43;
    font: normal normal 600 10px/17px 'Söhne Kräftig', 'Open Sans';
    letter-spacing: normal;
    margin-top: 3px;
    text-decoration: underline;
    cursor:pointer;
    display: flex;
    align-items: center;
}

@media only screen and (max-width: 700px) {
    .row.nopadding.plus {
        margin-top: 2px !important;
    }

    .tipsmobile .intro {
        display: none !important;
    }

    .mobilemen.search {
        width: 100%;
        top: 124%;
        margin: 0px;
    }

        .mobilemen.search #input-listSrch {
            width: 100%;
            margin: 0px;
            background: #15191f;
        }

            .mobilemen.search #input-listSrch + img {
                /* background: red; */
                position: absolute;
                left: 89% !important;
                top: 11px !important;
            }
}

@media only screen and (max-width: 600px) {
    .tips-feature-container img {
        float: left;
    }

    #input-listSrch {
        width: 100%;
        margin: 10px -14px;
    }

    #btnModalFilter {
        position: absolute;
        right: 15px;
    }

    .search-switch {
        display: block;
    }

    .s2d-navbar .navbar-nav .s2d-nav-link {
        margin-left: 0;
    }

    .shpmnt .srchcntr {
        float: left;
        margin: 0px 0 0 10px;
    }

        .shpmnt .srchcntr button#btnModalFilter {
            margin-top: 10px;
        }
}

.account_menu {
    width: 375px;
    height: auto;
    background: #fff;
    box-shadow: var(--jak-shadow);
    opacity: 1;
    position: absolute;
    z-index: 1000;
    top: 47px;
    right: 0;
    text-align: left;
    padding: 0;
}

span.iconlft {
    width: 43px;
    height: 43px;
    background: transparent!important;
    border-radius: 50px;
    float: left;
    margin-right: 14px;
    text-align: center;
    margin-bottom: 15px;
}

    span.iconlft img {
        margin-top: 4px;
    }

span.accmenu_hd {
    text-align: left;
    font: normal normal 600 20px/24px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    margin-bottom: 10px;
    display: block;
    background:var(--jak-blue-color);
    padding: 16px;
}

ul li a.account-mn-lnk {
    font: normal normal normal 14px/35px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #000;
    opacity: 1;
}

.account_menu .acc-li {
    float: left;
    width: 100%;
    align-items: center;
    justify-content: center;
    display: inline-block;
    list-style: none;
}

.form-group input#olsCouponCode:focus + .form-control-placeholder {
    color: var(--text-lighter);
    font: normal normal normal 12px/17px 'Söhne', 'Open Sans';
    transform: translate(10px, 12px);
    left: 21px;
    opacity: 0.4;
    font: normal normal normal 10/12px 'Söhne', 'Open Sans';
    pointer-events: none;
    transform: translate(10px, 7px);
}

input#searchcityinlist {
    background: var(--jak-input-bg);
    height: 40px;
    width: 98%;
    margin: 5px auto;
    padding: 14px;
    /* box-shadow: inset 0 0 1px #efeaea24; */
    border: 1px solid var(--jak-light-gray);
}

.bottom-btn-issueD.form-check {
    text-transform: capitalize;
    font: normal normal 14px/19px 'Söhne', 'Open Sans';
    letter-spacing: 0px;
    color: #ffffff;
    text-transform: capitalize;
    opacity: 1;
}

button.gm-ui-hover-effect {
    background: #fff !important;
    width: 20px !important;
    height: 20px !important;
    top: 0 !important;
    right: 0 !important;
    border-radius: 30px;
    padding: 0 !important;
}

    button.gm-ui-hover-effect img {
        margin: 3px !important;
    }

button.gm-ui-hover-effect span {
    margin: 3px!important;
}
.pointer {
    cursor: pointer;
}

.accountretailpopo .shipping-address-container,
.retailssignup #daLandmark,
.mapAreaContainer .password-icon {
    display: none;
}

.card-body.storage-card-EG .countryheader {
    background: transparent linear-gradient(263deg, #e94b35 0%, #75261b 100%) 0% 0% no-repeat padding-box;
    padding: 5px 11px;
    border-radius: 0px 0 0px 0px;
    height: 46px;
}

.storage-card-EG .copy-address.copy-address-EG {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    margin-top: 11px;
    z-index: 100;
}

.card-body.storage-card-JD .countryheader {
    background: transparent linear-gradient(263deg, #e94b35 0%, #75261b 100%) 0% 0% no-repeat padding-box;
    padding: 5px 11px;
    border-radius: 0px 0 0px 0px;
    height: 46px;
}

.storage-card-JD .copy-address.copy-address-JD {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    margin-top: 11px;
    z-index: 100;
}

.storage-card-UK .copy-address.copy-address-UK {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    margin-top: 11px;
    z-index: 100;
}

.card-body.storage-card-KW .countryheader {
    background: transparent linear-gradient(263deg, #e94b35 0%, #75261b 100%) 0% 0% no-repeat padding-box;
    padding: 5px 11px;
    border-radius: 0px 0 0px 0px;
    height: 46px;
}

.storage-card-KW .copy-address.copy-address-KW {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    margin-top: 11px;
    z-index: 100;
}

.card-body.storage-card .countryheader {
    background: transparent linear-gradient(263deg, #e94b35 0%, #75261b 100%) 0% 0% no-repeat padding-box;
    padding: 5px 11px;
    border-radius: 0px 0 0px 0px;
    height: 46px;
}

.storage-card .copy-address.copy-address {
    font: normal normal bold 10px/15px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #fff;
    opacity: 1;
    padding: 0px 4px;
    width: fit-content;
    height: 18px;
    z-index: 100;
}
@media only screen and (max-width: 374px) {
    .mobileaddplus {
        flex-grow: 2;
    }

    .js-active.signupmap .drpdwncity {
        width: 263px;
    }

        .js-active.signupmap .drpdwncity input#searchcityinlist {
            width: 250px !important;
        }

    .row.add_visacrdcntr .cvvPay button#ship-yourself-btn {
        width: 240px !important;
        margin-left: -2px;
    }

    .row.co-11.pl-0.rqstphto
    .col-.mb-3.product-elecntr
    .card-body.nopadding.imgreq {
        width: 332px !important;
    }

    .row.co-11.pl-0.rqstphto .col-.mb-3.product-elecntr {
        width: 335px !important;
    }

    .modal-body.accchngpswdhd {
        width: 330px !important;
        margin: auto !important;
    }

    .modal-header.pb-0.accchngpswdhd {
        /* width: 330px !important; */
        margin: auto !important;
    }

    div#pageModal #ModalDialog .modal-body.accchngpswdhd .form-container {
        width: 292px;
        margin: 0 auto;
    }

    .loginFOrgotpswd input#txtmobileno {
        width: 201px !important;
        margin-left: 10px;
        margin-right: -16px !important;
    }

    .letsStartContainer .loginFOrgotpswd .form-feild:nth-child(2) {
        padding-right: 10px;
    }

    .accountretailpopo .curentcity span {
        width: 66%;
        margin-top: 11px;
    }

    .accountretailpopo .addressContainer .scroll .scroll-hide {
        position: relative;
        width: 235px;
        left: 3px;
        padding-bottom: 4rem;
        bottom: 6px;
        margin-top: 20px;
    }

    .retailssignup .retailCenterContainer .search-container {
        top: 10px;
    }

    .retailssignup .addressContainer .scroll .scroll-hide {
        position: relative;
        width: 280px;
        left: 3px;
        padding-bottom: 4rem;
        bottom: 6px;
        margin-top: 21px;
    }

    .retailssignup .retailCenterContainer .mapAreaContainer {
        height: 280px !important;
    }

    .retailssignup .retail-areaname {
        font: normal normal 14px/20px 'Söhne', 'Open Sans' !important;
        width: 62% !important;
    }

    .saveaddressaddn .shipping-address-container {
        width: 94%;
    }

    .signupmap.js-active #div-mapareawidth input#daLandmark {
        left: 150px;
        width: 280px;
    }

    .addwrper .retail-areaname {
        font: normal normal 14px/20px 'Söhne', 'Open Sans' !important;
        width: 90% !important;
    }

    .retail-areaname {
        font: normal normal 14px/20px 'Söhne', 'Open Sans' !important;
        width: 56% !important;
    }

    .accountretailpopo .retail-details-container {
    }

    .retailCenterContainer .btn {
        box-shadow: none;
        left: 34% !important;
        width: 361px !important;
        position: absolute !important;
        left: 2% !important;
        transform: none !important;
        top: 300px !important;
    }

    .accountretailpopo .retailAdd span.con_number {
    }

    .accountretailpopo p.retailAdd {
        margin-top: 10px;
        display: block;
        width: 328px;
    }

    .retailCenterContainer .search-container {
        top: 10px;
    }

    #rtSearch + span.password-icon {
        right: 1.5rem !important;
        top: 135px !important;
        position: absolute !important;
    }

    .accretailbd .addressContainer .curentcity {
        margin: 27px auto 0;
        width: 276px;
        left: 4px;
    }

    .retailCenterContainer .mapAreaContainer {
        height: 280px !important;
    }
}

@media (min-width: 320px) and (max-width: 768px) {
    .col-12.dtlsvalues.list > div .liststatus {
        width: 280px;
    }

    .row.add_visacrdcntr .checkmark {
        position: absolute;
        top: 0;
        left: -59px;
    }

    .visacntr {
        padding-bottom: 0 !important;
        width: 88% !important;
    }

    .adminpreferein input {
        display: block;
        display: block !important;
        width: 25px;
        height: 25px;
        position: absolute;
        z-index: 100;
        left: 174px;
        top: 14px;
        opacity: 0;
    }

    .additonal-options-container.shippingpre.mobilebutns .shippingpre1 {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        margin: 5px;
        float: left;
        padding: 7px;
    }

    .adminpreferein input:checked ~ label .checkmark {
        background: #13bab6 0% 0% no-repeat padding-box;
        border: 1px solid #099a96;
        background: #13bab6 !important;
        border: 1px solid #099a96;
        height: 25px !important;
        width: 25px !important;
    }

    .adminpreferein input:checked ~ label span.checkmark:after {
        left: 8px;
        top: 4px;
        display: block;
        width: 7px;
        height: 13px;
        border: 0.5px solid #000;
        border-width: 0 3px 3px 0;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    [dir="rtl"] .inputcntr input:checked ~ label .checkmark {
        left: 22px;
        top: -4px;
    }

    [dir="rtl"] .inputcntr {
        float: right;
    }

    .inputcntr {
        width: 240px !important;
        height: 94px !important;
        /* background: transparent linear-gradient(267deg, #2886b1 0%, #156a91 100%) 0% 0% no-repeat padding-box; */
        background: transparent linear-gradient(268deg, #d69b43 0%, #a0640d 100%) 0% 0% no-repeat padding-box;
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        margin: 5px;
        float: left;
    }

        .inputcntr input {
            display: none;
        }

        .inputcntr:nth-child(2) {
            /* background: transparent linear-gradient(268deg, #d69b43 0%, #a0640d 100%) 0% 0% no-repeat padding-box; */
            background: transparent linear-gradient(69deg, #0e502c 0%, #1cb15f 100%) 0% 0% no-repeat padding-box;
        }

        .inputcntr:nth-child(3) {
            /* background: transparent linear-gradient(69deg, #0e502c 0%, #1cb15f 100%) 0% 0% no-repeat padding-box; */
            background: transparent linear-gradient(112deg, #77271b 0%, #e74a34 100%) 0% 0% no-repeat padding-box;
        }

        .inputcntr:nth-child(4) {
            /* background: transparent linear-gradient(112deg, #77271b 0%, #e74a34 100%) 0% 0% no-repeat padding-box; */
            background: transparent linear-gradient(267deg, #2886b1 0%, #156a91 100%) 0% 0% no-repeat padding-box;
        }

    .backgroundContainer.hlpcntr select#select-query-field {
        font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
    }

    label.preferintro {
        text-align: center;
        font: normal normal normal 14px/20px 'Söhne', 'Open Sans';
    }

    .additonal-options-container.shippingpre.mobilebutns .adminpreferein {
        width: 240px !important;
        height: 94px !important;
        background: transparent linear-gradient(267deg, #2886b1 0%, #156a91 100%) 0% 0% no-repeat padding-box;
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        margin: 5px;
        float: left;
    }

        .additonal-options-container.shippingpre.mobilebutns
        .adminpreferein:nth-child(2) {
            background: transparent linear-gradient(268deg, #d69b43 0%, #a0640d 100%) 0% 0% no-repeat padding-box;
        }

        .additonal-options-container.shippingpre.mobilebutns
        .adminpreferein:nth-child(3) {
            background: transparent linear-gradient(69deg, #0e502c 0%, #1cb15f 100%) 0% 0% no-repeat padding-box;
        }

        .additonal-options-container.shippingpre.mobilebutns
        .adminpreferein:nth-child(4) {
            background: transparent linear-gradient(112deg, #77271b 0%, #e74a34 100%) 0% 0% no-repeat padding-box;
        }

    div#card-listadd.c #btnSave {
        letter-spacing: 0.5px !important;
        width: 300px;
    }

    .shippingpreacc label.ml-1.language {
        font: normal normal 600 14px/21px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        margin-left: 0px !important;
    }

    .shippingpreacc label.circular-checkbox-container {
        top: -27px;
        right: 5px;
    }

    .shippingpreacc {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        margin: 5px;
        float: left;
    }

    .upload-btns p.notemessge {
        font-size: 12px;
        color: var(--jak-gray-color);
        font-style: italic;
    }

    .paycard
    .almostDoneContainer
    .form-container + .flex
    .form-container.cvv-container
    .form-group {
        margin-left: 0px;
    }

    .paycard .almostDoneContainer .form-container + .flex .form-container input {
        width: 138px !important;
        float: left;
    }

    .footerad {
        width: 300px !important;
    }

    .modal-header.shrhdr,
    #filterModalContent,
    .shrftr {
        width: 300px !important;
        margin: auto;
    }

    .shpmcntr span.shipment-title {
        margin-bottom: 3px;
        margin-top: 1px;
        display: block;
        text-transform: capitalize;
        width: 156px;
        float: left;
        text-align: left;
    }

    .modal-header.pb-0.accpswdhd,
    .modal-body.accpswdbdy {
        width: 100% !important;
        margin: auto;
    }

    .modal-body.accpswdbdy .btn {
        width: 100% !important;
        margin: auto;
    }

    .retailCenterContainer.dfgfg {
        padding: 0!important;
    }

    span.from-to-pointer {
        display: none;
    }

    .shpmcntr span.shipment-title {
        margin-bottom: 3px;
        margin-top: 1px;
        display: block;
        text-transform: capitalize;
        width: auto !important;
        float: left;
        text-align: left;
    }

    .ship-box > div {
        padding: 0 !important;
    }

    .ship-cal-header,
    .modal-footer.ship-cal-footer {
        width: 260px !important;
    }

    p.selected-city {
        width: 100%;
        display: inline-block;
        padding: 0 0 0 3px !important;
    }

    a.btnview-photos {
        left: 160px !important;
    }

    .strgaddpop {
        width: 260px !important;
    }

    div#pageModal #ModalDialog .upidproofcntr .form-container {
        width: 216px;
    }

    .modal-header.upidproofcntrhd,
    .modal-body.upidproofcntr {
        width: 350px !important;
        margin: auto !important;
    }

    .upidproofcntr .form-group input {
        width: 100% !important;
    }

    .uploadidbtn button#btnSave {
        width: 100% !important;
    }

    span.kilim.float-left {
        position: absolute;
        left: 57px;
        top: 26px;
        font: normal normal 14px/19px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
        /* word-break: break-all; */
        display: flow-root;
        width: 147px;
    }

    .otpContainer.accoptpop .otp-container {
        width: 20rem;
    }

    .pay-add-card#ship-yourself-btn {
        width: 280px !important;
        margin: 0 auto;
    }

    .mobilefilter button#btnModalFilter.webhide {
        display: block;
        float: right;
        right: 0;
    }

    .showonlymobile {
        display: block;
    }

    .drpdwnfrom {
        display: block;
        width: 100%;
        box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 0px;
        position: absolute;
        background: #15191f;
        width: 100% !important;
    }

    span.shipment-title.intro {
        display: none !important;
    }

    [dir="rtl"] .mobilemen {
        display: block;
        left: 0;
        right: inherit;
    }

        [dir="rtl"] .mobilemen.search img {
            right: inherit !important;
            left: 5%;
        }

    .mobilemen {
        display: block;
        width: 110px;
        right: 0;
        /* height: 30px; */
        /* background: red; */
        position: absolute;
        top: 2vh;
        display: block;
        z-index: 1000;
    }

        .mobilemen a {
            width: 30px;
            height: 30px;
            display: block;
            border-radius: 0px;
            float: left;
            margin-left: 5px;
            padding: 4px 0 0 0 !important;
            text-align: center;
            background: #fff;
        }

    .backitemtourslef .fuladdress {
        width: 100%;
    }

    .backitemtourslef .shpBkaddcntr,
    .backitemtourslef .retailcnter {
        min-height: 232px;
        width: 270px;
        height: auto;
    }

    .product-elecntr .card-body.nopadding.imgreq.reqprodtls {
        width: 300px;
    }

    .col-.mb-3.product-elecntr {
        width: 300px !important;
    }

    button.btn-secondary.continueToPayment.reqpagbtn.btnloader {
        width: 300px !important;
    }

    .col4.packpopupitemcard.pckbkmobile .bottom-btn {
        width: 100%;
        width: 100% !important;
        margin-bottom: 8px !important;
        margin: 0px 0 8px 0 !important;
    }

    .col4.packpopupitemcard.pckbkmobile .pack-item-card.mt-0 {
        margin-bottom: 12px;
    }

    .add_visacrdcntr:last-child .visacntr + button#btnAddCard {
        display: none !important;
    }

    button#btnAddCard.mobile {
        background: #ee5e43;
        border-radius: 0px;
        padding: 5px;
        font: normal normal normal 14px/18px 'Söhne Kräftig', 'Open Sans';
        /* float: right; */
        /* position: absolute; */
        /* left: 64%; */
        /* top: 455PX; */
        background: transparent;
        box-shadow: none;
        border: none;
        border-radius: 0px;
        color: #000;
        width: 102%;
        margin: 7px -13px;
        left: -7px;
        align-items: center;
        gap:10px;
    }

        button#btnAddCard.mobile span {
            font: normal normal normal 10px/18px 'Söhne', 'Open Sans';
            letter-spacing: 0px;
            color: #ffffff;
            opacity: 1;
            width: 100%;
            display: contents;
            margin-top: 30px;
            padding: 4px;
        }

    #btnAddCard.hidemobile {
        display: none;
    }

    .col-3.summaryRight.mobile {
        float: right;
        position: inherit;
    }

    .summeryleft.mobile {
        float: left;
        margin-left: 16px;
    }

    .hidemobile {
        display: none;
    }

    a.text-right.view-all-btn {
    }

    .mobilemenu ul.nav-menu {
        position: relative;
        justify-content: space-between;
        align-items: center;
        flex-direction: inherit;
        /* display: flex; */
        border-radius: 0px;
        /* display: flex; */
    }

    .mobilemenu li.nav-item {
        display: flex;
        justify-content: center;
        text-align: center;
        /* align-content: flex-end; */
    }

    .mobilemenu span.on-hover {
        display: flex;
        justify-content: center;
    }

    .mobilemenu .nav-link.s2d-nav-link img {
        width: 30px;
        height: 30px;
        display: inline-block;
        margin-left: 10px;
    }

    .mobilemenu {
        display: block;
    }

    .s2dbg {
        height: 100%;
    }

    .s2dcntr {
        max-width: 94% !important;
        position: inherit;
        overflow: hidden;
        height: 100%;
    }

    .mobilemenu {
        display: block;
        z-index: 1000;
        position: fixed;
        /* background: #252b33; */
        /* width: 300px; */
        bottom: 13px;
        margin: 0 auto;
        padding: 7pt;
        border-radius: 10pt;
        justify-content: center;
        /* align-items: self-start; */
        align-content: stretch;
        left: 3%;
        height: 70pt;
        bottom: 3vh;
    }

    a.utdel.clspack-status.ready-to-send-btn {
        font: normal normal bold 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #338625;
        opacity: 1;
        padding: 0 8px;
        height: 18px;
        display: block;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .sumrysubhd {
        margin-top: 26px;
        font: normal normal normal 14px/18px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .summaryRight h6.package-heading {
        margin-top: 0;
    }

    .bottom-listfooter button.detail-btn.btnpack-detail,
    .bottom-listfooter .detail-btn.btnship-detail {
        font: normal normal 500 12px/20px 'Söhne Kräftig', 'Open Sans';
        width: 100px;
        height: 32px;
        position: absolute;
        bottom: 9px;
    }

    .s2d-navbar.nav_new {
        padding: 10px 0;
        margin: 5px 0 0 0;
        background: var(--jak-blue-color);
        border: none;
        opacity: 1;
        height: 775px;
        align-items: flex-start;
    }

    .container.main_contorellar {
        flex-direction: column;
        height: 778px;
    }

    a.nav-link.s2d-nav-link {
        font: normal normal 10pt/20px 'Söhne', 'Open Sans' !important;
        /* display: flex; */
        padding: 3px;
    }

    .s2d-navbar.nav_new .navbar-nav .s2d-nav-link {
        text-align: center;
        font: normal normal 14px/20px 'Söhne Halbfett', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
        margin-bottom: 17px;
    }

    .container.right {
        max-width: 100% !important;
        float: right;
        padding-bottom: 200px;
    }

    .packagecnter span.shipment-title {
        font: normal normal 300 12px/24px 'Söhne', 'Open Sans';
    }

    #user-name {
        font: normal normal 400 20px/43px 'Söhne Buch', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin: 0;
    }

    .row.topcontent {
        margin-top: 75px;
    }

    label.sectionheading {
        width: 100%;
        font: normal normal 20px/31px 'Söhne Kräftig', 'Open Sans';
        font-weight: 500;
        text-align: left;
        line-height: 40px;
        align-items: center;
        padding-left: 13px;
        margin-bottom: 3px;
        color: #000;
    }

    .packagecnter {
        background: #ffffff;
        border: none;
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        /* display: flex; */
        margin: 0px;
        height: auto;
    }

    .sectionheading span {
        display: none;
        position: relative;
        right: auto;
        float: right;
        top: -9px;
    }

    .arrowtop {
        margin: 19px 7px 0px;
        text-align: center !important;
        width: 18px;
        height: 18px;
    }

    .arrowbtm {
        display: block;
        margin: 21px 7px 0px;
        text-align: center !important;
    }

        .arrowbtm img {
            width: 25px;
            height: 25px;
            width: 18px;
            height: 18px;
            transform: rotate(180deg);
        }

    .packagecnter .item {
        background: none;
        border: none;
        border-radius: 0px;
        opacity: 1;
        padding: 3px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        height: auto;
        box-shadow: var(--jak-shadow);
    }

    .header_Pack {
        padding: 0 0 14px 0;
        margin: 0;
        border-bottom: 1px solid;
        display: inline-block;
        width: 100%;
        border-bottom: 1px solid var(--jak-light-gray);
    }

        .header_Pack .packname {
            display: block;
            float: left;
            text-align: left;
        }

    .packname.btmvalue span + span {
        font: italic normal normal 12px/10pt 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
    }

    .packname.btmvalue span {
        font: normal normal 600 12px/17pt 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
    }

    .packagecnter .item .header .row.box {
        padding: 0px 0px 0px 15px;
    }

    .btnsright a.utdel.shipped-btn {
        opacity: 1;
        color: var(--unnamed-color-f7fafc);
        text-align: right;
        font: normal normal 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        opacity: 1;
        margin-right: 8px;
        border-radius: 0px;
        opacity: 1;
        padding: 0 8px;
        display: inline;
    }

    .packbox .header_Pack + .row.box .col-md-3 {
        width: 50%;
    }

    .packagecnter .item .row.box {
        padding: 0px 0px 0px 15px;
    }

    .box .detail-btn.btnpack-detail {
        background: none;
        font: normal 500 12px/normal 'Söhne Kräftig', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        opacity: 1;
        white-space: nowrap;
    }

    .backeff {
        background: red;
        height: 20px;
        position: relative;
        z-index: 100;
        width: 94%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        display: none;
        opacity: 1;
    }

    .customer_crdnumbr {
        display: inline-block;
        width: 98% !important;
    }

    .backeff2 {
        background: #00ff5a;
        display: none;
        height: 21px;
        position: relative;
        z-index: 0;
        margin-top: -10px;
        width: 92%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    .btnTrack-now,
    .btnsright a.utdel {
        font: normal normal 10px/19px 'Söhne', 'Open Sans' !important;
        letter-spacing: normal;
        padding: 1px 4px;
        border-radius: 0px;
        color: var(--jak-blue-color);
        text-transform: capitalize;
        opacity: 1;
        cursor: pointer;
    }

    .row.track_content {
        padding: 0px 0px 0px 15px;
    }

    #pageModal .packages-body-scroll {
        width: 300px !important;
        margin: auto;
    }

    .add-new-body {
        width: 300px !important;
        margin: auto;
    }

    .imgreq.reqprodtls .bottom-btn-inline {
        width: 100% !important;
        text-align: center;
        padding: 12px 25px !important;
    }

    .acc_saveadd + .accedtaddress {
        width: 300px;
        margin: auto;
    }

        .acc_saveadd + .accedtaddress .form-container {
            width: 250px;
        }

            .acc_saveadd + .accedtaddress .form-container button#btncCodecity {
                width: 250px;
            }

            .acc_saveadd + .accedtaddress .form-container .form-group {
                width: 213px;
            }

            .acc_saveadd + .accedtaddress .form-container input#daAddress,
            .acc_saveadd + .accedtaddress .form-container input#daDistrict,
            .acc_saveadd + .accedtaddress .form-container input#daAdditionalInfo {
                width: 250px !important;
            }

        .acc_saveadd + .accedtaddress .mapAreaContainer.full-width-map {
            width: 250px !important;
            height: 300px !important;
        }

        .acc_saveadd + .accedtaddress .deliveryAddressContainer .btn {
            left: 49%;
            width: 258px;
            position: relative;
            /* top: 5px; */
            z-index: 10;
            /* right: inherit!important; */
            bottom: -361px;
            top: inherit;
            transform: none;
            margin: auto;
            left: -18px;
        }

    .accpopcvv .almostDoneContainer .form-container + .flex .expiry-container {
        left: 5px !important;
    }

    .accpopcvv .almostDoneContainer .form-container + .flex .form-container {
        width: 144px !important;
        float: left;
    }

    #ModalDialog .accpopcvv .form-container .form-group input#adCVV {
        width: 141px !important;
        margin-left: 3px;
    }

    .row.ship-dt-lst {
        width: 300px;
    }

    .col-12.dtlsvalues.list {
        display: block;
    }

        .col-12.dtlsvalues.list .ml-2 {
            display: block;
        }

    .mapAreaContainer {
        width: 246px !important;
        margin: 417px 0 0 2px;
        left: 11px;
        right: 0px;
    }

    .modal-body.saveaddressaddn .mapAreaContainer.full-width-map {
        height: 300px !important;
    }

    .signupmap .mapAreaContainer {
        width: 282px !important;
        margin: 417px 0 0 -9px;
        left: 0;
        right: 0px;
    }

    .signupmap #div-addareawidth .progress {
        width: 257px;
        margin-top: -28px;
    }

    .signupmap .form-container {
        width: 260px;
    }

    .signupmap .deliveryAddressContainer .btn-selectcity {
        width: 260px;
    }

    .signupmap .jk.input-feild,
    .signupmap #daDistrict,
    .signupmap #daAdditionalInfo {
        width: 262px !important;
    }

    .signupmap .form-group {
        position: relative;
        width: 226px;
    }

    .dashbdfromto,
    .dashbdfrom {
        width: 100%;
    }

    .uploaadbtn#openModalUploadId,
    .uploaadbtn#btnChangePwd {
        width: 280px;
    }

    .form-container.expncvvcntr
    .form-container.cvv-container
    .form-group.cvv-form {
        margin-right: 20px;
    }

    div#pageModal
    #ModalDialog
    .almostDoneContainer.payment-height
    .form-container
    .form-group.expiry-container {
        width: 150px !important;
        margin-left: 20px;
    }

    .deliveryAddressContainer .btn.accountaddress {
        left: inherit !important;
        transform: inherit !important;
        width: 249px;
        right: 58px !important;
        position: absolute !important;
        bottom: -400px;
    }

    .modal-footer.splitbuttonstocardft button#ship-yourself-btn {
        width: 100% !important;
    }

    div#pageModal
    #ModalDialog
    .accpopcvv
    .almostDoneContainer.payment-height
    .form-container
    .form-group.expiry-container {
        width: 136px !important;
        margin-left: 4px;
    }

    .modal-body.without-label-container .form-container {
        width: 260px !important;
    }

        .modal-body.without-label-container .form-container .form-group input,
        .modal-body.without-label-container
        .form-container
        .form-group
        input#daDistrict {
            width: 260px !important;
        }

    .modal-header.details-modal-header.shipdetls_pophd,
    .modal-header.helphdr {
        background-color: #fff !important;
    }

    .addressContainer .scroll .scroll-hide {
        position: relative;
        width: 235px;
        left: 3px;
        padding-bottom: 4rem;
        bottom: 6px;
        margin-top: 21px;
    }

    .modal-body.accretailbd {
        height: 100% !important;
        width: 300px;
        margin: auto;
    }

    .accountretailpopo .curentcity span {
        width: 66%;
    }

    .modal-header.pb-0.accretailhd {
        width: 300px !important;
    }
}

@media (min-width: 375px) {
    .row.add_visacrdcntr .checkmark {
        position: absolute;
        top: 0;
        left: -23px;
    }

    .customer_crdnumbr {
        display: inline-block;
        width: 285px !important;
    }

    .visacntr {
        padding-bottom: 0 !important;
        width: 343px !important;
    }

    .accountretailpopo .addressContainer .scroll .scroll-hide {
        margin-top: 0px;
    }

    .headbox {
        width: 100%;
        text-align: left;
        line-height: 40px;
        align-items: center;
        padding-left: 13px;
    }

    .arrowtop img {
        width: 18px;
        height: 18px;
        transform: rotate(0deg);
    }

    .shpmcntr .main_cnter.row {
        background: #fff;
        /* border: 1px solid var(--jak-light-gray); */
        border-radius: 0px;
        opacity: 1;
        padding: 15px;
        position: relative;
        margin: 0px;
        height: 350px;
    }

    .col-md-12.shipcalc .blockmobile {
        display: block;
        flex-wrap: wrap !important;
    }

        .col-md-12.shipcalc .blockmobile .shipcalcbtn {
            width: 100% !important;
        }

    .col-md-12.shipcalc {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        padding: 0px;
    }

    .up_voice_cntr {
        margin-top: 0!important;
    }

    span.shipment-content {
        text-align: left;
        font: normal 300 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: var(--jak-gray-color);
        opacity: 1;
        width: 100%;
        display: block;
    }

    span.shipment-cntnt {
        text-align: left;
        font: normal 300 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #fb7054;
        opacity: 1;
        width: 100%;
        display: block;
    }

    .up_voice_cntr {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        margin: 0px;
    }

    .uploadinvoice span.shipment-title {
        float: left;
        font: normal normal 600 16px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #f7fafc;
        text-transform: capitalize;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    span.shipment-title-content {
        float: left;
        font: normal normal 600 16px/22px 'Söhne', 'Open Sans' !important;
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    span.shipment-btn {
        font: normal normal 600 12px/31px 'Söhne', 'Open Sans' !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
    }

    span.shipment-mbtn img,
    span.shipment-btn {
        margin-top: -3px;
    }

    .tips .main_cnter.row {
        margin: 0px;
        height: 114px;
        margin-top: 10px;
        position: relative;
        background: #fff;
        border: 1px solid #293341;
        border-radius: 0px;
    }

    .tips span.shipment-title1 {
        display: block;
        width: 80%;
        text-align: left;
        font: normal normal 300 12px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
    }

    .tips .view-all-btn {
        margin-top: 6px;
        margin-right: 178px;
    }

    .tips span.shipment-title {
        display: block;
        width: 100%;
        text-align: left;
        font: normal normal 12px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin-left: 0px;
    }

    .tips .col-md-12.content-cntr {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        padding: 0px;
        background: #fff;
    }

    .col-md-12.uploadinvoice {
        border-radius: 0;
        opacity: 1;
        margin: 0;
        height: auto;
        position: relative;
        z-index: 333;
        background: #fff;
        padding: 14px;
        border: 2px dashed var(--jak-blue-color);
    }

    .shipview.item a.text-right.view-all-btn {
        display: block;
        margin: 15px auto 0;
        text-align: center !important;
        color: white;
    }

    .packaddress .main_cnter.row {
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        margin: 0px;
    }

    .userflnm .acc_usrname {
        text-align: left;
        font: normal normal 16px/22px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .col-md-12.addressview.item.show {
        padding: 12px;
        position: relative;
        z-index: 333;
        background: #1d2b4a 0% 0% no-repeat padding-box;
        box-shadow: var(--jak-shadow);
        border: 1px solid #283991;
        border-radius: 0px;
        opacity: 1;
        margin: 0px;
        height: 205px;
    }

    span.cntry-code {
        font: normal normal 600 12px/17px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        text-align: left;
        font: normal normal 600 14px/18px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .row.address_content {
        margin: 2px 0 8px -13px;
    }

    .addressview .address_content p {
        font: normal normal normal 14px/19px 'Söhne', 'Open Sans' !important;
    }

    .addressview .row span {
        font: normal normal normal 12px/18px 'Söhne', 'Open Sans' !important;
        float: left;
    }

    p.shipment-date {
        font: normal normal normal 14px/20px 'Söhne', 'Open Sans' !important;
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin-top: 0px;
        white-space: nowrap;
        width: 145px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .consolidate {
        margin-top: 8px !important;
        margin-bottom: 110px;
        top: -125px;
    }

        .consolidate .main_cnter.row {
            margin: 0px;
            background: #fff;
            border: 1px solid #293341;
            border-radius: 0px;
            opacity: 1;
            position: relative;
            margin: 0px;
        }

        .consolidate .col-md-12 {
            border-radius: 0px;
            opacity: 1;
            position: relative;
            z-index: 333;
            margin: 0;
            padding: 13px;
            height: auto;
        }

    span.shipment-titletp {
        float: left;
        font: normal normal 16px/22px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        text-transform: capitalize;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    .col-md-12.col-xs-12.tipshd {
        font: normal normal 600 13px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        padding: 5px;
        margin-left: -3px;
    }

    p.shipment-date.mt-3.cpylink {
        font: normal normal 9px/15px Montserrat-r !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
        margin-left: 23px;
    }

    p.shipment-date.mt-3.clicked {
         animation: buttonAnimation 0.3s ease-in-out;
    }

    .btnsright1 a.utdel.clspack-status {
        font: normal normal 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #338625;
        opacity: 1;
        height: auto;
        margin-top: 6px;
    }

    .col4.packpopupitemcard:nth-child(odd) .font-data.card-header {
        background: var(--jak-green-color);
    }

    .col4.packpopupitemcard:nth-child(even) .font-data.card-header {
        background: var(--jak-green-color);
    }

    #ModalContent h6#packages-title + .card .card-header button {
        background: #00000047 0% 0% no-repeat padding-box;
        height: 18px;
        margin-top: 5px;
    }

    .customer_crdnumbr span.cardN.card-number {
        font: normal normal 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0.7px;
        color: #ffffff;
        opacity: 1;
    }

    span.shipment-mbtn {
        font: normal normal 600 12px/31px 'Söhne', 'Open Sans' !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
    }

    .addressview span.cntry-code {
        letter-spacing: 0px;
        color: #000;
        text-align: left;
        font: normal normal 500 14px/18px 'Söhne Kräftig', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
    }

    span.aa1 {
        height: 20px;
        position: relative;
        z-index: 100;
        width: 94%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
        display: none;
    }

    span.bb2 {
        display: none;
        height: 21px;
        position: relative;
        z-index: 0;
        margin-top: -10px;
        width: 92%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    .shimentcntr .main_cnter.row {
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        padding: 0px;
        position: relative;
        margin: 0px;
        height: 240px;
    }

    .shipviewcntr {
        padding: 13px 13px 0px 13px;
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        box-shadow: var(--jak-shadow);
    }

    .flex.user-greet.col-12 {
        display: block;
    }

    li.icodiv:last-child,
    li.icodiv.chkLangMain {
        display: none !important;
        border: 1px solid var(--jak-light-gray);
    }

    li#notification {
        position: absolute;
        right: 0;
        top: -45px;
        display: none;
        border: 1px solid var(--jak-light-gray);
    }

    li.icodiv.srchglbl {
        width: 300px !important;
        margin: 10px 0;
        display: none;
    }

    li.icodiv #input-listSrch,
    #inputTablistSrch {
        background: #fff;
    }

    li.icodiv.srchglbl img {
        left: 266px !important;
        width: 19px;
        height: 19px;
        top: 31px !important;
    }

    .Useractive-bg {
        background: #FFDBDC;
        border: none;
        height: auto !important;
        padding: 5px;
        display: inline-flex;
    }

    .col-md-6.shimentcntr.pr-0,
    .col-md-6.shpmcntr.pr-0,
    .col-md-6.tips.pr-0 {
        padding: 0 !important;
    }

    .row.track_content .col-md-3 {
        width: 50%;
    }

    .packaddress .bb,
    .packaddress .aa {
        display: none;
    }

    .col-md-12.addressview.item .col-md-4 {
        width: 50%;
    }

    li.icodiv.chkLangMain,
    li#notification {
        display: none;
    }

    .col-md-12.shipcalc .col-md-1 {
        display: none;
    }

    .shpmcntr .shipcalc .row .col-md-1 {
        display: none !important;
    }

    .shpmcntr .shipcalc .row .col {
        padding: 0 3px 0 4px !important;
    }

    .up_voice_cntr {
        margin-top: 5px !important;
    }

    .col-md-6.tips.pr-0 {
        margin-bottom: 3px;
        top: 142px;
    }

    .modal-lgg,
    .modal-xl {
        max-width: 800px;
    }

    #btnModalFilter {
        position: absolute;
        right: 100px;
    }

    .mobilefilter {
        position: absolute;
        top: -37px;
        right: 0;
    }

    .packbg {
        margin-top: 50px !important;
    }

        .packbg.prfretailcenter {
            margin-top: 0px !important;
        }

    .packmobile .scroll .scroll-hide {
        overflow-x: auto !important;
        max-width: 351px;
        padding-bottom: 0;
    }

    .accountbg {
        margin-top: 0px !important;
    }

    .name_detailbox2 .idnum {
        background: #fff;
        margin: 0px 0px 15px 0;
        padding: 0 0 0 0px !important;
        width: 100%;
        border-radius: 0px 0;
    }

    .name_detailbox {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        display: inline-block;
        width: 298px;
        height: 241px;
        padding: 22px;
        margin-left: 15px;
    }

    .name_detailbox2 {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        display: inline-block;
        width: 298px;
        height: auto;
        margin-left: 0px !important;
    }

    .row.nopadding.plus {
        width: 300px;
    }

    .sidebar-nav li a {
        display: inline-block !important;
        padding: 5px 15px !important;
    }

    span.pro_head:before {
        display: none !important;
    }

    button#btncCodeshippingFrom,
    #btncCodeshippingTo {
        width: 100% !important;
        font-size: 14px !important;
    }

    .calseprater {
        width: 22px;
        margin: 29px 10px !important;
        display: none;
    }

    .tblsdtlstxt {
        display: block; /* width:33%; */ /* float:left; */
    }

    .bottom-bn.body-font.body-font-p {
        width: 50%;
        float: left;
    }

    .modal-body.shipment-modal-body.pt-2.br-0.shipdetls_popbd {
        width: 300px;
    }

    .modal-footer,
    .modal-header {
        background-color: none !important;
        border: none;
        margin: auto;
        width: 300px !important;
    }

    .tipsmobile {
        display: block;
    }

    .product-elecntr .card-body.nopadding {
        background: red;
        background: transparent linear-gradient(78deg, #0e502c 0%, #1cb15f 100%) 0% 0% no-repeat padding-box;
        height: 160px !important;
    }

    .product-elecntr .bottom-btn {
        display: block;
        width: 128px !important;
        padding: 0;
        margin-top: -50px;
        float: inherit !important;
        margin: -50px auto 0 !important;
    }

    .product-elecntr .pack-img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 128px !important;
    }

    .packscrol .newlistcrd .card-body.bbr-4.py-card.newlstcntr {
        display: block;
        float: left;
    }

        .packscrol .newlistcrd .card-body.bbr-4.py-card.newlstcntr .dtlsvalues {
            width: 50%;
            display: block;
            float: left;
            margin: 5px 0;
        }

    label.crdcusmer img {
        width: 45px;
        margin-right: 66px !important;
    }

    .row.add_visacrdcntr .checkmark {
        position: absolute;
        top: 0;
        left: -50px;
    }

    .customer_crdnumbr {
        display: inline-block;
        width: 139% !important;
    }

    .order-total.summryfter p {
        width: 82%;
        float: right;
        text-align: left;
        margin: -4px;
        font: normal normal normal 12px/normal 'Söhne', 'Open Sans';
        color: #000;
    }

    .rtosender .card.btnmobilerts {
        width: 300px;
        margin-left: -26px;
        display: inline-block;
        margin-bottom: 100px;
    }

    .ad_moredetails span {
        width: 105px !important;
    }

    [dir="rtl"] .ad_moredetails span {
        width: 67px !important;
        letter-spacing: 0;
    }

    .accpack-card {
        width: 292px !important;
    }

    .modal-header,
    .modal-body {
        width: 300px !important;
        margin: auto;
    }

    #pageModal .packages-body-scroll {
        width: 300px !important;
        margin: auto;
    }

    .add-new-body {
        width: 300px !important;
        margin: auto;
    }

    .imgreq.reqprodtls .bottom-btn-inline {
        width: 100% !important;
        text-align: center;
        padding: 12px 25px !important;
    }

    .acc_saveadd + .accedtaddress {
        width: 300px;
        margin: auto;
    }

        .acc_saveadd + .accedtaddress .form-container {
            width: 250px;
        }

            .acc_saveadd + .accedtaddress .form-container button#btncCodecity {
                width: 250px;
            }

            .acc_saveadd + .accedtaddress .form-container .form-group {
                width: 213px;
            }

            .acc_saveadd + .accedtaddress .form-container input#daAddress,
            .acc_saveadd + .accedtaddress .form-container input#daDistrict,
            .acc_saveadd + .accedtaddress .form-container input#daAdditionalInfo {
                width: 250px !important;
            }

        .acc_saveadd + .accedtaddress .mapAreaContainer.full-width-map {
            width: 250px !important;
            height: 300px !important;
        }

        .acc_saveadd + .accedtaddress .deliveryAddressContainer .btn {
            left: 49%;
            width: 258px;
            position: relative;
            /* top: 5px; */
            z-index: 10;
            /* right: inherit!important; */
            bottom: -361px;
            top: inherit;
            transform: none;
            margin: auto;
            left: -18px;
        }

    .accpopcvv .almostDoneContainer .form-container + .flex .expiry-container {
        left: 5px !important;
    }

    .accpopcvv .almostDoneContainer .form-container + .flex .form-container {
        width: 144px !important;
        float: left;
    }

    #ModalDialog .accpopcvv .form-container .form-group input#adCVV {
        width: 141px !important;
        margin-left: 3px;
    }

    .row.ship-dt-lst {
        width: 300px;
    }

    .col-12.dtlsvalues.list {
        display: block;
    }

        .col-12.dtlsvalues.list .ml-2 {
            display: block;
        }

    .mapAreaContainer {
        width: 246px !important;
        margin: 417px 0 0 2px;
        left: 11px;
        right: 0px;
    }

    .modal-body.saveaddressaddn .mapAreaContainer.full-width-map {
        height: 300px !important;
    }

    .signupmap .mapAreaContainer {
        width: 282px !important;
        margin: 417px 0 0 -9px;
        left: 0;
        right: 0px;
    }

    .signupmap #div-addareawidth .progress {
        width: 257px;
        margin-top: -28px;
    }

    .signupmap .form-container {
        width: 260px;
    }

    .signupmap .deliveryAddressContainer .btn-selectcity {
        width: 260px;
    }

    .signupmap .jk.input-feild,
    .signupmap #daDistrict,
    .signupmap #daAdditionalInfo {
        width: 262px !important;
    }

    .signupmap .form-group {
        position: relative;
        width: 226px;
    }

    .dashbdfromto,
    .dashbdfrom {
        width: 100%;
    }

    .uploaadbtn#openModalUploadId,
    .uploaadbtn#btnChangePwd {
        width: 280px;
    }

    .form-container.expncvvcntr
    .form-container.cvv-container
    .form-group.cvv-form {
        margin-right: 20px;
    }

    div#pageModal
    #ModalDialog
    .almostDoneContainer.payment-height
    .form-container
    .form-group.expiry-container {
        width: 150px !important;
        margin-left: 20px;
    }

    .deliveryAddressContainer .btn.accountaddress {
        left: inherit !important;
        transform: inherit !important;
        width: 249px;
        right: 58px !important;
        position: absolute !important;
        bottom: -400px;
    }

    .modal-footer.splitbuttonstocardft button#ship-yourself-btn {
       width: 100% !important;
    }

    div#pageModal
    #ModalDialog
    .accpopcvv
    .almostDoneContainer.payment-height
    .form-container
    .form-group.expiry-container {
        width: 136px !important;
        margin-left: 4px;
    }

    .modal-body.without-label-container .form-container {
        width: 260px !important;
    }

        .modal-body.without-label-container .form-container .form-group input,
        .modal-body.without-label-container
        .form-container
        .form-group
        input#daDistrict {
            width: 260px !important;
        }

    .modal-header.details-modal-header.shipdetls_pophd,
    .modal-header.helphdr {
        background-color: #fff !important;
    }

    .addressContainer .scroll .scroll-hide {
        position: relative;
        width: 235px;
        left: 3px;
        padding-bottom: 4rem;
        bottom: 6px;
        margin-top: 21px;
    }

    .modal-body.accretailbd {
        height: 100% !important;
        width: 300px;
        margin: auto;
    }

    .accountretailpopo .curentcity span {
        width: 66%;
    }

    .modal-header.pb-0.accretailhd {
        width: 300px !important;
    }
}

@media (min-width: 375px) {
    .accountretailpopo .addressContainer .scroll .scroll-hide {
        margin-top: 0px;
    }

    .modal-body.without-label-container .form-container {
        width: 300px !important;
    }

        .modal-body.without-label-container .form-container .form-group input,
        .modal-body.without-label-container
        .form-container
        .form-group
        input#daDistrict {
            width: 300px !important;
        }

    div#pageModal
    #ModalDialog
    .accpopcvv
    .almostDoneContainer.payment-height
    .form-container
    .form-group.expiry-container {
        width: 138px !important;
        margin-left: 5px;
    }

    .form-container.expncvvcntr
    .form-container.cvv-container
    .form-group.cvv-form {
        margin-right: 20px;
    }

    div#pageModal
    #ModalDialog
    .almostDoneContainer.payment-height
    .form-container
    .form-group.expiry-container {
        width: 150px !important;
        margin-left: 20px;
    }

    .footerad {
        width: 355px !important;
    }

    .modal-header.shrhdr,
    #filterModalContent,
    .shrftr {
        width: 330px !important;
        margin: auto;
    }

    .modal-header.pb-0.accpswdhd,
    .modal-body.accpswdbdy {
        width: 350px !important;
        margin: auto;
    }

    .modal-body.accpswdbdy .btn {
        width: 100% !important;
        margin: auto;
    }

    .retailCenterContainer.dfgfg {
        padding: 0!important;
    }

    .modal-header.pb-0.accretailhd button.close {
        left: 114% !important;
    }

    button#btnSave.submitidprf {
        position: unset !important;
        margin: 0;
        width: 100% !important;
    }
}

@media (min-width: 500px) {
    .visacntr {
        padding-bottom: 0 !important;
        width: 366px !important;
    }

    div#pageModal #ModalDialog .accfooterbtn .btnAddNewCard {
        width: 330px !important;
        margin: auto;
    }

    .retailCenterContainer {
        width: 100%;
    }


    .modal-body.accretailbd .rcenterhead {
        padding-top: 10px !important;
    }

    .modal-body.accretailbd .curentcity span {
        padding-top: 0px;
    }

    .modal-body.accretailbd .addressContainer .curentcity {
        width: 100% !important;
        /* background: red; */
        font-family: 'Jali Arabic', sans-serif !important;
    }

    .modal-body.accretailbd input#rtSearch {
        width: 300px !important;
    }

        .modal-body.accretailbd input#rtSearch + span.password-icon {
            right: 0.5rem;
            top: 138px;
            position: absolute;
        }

    .modal-body.accretailbd .scroll-hide {
        margin: 22px;
        top: 12px;
        width: 300px;
    }

    .modal-body.accretailbd .mapAreaContainer.full-width-map {
        margin-top: 400px;
        width: 300px !important;
        height: 300px !important;
    }

    .modal-body.accretailbd button#btnSaveRetail {
        top: 346px;
    }

    .modal-body.accretailbd {
        height: 100% !important;
    }

    .letsStartContainer .form-feild:nth-child(2) {
        padding-left: 10px;
        position: relative;
        width: 200px;
    }

    .otpContainer.accoptpop .otp-container {
        width: 23rem;
    }

    .signupmap .deliveryAddressContainer .btn {
        left: 49%;
        bottom: -239px;
        width: 300px;
    }

    .signupmap .jk.input-feild,
    .signupmap #daDistrict,
    .signupmap #daAdditionalInfo {
        width: 300px !important;
    }

    .signupmap .form-group {
        position: relative;
        width: 300px;
    }

    .signupmap #div-addareawidth .progress {
        width: 300px;
        margin-top: -28px;
    }

    .signupmap .deliveryAddressContainer .btn-selectcity {
        width: 300px;
    }

    .signupmap .deliveryAddressContainer .btn-selectcity {
        width: 300px;
    }

    .signupmap .mapAreaContainer {
        width: 300px !important;
        margin: 417px 0 0 2px;
        left: 11px;
        right: 0px;
        height: 280px !important;
    }

    .retailssignup .mapAreaContainer {
        /*width: 292px !important;*/
        margin: 417px 0 0 2px;
        left: 11px;
        right: 0px;
        height: 300px;
    }

    .retailssignup .retailCenterContainer .btn {
        top: 334px;
    }

    .prfsavedadd a#btnAddNew {
        margin: 0;
        right: 0px;
    }

    div#pageModal #ModalDialog .without-label-container .form-container {
        width: 300px !important;
        margin: 0 auto;
    }

    .uploaadbtn#openModalUploadId,
    .uploaadbtn#btnChangePwd {
        width: 330px;
    }

    .dashbdfromto,
    .dashbdfrom {
        width: 100%;
    }

    .mapAreaContainer {
        width: 350px !important;
        margin: 417px 0 0 2px;
        left: 11px;
        right: 0px;
    }

    .row.ship-dt-lst {
        width: 350px;
    }

    .col-12.dtlsvalues.list {
        display: block;
    }

    .acc_saveadd + .accedtaddress .mapAreaContainer.full-width-map {
        width: 300px !important;
    }

    .acc_saveadd + .accedtaddress .form-container input#daAddress,
    .acc_saveadd + .accedtaddress .form-container input#daDistrict,
    .acc_saveadd + .accedtaddress .form-container input#daAdditionalInfo {
        width: 300px !important;
    }

    .acc_saveadd + .accedtaddress .form-container {
        width: 300px;
    }

        .acc_saveadd + .accedtaddress .form-container button#btncCodecity {
            width: 300px;
        }

        .acc_saveadd + .accedtaddress .form-container .form-group {
            width: 270px;
        }

    .acc_saveadd + .accedtaddress {
        width: 350px;
    }

        .acc_saveadd + .accedtaddress .deliveryAddressContainer .btn {
            margin-top: 348px;
            left: 49%;
            width: 306px;
            position: relative;
            /* top: 5px; */
            z-index: 10;
            /* display: inline-block; */
            right: inherit;
            bottom: 0;
            transform: translateX(-50%);
        }

    .add-new-body {
        width: 350px !important;
        margin: auto;
    }
}

@media (min-width: 768px) {
    .plan-container2 {
        /* border-radius: 0px; */
        width: 240px;
    }

    .adminpreferein input {
        display: block !important;
        width: 25px;
        height: 25px;
        position: absolute;
        z-index: 100;
        left: 193px;
        top: 15px;
        opacity: 0;
    }

    .modal-header {
        width: 375px !important;
        margin: auto;
    }

    .accpack-card {
        width: 313px !important;
    }

    .rtosender .card.btnmobilerts {
        width: 345px;
        margin-left: -26px;
        display: inline-block;
        margin-bottom: 100px;
    }

    .order-total.summryfter p {
        width: 84%;
        float: right;
        text-align: left;
        margin: 2px;
        font: normal normal normal 12px/normal 'Söhne', 'Open Sans';
        color: #000;
    }

    .customer_crdnumbr {
        display: inline-block;
        width: 314px !important;
    }

    .row.add_visacrdcntr .checkmark {
        position: absolute;
        top: 0;
        left: -10px;
    }

    label.crdcusmer img {
        width: 45px;
        margin-right: 35px !important;
    }

    .packscrol .newlistcrd .card-body.bbr-4.py-card.newlstcntr {
        display: flex;
        float: inherit;
    }

        .packscrol .newlistcrd .card-body.bbr-4.py-card.newlstcntr .dtlsvalues {
            width: auto;
            display: block;
            float: left;
            margin: 10px 0;
        }

    .col4.packpopupitemcard.pckbkmobile .bottom-btn {
        width: 100%;
        width: 100% !important;
        margin-bottom: 8px !important;
        margin: 0px 0 8px 0 !important;
    }

    .col4.packpopupitemcard.pckbkmobile .pack-item-card.mt-0 {
        margin-bottom: 12px;
    }

    .add_visacrdcntr:last-child .visacntr + button#btnAddCard {
        display: none !important;
    }

    button#btnAddCard.mobile {
        background: #ee5e43;
        border-radius: 0px;
        padding: 5px;
        font: normal normal normal 14px/18px 'Söhne Kräftig', 'Open Sans';
        /* float: right; */
        /* position: absolute; */
        /* left: 64%; */
        /* top: 455PX; */
        background: transparent;
        box-shadow: none;
        border: none;
        border-radius: 0px;
        color: #000;
        width: 102%;
        margin: 7px -13px;
        left: -7px;
    }

        button#btnAddCard.mobile span {
            font: normal normal normal 10px/18px 'Söhne', 'Open Sans';
            letter-spacing: 0px;
            color: #ffffff;
            opacity: 1;
            width: 100%;
            display: contents;
            margin-top: 30px;
            padding: 4px;
        }

    #btnAddCard.hidemobile {
        display: none;
    }

    .col-3.summaryRight.mobile {
        float: right;
        position: inherit;
    }

    .summeryleft.mobile {
        float: left;
        margin-left: 16px;
    }

    .hidemobile {
        display: none;
    }

    a.text-right.view-all-btn {
    }

    .mobilemenu ul.nav-menu {
        position: relative;
        justify-content: space-between;
        align-items: center;
        flex-direction: inherit;
        /* display: flex; */
        border-radius: 0px;
        /* display: flex; */
    }

    .mobilemenu li.nav-item {
        display: flex;
        justify-content: center;
        text-align: center;
        /* align-content: flex-end; */
    }

    .mobilemenu span.on-hover {
        display: flex;
        justify-content: center;
    }

    .mobilemenu .nav-link.s2d-nav-link img {
        width: 30px;
        height: 30px;
        display: inline-block;
    }

    .mobilemenu {
        display: block;
    }

    .s2dcntr {
        max-width: 94% !important;
        position: inherit;
    }

    .mobilemenu {
        display: block;
        z-index: 1000;
        position: fixed;
        /* background: #252b33; */
        /* width: 345px; */
        bottom: 13px;
        margin: 0 auto;
        padding: 7pt;
        border-radius: 10pt;
        justify-content: center;
        /* align-items: self-start; */
        align-content: stretch;
        left: 3%;
        height: 70pt;
        bottom: 3vh;
    }

    a.utdel.clspack-status.ready-to-send-btn {
        font: normal normal bold 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #338625;
        opacity: 1;
        padding: 0 8px;
        height: 18px;
        display: block;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .sumrysubhd {
        margin-top: 26px;
        font: normal normal normal 14px/18px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .summaryRight h6.package-heading {
        margin-top: 0;
    }

    .bottom-listfooter button.detail-btn.btnpack-detail,
    .bottom-listfooter .detail-btn.btnship-detail {
        font: normal normal 500 12px/20px 'Söhne Kräftig', 'Open Sans';
        width: 100px;
        height: 32px;
        position: absolute;
        bottom: 9px;
    }

    .s2d-navbar.nav_new {
        padding: 10px 0;
        margin: 5px 0 0 0;
        background: var(--jak-blue-color);
        border: none;
        opacity: 1;
        height: 775px;
        align-items: flex-start;
    }

    .container.main_contorellar {
        flex-direction: column;
        height: 778px;
    }

    a.nav-link.s2d-nav-link {
        font: normal normal 10pt/20px 'Söhne', 'Open Sans' !important;
        /* display: flex; */
        padding: 10px;
    }

    .s2d-navbar.nav_new .navbar-nav .s2d-nav-link {
        text-align: center;
        font: normal normal 14px/20px 'Söhne Halbfett', 'Open Sans';
        letter-spacing: 0px;
         color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
        margin-bottom: 17px;
    }

    .container.right {
        max-width: 100% !important;
        float: right;
    }

    .packagecnter span.shipment-title {
        font: normal normal 300 12px/24px 'Söhne', 'Open Sans';
    }

    #user-name {
        font: normal normal 400 22px/43px 'Söhne Buch', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin: 0;
    }

    .row.topcontent {
        margin-top: 75px;
    }

    label.sectionheading {
        width: 100%;
        font: normal normal 20px/31px 'Söhne Kräftig', 'Open Sans';
        font-weight: 500;
        text-align: left;
        line-height: 40px;
        align-items: center;
        padding-left: 13px;
        margin-bottom: 3px;
        color: #000;
    }

    .packagecnter {
        background: #ffffff;
        border: none;
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        /* display: flex; */
        margin: 0px;
        height: auto;
    }

    .sectionheading span {
        display: none;
        position: relative;
        right: auto;
        float: right;
        top: -9px;
    }

    .arrowtop {
        margin: 19px 7px 0px;
        text-align: center !important;
        width: 18px;
        height: 18px;
    }

    .arrowbtm {
        display: block;
        margin: 21px 7px 0px;
        text-align: center !important;
    }

        .arrowbtm img {
            width: 25px;
            height: 25px;
            width: 18px;
            height: 18px;
            transform: rotate(180deg);
        }

    .packagecnter .item {
        background: none;
        border: none;
        border-radius: 0px;
        opacity: 1;
        padding: 3px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        height: auto;
        box-shadow: var(--jak-shadow);
    }

    .header_Pack {
        padding: 0 0 14px 0;
        margin: 0;
        border-bottom: 1px solid;
        display: inline-block;
        width: 100%;
       border-bottom: 1px solid var(--jak-light-gray);
    }

        .header_Pack .packname {
            display: block;
            float: left;
            text-align: left;
        }

    .packname.btmvalue span + span {
        font: italic normal normal 12px/10pt 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
    }

    .packname.btmvalue span {
        font: normal normal 600 12px/17pt 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
    }

    .packagecnter .item .header .row.box {
        padding: 0px 0px 0px 15px;
    }

    .btnsright a.utdel.shipped-btn {
        opacity: 1;
        color: var(--unnamed-color-f7fafc);
        text-align: right;
        font: normal normal 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        opacity: 1;
        margin-right: 8px;
        border-radius: 0px;
        opacity: 1;
        padding: 0 8px;
        display: inline;
    }

    .packbox .header_Pack + .row.box .col-md-3 {
        width: 50%;
    }

    .packagecnter .item .row.box {
        padding: 0px 0px 0px 15px;
    }

    .box .detail-btn.btnpack-detail {
        background: none;
        font: normal 500 12px/normal 'Söhne Kräftig', 'Open Sans';
        letter-spacing: normal;
         color: var(--jak-blue-color);
        opacity: 1;
        white-space: nowrap;
    }

    .backeff {
        background: red;
        height: 20px;
        position: relative;
        z-index: 100;
        width: 94%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        display: none;
        opacity: 1;
    }

    .backeff2 {
        background: #00ff5a;
        display: none;
        height: 21px;
        position: relative;
        z-index: 0;
        margin-top: -10px;
        width: 92%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    .btnTrack-now,
    .btnsright a.utdel {
        font: normal normal 600 12px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        text-transform: capitalize;
        opacity: 1;
        cursor: pointer;
    }

    .row.track_content {
        padding: 0px 0px 0px 15px;
    }

    .headbox {
        width: 100%;
        text-align: left;
        line-height: 40px;
        align-items: center;
        padding-left: 13px;
    }

    .arrowtop img {
        width: 18px;
        height: 18px;
        transform: rotate(0deg);
    }

    .shpmcntr .main_cnter.row {
        background: #fff;
        /* border: 1px solid var(--jak-light-gray); */
        border-radius: 0px;
        opacity: 1;
        padding: 15px;
        position: relative;
        margin: 0px;
        height: 350px;
    }

    .col-md-12.shipcalc {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        padding: 0px;
    }

    .up_voice_cntr {
        margin-top: 0 !important;
    }

    span.shipment-content {
        text-align: left;
        font: normal 300 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        opacity: 1;
        width: 100%;
        display: block;
    }

    span.shipment-cntnt {
        text-align: left;
        font: normal 300 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #fb7054;
        opacity: 1;
        width: 100%;
        display: block;
    }

    .up_voice_cntr {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        margin: 0px;
        max-width: 100%;
    }

    .uploadinvoice span.shipment-title {
        float: left;
        font: normal normal 600 16px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #f7fafc;
        text-transform: capitalize;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    span.shipment-title-content {
        float: left;
        font: normal normal 600 16px/22px 'Söhne', 'Open Sans' !important;
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    span.shipment-btn {
        font: normal normal 600 12px/31px 'Söhne', 'Open Sans' !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
    }

    span.shipment-mbtn img,
    span.shipment-btn {
        margin-top: -3px;
    }

    .tips .main_cnter.row {
        margin: 0px;
        height: 114px;
        margin-top: 10px;
        position: relative;
        background: #fff;
        border: 1px solid #293341;
        border-radius: 0px;
    }

    .tips span.shipment-title1 {
        display: block;
        width: 80%;
        text-align: left;
        font: normal normal 300 12px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
    }

    .tips .view-all-btn {
        margin-top: 6px;
        margin-right: 226px;
    }

    .tips span.shipment-title {
        display: block;
        width: 80%;
        text-align: left;
        font: normal normal 12px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin-left: 0px;
    }

    .tips .col-md-12.content-cntr {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        padding: 0px;
        background: #fff;
    }

    .col-md-12.uploadinvoice {
        border-radius: 0;
        opacity: 1;
        margin: 0;
        height: auto;
        position: relative;
        z-index: 333;
        background: #fff;
        padding: 14px;
        border: 2px dashed var(--jak-blue-color);
    }

    .shipview.item a.text-right.view-all-btn {
        display: block;
        margin: 15px auto 0;
        text-align: center !important;
        color: white;
    }

    .packaddress .main_cnter.row {
        border-radius: 0px;
        opacity: 1;
         padding: 10px;
        position: relative;
        margin: 0px;
    }

    .userflnm .acc_usrname {
        text-align: left;
        font: normal normal 16px/22px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .col-md-12.addressview.item.show {
        padding: 12px;
        position: relative;
        z-index: 333;
        background: #1d2b4a 0% 0% no-repeat padding-box;
        box-shadow: var(--jak-shadow);
        border: 1px solid #283991;
        border-radius: 0px;
        opacity: 1;
        margin: 0px;
        height: 205px;
    }

    span.cntry-code {
        font: normal normal 600 12px/17px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        text-align: left;
        font: normal normal 600 14px/18px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .row.address_content {
        margin: 2px 0 8px -13px;
    }

    .addressview .address_content p {
        font: normal normal normal 14px/19px 'Söhne', 'Open Sans' !important;
    }

    .addressview .row span {
        font: normal normal normal 12px/18px 'Söhne', 'Open Sans' !important;
        float: left;
    }

    p.shipment-date {
        font: normal normal normal 14px/20px 'Söhne', 'Open Sans' !important;
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin-top: 0px;
        white-space: nowrap;
        width: 158px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .consolidate {
        margin-top: 8px !important;
        margin-bottom: 110px;
        top: -125px;
    }

        .consolidate .main_cnter.row {
            margin: 0px;
            background: #fff;
            border: 1px solid #293341;
            border-radius: 0px;
            opacity: 1;
            position: relative;
            margin: 0px;
        }

        .consolidate .col-md-12 {
            border-radius: 0px;
            opacity: 1;
            position: relative;
            z-index: 333;
            margin: 0;
            padding: 13px;
            height: auto;
        }

    span.shipment-titletp {
        float: left;
        font: normal normal 16px/22px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
       color: #000;
        text-transform: capitalize;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    .col-md-12.col-xs-12.tipshd {
        font: normal normal 600 13px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        padding: 5px;
        margin-left: -3px;
    }

    p.shipment-date.mt-3.cpylink {
        font: normal normal 12px/15px Montserrat-r !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
        margin-left: 23px;
    }

    p.shipment-date.mt-3.clicked {
        animation: buttonAnimation 0.5s ease-in-out;
   }

    .btnsright1 a.utdel.clspack-status {
        font: normal normal 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #338625;
        opacity: 1;
        height: auto;
        margin-top: 6px;
    }

    .col4.packpopupitemcard:nth-child(odd) .font-data.card-header {
        background: var(--jak-green-color);
    }

    .col4.packpopupitemcard:nth-child(even) .font-data.card-header {
        background: var(--jak-green-color);
    }

    #ModalContent h6#packages-title + .card .card-header button {
        background: #00000047 0% 0% no-repeat padding-box;
        height: 18px;
        margin-top: 5px;
    }

    .customer_crdnumbr span.cardN.card-number {
        font: normal normal 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0.7px;
        color: #ffffff;
        opacity: 1;
    }

    span.shipment-mbtn {
        font: normal normal 600 12px/31px 'Söhne', 'Open Sans' !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
    }

    .addressview span.cntry-code {
        letter-spacing: 0px;
        color: #000;
        text-align: left;
        font: normal normal 500 14px/18px 'Söhne Kräftig', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
    }

    span.aa1 {
        height: 20px;
        position: relative;
        z-index: 100;
        width: 94%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
        display: none;
    }

    span.bb2 {
        display: none;
        height: 21px;
        position: relative;
        z-index: 0;
        margin-top: -10px;
        width: 92%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    .shimentcntr .main_cnter.row {
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        padding: 0px;
        position: relative;
        margin: 0px;
        height: 240px;
    }

    .shipviewcntr {
        padding: 13px 13px 0px 13px;
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        box-shadow: var(--jak-shadow);
    }

    .flex.user-greet.col-12 {
        display: block;
    }

    li.icodiv:last-child,
    li.icodiv.chkLangMain {
        display: none !important;
    }

    li#notification {
        position: absolute;
        right: 0;
        top: -45px;
    }

    li.icodiv.srchglbl {
        width: 350px !important;
        margin: 10px 0;
    }

    li.icodiv #input-listSrch,
    #inputTablistSrch {
        background: #fff;
    }

    li.icodiv.srchglbl img {
        left: 318px !important;
        width: 19px;
        height: 19px;
        top: 31px !important;
    }

    .col-md-6.shimentcntr.pr-0,
    .col-md-6.shpmcntr.pr-0,
    .col-md-6.tips.pr-0 {
        padding: 0 !important;
    }

    .row.track_content .col-md-3 {
        width: 50%;
    }

    .packaddress .bb,
    .packaddress .aa {
        display: none;
    }

    .col-md-12.addressview.item .col-md-4 {
        width: 50%;
    }

    li.icodiv.chkLangMain {
        display: none;
    }

    .col-md-12.shipcalc .col-md-1 {
        display: none;
    }

    .shpmcntr .shipcalc .row .col-md-1 {
        display: none !important;
    }

    .shpmcntr .shipcalc .row .col {
        padding: 0 3px 0 4px !important;
    }

    .up_voice_cntr {
        margin-top: 5px !important;
    }

    .col-md-6.tips.pr-0 {
        margin-bottom: 3px;
        top: 132px;
    }

    .modal-lgg,
    .modal-xl {
        max-width: 800px;
    }

    #btnModalFilter {
        position: absolute;
        right: 100px;
    }

    .mobilefilter {
        position: absolute;
        top: -37px;
        right: 0;
    }

    .packbg {
        margin-top: 50px !important;
    }

        .packbg.prfretailcenter {
            margin-top: 80px !important;
        }

    .packmobile .scroll .scroll-hide {
        overflow-x: auto !important;
        max-width: 351px;
    }

    .accountbg {
        margin-top: 80px !important;
    }

    .name_detailbox2 .idnum {
        background: #fff;
        margin: 0px 0px 15px 0;
        padding: 0 0 0 0px !important;
        width: 100%;
        border-radius: 0px 0;
    }

        .name_detailbox2 .idnum label.arabic-right {
            padding-left: 22px !important;
        }

        .name_detailbox2 .idnum span.txt-right {
            padding-left: 20px !important;
        }

    .name_detailbox2 span#span-pwd {
        margin-left: 21px;
    }

    .uploaadbtn#openModalUploadId,
    .uploaadbtn#btnChangePwd {
        background: #fff;
        border-radius: 0px 0px 0;
        display: block;
        margin: 10px 0 0 0 !important;
    }

    .name_detailbox {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        display: inline-block;
        width: 330px;
        height: 241px;
        padding: 22px;
        margin-left: 15px;
    }

    .name_detailbox2 {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        display: inline-block;
        width: 330px;
        height: auto;
        margin-left: 0px !important;
    }

    .sidebar-nav li a {
        display: inline-block !important;
        padding: 5px 15px !important;
    }

    span.pro_head:before {
        display: none !important;
    }

    button#btncCodeshippingFrom,
    #btncCodeshippingTo {
        width: 100% !important;
        font-size: 14px !important;
    }

    .calseprater {
        width: 22px;
        margin: 29px 10px !important;
    }

    .tblsdtlstxt {
        display: block; /* width:33%; */ /* float:left; */
    }

    .bottom-bn.body-font.body-font-p {
        width: 50%;
        float: left;
    }

    .modal-footer,
    .modal-header,
    .modal-body {
        background-color: none !important;
        border: none;
        width: 350px !important;
        margin: auto;
    }

    #pageModal .packages-body-scroll {
        width: 350px !important;
        margin: auto;
    }

    .tipsmobile {
        display: block;
    }

    .product-elecntr .card-body.nopadding.imgreq.reqprodtls {
        width: 350px;
    }

    .col-.mb-3.product-elecntr {
        width: 350px !important;
    }

    button.btn-secondary.continueToPayment.reqpagbtn.btnloader {
        width: 365px !important;
    }

    .product-elecntr .card-body.nopadding {
        background: red;
        background: transparent linear-gradient(78deg, #0e502c 0%, #1cb15f 100%) 0% 0% no-repeat padding-box;
        height: 160px !important;
    }

    .product-elecntr .bottom-btn {
        display: block;
        width: 128px !important;
        padding: 0;
        margin-top: -50px;
        float: inherit !important;
        margin: -50px auto 0 !important;
    }

    .product-elecntr .pack-img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 128px !important;
    }

    .modal-body.saveaddressaddn .addressContainer .form-container.mb-3 {
        width: 240px !important;
        margin-left: 30px;
    }

    .modal-body.saveaddressaddn .mapAreaContainer.full-width-map {
        width: 241px !important;
        margin: 367px 0 0 33px !important;
        height: 300px !important;
    }

    .modal-body.saveaddressaddn .deliveryAddressContainer .btn {
        left: 84px;
        width: 237px;
        margin: 332px 0 0 0;
        bottom: inherit;
    }

    .multisteps-form__content
    .almostDoneContainer
    .form-container + .flex
    .form-container
    input.cvv {
        width: 144px !important;
        margin-left: 1% !important;
    }

    .multisteps-form__content
    .almostDoneContainer
    .form-container + .flex
    .form-container
    input.expiry {
        width: 140px !important;
    }

    a.btnview-photos {
        left: 210px !important;
    }

    .modal-header.shrhdr,
    #filterModalContent,
    .shrftr {
        width: 330px !important;
        margin: auto;
    }

        #filterModalContent .shrbody {
            width: 330px !important;
        }
}

@media (min-width: 425px) {
    div#pageModal
    #ModalDialog
    .almostDoneContainer.payment-height
    .form-container
    .form-group.expiry-container {
        width: 150px !important;
        margin-left: 0px;
    }

    .footerad {
        width: 100% !important;
    }

    .filter-modal-footer {
        width: 390px !important;
    }

    #filterModalContent .shrbody {
        width: 390px !important;
    }

    .modal-header.shrhdr,
    #filterModalContent,
    .modal-footer.shrftr {
        width: 390px !important;
        margin: auto;
    }

    a.btnview-photos {
        left: 260px !important;
    }

    .strgaddpop {
        width: 400px !important;
    }

    div#pageModal #ModalDialog .upidproofcntr .form-container {
        width: 326px;
    }

    .modal-header.upidproofcntrhd,
    .modal-body.upidproofcntr {
        width: 350px !important;
        margin: auto !important;
    }

    .upidproofcntr .form-group input {
        width: 100% !important;
    }

    .uploadidbtn button#btnSave {
        width: 100% !important;
    }

    .modal-header.pb-0.accretailhd button.close {
        left: 114% !important;
    }

    .modal-body.accretailbd .rcenterhead {
        padding-top: 10px !important;
    }

    .modal-body.accretailbd .curentcity span {
        padding-top: 0px;
    }

    .modal-body.accretailbd .addressContainer .curentcity {
        width: 100% !important;
        /* background: red; */
    }

    .modal-body.accretailbd input#rtSearch {
        width: 345px !important;
    }

        .modal-body.accretailbd input#rtSearch + span.password-icon {
            right: 0.5rem;
            top: 138px;
            position: absolute;
        }

    .modal-body.accretailbd .scroll-hide {
        margint: 22px;
        top: 12px;
        width: 346px;
    }

    .modal-body.accretailbd .mapAreaContainer.full-width-map {
        margin-top: 400px;
        width: 344px !important;
        height: 300px !important;
    }

    .modal-body.accretailbd button#btnSaveRetail {
        top: 740px;
        width: 345px;
        transform: none;
    }

    .modal-body.accretailbd {
        height: 100% !important;
    }

    .modal-body.saveaddressaddn .addressContainer .form-container.mb-3 {
        width: 290px !important;
        margin-left: 30px;
    }

    .modal-body.saveaddressaddn .addressContainer input#daAddress {
        width: 240px !important;
    }

    .modal-body.saveaddressaddn .deliveryAddressContainer .btn-selectcity {
        width: 290px !important;
        margin-bottom: 7px;
    }

    .acc_saveadd + .accedtaddress .deliveryAddressContainer .btn {
        margin-top: 480px;
        left: 33%;
    }

    #ModalDialog .packagesnewcrd .almostDoneContainer.payment-height input {
        width: 280px !important;
        margin: 7px auto;
    }

    #ModalContent .without-label-container .form-container input {
        width: 300px !important;
    }

    div#pageModal #ModalDialog .without-label-container .form-container {
        width: 300px !important;
        margin: 0 auto;
    }
    /*.bottom-listfooter .trck{width: 80px;}*/
    .mapAreaContainer {
        width: 400px !important;
        margin: 417px 0 0 2px;
        left: 11px;
        right: 0px;
    }

    #pageModal .packages-body-scroll {
        padding-left: 10px !important;
        width: 400px;
        margin: auto;
    }

    .modal-footer,
    .modal-header,
    .modal-body.add-new-body.accpopcvv,
    .modal-body,
    #pageModal .packages-body-scroll {
        background-color: none !important;
        border: none;
        width: 400px !important;
    }

    li.icodiv.srchglbl img {
        left: 360px !important;
    }

    li.icodiv.srchglbl {
        width: 400px !important;
        margin: 10px 0;
    }

    .mobilemenu {
        display: block;
        z-index: 1000;
        position: fixed;
        /* background: #252b33; */
        /* width: fit-content; */
    }

    .tips span.shipment-title {
        display: block;
        width: 100%;
    }

    .tips .view-all-btn {
        margin-top: 6px;
        margin-right: 274px;
    }

    .shpmcntr .main_cnter.row {
    }
}

@media (min-width: 500px) {
    div#pageModal #ModalDialog .accfooterbtn .btnAddNewCard {
        width: 330px !important;
        margin: auto;
    }

    .retailCenterContainer {
        width: 100%;
    }

    .signupmap .mapAreaContainer #map {
        height: 350px !important;
    }

    .signupmap .mapAreaContainer #daLandmark {
        width: 273px !important;
    }

    .signupmap .mapAreaContainer {
        width: 400px;
        margin: 420px 0 0 12%;
        /* right: inherit; */
    }

    .signupmap .deliveryAddressContainer-add {
        overflow: auto;
    }

        .signupmap .deliveryAddressContainer-add .scroll-hide {
            width: 300px;
            margin: auto;
        }

    .multisteps-form__panel.rounded.js-active button#btnID {
        width: 455px;
        margin: auto;
    }

    .pg_heading {
        margin-bottom: 60px;
    }

    .modal-footer.splitbuttonstocardft button#ship-yourself-btn {
        width: 100% !important;
        margin: auto;
    }

    #ModalDialog .packagesnewcrd .form-container .form-group input#adCVV {
        width: 141px !important;
        margin-left: 3px;
    }

    #ModalDialog .packagesnewcrd .almostDoneContainer #adExpiry {
        width: 155px !important;
    }

    div#pageModal
    #ModalDialog
    .packagesnewcrd
    .form-container + .flex
    .form-group.expiry-container {
        /* background: red; */
        margin-left: -5px;
        width: 186px !important;
    }

    .col-3.summaryRight.mobile {
        float: left;
        position: inherit;
    }

    .letsStartContainer.loginstart input#mNumber {
        width: 323px !important;
    }

    .letsStartContainer.loginstart button#btnMobile {
        width: 45%;
    }

    div#pageModal
    #ModalDialog
    .accpopcvv
    .almostDoneContainer.payment-height
    .form-container + .flex
    .expiry-container {
        margin-left: -5px;
        width: 186px !important;
    }

    .otpContainer.accoptpop {
        margin: 0;
        width: 400px !important;
    }

        .otpContainer.accoptpop .otp-container {
            width: 331px !important;
        }

        .otpContainer.accoptpop input#codeBox1 {
            width: 70px;
            height: 70px;
        }

        .otpContainer.accoptpop input#codeBox2,
        .otpContainer.accoptpop input#codeBox3,
        .otpContainer.accoptpop input#codeBox4 {
            width: 70px;
            height: 70px;
        }

        .otpContainer.accoptpop button#btnValidateOTP {
            width: 357px;
        }

    button#btnSave {
        width: 350px !important;
    }

    div#pageModal #ModalDialog .packagesnewcrd .form-container.expncvvcntr {
        margin: 0 !important;
        width: 330px !important;
        display: block;
    }

    div#pageModal #ModalDialog .accpopcvv .form-container.expncvvcntr {
        margin: 0 !important;
        width: 330px !important;
        display: block;
    }

    div#pageModal #ModalDialog .packagesnewcrd .form-container.expleft {
        float: left;
        width: 150px !important;
        margin: 0;
        /* display: block; */
    }

    div#pageModal #ModalDialog .accpopcvv .form-container.expleft {
        float: left;
        width: 150px !important;
        margin: 0;
        /* display: block; */
    }

    div#pageModal
    #ModalDialog
    .accpopcvv
    .form-container
    .form-group.expiry-container {
        width: 150px !important;
    }

    div#pageModal #ModalDialog .accpopcvv .form-container.cvv-container {
        float: right;
        width: 150px !important;
    }

    #ModalDialog .accpopcvv .form-container .form-group input#adCVV {
        width: 150px !important;
        /* margin: 0; */
        margin-left: 0px !important;
    }

    div#pageModal #ModalDialog .form-group {
        width: 314px !important;
    }

    div#pageModal #ModalDialog .packagesnewcrd .form-container.cvv-container {
        float: right;
        width: 150px !important;
    }

    div#pageModal #ModalDialog input#idnumber {
        width: 360px !important;
    }

    .upidproofcntr .uploadFilesContainer {
        left: 48%;
        width: 345px !important;
    }

    .uploaadbtn#openModalUploadId:hover,
    .uploaadbtn#btnChangePwd:hover {
        text-decoration: none;
    }

    .uploaadbtn#openModalUploadId,
    .uploaadbtn#btnChangePwd {
        background: #fff;
        border-radius: 0px 0px 0;
        display: block;
        margin: 10px 0 0 0 !important;
        font: normal normal 12px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #ffffff;
        padding: 10 !important;
        opacity: 1;
        width: 442px !important;
        padding: 8px 8px 8px 22px !important;
    }

    .name_detailbox2 {
        background: none 0% 0% no-repeat padding-box;
    }

        .name_detailbox2 .idnum {
            background: #fff;
            margin: 10px 0px 15px 0 !important;
            padding: 0px !important;
            width: 442px !important;
            border-radius: 0px 0;
        }

            .name_detailbox2 .idnum label.arabic-right {
                padding-left: 22px !important;
            }

            .name_detailbox2 .idnum span.txt-right {
                padding-left: 20px !important;
            }

        .name_detailbox2 span#span-pwd {
            margin-left: 21px;
        }

    .mobilemenu {
        display: block;
        z-index: 1000;
        position: fixed;
        left: 10%;
        /* width: fit-content; */
    }

    .packmobile .scroll .scroll-hide {
        overflow-x: auto !important;
        max-width: 100%;
    }
}

@media (min-width: 600px) {
    p.shipment-date {
        width: 233px;
    }

    span.shipment-title + .shipment-date {
        width: 200px !important;
    }

    .mobilemenu {
        display: block;
        z-index: 1000;
        position: fixed;
        left: 20%;
        /* width: fit-content; */
    }
}

@media (min-width: 992px) {
    .row.topcontent > .col-lg-6 {
        width: 50%!important;
        flex: 0 0 100%;
        max-width: 50%!important;
    }
}

@media (min-width: 710px) {
    .row.nopadding.plus {
        width: inherit;
        /* clear: both; */
    }
}

@media (min-width: 768px) {
    .plan-container2 {
        /* border-radius: 0px; */
        width: 240px;
    }

    .adminpreferein input {
        display: block !important;
        width: 25px;
        height: 25px;
        position: absolute;
        z-index: 100;
        left: 193px;
        top: 15px;
        opacity: 0;
    }

    [dir="rtl"] .inputcntr input:checked ~ label .checkmark {
        left: 22px;
        top: -5px;
    }

    .dashbdfromto,
    .dashbdfrom {
        top: 80px !important;
    }

    .row.nopadding.plus {
        width: inherit;
        /* clear: both; */
    }

    .search-switch button#btnClear.clearbutton {
        float: left;
        right: 3px !important;
    }

    div#package_selec_msg,
    span#dg-pkg-msg {
        height: auto;
        background: #FFDBDC;
        /* border: 2px solid #952612; */
        border-radius: 0px;
        opacity: 1;
        /*margin-top: -65px;*/
        margin-bottom: 20px;
        font: normal normal normal 12px/normal 'Söhne', 'Open Sans';
        padding: 0 5px;
        width: 70%;
        color: #CD171A;
    }

    [dir="rtl"] span#package_selec_msg {
        text-align: right;
    }

    span#dg-pkg-msg {
        margin-top: -20px !important;
        margin-bottom: 20px !important;
    }

    span.shipself-label.dellabl {
        position: absolute;
        left: 61px;
        top: -9px;
        font: normal normal 14px/19px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
        font: normal normal 300 10px/18px 'Söhne', 'Open Sans';
    }

    button.btn-add-card.hidemobile.paymentaddcard.pull-right {
        width: 178px;
        height: 113px;
        color: #f05133;
        background: #f0513307 0% 0% no-repeat padding-box;
        box-shadow: var(--jak-shadow);
        border: 1px dashed #ee5e43;
        opacity: 1;
        /* margin: -114px 29px; */
        position: absolute;
        /* right: 525px; */
        font: normal normal 65px/18px OpenSans-ight;
        text-align: center;
    }

        button.btn-add-card.hidemobile.paymentaddcard.pull-right span {
            font: normal normal normal 14px/18px 'Söhne', 'Open Sans';
            letter-spacing: 0px;
            color: #ee5e43;
            opacity: 1;
            width: 100%;
            display: block;
            margin-top: 30px;
        }

    button.btn-add-card.hidemobile.paymentaddcard.pull-right {
    }

    .pdtls a#btnview-inspect {
        background: #ffffff52;
        width: 67px;
        left: 270px !important;
    }

    .additonal-options-container.mobilebutns.pdtls {
        width: 100%;
        margin-top: 12px;
        margin-bottom: 10px;
        display: inline-block;
    }

    .modal-header.pb-0.accretailhd {
        width: auto !important;
    }

    .footerad {
        width: 100% !important;
    }

    .filter-modal-footer {
        width: 100% !important;
    }

    #filterModalContent .shrbody {
        width: 100% !important;
    }

    .modal-header.shrhdr,
    #filterModalContent,
    .modal-footer.shrftr {
        width: 100% !important;
        margin: auto;
    }

    span.from-to-pointer {
        display: inline-block;
    }

    p.selected-city {
        width: 100%;
        display: inline-block;
        padding: 0 44px 3px !important;
        margin-bottom: 3px;
    }

    .ship-box > div {
        padding: 4px 43px 0 !important;
    }

    .ship-cal-header,
    .modal-footer.ship-cal-footer {
        width: 500px !important;
    }

    .shpmcntr span.shipment-title {
        margin-bottom: 3px;
        margin-top: 1px;
        display: block;
        text-transform: capitalize;
        width: 156px !important;
        float: left;
        text-align: left;
    }

    .modal-header.pb-0.accpswdhd,
    .modal-body.accpswdbdy {
        width: 100% !important;
        margin: auto;
    }

    .modal-body.accpswdbdy .btn {
        width: 100% !important;
        margin: auto;
    }

    .retailCenterContainer.dfgfg {
        padding: 0!important;
    }

    a.btnview-photos {
        left: 225px !important;
    }

    .modal-header.upidproofcntrhd,
    .modal-body.upidproofcntr {
        width: 100% !important;
        margin: auto !important;
    }

    .upidproofcntr .form-group input {
        width: 100% !important;
    }

    .uploadidbtn button#btnSave {
        width: 100% !important;
    }

    /* .accretailbd .addressContainer {
        width: 48% !important;
    } */

    .modal-body.accretailbd .mapAreaContainer.full-width-map {
        width: 48% !important;
    }

    .modal-header.pb-0.accretailhd button.close {
        left: 89% !important;
    }

    .modal-body.accretailbd .rcenterhead {
        padding-top: 10px !important;
    }

    .modal-body.accretailbd .curentcity span {
        padding-top: 0px;
        width: 65%;
    }

    .modal-body.accretailbd .addressContainer .curentcity {
        width: 100% !important;
        /* background: red; */
    }

    .modal-body.accretailbd input#rtSearch {
        width: 221px !important;
    }

        .modal-body.accretailbd input#rtSearch + span.password-icon {
            right: 0.5rem;
            top: 138px;
            position: absolute;
        }

    .modal-body.accretailbd .scroll-hide {
        margint: 22px;
        top: 12px;
        width: 223px;
    }

    .modal-body.accretailbd .mapAreaContainer.full-width-map {
        margin-top: 400px;
        width: 48% !important;
        height: 471px !important;
    }

    .modal-body.accretailbd button#btnSaveRetail {
        top: 460px;
        width: 227px;
        transform: none;
        left: inherit;
    }

    .modal-body.accretailbd {
        height: 500px !important;
    }

    .otpContainer.accoptpop .otp-container {
        width: 398px !important;
    }

    div#pageModal
    #ModalDialog
    .modal-body.saveaddressaddn
    .addressContainer
    .form-container.mb-3 {
        width: 230px !important;
        margin-left: 0px;
    }

    .modal-body.saveaddressaddn .deliveryAddressContainer .btn {
        left: 118px;
        width: 290px;
        margin: 332px 0 0 0;
        bottom: inherit;
    }

    .modal-body.saveaddressaddn .mapAreaContainer.full-width-map {
        width: 48% !important;
        margin: 0;
        left: inherit;
        height: 79% !important;
        top: 10px !important;
        right: 0px;
    }

    .acc_saveadd + .accedtaddress .mapAreaContainer.full-width-map {
        width: 48% !important;
        margin: 0;
        left: inherit;
        height: 79% !important;
        top: 10px !important;
        right: 0px;
    }

    .accedtaddress .addressContainer {
        padding: 0 0px;
        display: block;
        width: 48%;
        height: 75%;
        left: 0;
    }

    .acc_saveadd + .accedtaddress .form-container button#btncCodecity {
        width: 250px;
    }

    div#pageModal #ModalDialog .form-container .accedtaddress {
        width: 248px !important;
    }

    div#pageModal #ModalDialog .acc_saveadd + .accedtaddress .form-container {
        width: 208px !important;
        margin: 0;
    }

    .acc_saveadd + .accedtaddress .form-container input#daAddress,
    .acc_saveadd + .accedtaddress .form-container input#daDistrict,
    .acc_saveadd + .accedtaddress .form-container input#daAdditionalInfo {
        width: 250px !important;
    }

    .accedtaddress .curentcity span {
        width: 57%;
    }

    .acc_saveadd + .accedtaddress .deliveryAddressContainer .btn {
        margin-top: 0px;
        left: 50%;
    }

    div#pageModal #ModalDialog .upidproofcntr .form-container,
    div#pageModal #ModalDialog .upidproofcntr input#idnumber {
        width: 460px !important;
    }

    .upidproofcntr .uploadFilesContainer {
        left: 50%;
        width: 460px !important;
    }

    .backitemtourslef .shipbkursf {
        width: 340px !important;
    }

    .shpBkaddcntr + .col-lg-3.col-xs-12.mb-3 {
        width: 240px;
        padding: 0;
    }

    span.shipment-title.intro {
        display: block !important;
    }

    .showonlymobile {
        display: none;
    }

    .mobilemen {
        display: none;
        width: 70px;
    }

    div#ModalContent .shiprocesspophd,
    div#ModalContent .shiprocesspopbd {
        width: 491px !important;
    }

    div#ModalContent .shiprocesspopft {
        width: 491px !important;
        display: inline-block;
    }

    .product-elecntr.inspectmobile .bottom-btn-inline {
        display: block;
        width: 242px;
        padding: 5px;
        float: inherit;
        text-align: center;
        margin: 0 auto;
    }

    .tipsmobile {
        display: flex;
    }

    .modal-footer,
    .modal-header,
    .modal-body,
    .modal-body.add-new-body.accpopcvv.pt-2 {
        background-color: var(--background-primary) !important;
        border: none;
        width: 100% !important;
    }

    .with-label-header,
    .with-label-footer {
        width: 100% !important;
        margin: auto;
    }

    .splitbuttonstocard,
    .splitbuttonstocardbd,
    .splitbuttonstocardbd {
        width: 400px !important;
    }

    .tblsdtlstxt {
        display: block; /* width:33%; */ /* float:left; */
    }

    .bottom-bn.body-font.body-font-p {
        width: 50%;
        float: left;
    }

    .acc_saveadd + .accedtaddress {
        width: auto !important;
    }

    .navbar-expand-lg .navbar-nav {
        flex-direction: column;
        height: 500px;
        left: -34%;
        display: block;
        position: absolute;
        top: 91px;
    }

    .mobilefilter {
    }

    .packbg .scroll .scroll-hide::-webkit-scrollbar {
        width: 0.4rem;
        height: 0.2rem;
    }

    .calseprater {
        width: 22px;
        margin: 29px 23px !important;
    }

    button#btncCodeshippingFrom,
    #btncCodeshippingTo {
        font-size: 14px !important;
        width: 100% !important;
    }

    .accountbg {
        margin: 0 !important;
    }

    .packbg.prfretailcenter {
        margin-top: 0px !important;
    }

    span.pro_head:before {
        display: block !important;
    }

    .name_detailbox2 {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        display: inline-block;
        width: 443px;
        height: auto;
        margin-left: 0px;
        /* margin-top: 10px; */
    }

    .name_detailbox {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        display: inline-block;
        width: 443px;
        height: 241px;
        padding: 22px;
        margin-left: 15px;
    }

    .name_detailbox2 .idnum {
        background: #fff;
        margin: 0px 0px 15px 0 !important;
        padding: 0 0 0 23px !important;
        width: 417px !important;
        border-radius: 0px 0;
        overflow: hidden;
    }

    .cntryadd {
        margin-top: 0px !important;
    }

    .packmobile .scroll .scroll-hide {
        overflow-x: auto !important;
        max-width: 100%;
    }

    .packbg {
        margin-top: 0px !important;
    }

    .hidemobile {
        display: block;
    }

    .col-md-6.tips.pr-0 {
        margin-bottom: 0px;
        top: 90px;
    }

    .up_voice_cntr {
        margin-top:0 !important;
    }

    .shpmcntr .shipcalc .row .col {
        padding: inherit !important;
    }

    .shpmcntr .shipcalc .row .col-md-1 {
        display: block !important;
    }

    .shpmcntr .shipcalc .row .col-md-1 {
        padding: block !important;
    }

    .col-md-12.shipcalc .col-md-1 {
        display: block;
    }

    .col-md-12.addressview.item .col-md-4 {
        width: fit-content;
    }

    .packaddress .bb,
    .packaddress .aa {
        display: block;
    }

    .col-md-6.shimentcntr.pr-0,
    .col-md-6.shpmcntr.pr-0,
    .col-md-6.tips.pr-0 {
        padding: 0px !important;
    }

    li.icodiv:last-child {
        display: flex !important;
        border: none;
    }

    li#accountlistview:after {
        content: "";
        display: block;
        margin: 9px -15px 29px -4px;
        width: 18px;
        height: 20px;
        border-top: 1px solid #fffbfb;
        border-left: 1px solid #fffefe;
        transform: rotate(90deg);
        position: absolute;
        right: 16px;
        top: -2px;
    }

    li.icodiv.chkLangMain {
        display: block !important;
        border: 1px solid var(--jak-light-gray);
    }

    li#notification {
        position: inherit;
        right: 0;
        top: inherit;
        display: block;
        border: 1px solid var(--jak-light-gray);
    }

    li.icodiv.srchglbl {
        width: 380px;
        margin: 0px 12px;
    }

        li.icodiv.srchglbl img {
            left: 187px !important;
            width: 19px;
            height: 19px;
            top: 19px !important;
        }

    .flex.user-greet.col-12 {
        display: flex;
    }

    li.icodiv.chkLangMain {
        display: block;
        border: 1px solid var(--jak-light-gray);
    }

    a.text-right.view-all-btn {
        position: inherit;
        top: unset;
        right: 0;
    }

    .s2dcntr {
        max-width: 1280px !important;
        position: relative;
    }

    .mobilemenu {
        display: none;
    }

    header {
        display: block;
        max-width: 160px !important;
        float: left;
        height: 100vh;
        padding: 9px 9px;
    }

    a.utdel.clspack-status.ready-to-send-btn {
        font: normal normal bold 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #338625;
        opacity: 1;
        padding: 0 8px;
        height: 18px;
        display: block;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .sumrysubhd {
        margin-top: 26px;
        font: normal normal normal 14px/18px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .summaryRight h6.package-heading {
        margin-top: 0;
    }

    .bottom-listfooter button.detail-btn.btnpack-detail,
    .bottom-listfooter .detail-btn.btnship-detail {
        font: normal normal 500 12px/20px 'Söhne Kräftig', 'Open Sans';
        width: 100px;
        height: 32px;
        position: absolute;
        bottom: 9px;
    }

    .s2d-navbar.nav_new {
        padding: 10px 0;
        margin: 5px 0 0 0;
        background: var(--jak-blue-color);
        border: none;
        opacity: 1;
        height: 775px;
        align-items: flex-start;
    }

    .container.main_contorellar {
        flex-direction: column;
        height: 778px;
    }

    a.nav-link.s2d-nav-link.active-label {
        font: normal normal 700 14px/20px 'Söhne', 'Open Sans' !important;
    }

    .s2d-navbar.nav_new .navbar-nav .s2d-nav-link {
        text-align: center;
        font: normal normal 14px/20px 'Söhne Halbfett', 'Open Sans';
        letter-spacing: 0px;
         color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
        margin-bottom: 17px;
    }

    .container.right {
        max-width: 87% !important;
        float: right;
    }

    .packagecnter span.shipment-title {
        font: normal normal 300 12px/24px 'Söhne', 'Open Sans';
    }

    #user-name {
        font: normal normal 400 22px/43px 'Söhne Buch', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin: 0;
    }

    .row.topcontent {
        margin-top: 23px;
    }

    label.sectionheading {
        width: 100%;
        font: normal normal 20px/31px 'Söhne Kräftig', 'Open Sans';
        font-weight: 500;
        text-align: left;
        line-height: 40px;
        align-items: center;
        padding-left: 13px;
        margin-bottom: 3px;
        color: #000;
    }

    .packagecnter {
        background: #ffffff;
        border: none;
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        /* display: flex; */
        margin: 0px;
        height: 212px;
    }

    .sectionheading span {
        display: flex;
        position: relative;
        right: auto;
        float: right;
        top: -9px;
    }

    .arrowtop {
        margin: 19px 7px 0px;
        text-align: center !important;
        width: 18px;
        height: 18px;
    }

    .arrowbtm {
        display: block;
        margin: 21px 7px 0px;
        text-align: center !important;
    }

        .arrowbtm img {
            width: 25px;
            height: 25px;
            width: 18px;
            height: 18px;
            transform: rotate(180deg);
        }

    .packagecnter .item {
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        padding: 13px;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        height: 130px;
        box-shadow: var(--jak-shadow);
    }

    .header_Pack {
        padding: 0 0 9px 0;
        margin: 0;
        border-bottom: 1px solid;
        display: inline-block;
        width: 100%;
        border-bottom: 1px solid var(--jak-light-gray);
    }

        .header_Pack .packname {
            display: grid;
            float: left;
            text-align: left;
        }

    .packname.btmvalue span + span {
        font: italic normal normal 12px/17px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
    }

    .packname.btmvalue span {
        font: normal normal 600 12px/17px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
    }

    .packagecnter .item .header .row.box {
        padding: 0px 0px 0px 15px;
    }

    .btnsright a.utdel.shipped-btn {
        opacity: 1;
        color: var(--unnamed-color-f7fafc);
        text-align: right;
        text-align: right;
        font: normal normal 10px/19px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        opacity: 1;
        margin-right: 8px;
        border-radius: 0px;
        opacity: 1;
        padding: 0 8px;
        display: inline-block;
        height: auto;
    }

    .packagecnter .item .row.box {
        padding: 0px 0px 0px 15px;
    }

    .box .detail-btn.btnpack-detail {
        background: none;
        font: normal 500 12px/normal 'Söhne Kräftig', 'Open Sans';
        letter-spacing: normal;
         color: var(--jak-blue-color);
        opacity: 1;
        bottom: 22px;
        white-space: nowrap;
    }

    .backeff {
        background: red;
        height: 20px;
        position: relative;
        z-index: 100;
        width: 94%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
        display: block;
    }

    .backeff2 {
        background: #00ff5a;
        height: 21px;
        display: block;
        position: relative;
        z-index: 0;
        margin-top: -10px;
        width: 92%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    .btnTrack-now,
    .btnsright a.utdel {
        font: normal normal 600 12px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        text-transform: capitalize;
        opacity: 1;
        cursor: pointer;
    }

    .row.track_content {
        padding: 0px 0px 0px 15px;
    }

    .headbox {
        width: 100%;
        text-align: left;
        line-height: 40px;
        align-items: center;
        padding-left: 13px;
    }

    .arrowtop img {
        width: 18px;
        height: 18px;
        transform: rotate(0deg);
    }

    .shpmcntr .main_cnter.row {
        background: #fff;
        /* border: 1px solid var(--jak-light-gray); */
        border-radius: 0px;
        opacity: 1;
        padding: 15px;
        position: relative;
        margin: 0px;
        min-height: 292px;
    }

    .col-md-12.shipcalc {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        padding: 0px;
    }

    .up_voice_cntr {
        margin-top:0 !important;
    }

    span.shipment-content {
        text-align: left;
        font: normal 300 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        opacity: 1;
        width: 100%;
        display: block;
    }

    span.shipment-cntnt {
        text-align: left;
        font: normal 300 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #fb7054;
        opacity: 1;
        width: 100%;
        display: block;
    }

    label.sectionheading.headbox > img {
        margin-top: -2px;
    }

    .up_voice_cntr {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        margin: 14px 0 0 0 !important;
    }

    .uploadinvoice span.shipment-title {
        float: left;
        font: normal normal 600 16px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #f7fafc;
        text-transform: capitalize;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    span.shipment-title-content {
        float: left;
        font: normal normal 600 16px/22px 'Söhne', 'Open Sans' !important;
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    span.shipment-btn {
        font: normal normal 600 12px/31px 'Söhne', 'Open Sans' !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
    }

    span.shipment-mbtn img,
    span.shipment-btn {
        margin-top: -3px;
    }

    .tips .main_cnter.row {
        margin: 0px;
        height: 71px;
        margin-top: 10px;
        position: relative;
        background: #fff;
        border: 1px solid #293341;
        border-radius: 0px;
    }

    .tips span.shipment-title1 {
        display: block;
        width: 80%;
        text-align: left;
        font: normal normal 300 12px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
    }

    .tips .view-all-btn {
        margin-top: 4px;
        margin-right: -38px;
    }

    .tips span.shipment-title {
        display: block;
        width: 80%;
        text-align: left;
        font: normal normal 12px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
    }

    .tips .col-md-12.content-cntr {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        padding: 0px;
        background: #fff;
    }

    .col-md-12.uploadinvoice {
        border-radius: 0;
        opacity: 1;
        margin: 0;
        height: 71px !important;
        position: relative;
        z-index: 333;
        background: #fff;
        padding: 14px;
        border: 2px dashed var(--jak-blue-color);
    }

    .shipview.item a.text-right.view-all-btn {
        display: block;
        margin: 15px auto 0;
        text-align: center !important;
        color: white;
    }

    .packaddress .main_cnter.row {
        border-radius: 0px;
        opacity: 1;
         padding: 10px;
        position: relative;
        margin: 0px;
    }

    .userflnm .acc_usrname {
        text-align: left;
        font: normal normal 16px/22px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .col-md-12.addressview.item.show {
        padding: 12px;
        position: relative;
        z-index: 333;
        background: #1d2b4a 0% 0% no-repeat padding-box;
        box-shadow: var(--jak-shadow);
        border: 1px solid #283991;
        border-radius: 0px;
        opacity: 1;
        margin: 0px;
        height: 175px;
    }

    span.cntry-code {
        font: normal normal 600 12px/17px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        text-align: left;
        font: normal normal 600 14px/18px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .row.address_content {
        margin: 2px 0 8px -13px;
    }

    .addressview .address_content p {
        font: normal normal normal 14px/19px 'Söhne', 'Open Sans' !important;
    }

    .addressview .row span {
        font: normal normal normal 12px/16px 'Söhne', 'Open Sans' !important;
        float: left;
    }

    p.shipment-date {
        font: normal normal normal 14px/20px 'Söhne', 'Open Sans' !important;
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin-top: 0px;
        white-space: nowrap;
        width: 158px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .consolidate {
        margin-top: 56px !important;
    }

        .consolidate .main_cnter.row {
            margin: 0px;
            background: #fff;
            border: 1px solid #293341;
            border-radius: 0px;
            opacity: 1;
            position: relative;
            margin: 0px;
        }

        .consolidate .col-md-12 {
            border-radius: 0px;
            opacity: 1;
            position: relative;
            z-index: 333;
            margin: 0;
            padding: 13px;
            height: 70px;
        }

    span.shipment-titletp {
        float: left;
        font: normal normal 16px/22px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        text-transform: capitalize;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    .col-md-12.col-xs-12.tipshd {
        font: normal normal 600 13px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        padding: 0;
    }

    p.shipment-date.mt-3.cpylink {
        font: normal normal 12px/15px Montserrat-r !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
        margin-left: 23px;
    }

    p.shipment-date.mt-3.clicked {
        animation: buttonAnimation 0.5s ease-in-out;
   }

    .btnsright1 a.utdel.clspack-status {
        font: normal normal 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #338625;
        opacity: 1;
        height: auto;
        margin-top: 6px;
    }

    .col4.packpopupitemcard:nth-child(odd) .font-data.card-header {
        background: var(--jak-green-color);
    }

    .col4.packpopupitemcard:nth-child(even) .font-data.card-header {
        background: var(--jak-green-color);
    }

    #ModalContent h6#packages-title + .card .card-header button {
        background: #00000047 0% 0% no-repeat padding-box;
        height: 18px;
        margin-top: 5px;
    }

    .customer_crdnumbr span.cardN.card-number {
        font: normal normal 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0.7px;
        color: #ffffff;
        opacity: 1;
    }

    span.shipment-mbtn {
        font: normal normal 600 12px/31px 'Söhne', 'Open Sans' !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
    }

    .addressview span.cntry-code {
        letter-spacing: 0px;
        color: #000;
        text-align: left;
        font: normal normal 500 14px/18px 'Söhne Kräftig', 'Open Sans';
        letter-spacing: 0px;
       color: #000;
        opacity: 1;
    }

    span.aa1 {
        display: block;
        height: 20px;
        position: relative;
        z-index: 100;
        width: 94%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    span.bb2 {
        display: block;
        height: 21px;
        position: relative;
        z-index: 0;
        margin-top: -10px;
        width: 92%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    .shimentcntr .main_cnter.row {
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        margin: 0px;
        height: 212px;
    }

    .shipviewcntr {
        padding: 13px 13px 0px 13px;
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        box-shadow: var(--jak-shadow);
    }

    .modal-lgg,
    .modal-xl {
        max-width: 800px;
    }

    .row.topcontent > .col-md-6 {
        width: 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .container.right {
        max-width: 81% !important;
        float: right;
        margin-right: 7px;
        padding-bottom: 0;
    }

    .container.right.paymentContainer {
        max-width: 96%!important;   
    }

    .retailCenterContainer.dfgfg .mapAreaContainer.full-width-map {
        margin: 0px !important;
        height: 80% !important;
        top: -11px !important;
        left: inherit;
    }

    input#input-listSrch {
        width: 200px;
    }

    li.icodiv.srchglbl {
        width: 213px !important;
        margin: 0px 12px;
        display: block;
    }

    .newlstcntr .dtlsvalues:after {
        content: "";
        width: 1px;
        height: 17px;
        background: #404855;
        display: inline-block;
        margin-top: -23px;
        position: absolute;
        margin-left: -51px !important;
    }

    div#divList.newlistcrd > div {
        padding-right: 0;
        max-width: 100%;
        flex: 0 0 100%;
    }

    .navbar-light .navbar-toggler {
        display: none;
    }

    .packbg .bottom-listfooter .bottom-btn:nth-child(2) {
        margin-left: 46px;
        width: 156px;
    }

        .packbg .bottom-listfooter .bottom-btn:nth-child(2) div {
            font: normal normal 600 10px/22px 'Söhne', 'Open Sans';
        }

    .col-3.summaryRight.mobile {
        float: left;
        position: inherit;
        max-width: 367px;
    }

    .summeryleft.mobile {
        float: left;
    }

    .col-.mb-3.product-elecntr {
        width: 580px;
    }

    #btnAddCard.hidemobile {
        display: block;
    }

    .newlstcntr + .bottom-listfooter .downld.uploadpackageInvocie {
        font: normal normal 600 10px/24px 'Söhne', 'Open Sans';
    }

    .bottom-listfooter .trck {
        width: 116px;
    }

    button#btnAddCard.mobile {
        width: 360px;
    }

    div#div-process-pack {
        display: inline-block;
        /*margin-right: -130px;*/
        width: 353px;
        float: right;
    }

    [dir="rtl"] #page-content-wrapper {
        right: 0;
        margin-top: 121px !important;
    }
}

@media (min-width: 992px) {
    [dir="rtl"] #page-content-wrapper {
        right: 0;
        margin-top: 68px !important;
    }

    div#package_selec_msg,
    span#dg-pkg-msg {
        height: auto;
        background: #FFDBDC;
        /* border: 2px solid #952612; */
        border-radius: 0px;
        opacity: 1;
        /*margin-top: -65px;*/
        margin-bottom: 20px;
        font: normal normal normal 12px/normal 'Söhne', 'Open Sans';
        padding: 0 5px;
        width: 70%;
        color: #CD171A;
    }

    [dir="rtl"] span#package_selec_msg {
        text-align: right;
    }

    div#div-process-pack {
        display: inherit;
        margin-right: 0;
        float: right;
    }

    #ModalContent
    .modal-body.saveaddressaddn
    .deliveryAddressContainer
    .btn-selectcity {
        width: 310px !important;
        margin-bottom: 7px;
    }

    div#pageModal
    #ModalDialog
    .modal-body.saveaddressaddn
    .addressContainer
    .form-container.mb-3 {
        width: 230px !important;
        margin-left: 0px;
    }

    .saveaddressaddn .deliveryAddressContainer {
        width: 95%;
        padding: 0 20px !important;
    }

    div#pageModal
    #ModalDialog
    .modal-body.saveaddressaddn
    .addressContainer
    .form-container.mb-3 {
        width: 270px !important;
        margin-left: 0px;
    }

    .modal-content
    #ModalContent
    .modal-body.saveaddressaddn
    .addressContainer
    input#daAddress {
        width: 310px !important;
    }

    .modal-content
    .modal-body.saveaddressaddn
    .addressContainer
    input#daDistrict {
        width: 310px !important;
    }

    .modal-content
    .modal-body.saveaddressaddn
    .addressContainer
    input#daAdditionalInfo {
        width: 310px !important;
    }

    .modal-content .modal-body.saveaddressaddn .deliveryAddressContainer .btn {
        left: 157px;
        width: 310px;
        right: inherit !important;
    }

    .accedtaddress .deliveryAddressContainer {
        width: 95%;
        padding: 0 20px !important;
    }

    .acc_saveadd + .accedtaddress .form-container button#btncCodecity {
        width: 320px;
    }

    .acc_saveadd + .accedtaddress .form-container input#daAddress,
    .acc_saveadd + .accedtaddress .form-container input#daDistrict,
    .acc_saveadd + .accedtaddress .form-container input#daAdditionalInfo {
        width: 320px !important;
    }

    div#pageModal #ModalDialog .acc_saveadd + .accedtaddress .form-container {
        width: 270px !important;
        margin: 0;
    }

    .acc_saveadd + .accedtaddress .deliveryAddressContainer .btn {
        margin-top: 0px;
        left: 25%;
    }

    .acc_saveadd + .accedtaddress .deliveryAddressContainer .btn {
        margin-top: 0 px;
        left: 31%;
        width: 320px;
    }

    .accedtaddress .curentcity span {
        width: 68%;
    }

    .backitemtourslef .shipbkursf {
        width: 320px !important;
    }

    div#pageModal #ModalDialog .without-label-container .form-container {
        width: 280px !important;
        margin: 0 auto;
    }

    #ModalContent .without-label-container .form-container input {
        width: 280px !important;
    }

    .footer.uploadCenter.pb-2.bbr-8.with-label-footer {
        width: 420px !important;
    }

    .modal-body.add-new-body.accpopcvv.pt-2 {
        width: 100% !important;
    }

    .tipstrikpop {
        width: 490px;
    }

    .col-12.dtlsvalues.list .ml-2 {
        display: contents;
    }

    button#btnAddCard.mobile {
        display: block;
    }

    .product-elecntr .card-body.nopadding {
        background: red;
        background: transparent linear-gradient(78deg, #0e502c 0%, #1cb15f 100%) 0% 0% no-repeat padding-box;
        height: 80px;
    }

    .product-elecntr .bottom-btn {
        display: block;
        width: 128px;
        padding: 0;
        margin-top: -50px;
        float: left;
        margin: -50px auto 0;
    }

    .product-elecntr .pack-img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 128px;
    }

    .bottom-listfooter .trck {
        width: 116px;
    }

    .tblsdtlstxt {
        display: flex;
        justify-content: space-between;
    }

    .bottom-bn.body-font.body-font-p {
        width: auto;
        float: inherit;
    }

    .navbar-expand-lg .navbar-nav {
        flex-direction: column;
        height: 500px;
        left: -22% !important;
        display: block;
        position: absolute;
        top: 91px;
    }

    .row.ship-dt-lst {
        width: auto;
    }

    .col-12.dtlsvalues.list {
        display: flex;
    }
}

.col-12.body-font.body-font-p.card-header.avdphoto h3.f-right.label {
    text-align: left;
}

    .col-12.body-font.body-font-p.card-header.avdphoto h3.f-right.label sup {
        letter-spacing: 0;
    }

button.btnTrack-now {
    background: none;
    border: none;
    font: normal normal 600 10px/20px 'Söhne', 'Open Sans' !important;
}

#toast-container > .toast.toast-error,
#toast-container > .toast.toast-success {
    background-image: none !important;
    padding: 15px;
    cursor: default;
}

.toast-error button.toast-close-button,
.toast-success button.toast-close-button {
    font: normal normal bold 12px/20px 'Söhne', 'Open Sans' !important;
    text-shadow: none;
    color: #fff;
    opacity: 1;
    font: normal normal bold 12px/20px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: #ffffff;
    opacity: 1;
    top: 48%;
    text-transform: capitalize;
}

@media only screen and (min-width: 1024px) {
    .modal-body.accretailbd input#rtSearch.search-container {
        width: 322px;
        margin-top: 127px;
    }
}

@media (min-width: 1280px) {
    main .signInPopup {
        /*height: 100vh;*/
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .lestsstartt .backgroundContainer {
        display: flex !important;
    }

    .lestsstartt .letsStartContainer {
        width: 600px;
    }

        .lestsstartt .letsStartContainer .note {
            transform: none !important;
            left: inherit;
        }

    span.shipment-title + .shipment-date {
        width: 150px !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-weight: 600;
        color: #000;
    }

    .almostDoneContainer
    .form-container + .flex
    .form-container.cvv-container
    .form-group {
        margin-left: 0px;
    }

    .card-body.retailcnter span.kilim.float-left {
        /* left: 0; */
        left: 57px;
    }

    span.kilim.float-left {
        position: relative;
        left: -86px;
        top: 6px;
        font: normal normal 14px/19px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
        /* word-break: break-all; */
        display: flow-root;
        width: 147px;
    }

    .otpContainer .otp-container.test {
        width: 31rem;
    }

    .finalStepContainer .message {
        margin-top: 8px !important;
        /* width: 31rem; */
    }
   
    .apply .message {
        margin-top: 8px !important;
        width: 31rem;
    }

    .otpContainer .otp-container.test {
        display: flex;
        justify-content: space-evenly;
        margin: 7rem 0 2rem;
        width: 31rem;
    }

    .uploadFilesContainer {
        width: 460px !important;
    }

    .otp-container .otpInput {
        width: 100px !important;
        height: 100px !important;
    }

    .modal-body.saveaddressaddn .addressContainer {
        padding: 0 45px;
        display: block;
        width: 41%;
        height: 75%;
    }

    div#pageModal
    #ModalDialog
    .modal-body.saveaddressaddn
    .addressContainer
    .form-container.mb-3 {
        width: 460px !important;
        margin-left: 0px;
        margin: 0 auto;
    }

    .modal-body.saveaddressaddn
    .addressContainer
    .form-container.mb-3
    #btncCodecity {
        width: 345px !important;
    }

    .modal-content
    #ModalContent
    .modal-body.saveaddressaddn
    .addressContainer
    input#daAddress {
        width: 345px !important;
    }

    .modal-content
    .modal-body.saveaddressaddn
    .addressContainer
    input#daDistrict {
        width: 345px !important;
    }

    .modal-content
    .modal-body.saveaddressaddn
    .addressContainer
    input#daAdditionalInfo {
        width: 345px !important;
    }

    .modal-content .modal-body.saveaddressaddn .deliveryAddressContainer .btn {
        left: 202px;
        width: 345px;
        right: inherit !important;
    }

    .accedtaddress .addressContainer {
        padding: 0 0px;
        display: block;
        width: 41%;
        height: 75%;
        left: 0;
    }

    .accedtaddress .deliveryAddressContainer {
        width: 99%;
        padding: 0 20px !important;
    }

    #ModalContent .without-label-container .form-container input {
        width: 390px !important;
    }

    .modal-body.without-label-container
    .form-container
    .form-group
    input#daDistrict {
        width: 390px !important;
    }

    .footer.uploadCenter.pb-2.bbr-8.with-label-footer {
        width: 100% !important;
    }

    div#pageModal #ModalDialog .without-label-container .form-container {
        width: 390px !important;
        margin: 0 auto;
    }

    .multisteps-form__panel.rounded.js-active button#btnID {
        width: 460px;
    }

    .ViewRequestPhotos .product-elecntr .card-body.nopadding.imgreq {
        width: 784px !important;
        margin-top: 0px;
        text-align: left;
    }

    .card-body.nopadding.insptreport {
        width: 784px !important;
        margin-top: 0px;
        text-align: left;
        background: #292f38 0% 0% no-repeat padding-box;
        /* opacity: 0.8; */
        font: normal normal normal 13px/18px 'Söhne', 'Open Sans';
    }

    .pg_heading {
        margin: 33px 0px 18px 0px;
    }

    .letsStartContainer.loginstart input#mNumber {
        width: 330px !important;
    }

    .letsStartContainer.loginstart button#btnMobile {
        width: 460px;
        margin-left: 3px !important;
    }

    .mobilefilter button#btnModalFilter.webhide {
        display: none;
        float: right;
        right: 0;
    }

    div#pageModal
    #ModalDialog
    .almostDoneContainer.payment-height
    .form-container + .flex
    .form-container {
        width: 144px !important;
        float: left;
        margin: 0;
    }

    div#pageModal
    #ModalDialog
    .accpopcvv
    .almostDoneContainer.payment-height
    .form-container + .flex
    .expiry-container {
        margin-left: 0px;
        width: 168px !important;
    }

    div#pageModal
    #ModalDialog
    .almostDoneContainer.payment-height
    .form-container {
        width: 330px !important;
    }

        div#pageModal
        #ModalDialog
        .almostDoneContainer.payment-height
        .form-container.cvv-container {
            float: right;
            width: 150px !important;
            margin: 0;
            left: 0rem;
        }

        div#pageModal
        #ModalDialog
        .almostDoneContainer.payment-height
        .form-container.expleft {
            float: left;
            width: 150px !important;
            margin: 0;
        }

        div#pageModal
        #ModalDialog
        .almostDoneContainer.payment-height
        .form-container.expncvvcntr {
            margin: 0 !important;
            width: 330px !important;
            display: block;
        }

    div#pageModal
    #ModalDialog
    .accpopcvv
    .almostDoneContainer.payment-height
    .form-container
    .form-group.expiry-container {
        /* width: 148px!important; */
        margin-left: 0px;
    }

    div#pageModal
    #ModalDialog
    .almostDoneContainer.payment-height
    .form-container
    .form-group.expiry-container {
        width: 168px !important;
    }

    div#pageModal
    #ModalDialog
    .almostDoneContainer.payment-height
    .form-container + .flex
    .form-container.cvv-container {
        width: 164px !important;
        margin-left: 24px;
    }

    .otpContainer.accoptpop {
        margin: 0;
        width: 600px !important;
    }

        .otpContainer.accoptpop .otp-container {
            width: 31rem !important;
        }

        .otpContainer.accoptpop input#codeBox1 {
            width: 100px;
            height: 100px;
        }

        .otpContainer.accoptpop input#codeBox2,
        .otpContainer.accoptpop input#codeBox3,
        .otpContainer.accoptpop input#codeBox4 {
            width: 100px;
            height: 100px;
        }

        .otpContainer.accoptpop button#btnValidateOTP {
            width: 460px;
        }

    button#btnSave.submitidprf {
        width: 460px !important;
    }

    div#pageModal #ModalDialog input#idnumber {
        width: 460px !important;
    }

    .name_detailbox2 .idnum label.arabic-right {
        padding-left: 0px !important;
    }

    .name_detailbox2 .idnum span.txt-right {
        padding-left: 0px !important;
    }

    .uploaadbtn#openModalUploadId,
    .uploaadbtn#btnChangePwd {
        width: 297px !important;
        margin: 12px -12px -12px -12px !important;
        padding: 8px 8px 8px 12px !important;
    }

    .name_detailbox2 span#span-pwd {
        margin-left: 0px !important;
    }

    .dashbdfromto {
        display: block;
        width: 100%;
        box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 0px;
        position: absolute;
        background: #15191f;
        width: 238px !important;
    }

    .dashbdfrom {
        display: block;
        width: 100%;
        box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 0px;
        position: absolute;
        background: #15191f;
        width: 230px !important;
    }

    .letsStartContainer.auditfromcntr a.account-label.chkLangMain img {
        width: 20px;
        margin-top: 3px;
    }

    .letsStartContainer.auditfromcntr .form-container {
        width: 460px;
    }

    .letsStartContainer.auditfromcntr input#txtpassword {
        width: 420px;
    }

    .form-feild.sgnin.auditpho.form-container {
        width: 340px !important;
    }

    .lang-select.audit1 img.auditlogdrpdn {
        width: 16px !important;
    }

    h3.label.pgsignlabel {
        margin-top: 30px;
        margin-bottom: 22px;
        font: normal normal 600 20px / 36px 'Söhne Kräftig', 'Open Sans';
    }

    .lang-select.audit1 img {
        width: 26px !important;
    }

    .name_detailbox {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        display: inline-block;
        width: 443px;
        height: 240px;
        padding: 22px;
        margin-left: 15px;
    }

    .name_detailbox2 {
        /* background: #fff; */
        border-radius: 0px;
        opacity: 1;
        display: inline-block;
        width: 443px;
        height: auto;
        margin-left: 15px;
    }

    .accountpophd + div button#btncCodecity li img {
        right: -87px !important;
    }

    .saveaddressaddn .deliveryAddressContainer {
        width: 986px;
        padding: 0 0px !important;
    }

    #ModalContent .modal-body.saveaddressaddn .mapAreaContainer.full-width-map {
        width: 53% !important;
        height: 443px !important;
        margin-top: 21px !important;
        left: inherit;
        right: 48px;
    }

    .modal-body.saveaddressaddn .addressContainer .form-container.mb-3 {
        width: 300px !important;
        margin-left: 0px;
    }

    .modal-body.saveaddressaddn .deliveryAddressContainer .btn {
        left: 50%;
        width: 348px;
        margin: -20px;
    }

    button#btncCodeshippingFrom,
    #btncCodeshippingTo {
        width: 100% !important;
        font-size: 14px !important;
        height: 54px !important;
    }

    .calseprater {
        width: 22px;
        margin: 10px !important;
        display: block;
    }

    .col-md-12.shipcalc .blockmobile .shipcalcbtn {
        width: 45% !important;
    }

    .acc_saveadd + .accedtaddress .form-container button#btncCodecity {
        width: 345px;
    }

    div#pageModal #ModalDialog .acc_saveadd + .accedtaddress .form-container {
        width: 300px !important;
    }

    .acc_saveadd + .accedtaddress .deliveryAddressContainer .btn {
        transform: translateX(-50%);
        margin: inherit;
        left: 32% !important;
        width: 340px !important;
        position: relative;
        top: 5px;
        z-index: 10;
    }

    .acc_saveadd + .accedtaddress .form-container input#daAddress,
    .acc_saveadd + .accedtaddress .form-container input#daDistrict,
    .acc_saveadd + .accedtaddress .form-container input#daAdditionalInfo {
        width: 345px !important;
    }

    .acc_saveadd + .accedtaddress .form-container .form-group {
        width: 320px;
    }

    .acc_saveadd + .accedtaddress {
        width: 345px;
    }

        .acc_saveadd + .accedtaddress .mapAreaContainer.full-width-map {
            width: 57% !important;
            margin: 0;
            left: inherit;
            height: 79% !important;
            top: 10px !important;
            right: 10px;
        }

    .name_detailbox2 .idnum {
        background: #fff;
        margin: 0px 0px 15px 0 !important;
        padding: 12px !important;
        width: 297px !important;
        border-radius: 0px 0;
    }

    .row.nopadding.plus {
        width: inherit;
        /* clear: both; */
    }

    .packpopupitemcard.pckbkmobile .bottom-btn {
        width: 100% !important;
        margin-bottom: 8px !important;
        margin: 0px 0 8px 0 !important;
    }

    .container.mt-5.packbg.mobileshift {
        display: flex;
        flex-direction: column-reverse;
        padding: 0;
    }

    .product-elecntr .card-body.nopadding {
        background: red;
        background: transparent linear-gradient(78deg, #0e502c 0%, #1cb15f 100%) 0% 0% no-repeat padding-box;
        height: 80px !important;
    }

    .product-elecntr .pack-img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 75px !important;
    }

    .product-elecntr .bottom-btn {
        display: block;
        width: 75px !important;
        padding: 0;
        margin: -12px 0 0 0 !important;
        float: left !important;
    }

    .product-elecntr.inspectmobile .bottom-btn-inline {
        display: inline-block;
        text-align: left;
        width: 270px;
        padding: 5px;
        float: right;
    }

    .add_visacrdcntr:last-child .visacntr + button#btnAddCard {
        display: block !important;
    }

    button#btnAddCard.mobile {
        display: none;
    }

    .container.mt-5.packbg.mobileshift {
        display: block;
        flex-direction: column-reverse;
        padding: 0px 15px 0 15px;
    }

    .col-3.summaryRight.mobile {
        float: right;
        position: inherit;
        max-width: 345px;
    }

    .packbg .bottom-listfooter .bottom-btn:nth-child(2) div {
        font: normal normal 600 10px/12px 'Söhne', 'Open Sans';
    }

    ul.navbar-nav.flex-grow-1.nav-menu {
        flex-direction: column;
        height: 500px;
        left: -24%;
        display: block;
        position: absolute;
        position: absolute;
        height: 82vh;
        top: 91px;
    }

    .newlstcntr + .bottom-listfooter .downld.uploadpackageInvocie {
        font: normal normal 10px/12px 'Söhne', 'Open Sans';
    }

    .col-3.summaryRight.mobile {
        float: right;
        position: absolute;
        max-width: 345px;
    }

        .col-3.summaryRight.mobile.bb:before {
            content: "kj";
            position: absolute;
            bottom: -66px;
            color: transparent;
        }

    .summeryleft.mobile {
        float: left;
    }

    .col-.mb-3.product-elecntr {
        width: 367px;
    }

    .product-elecntr .card-body.nopadding.imgreq {
        width: 364px !important;
    }

    #cardsList ul.ul-pack.nav.loader-ul {
        background: var(--jak-green-color);
        height: 36px;
        float: left;
        padding: 5px 12px !important;
        display: flex;
        min-width: 700px !important;
    }

    ul.ul-pack.nav.loader-ul {
        min-width: 805px !important;
        width: 1044px !important;
    }

    .name_detailbox2 {
        background: transparent !important;
        border-radius: 0px;
        opacity: 1;
        display: inline-block;
        width: 443px;
        height: auto;
        margin-left: 15px !important;
    }

    .packbg .bottom-listfooter .bottom-btn:nth-child(2) {
        display: inline-block;
        width: 42%;
        margin-left: 0px;
    }

    .newlstcntr .dtlsvalues:after {
        content: "";
        width: 1px;
        height: 17px;
        background: #404855;
        display: inline-block;
        margin-top: -23px;
        position: absolute;
        margin-left: -16px !important;
    }

    div#divList.newlistcrd > div {
        padding-right: 0;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }

    .packmobile .scroll .scroll-hide {
        overflow-x: auto !important;
        max-width: inherit;
    }

    .mobilefilter {
        position: absolute;
        top: 0px;
        right: 0;
    }

    input#input-listSrch {
        width: 379px;
    }

    .row.topcontent > .col-md-6 {
        width: 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .navbar-expand-lg .navbar-collapse {
        width: 100%;
    }

    .col-md-6.tips.pr-0 {
        margin-bottom: 0px;
        top: 0px;
    }

    .up_voice_cntr {
        margin-top:0 !important;
    }

    .shpmcntr .shipcalc .row .col {
        padding: inherit !important;
    }

    .shpmcntr .shipcalc .row .col-md-1 {
        display: block !important;
    }

    .shpmcntr .shipcalc .row .col-md-1 {
        padding: block !important;
    }

    .col-md-12.shipcalc .col-md-1 {
        display: block;
    }

    .col-md-12.addressview.item .col-md-4 {
        width: fit-content;
    }

    .packaddress .bb,
    .packaddress .aa {
        display: block;
    }

    .col-md-6.shimentcntr.pr-0,
    .col-md-6.shpmcntr.pr-0,
    .col-md-6.tips.pr-0 {
        padding: 0 0 0 15px !important;
    }

    li.icodiv:last-child {
        display: flex !important;
        cursor: pointer;
    }

    li.icodiv.chkLangMain,
    li#notification {
        display: block !important;
        border: 1px solid var(--jak-light-gray);
    }

    li#notification {
        cursor: pointer;
        position: inherit;
        right: 0;
        top: inherit;
        border: 1px solid var(--jak-light-gray);
    }

    li.icodiv.srchglbl {
        cursor: pointer;
        width: 380px !important;
        margin: 0px 12px;
        display: block;
    }

        li.icodiv.srchglbl img {
            left: 346px !important;
            width: 19px;
            height: 19px;
            top: 19px !important;
        }

    .flex.user-greet.col-12 {
        display: flex;
    }

    li.icodiv.chkLangMain {
        display: block;
        cursor: pointer;
        border: 1px solid var(--jak-light-gray);
    }

    a.text-right.view-all-btn {
        position: inherit;
        top: unset;
        right: 0;
    }

    .s2dcntr {
        max-width: 1280px !important;
        position: relative;
    }

    .mobilemenu {
        display: none;
    }

    a.utdel.clspack-status.ready-to-send-btn {
        font: normal normal bold 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #338625;
        opacity: 1;
        padding: 0 8px;
        height: 18px;
        display: block;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .sumrysubhd {
        margin-top: 26px;
        font: normal normal normal 14px/18px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .summaryRight h6.package-heading {
        margin-top: 0;
    }

    .bottom-listfooter button.detail-btn.btnpack-detail,
    .bottom-listfooter .detail-btn.btnship-detail {
        font: normal normal 500 12px/20px 'Söhne Kräftig', 'Open Sans';
        width: 100px;
        height: 32px;
        position: absolute;
        bottom: 9px;
    }

    .s2d-navbar.nav_new {
        padding: 10px 0;
        margin: 5px 0 0 0;
        background: var(--jak-blue-color);
        border: none;
        opacity: 1;
        height: 96vh;
        align-items: flex-start;
    }

    .container.main_contorellar {
        flex-direction: column;
        height: 778px;
    }

    a.nav-link.s2d-nav-link.active-label {
        font: normal normal 700 14px/20px 'Söhne', 'Open Sans' !important;
    }

    .s2d-navbar.nav_new .navbar-nav .s2d-nav-link {
        text-align: center;
        font: normal normal 14px/20px 'Söhne Halbfett', 'Open Sans' !important;
        letter-spacing: 0px;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
        margin-bottom: 17px;
    }

    .container.right {
        max-width: 87% !important;
        float: right;
        margin: 0;
    }

    .packagecnter span.shipment-title {
        font: normal normal 300 12px/24px 'Söhne', 'Open Sans';
    }

    #user-name {
        font: normal normal 400 22px/43px 'Söhne Buch', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin: 0;
    }

    .row.topcontent {
        margin-top: 23px;
    }

    label.sectionheading {
        width: 100%;
        font: normal normal 20px/31px 'Söhne Kräftig', 'Open Sans';
        font-weight: 500;
        text-align: left;
        line-height: 40px;
        align-items: center;
        padding-left: 13px;
        color: #000;
        margin-bottom: 3px;
    }

    .packagecnter {
        background: #ffffff;
        border: none;
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        /* display: flex; */
        margin: 0px;
        height: 212px;
    }

    .sectionheading span {
        display: flex;
        position: relative;
        right: auto;
        float: right;
        top: -9px;
    }

    .arrowtop {
        margin: 19px 7px 0px;
        text-align: center !important;
        width: 18px;
        height: 18px;
    }

    .arrowbtm {
        display: block;
        margin: 21px 7px 0px;
        text-align: center !important;
    }

        .arrowbtm img {
            width: 25px;
            height: 25px;
            width: 18px;
            height: 18px;
            transform: rotate(180deg);
        }

    .packagecnter .item {
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        padding: 13px;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        height: 130px;
        box-shadow: var(--jak-shadow);
    }

    .header_Pack {
        padding: 0 0 9px 0;
        margin: 0;
        border-bottom: 1px solid;
        display: inline-block;
        width: 100%;
        border-bottom: 1px solid var(--jak-light-gray);
    }

    .col-md-3.nopadding.upparcase,
    .col-md-3.nopadding.itmsttlwei {
        padding-left: 9px;
    }

    .header_Pack .packname {
        display: grid;
        float: left;
        text-align: left;
    }

    .packname.btmvalue span + span {
        font: italic normal normal 12px/17px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
    }

    .packname.btmvalue span {
        font: normal normal 600 12px/17px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
    }

    .packagecnter .item .header .row.box {
        padding: 0px 0px 0px 15px;
    }

    .btnsright a.utdel.shipped-btn {
        cursor: default;
        opacity: 1;
        color: var(--unnamed-color-f7fafc);
        text-align: right;
        text-align: right;
        font: normal normal 10px/19px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        opacity: 1;
        margin-right: 8px;
        border-radius: 0px;
        opacity: 1;
        padding: 0 8px;
        display: inline-block;
        height: auto;
    }

    .packagecnter .item .row.box {
        padding: 0px 0px 0px 15px;
    }

    .box .detail-btn.btnpack-detail {
        background: none;
        font: normal 500 12px/normal 'Söhne Kräftig', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        opacity: 1;
        bottom: 22px;
        white-space: nowrap;
    }

    .backeff {
        background: red;
        height: 20px;
        position: relative;
        z-index: 100;
        width: 94%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
        display: block;
    }

    .backeff2 {
        background: #00ff5a;
        height: 21px;
        display: block;
        position: relative;
        z-index: 0;
        margin-top: -10px;
        width: 92%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    .btnTrack-now,
    .btnsright a.utdel {
        font: normal normal 600 12px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: var(--jak-blue-color);
        text-transform: capitalize;
        display: inline-block;
        opacity: 1;
        cursor: pointer;
    }

    .row.track_content {
        padding: 0px 0px 0px 15px;
    }

    .headbox {
        width: 100%;
        text-align: left;
        line-height: 40px;
        align-items: center;
        padding-left: 13px;
    }

    .arrowtop img {
        width: 18px;
        height: 18px;
       transform: rotate(0deg);
    }

    .shpmcntr .main_cnter.row {
        background: #fff;
        /* border: 1px solid var(--jak-light-gray); */
        border-radius: 0px;
        opacity: 1;
        padding: 15px;
        position: relative;
        margin: 0px;
        height: 292px;
    }

    .col-md-12.shipcalc {
        background: #fff;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        padding: 0px;
    }

    .up_voice_cntr {
        margin-top:0 !important;
    }

    span.shipment-content {
        text-align: left;
        font: normal 600 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        opacity: 1;
        width: 100%;
        display: block;
    }

    span.shipment-cntnt {
        text-align: left;
        font: normal 600 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #fb7054;
        opacity: 1;
        width: 100%;
        display: block;
    }

    label.sectionheading.headbox > img {
        margin-top: -2px;
    }

    .up_voice_cntr {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        margin: 0px;
    }

    .uploadinvoice span.shipment-title {
        float: left;
        font: normal normal 600 16px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #f7fafc;
        text-transform: capitalize;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    span.shipment-title-content {
        float: left;
        font: normal normal 600 16px/22px 'Söhne', 'Open Sans' !important;
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    span.shipment-btn {
        font: normal normal 600 12px/31px 'Söhne', 'Open Sans' !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
    }

    span.shipment-mbtn img,
    span.shipment-btn {
        margin-top: -3px;
    }

    .tips .main_cnter.row {
        margin: 0px;
        height: 71px;
        margin-top: 10px;
        position: relative;
        background: #fff;
        border: 1px solid #293341;
        border-radius: 0px;
    }

    .tips span.shipment-title1 {
        display: block;
        width: 80%;
        text-align: left;
        font: normal normal 300 12px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
    }

    .tips .view-all-btn {
        margin-top: 4px;
        margin-right: -38px;
    }

    .tips span.shipment-title {
        display: block;
        width: 78%;
        text-align: left;
        font: normal normal 12px/16px 'Söhne', 'Open Sans';
        margin-left: 1px;
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
    }

    .tips .col-md-12.content-cntr {
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        padding: 0px;
        background: #fff;
    }

    .col-md-12.uploadinvoice {
        border-radius: 0;
        opacity: 1;
        margin: 0;
        height: 71px !important;
        position: relative;
        z-index: 333;
        background: #fff;
        padding: 14px;
        border: 2px dashed var(--jak-blue-color);
    }

    .shipview.item a.text-right.view-all-btn {
        display: block;
        margin: 15px auto 0;
        text-align: center !important;
        color: white;
    }

    .packaddress .main_cnter.row {
        border-radius: 0px;
        opacity: 1;
         padding: 10px;
        position: relative;
        margin: 0px;
    }

    .userflnm .acc_usrname {
        text-align: left;
        font: normal normal 16px/22px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .col-md-12.sd.addressview_2.addressview.item.show {
        background: #262934 0% 0% no-repeat padding-box;
        box-shadow: var(--jak-shadow);
        border: 1px solid #80322c;
    }

    .col-md-12.sd.addressview_3.addressview.item.show {
        background: #153b35 0% 0% no-repeat padding-box;
        box-shadow: var(--jak-shadow);
        border: 1px solid #108846;
    }

    .col-md-12.addressview.item.show {
        padding: 12px;
        position: relative;
        z-index: 333;
        background: #1d2b4a 0% 0% no-repeat padding-box;
        box-shadow: var(--jak-shadow);
        border: 1px solid #283991;
        border-radius: 0px;
        opacity: 1;
        margin: 0px;
        height: 175px;
    }

    span.cntry-code {
        font: normal normal 600 12px/17px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        text-align: left;
        font: normal normal 600 14px/18px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #ffffff;
        opacity: 1;
    }

    .row.address_content {
        margin: 2px 0 8px -13px;
    }

    .addressview .address_content p {
        font: normal normal normal 14px/19px 'Söhne', 'Open Sans' !important;
    }

    .addressview .row span {
        font: normal normal normal 12px/16px 'Söhne', 'Open Sans' !important;
        float: left;
    }

    p.shipment-date {
        font: normal normal normal 14px/20px 'Söhne', 'Open Sans' !important;
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        margin-top: 0px;
        white-space: nowrap;
        width: 158px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .consolidate {
        margin-top: 53px !important;
    }

        .consolidate .main_cnter.row {
            margin: 0px;
            background: #fff;
            border: 1px solid #293341;
            border-radius: 0px;
            opacity: 1;
            position: relative;
            margin: 0px;
        }

        .consolidate .col-md-12 {
            border-radius: 0px;
            opacity: 1;
            position: relative;
            z-index: 333;
            margin: 0;
            padding: 13px;
            height: 70px;
        }

    span.shipment-titletp {
        float: left;
        font: normal normal 16px/22px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        text-transform: capitalize;
        opacity: 1;
        text-align: left;
        margin-left: 3px;
    }

    .col-md-12.col-xs-12.tipshd {
        font: normal normal 600 13px/16px 'Söhne', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
        padding: 0;
    }

    p.shipment-date.mt-3.cpylink {
        font: normal normal 12px/15px Montserrat-r !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
        margin-left: 23px;
    }

    p.shipment-date.mt-3.clicked {
        animation: buttonAnimation 0.5s ease-in-out;
   }

    .btnsright1 a.utdel.clspack-status {
        font: normal normal 10px/20px 'Söhne', 'Open Sans';
        letter-spacing: normal;
        color: #338625;
        opacity: 1;
        height: auto;
        margin-top: 6px;
    }

    .clspack-status {
        cursor: context-menu !important;
    }

    .col4.packpopupitemcard:nth-child(odd) .font-data.card-header {
        background: var(--jak-green-color);
    }

    .col4.packpopupitemcard:nth-child(even) .font-data.card-header {
        background: var(--jak-green-color);
    }

    #ModalContent h6#packages-title + .card .card-header button {
        background: #00000047 0% 0% no-repeat padding-box;
        height: 18px;
        margin-top: 5px;
    }

    .customer_crdnumbr span.cardN.card-number {
        font: normal normal 14px/20px 'Söhne', 'Open Sans';
        letter-spacing: 0.7px;
        color: #ffffff;
        opacity: 1;
    }

    span.shipment-mbtn {
        font: normal normal 600 12px/31px 'Söhne', 'Open Sans' !important;
        letter-spacing: normal;
        color: #ffffff;
        text-transform: capitalize;
        opacity: 1;
    }

    .addressview span.cntry-code {
        letter-spacing: 0px;
        color: #000;
        text-align: left;
        font: normal normal 500 14px/18px 'Söhne Kräftig', 'Open Sans';
        letter-spacing: 0px;
        color: #000;
        opacity: 1;
    }

    span.aa1 {
        display: block;
        height: 20px;
        position: relative;
        z-index: 100;
        width: 94%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    span.bb2 {
        display: block;
        height: 21px;
        position: relative;
        z-index: 0;
        margin-top: -10px;
        width: 92%;
        margin: -10px auto 0;
        background: #292f38 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 56px #00000038;
        border-radius: 0px 0px 0;
        opacity: 1;
    }

    .shimentcntr .main_cnter.row {
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        padding: 10px;
        position: relative;
        margin: 0px;
        height: 212px;
    }

    .shipviewcntr {
        padding: 13px 13px 0px 13px;
        background: #ffffff;
        border-radius: 0px;
        opacity: 1;
        position: relative;
        z-index: 333;
        margin: 0;
        box-shadow: var(--jak-shadow);
    }

    .modal-lgg,
    .modal-xl {
        max-width: 800px;
    }
}

.page-content-container {
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

[type="button"] > span {
    pointer-events: none;
}

#daLandmark {
}

.gm-style-iw {
    background-color: black !important;
}

.gm-style-iw-d {
    overflow: hidden !important;
}

.forceltr {
    direction: ltr;
}

.visaback {
    border-radius: 0px;
    background-color: #f9f9f9;
    padding: 4px;
    margin-top: 9px;
    margin-bottom: 7px;
}

[dir="rtl"] .visaback {
    margin-left: 20px;
}

@media (min-width: 768px) and (max-width: 837px) {
    .liststatus {
        width: 209px !important;
    }
}

@media (min-width: 838px) and (max-width: 1156px) {
    .liststatus {
        width: 278px !important;
    }
}

@media (min-width: 723px) and (max-width: 767px) {
    .liststatus {
        width: 277px !important;
    }
}

@media (min-width: 644px) and (max-width: 722px) {
    .liststatus {
        width: 205px !important;
    }
}

@media (min-width: 1157px) and (max-width: 1199px) {
    .second-child {
        width: 160px !important;
    }

    .row.topcontent > .col-lg-6 {
        width: 50%!important;
        flex: 0 0 50%;
        max-width: 50%!important;
    }
}

@media (max-width: 420px) {
    .bottom-listfooter .trck {
        width: 82%;
    }
}

@media (max-width: 590px) {
    .detail-btn {
        position: unset;
        /*padding-left: 0;*/
        width: 110px;
    }

        .detail-btn.clspack-status {
            font: normal normal 400 8px/20px 'Söhne', 'Open Sans' !important;
        }
}

@media (max-width: 991px) {
    .ship-dt-lst .btnitem-detail {
        float: unset;
    }
    
    .tab-view-btn, .list-view-btn {
        display: none;
    }
    
    [dir="rtl"] .tab-view-btn, [dir="rtl"] .list-view-btn  {
        display: none;
    }

    .tab-view-btn.sort, [dir="rtl"] .tab-view-btn.sort {
        display:flex;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .ul-packt li a {
        margin-right: 33px;
    }
}

.span.upload-invoice-content.mb-0 {
    height: auto !important;
}

.pack-item-card {
    height: 94%;
}

.rtosender .font-data.card-header.item-detail-header {
    height: unset !important;
}

@media (max-width: 575px) {
    .mobilemen.search {
        display: none !important;
    }

    .packbg {
        margin-top: 0px !important;
    }
}

/* .backgroundContainer {
    display: unset !important;
} */

#fullArea {
    width: 600px;
    height: 100%;
    margin: auto;
}

.letsStartContainer {
    width: 100%;
}
/*
.signInPopup {
    max-width: 600px;
    margin: auto;
}*/

@media (max-width: 991px) {
    header {
        display: none;
    }

    .form-container {
        width: 100% !important;
    }

    .modal-footer,
    .modal-header,
    .modal-body.add-new-body.accpopcvv,
    .modal-body,
    #pageModal .packages-body-scroll {
        width: 100% !important;
    }

    #message-field {
        width: 100%;
    }

    div#pageModal #ModalDialog .form-group {
        width: 100% !important;
    }

    .help-modal {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .cvvPay .form-container {
        width: 29% !important;
    }

    .comment-field #comments {
        width: 298px !important;
    }

    .customer_crdnumbr {
        width: 100% !important;
    }

    .shippingoptins.extropts {
        width: 100%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .cvvPay .form-container {
        width: 19% !important;
    }
}

@media (min-width: 992px) {
    .col-3.summaryRight.mobile {
        float: right !important;
        position: absolute !important;
    }
}

@media(max-width:991px) {
    .signInPopup .form-group {
        width: 100%
    }

    .signInPopup .form-wrapper {
        width: 100%
    }

    .form-container input#txtpassword {
        width: calc(100% - 42px) !important;
    }

    .signInContainer,
    #divLoginMobile,
    .letsStartContainer {
        padding: 50px;
    }

    .form-container input#txtem {
        width: calc(100% - 42px) !important;
    }

    .phone-icon {
        right: 14px !important;
    }

        .phone-icon img {
            width: 70%;
        }

    .letsStartContainer {
        padding-bottom: 100px;
        display: block;
        text-align: center;
    }

    .center-container {
        display: block;
    }

    button#btnOtp,
    .letsStartContainer.loginstart button#btnMobile,
    .personalDetailsContainer .progress, .personalDetailsContainer .btn {
        position: unset;
        transform: unset;
        /*display:block;*/
        width: 100% !important;
    }

    a.account-label.chkLangMain {
        display: block !important;
        position: unset !important;
        text-align: center;
    }

    .letsStartContainer.loginstart input#mNumber {
        width: 100% !important;
    }

    .message {
        width: 100%;
    }

    .center-container {
        width: 100% !important;
        max-width: 100% !important;
        place-items: center;
    }

    .signInContainer, .resetContainer, .letsStartContainer, .otpContainer, .personalDetailsContainer, .idDetailsContainer, .congratsContainer, .almostDoneContainer, .selectPlanContainer, .finalStepContainer, .newPasswordContainer, .deliveryAddressContainer, .retailCenterContainer {
        display: block;
        text-align: center;
        width: 100% !important;
        overflow: hidden auto !important;
        padding: 20px;
    }

        .otpContainer .message {
            width: 100%;
            top: 1rem;
        }

        .otpContainer .otp-container.test {
            display: block !important;
            width: 100% !important;
            margin: 2rem 0 2rem !important;
        }

    .title, .almost-done-title {
        position: unset;
    }

    #btnOtp {
        margin-top: 0;
    }

    .resetContainer .message {
        width: 100% !important;
    }

    .loginFOrgotpswd input#txtmobileno {
        width: 100% !important;
        margin-right: 0 !important;
    }

    .send-otp .btn {
        width: 100% !important;
        position: unset;
        transform: unset;
    }

    .create-with-email {
        margin-top: 35px !important;
    }

    .personalDetailsContainer .scroll .scroll-hide .form-group input,
    .personalDetailsContainer .form-group {
        width: 100% !important;
    }
}

.congratsContainer #btnCongrats {
    width: 100% !important;
    position: unset;
    transform: unset;
}

.congratsContainer .refrenceText {
    width: 100%;
}

.congratsContainer .button-row {
    width: 100%;
}

.congratsContainer {
    width: 100%;
    justify-content: center;
    align-items: center;
}

div#pageModal #ModalDialog .almostDoneContainer.payment-height .form-container,
div#pageModal #ModalDialog .form-group {
    display: inline-block;
    width: 100% !important;
}

.payment-height #adName,
.payment-height #adExpiry {
    height: 54px;
}

.payment-height .cards-types {
    margin: 0 auto !important;
}

.accountNewCard .almostDoneContainer,
.packagesnewcrd .almostDoneContainer {
    display: block !important;
    width: 100% !important;
    height: unset;
}

div#pageModal #ModalDialog .almostDoneContainer.payment-height .form-container.expleft {
    width: 48% !important;
}

div#pageModal #ModalDialog .almostDoneContainer.payment-height .form-container.cvv-container {
    width: 48% !important;
}

div#pageModal #ModalDialog .accpopcvv .almostDoneContainer.payment-height .form-container .form-group.expiry-container,
div#pageModal #ModalDialog .almostDoneContainer.payment-height .form-container.expncvvcntr {
    width: 100% !important;
    margin: 0 !important;
}


@media(min-width:992px) {
    .additonal-options-container.mobilebutns {
        width: 510px;
        margin: 126px auto;
        float: left;
        margin: 125px 10px 25px 10px;
    }
}

@media(max-width:991px) {
    #divLoginMobile .form-group {
        width: 100%;
    }

    #divLoginMobile .form-wrapper {
        display: flex;
        width: 100%;
    }

    .multisteps-form__form .form-wrapper {
        width: 100%;
    }

    .multisteps-form .letsStartContainer,
    .idDetailsContainer {
        padding: 20px;
    }

        .idDetailsContainer .form-group,
        .idDetailsContainer .form-group input {
            width: 100% !important;
        }

        .idDetailsContainer .btn {
            /*display: block;*/
            position: unset;
            transform: unset;
        }

        .idDetailsContainer .note {
            width: unset;
            font: normal normal normal 12px/22px 'Söhne', 'Open Sans';
        }

    .additonal-options-container.shippingpre.mobilebutns .adminpreferein {
        width: 48% !important;
    }
}

@media(max-width:767px) {
    .accountNewCard .almostDoneContainer {
        padding: 20px !important;
    }

    .additonal-options-container.shippingpre.mobilebutns .adminpreferein {
        width: 100% !important;
        height: auto !important;
        margin: 5px 0 !important;
    }

    .additonal-options-container.shippingpre.mobilebutns .shippingpre1 {
        width: 100% !important;
    }

    .selectPlanContainer {
        height: unset;
    }

    .curentcity span {
        display: block;
    }

    .signupmap .deliveryAddressContainer .btn-selectcity,
    .signupmap .form-group,
    .signupmap .jk.input-feild, .signupmap #daDistrict, .signupmap #daAdditionalInfo {
        width: 100% !important;
    }

    .addressContainer {
        padding: 0 !important;
        position: unset;
        margin-bottom: 20px;
        height: unset;
        width: 100%;
    }

    .signupmap .mapAreaContainer {
        position: unset !important;
        width: 100% !important;
    }

    #div-mapareawidth {
        margin: 0 !important;
    }

    .deliveryAddressContainer .btn {
        position: unset !important;
        width: 100% !important;
        transform: unset !important
    }

    .curentcity {
        margin: 24px auto 6px !important;
    }

    .curentcity,
    .addressContainer .message {
        width: 100% !important;
        position: unset !important;
    }

    .search-container {
        position: unset !important;
        transform: unset !important;
        margin: 15px 0 10px;
    }

    .signupmap #div-addareawidth .progress {
        margin-top: 62px;
    }

    .signupmap .deliveryAddressContainer-add .scroll-hide {
        width: 100% !important;
    }

    .deliveryAddressContainer-add {
        padding: 30px !important;
    }

    .deliveryAddressContainer, .retailCenterContainer {
        padding: 30px;
    }

    .retailssignup span.close-btnretail {
        position: absolute;
        right: 0px;
        margin: 9px;
        top: 10px;
        cursor: pointer;
    }

    .retailssignup span.close-btnretail {
        top: 10px;
    }

    .addressContainer .scroll .scroll-hide {
        width: 100% !important;
    }

    .retail-details-container {
        display: block;
    }

    p.retailAdd {
        width: 100%;
    }

    .search-container {
        width: 100% !important;
        margin-left: 0 !important;
    }
    /*.checkmark {
        top: -24px!important;
        left: -10px!important;
        width: 25px;
    }*/
    .retailssignup input#rtSearch + .password-icon {
        top: -43px !important;
        right: 8px !important;
    }

    .mapAreaContainer {
        width: 100% !important;
        margin: 0 !important;
        position: unset !important;
    }

    .retailCenterContainer .btn {
        position: unset !important;
        width: 100% !important;
        transform: unset !important;
    }
}

@media(max-width:575px) {
    .form-control-placeholder {
        font-size: 12px !important;
    }

    .almostDoneContainer {
        padding: 0px 50px;
    }

    .selectPlanContainer {
        padding: 20px;
    }
}

@media(min-width:992px) and (max-width:1499px) {
    .selectPlanContainer .message {
        margin-top: 6.5rem;
    }
}

@media(min-width:1200px) {
    button#btncCodecity li img {
        right: -24px !important;
    }
}
.httplinkcolor {
    color:#2D8BD0;
}
@media(max-width:768px) {
    .drpdwn {
        width: 260px !important;
    }

    .final-step-title {
        margin-top: 1.5rem;
    }

    .finalStepContainer .summary-container {
        width: 100%;
    }

    .finalStepContainer .form-group label, .finalStepContainer input:placeholder-shown + .form-control-placeholder {
        transform: translate(13px, 16px);
    }

    button#btnOLSApply {
        right: 58px;
        top: 7px;
    }

    .finalStepContainer .footnote {
        width: 100%;
        padding: 0;
    }

    .almostDoneContainer button#btnAd,
    .finalStepContainer #btnOLS,
    .almostDoneContainer button#btnAd {
        position: unset;
        transform: unset;
        /* display: block; */
        width: 100% !important;
    }

    .almostDoneContainer input#adName,
    .almostDoneContainer input#adName,
    .almostDoneContainer #adCardNumber,
    .paycard .almostDoneContainer .form-container + .flex .form-container input {
        width: 100% !important;
    }

    .cards-types {
        width: unset;
    }

    .letsStartContainer .note {
        width: 100%;
    }

    .change-img {
        bottom: -80px;
    }

    .idDetailsContainer button#btnID {
        margin-top: 28px;
    }

    #retail-details-div .checkmark {
        top: -24px !important;
        left: -10px !important;
        width: 20px;
    }

    .quantity-left-minus, .quantity-right-plus {
        width: 35px !important;
    }
    #cardsList{
        display:unset;
    }
}

.utdel.clsship-status.attention-required-btn {
    cursor:default;
}

[dir="rtl"] div#div-process-pack {
    float:left;
}

[dir="rtl"] div#package_selec_msg {
    text-align: right;
}

[dir="rtl"] #toast-container > .toast.toast-success .toast-title {
    float: right;
}

#toast-container > .toast.toast-success .toast-title .toastrIcon,
#toast-container > .toast.toast-error .toast-title .toastrIcon {
    width: 12px;
    height: 12px;
    margin-right: 5px;
}

[dir="rtl"] #toast-container > .toast.toast-success .toast-title .toastrIcon,
[dir="rtl"] #toast-container > .toast.toast-error .toast-title .toastrIcon {
    margin-left: 5px;
}

html {
    scrollbar-color: var(--jak-gray-color) var(--jak-input-bg);
}

:root {
    --jak-blue-color: #0057FF;
    --jak-green-color: #C3F401;
    --jak-pink-color: #FF83FF;
    --jak-input-bg: #F6F7FA;
    --jak-gray-color: #737477;
    --jak-light-gray: #E5E9EF;
    --jak-sub-heading: #858CA0;
    --jak-shadow: 0px 0px 22px 0px #0108150D;
}

.btn-icon img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(103%) contrast(103%);
}

.methodNames {
    color: #000;
}

.methodNames.active {
    font-weight: 600;
}

.blueSvg {
    filter: brightness(0) saturate(100%) invert(22%) sepia(59%) saturate(6637%) hue-rotate(220deg) brightness(102%) contrast(105%)!important;
}

.graySvg {
    filter: brightness(0) saturate(100%) invert(60%) sepia(7%) saturate(264%) hue-rotate(184deg) brightness(93%) contrast(91%);
}

.whiteSvg {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(260deg) brightness(98%) contrast(104%);
}

.blackSvg {
    filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(7500%) hue-rotate(327deg) brightness(96%) contrast(104%);
}

.summaryBox .bg-transparent {
    border-radius: 0;
}

.jakIcon {
    background: var(--jak-input-bg);
    width: 147px;
    height: 147px;
    display:flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.paymentCardBox,
.paymentAmount,
.paymentDate,
.paymentCoupon {
    color: #000;
}


 button.attention-required-btn {
        color: #CD171A!important;
    }

    .in-review-btn,
.in-review-tab-btn {
    background: #FFF1CD;
    color: #B18516!important;
}

.text-black {
    color: #000!important;
}

.text-gray {
    color: var(--jak-gray-color)!important;
}

.transactionCard {
    background: var(--jak-input-bg);
}

.mobilefilter {
    display: flex;
    gap: 5px;
    flex-direction: row-reverse;
}

.notificationHeader {
    background: var(--jak-blue-color);
    padding: 16px;
    display: flex;
    justify-content: space-between;
}

.notification-menu {
    box-shadow: 0px 0px 22px 0px #04072917;
}


.smsChargesMessages {
    display: flex;
    gap: 8px;
    align-items: center;
    text-align: left;
    width: 100%;
}

.smsChargesMessages img {
    width: 15px;
    height: 20px;
}

.smsChargesMessages p {
    font-size: 12px;
    color: var(--jak-sub-heading);
    font-family: 'Söhne Buch', 'Open Sans';
}

.resend #timer {
    font-weight: 600;
}

.resend-option .resend-link {
    color: var(--jak-blue-color);
}

.paymentCardBox {
    background: var(--jak-input-bg);
}

[dir="rtl"] .arabicRotate {
    transform: rotate(270deg);
    margin-right: 5px;
}

.pkgDetailBtn > .detail-btn,
.shipmentDetailBtn > .detail-btn {
    right: 36px;
}

.bottom-btn-detail .shipment-date.forceltr {
    font: normal normal normal 16px / 24px 'Söhne Open Sans', 'Open Sans' !important;
}

.gap-10 {
    gap: 10px;
}

.time-line.shipmentHistoryModal {
  padding-bottom: 34px;
}

.time-line.shipmentHistoryModal .time-line-icon {
  top: 26px;
}

.time-line.shipmentHistoryModal .forceltr {
  text-align: left;
}

.time-line.shipmentHistoryModal .forceltr.dateUTC {
  background: var(--jak-input-bg);
  border: 1px solid var(--jak-light-gray);
  position: relative;
  left: -38px;
  width: fit-content;
  padding: 2px 5px;
}

.dividerLine {
    border-top: 1px solid var(--jak-light-gray);
}

.storage-card .user_address {
    flex-direction: column;
}

.user_address .dividerLine {
    margin: 5px 0;
}

.shiprocesspophd {
    background: #fff;
}

.uploaadbtn {
    float:right;
}

[dir='rtl'] .uploaadbtn {
    float:right;
}

#btnSubmitChangepwd {
    width: 100%!important;
}

.ready-to-send-btn {
    color: #338625!important;
}

.shipped-btn {
    color: var(--jak-blue-color)!important;
}

.toast-success {
    background: #000!important;
}

#launcher {
    display: none;
}


.swal2-styled.swal2-confirm{
    width: 100%;
    height: 100%;
    background: var(--jak-blue-color)!important;
    border-radius: 0!important;
    white-space: nowrap;
}
.swal2-loader .swal2-styled.swal2-cancel {
    width: 100%;
    height: 100%;
    text-transform: capitalize;
    font: normal normal 600 16px/19px 'Söhne', 'Open Sans';
    letter-spacing: normal;
    color: var(--jak-blue-color)!important;
    text-transform: capitalize;
    opacity: 1;
    background-color: #F6F7FA!important;
    background: #F6F7FA!important;
    border-radius: 0!important;
}

.swal2-actions {
    flex-direction: row-reverse;
    flex-wrap: nowrap!important;
    gap: 5px;
}

.swal2-html-container{
    color: #000!important;
    opacity: 1;
}


.upload-box {
  width: 100%;
  background: #fff;
  border: 1px dashed var(--jak-blue-color);
  border-radius: 0;
  padding: 10px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: all 0.2s ease-in-out;
  /* margin-left: -15px; */
}

.upload-box.contact-box {
    background: var(--jak-blue-color);
    margin-left: 0;
}

.upload-content {
  display: flex;
  align-items: center;
  gap: 14px;
}

.upload-iconDashboard {
  width: 36px;
  height: 36px;
  opacity: 0.7;
}

.contactDashboard {
    background: #0B50D7;
    padding: 5px;
    border-radius: 25px;
}

.contactDashboardIcon {
    width: 22px;
    height: 22px;
}

.upload-text-box h3 {
  font-size: 17px;
  font-weight: 400;
  color: #111827;
  margin: 0;
}

.upload-text-box p {
  font-size: 12px;
  color: #858CA0;
  margin: 2px 0 0;
}

.upload-link {
  font-size: 12px;
  color: #2563eb;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.2s ease;
}


.capitalizeText {
    text-transform: capitalize!important;
}

.dtlsvalues:not(:last-child)::after {
  content: none;
  position: unset;
  top: 10px;
  right: 0;
  width: 1px;
  height: 40px;
  background-color: #e5e7eb;
}

.headerTitle {
    color: #000!important;
    margin: 0;
}

.subHeaderTitle {
    color: var(--jak-sub-heading)!important;
    margin: 0;
}

.navLogo {
    width: 18px;
    height: 20px;
}

.navLogo.accountSvg {
    width: 15px;
}

#message-field {
    width: 100%;
}

.backgroundContainer.hlpcntr .form-container {
    width: 100%;
}

.backgroundContainer.hlpcntr .dropdown {
    justify-content: start;
}

.pack-help, .modal-footer.helphdr {
    padding:0 30px 20px 30px;
}

.filterText {
    background: white!important;
    padding: 3px 10px!important;
}

.filterText span {
    font-size: 12px;
    color: var(--jak-blue-color);
    font-weight: 500;
}

.defaultBorder {
    border-bottom: 1px solid #3C3D40!important;
}

.normalBorder {
    border-bottom: 1px solid #D6D6D6!important;
}

.subHeading {
    color: var(--jak-sub-heading)!important;
}

.header_Pack .packname a span {
    color: var(--jak-gray-color);
    float: right;
    margin-left: 5px;
    margin-top: 0px;
    font-size: 12px;
    font-family: 'Söhne Kräftig';
}

.trck_num .shipmentId.subHeaderTitle {
    color: #000!important;
    font: normal normal 14px/20px 'Söhne Kräftig', 'Open Sans';
    font-weight: 500;
    vertical-align: middle;
}

.trck_num .shipmentId.headerTitle {
    color: var(--jak-gray-color)!important;;
}

.readViewOnly {
    display: none!important;
}

li.icodiv.chkLangMain {
    display: flex!important;
    gap: 10px;
    width: 100px;
}

[dir='rtl'] li.icodiv.chkLangMain {
    display: flex!important;
    gap: 10px;
    flex-direction: row-reverse;
    width: 100px;
}

li.icodiv.chkLangMain span {
    font: normal normal 500 16px / 39px 'Jali Arabic', sans-serif;
}

[dir='rtl'] li.icodiv.chkLangMain span {
    font: normal normal 400 16px / 39px 'Söhne Buch', sans-serif;
}

hr.sortFilter {
    border-bottom: 1px solid var(--jak-light-gray);
    margin: 10px 0;
    width: 100%;
    padding: 0 15px;
}

.contactUsText {
    color: #fff;
    font: normal normal normal 16px / normal 'Söhne Kräftig', 'Open Sans' !important;
    margin: 0;
}

.contactUsParagraph {
    color: #fff;
    font: normal normal normal 12px / normal 'Söhne Buch', 'Open Sans' !important;
    margin: 0;
}

.up_voice_cntr  {
    margin-left: -15px!important;
}


/* Status CSS  */
.incomingJak,
.shippedJak,
.deliveredJak,
.inReviewJak,
.actionRequiredJak,
.pendingPaymentsJak 
  {
    height: 18px!important;
    border-radius: 0!important;
    border-radius: 0px!important;
    font: normal normal 500 10px / 20px 'Söhne', 'Open Sans'!important;
    margin-top: 5px!important;
    top: inherit!important;
    padding: 0 10px!important;
}

.incomingJak,
.deliveredJak,
.completedJak {
    background: #DAF8D5!important;
    color: #338625!important;
}

.pendingPaymentsJak {
    background: #FFF1CD!important;
    color: #B18516!important;
}

.inReviewJak,
.returnedJak {
    background: #FFF1CD!important;
    color: #B18516!important;
}

.shippedJak,
.shipmentRequestedJak,
.inProcessJak {
    background: #DDEBFF!important;
    color: #1359BC!important;
}

.actionRequiredJak,
.destroyedJak,
.discardJak,
.discardedJak {
    background: #FFDBDC!important;
    color: #CD171A!important;
}