@media (max-width: 1199px) {
    .col-upgrades-points {
        width: 33.333%;
        margin-bottom: 15px;
    }
    .col-upgrades-points-btn {
        width: 100%;
        text-align: left;
    }
}

@media (max-width: 991px) {
    .container.loyalty-program .menu-left-col {
        width: 25% !important;
    }
    .container.loyalty-program .main-content-right {
        width: 75% !important;
    }
    
    .form-field {
        display: block;
    }
    .form-field label, .form-field .form-field-input {
        width: 100%;
        display: block;
    }
    .form-field label {
        padding-right: 0;
        margin-bottom: 5px;
    }
    .form-field.form-field-checkbox > div, .form-field.form-field-checkbox > label {
        display: inline-block;
    }
    .form-field.form-field-checkbox > label {
        width: auto;
    }
    
    .loyalty-program-points.two-columns .loyalty-program-points-block {
        width: 100%;
        float: none;
    }
}

@media (max-width: 767px) {
    .container.loyalty-program .menu-left-col {
        width: 220px !important;
        background-color: #ffffff;
        display: block !important;
        position: absolute;
        top: 5px;
        left: -220px;
        z-index: 5555;
        padding: 0 !important;
    }
    .container.loyalty-program .menu-left-col.shown {
        left: 0;
    }
    .loyalty-program-menu ul.navbar {
        margin-bottom: 0;
    }
    .container.loyalty-program .main-content-right {
        width: 100% !important;
    }
    
    .menu-left-toggle {
        display: block;
    }
    
    ul.salesforce-account-types-tabs li {
        width: 50%;
    }
    ul.salesforce-account-types-tabs li.active a:after {
        display: none;
    }
    .salesforce-account-types-info {
        padding: 25px 20px 15px;
    }
}

@media (max-width: 640px) {
    .loyalty-program-page-title span {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .col-upgrades-points {
        width: 100%;
        padding-right: 0;
    }
    
    .points-thresholds-progress-label {
        display: none;
    }
    .points-thresholds-progress .point-break span.point-break-label {
        display: block;
    }
    .points-thresholds-progress .point-break-value.points-acquired {
        top: 10px;
    }
    
    .salesforce-popup .salesforce-inline-popup {
        width: 80% !important;
    }
    .salesforce-popup .mfp-close {
        right: 10% !important;
    }
}

@media (max-width: 480px) {
    .btn.btn-custom {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    .loyalty-program-points-block > .row > div {
        width: 100%;
        margin-bottom: 15px;
    }
    
    .points-thresholds-progress .point-break-value .point-break-legend {
        width: 100px;
        font-size: 8px;
        right: -82px;
    }
    .points-thresholds-progress .point-break-value .point-break-legend-value {
        font-size: 12px;
    }
}