﻿.inputs .input-upload {
    display: inline-block;
    width: 400px;
    max-width: 100%;
    font-size: 14px;
}

.inputs .input-upload {
    display: inline-block;
    width: 400px;
    max-width: 100%;
    font-size: 14px;
}

.input-upload .uploaded-image {
    border-radius: 5px;
}

.input-upload .qq-upload-button {
    background-color: #FF6600;
}

.input-upload .remove-image-button {
    cursor: pointer;
}

.bookup-cart-row {
    border-top: 1px solid grey;
    padding: 5px 0;
}

    .bookup-cart-row > div {
        display: inline-block;
    }

    .bookup-cart-row .product-name {
        width: 70%;
    }

    .bookup-cart-row .sub-total {
        width: 10%;
    }

    .bookup-cart-row .remove-bookup {
        width: 10%;
        text-align: center;
    }

        .bookup-cart-row .remove-bookup > input {
            padding: 5px 7px !important;
        }

.bookup-cart-footer {
    padding: 20px 0;
    text-align: right;
}

    .bookup-cart-footer > div {
        display: inline-block;
    }

    .bookup-cart-footer .total {
        font-size: 24px;
    }

.takephoto-btn-wrapper {
    text-align: right;
}

.media-item li:first-child {
    margin-bottom: 6px;
}

.media-action-container {
    margin-bottom: 10px;
}

.media-item .DivColumn {
    min-width: 400px;
}

@media all and (max-width: 1001px) {
    .bookup-inputs label {
        width: 100%;
        display: block;
    }

    .takephoto-btn-wrapper {
        text-align: center;
    }
}

@media all and (max-width: 767px) {
    .bookup-inputs {
        text-align: center;
    }

        .media-buttons .cardmanagement-button,
        .bookup-inputs .bookup-button,
        .bookup-inputs .bookup-free-value-section {
            display: block;
            margin: 5px auto;
        }
}

.locked {
    color: red;
}

.bookup-contract-name, .bookup-cart-history-item {
    font-weight: bold;
}

.bookup-contract-name {
    font-size: 1.1em;
}

.bookup-contract {
    text-align: right;
    margin-left: auto;
}

.bookup-cart-history-item {
    margin: 5px 0;
}

.available-contracts .bookup-cart-items {
    padding-top: 30px;
    display: inline-flex;
    width: 100%;
}

.contract-item {
    border-bottom: 1px solid #e6e6e6;
}

    .contract-item:first-child {
        border-top: 1px solid #e6e6e6;
    }

.bookup-cart-subitems {
    padding: 6px 0;
}


.bookup-cart-name.bookup-contract-name {
    display: inline-block;
}

.bookup-cart-history, .bookup-cart-name.bookup-contract-name {
    margin-left: 15px;
}

.bookup-cart-items + .media-bookup {
    margin-left: 35px;
}

.bookup-cart-show-history-btn {
    width: 20px;
}

    .bookup-cart-show-history-btn i {
        font-size: 1.6em;
        font-weight: bolder;
        float: left;
        margin: 6px 0;
        /* color: #FF6600*/
    }

.cardmanagement-button {
    max-width: 100%;
    white-space: normal;
}

    .cardmanagement-button[disabled] {
        background-color: grey;
    }

.bookup-cart-item-old-price {
    text-decoration: line-through;
}

.DivColumn, .media-buttons, .feratel-card-validation {
    display: inline-block;
}

    .media-buttons .feratel-card-validation {
        padding: 0;
    }

.media-buttons, .feratel-card-validation {
    float: right;
    text-align: right;
}

    /*.feratel-card-validation {
    margin-left: 30px;
}*/

    .feratel-card-validation * {
        display: inline-block;
        vertical-align: middle;
    }

    .approval-container label,
    .feratel-card-validation label {
        margin-left: 15px;
    }

    .approval-container .required,
    .feratel-card-validation .required {
        margin-right: 10px;
    }

    .feratel-card-validation .dropdown-content {
        display: none;
        min-width: 240px;
    }

    .feratel-card-validation .dropdown-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

.approval-container .select-wrap {
    width: auto;
}

.feratel-card-validation .select-wrap {
    margin-right: 14px;
    width: auto;
}

    .approval-container .approval-attribute-select,
    .approval-container .select-wrap .select-box,
    .feratel-card-validation .select-wrap .select-box {
        font-size: 14px;
        height: 46px;
        padding: 14px 25px 14px 10px;
        margin: 0 5px;
    }

.feratel-card-validation .validate-feratel-card-media-button {
    margin: 0;
}

.feratel-card-validation .feratel-close-icon::after {
    margin: 8px 10px 0px 0px;
}

.feratel-card-validation.fixed {
    min-width: 300px;
}

.card-managment-page .notification {
    display: inline-block;
    font-size: 15px;
    margin: 0;
    border: none;
    background-color: #FF6600;
    padding: 10px 20px;
    color: #FFF;
    position: relative;
}

.notification .badge {
    display: none;
    position: absolute;
    top: -10px;
    right: -10px;
    padding: 5px 10px;
    border-radius: 50%;
    background: #e6ffff;
    color: black;
    text-align: center;
}

.panel-btn {
    margin-top: 10px;
}

    .panel-btn .cardmanagement-button {
        margin: 5px !important;
    }

.card-managment-page .general-info {
    display: flex;
}

.renewal-cards .feratel-card-validation .label-row,
.renewal-cards .feratel-card-validation .label-row {
    display: inline-block;
}

.card-managment-page .with-icon, .renewal-cards .with-icon {
    height: 46px;
    padding: 11px !important;
    background-position: center;
    background-repeat: no-repeat;
    min-width: 46px;
}

    .card-managment-page .with-icon.addBookupToCartButton {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.5033 19.7915L20.4315 6.28608C20.3648 5.41594 19.6289 4.73438 18.7563 4.73438H16.6393V4.63922C16.6393 2.08111 14.5582 0 12.0001 0C9.44207 0 7.36096 2.08111 7.36096 4.63917V4.73433H5.24399C4.37132 4.73433 3.63543 5.41589 3.56886 6.2842L2.49669 19.7933C2.41372 20.8749 2.78896 21.9518 3.52611 22.7476C4.26327 23.5435 5.30825 24 6.39308 24H17.6071C18.6919 24 19.7369 23.5435 20.4741 22.7476C21.2112 21.9517 21.5864 20.8749 21.5033 19.7915ZM8.76669 4.63917C8.76669 2.85628 10.2172 1.40578 12.0001 1.40578C13.7829 1.40578 15.2335 2.85633 15.2335 4.63917V4.73433H8.76669V4.63917ZM19.4427 21.7924C18.9637 22.3095 18.3119 22.5942 17.6071 22.5942H6.39313C5.68832 22.5942 5.03647 22.3095 4.5575 21.7924C4.07858 21.2753 3.84449 20.6035 3.8983 19.9027L4.97033 6.39352C4.98121 6.25139 5.1014 6.14011 5.24394 6.14011H7.36091V7.87144C7.36091 8.25961 7.67563 8.57433 8.0638 8.57433C8.45197 8.57433 8.76669 8.25961 8.76669 7.87144V6.14011H15.2335V7.87144C15.2335 8.25961 15.5482 8.57433 15.9364 8.57433C16.3246 8.57433 16.6393 8.25961 16.6393 7.87144V6.14011H18.7563C18.8988 6.14011 19.019 6.25139 19.03 6.39539L20.1018 19.9008C20.1557 20.6035 19.9216 21.2753 19.4427 21.7924Z' fill='white'/%3E%3C/svg%3E%0A");
    }

    .card-managment-page .with-icon.bookup-free-value-button,
    .card-managment-page .with-icon.validate-feratel-card-media-button,
    .renewal-cards .with-icon.validate-feratel-card-media-button {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='19' viewBox='0 0 24 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24.5001 1.89594L22.3695 0.000183105L9.1455 14.6737L1.47042 7.42476L-0.499878 9.48396L9.31055 18.7502L24.5001 1.89594Z' fill='white'/%3E%3C/svg%3E%0A");
    }

    .card-managment-page .with-icon.remove-bookup-btn {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0)'%3E%3Cpath d='M5.59217 21.9878C5.64832 23.1175 6.57396 23.9999 7.70719 23.9999H16.2929C17.4262 23.9999 18.3519 23.1176 18.4079 21.9878L19.6446 7.76465H4.35547L5.59217 21.9878ZM14.1177 11.2941H15.5295V19.0588H14.1177V11.2941ZM11.2942 11.2941H12.706V19.0588H11.2942V11.2941ZM8.47067 11.2941H9.88243V19.0588H8.47067V11.2941Z' fill='white'/%3E%3Cpath d='M15.5294 3.52941V2.11765C15.5294 0.950024 14.5794 0 13.4117 0H10.5882C9.42057 0 8.47054 0.950024 8.47054 2.11765V3.52941H2.82349V6.35294H21.1764V3.52941H15.5294ZM9.88231 3.52941V2.11765C9.88231 1.72842 10.199 1.41176 10.5882 1.41176H13.4117C13.801 1.41176 14.1176 1.72842 14.1176 2.11765V3.52941H9.88231Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    }

    .card-managment-page .with-icon.edit-bookup-btn {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0)'%3E%3Cpath d='M14.6852 3.37655L3.43604 14.6257L9.37987 20.5696L20.6291 9.32038L14.6852 3.37655Z' fill='white'/%3E%3Cpath d='M23.6419 4.78296L19.2521 0.330899C18.8162 -0.104967 18.1313 -0.104967 17.7265 0.299766C17.7265 0.299766 17.7265 0.299766 17.6954 0.330899L15.7651 2.26116L21.7116 8.23876L23.6419 6.30849C24.0777 5.87263 24.0777 5.18769 23.6419 4.78296Z' fill='white'/%3E%3Cpath d='M2.56475 15.9287L0.105222 22.529C-0.112711 23.0894 0.167489 23.7121 0.727888 23.93C0.976954 24.0234 1.25715 24.0234 1.50622 23.93L8.10648 21.4393L2.56475 15.9287Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    }

    .card-managment-page .with-icon.renew-button,
    .card-managment-page .renew-button span.with-icon,
    .card-managment-page .with-icon.prolong-package-button,
    .card-managment-page .prolong-package-button span.with-icon {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.4686 10.1203C19.7271 10.1203 19.126 10.7214 19.126 11.463V17.8851C19.126 17.9152 19.0689 17.9748 19.0321 17.9748H8.85479V15.204C8.85479 14.7923 8.60009 14.5048 8.23543 14.5048C8.09586 14.5048 7.95515 14.5483 7.81727 14.6343L1.37117 18.648C1.13527 18.7949 1.00007 19.0159 1 19.2541C1 19.4913 1.13426 19.7109 1.36842 19.8568L7.81713 23.8704C7.95522 23.9564 8.09586 24 8.23543 24C8.60009 24 8.85479 23.7125 8.85479 23.3008V20.6601H19.0321C20.5385 20.6601 21.8113 19.3892 21.8113 17.8851V11.463C21.8113 10.7214 21.2102 10.1203 20.4686 10.1203Z' fill='white'/%3E%3Cpath d='M22.1145 4.14319L15.6658 0.129632C15.5277 0.0436359 15.3871 0 15.2475 0C14.8828 0 14.6281 0.287527 14.6281 0.699248V3.33996H4.45083C2.94439 3.33996 1.67163 4.61077 1.67163 6.11493V12.5371C1.67163 13.2786 2.27273 13.8797 3.01427 13.8797C3.75581 13.8797 4.35692 13.2786 4.35692 12.5371V6.11493C4.35692 6.08479 4.41405 6.02524 4.45083 6.02524H14.6281V8.79605C14.6281 9.20771 14.8828 9.49523 15.2475 9.49523C15.3871 9.49523 15.5278 9.45166 15.6657 9.36574L22.1117 5.35197C22.3477 5.20509 22.4829 4.98416 22.4829 4.74591C22.4829 4.50873 22.3487 4.28914 22.1145 4.14319Z' fill='white'/%3E%3C/svg%3E%0A");
    }

    .card-managment-page .with-icon.bookup-events-bookup-btn {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.4 2.40002H19.2V0H16.8V2.40002H7.19997V0H4.79995V2.40002H3.59997C2.27399 2.40002 1.21199 3.474 1.21199 4.80003L1.19995 21.6C1.19995 22.926 2.27393 24 3.59997 24H20.4C21.726 24 22.8 22.926 22.8 21.6V4.79998C22.7999 3.474 21.726 2.40002 20.4 2.40002ZM20.4 21.6H3.59997V8.39997H20.4V21.6Z' fill='white'/%3E%3Cpath d='M17.4359 12.072L16.164 10.8L10.3079 16.656L7.76398 14.112L6.49194 15.384L10.3079 19.2L17.4359 12.072Z' fill='white'/%3E%3C/svg%3E%0A");
    }

    .card-managment-page .with-icon.history-icon {
        background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 70 70'%3E%3C!-- Generator: Adobe Illustrator 29.0.1, SVG Export Plug-In . SVG Version: 2.1.0 Build 192) --%3E%3Cdefs%3E%3Cstyle%3E .st0 %7B fill: %23fff; %7D %3C/style%3E%3C/defs%3E%3Cpath class='st0' d='M51.2,47l-7.5-7.5c1.5-2.2,2.2-4.5,2.3-7.5,0-7.8-6.3-14-14-14s-14,6.3-14,14,6.3,14,14,14,5.4-.9,7.5-2.3l7.5,7.5c.6.6,1.4.9,2.1.9s1.5-.3,2.1-.9h.1c1.1-1.1,1.1-3.1,0-4.2ZM31.8,43c-6.2,0-11.1-4.9-11.1-11.1s5-11.1,11.1-11.1,11.1,4.9,11.1,11.1-4.9,11.1-11.1,11.1Z'/%3E%3Cpath class='st0' d='M30.6,28.4c.1.1.6.2.9.2,1.3,0,2.3-1.1,2.2-2.3-.1-1.5-1.6-2.4-3.1-1.7h0c-1.7.9-1.6,3.1,0,3.8Z'/%3E%3Cpolygon class='st0' points='29.4 38.3 33.8 38.3 33.8 34.5 33.8 34.4 33.8 30.6 29.4 30.6 29.4 38.3'/%3E%3C/svg%3E");
    }

.download-icon {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 70 70' style='enable-background:new 0 0 70 70;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill-rule:evenodd;clip-rule:evenodd;fill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M35.1,40.1c-0.3,0-0.5-0.1-0.7-0.3l-6.6-7c-0.6-0.6-0.1-1.6,0.7-1.6H32v-7.3c0-0.9,0.7-1.6,1.6-1.6h3.1 c0.9,0,1.6,0.7,1.6,1.6v7.3h3.4c0.8,0,1.2,1,0.7,1.6l-6.6,7C35.6,39.9,35.4,40.1,35.1,40.1z'/%3E%3Cpath class='st0' d='M20.1,45.9c0,1,1,1.8,2.2,1.8H48c1.2,0,2.2-0.8,2.2-1.8v-0.5c0-1-1-1.8-2.2-1.8H22.3c-1.2,0-2.2,0.8-2.2,1.8 C20.1,45.4,20.1,45.9,20.1,45.9z'/%3E%3C/svg%3E%0A");
}

.download-qr-icon {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 70 70' style='enable-background:new 0 0 70 70;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D .st1%7Bfill-rule:evenodd;clip-rule:evenodd;fill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M45.4,24.7h-4.8v4.8h4.8V24.7z'/%3E%3Cpath class='st0' d='M29.5,24.7h-4.8v4.8h4.8V24.7z'/%3E%3Cpath class='st0' d='M34.2,34.2H20V20h14.3V34.2z M22.6,31.7h9.1v-9.3h-9.1V31.7z'/%3E%3Cpath class='st0' d='M34.2,50H20V35.8h14.3V50z M22.6,47.5h9.1v-9.3h-9.1V47.5z'/%3E%3Cpath class='st0' d='M50,34.2H35.8V20H50V34.2z M38.4,31.7h9.1v-9.3h-9.1V31.7z'/%3E%3Cpath class='st0' d='M29.5,40.6h-4.8v4.8h4.8V40.6z'/%3E%3Cpath class='st1' d='M43,48.5c-0.2,0-0.3-0.1-0.4-0.2L39.1,44c-0.3-0.4-0.1-1,0.4-1h1.8v-4.6c0-0.6,0.4-1,0.8-1h1.6 c0.5,0,0.8,0.4,0.8,1V43h1.8c0.4,0,0.6,0.6,0.4,1l-3.5,4.4C43.2,48.4,43.1,48.5,43,48.5z'/%3E%3C/svg%3E%0A");
}

.download-google-icon {
    background-size: 70px;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 70 70' style='enable-background:new 0 0 70 70;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M40.1,50.1c-0.5-7.5-3.5-15.7-9.3-24.8h7c3.9,5.4,8.7,14,9.7,24.8H40.1z M48.1,47.8C47.3,41.9,45.2,36,42,30.3 c-0.3-3.4-0.9-6.7-1.8-10c0-0.1,0-0.2,0.1-0.3c0.1-0.1,0.2-0.1,0.3-0.1h6c0.4,0,0.7,0.3,0.8,0.6c1.4,5,2.1,9.9,2.1,14.5 C49.6,39.2,49,43.8,48.1,47.8z M26.8,44.6c-1.4-5-3.6-9.2-6.3-12.7c-0.1-0.1-0.1-0.3,0-0.3c0-0.1,0.2-0.2,0.3-0.2h6.4 c0.3,0,0.6,0.1,0.7,0.4c2.6,3.5,4.2,7.4,5.5,12.9H26.8z M34.1,43.3c-0.9-3.5-1.8-6.5-3.7-9.5c0.3-1.7,0.3-3.4,0.2-5.2 c0-0.6,0-1.2,0-1.8c2.2,3.7,4,7.1,5.4,10.4C35.5,39.3,34.8,41.3,34.1,43.3z'/%3E%3C/svg%3E%0A");
}

.download-apple-icon {
    background-size: 70px;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 70 70' style='enable-background:new 0 0 70 70;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M34.8,47.7c-3.6,0-7.2,0-10.8,0c-2.7,0-4-1.3-4.1-4c0-5.8,0-11.7,0-17.5c0-2.6,1.3-3.9,3.9-3.9 c7.4,0,14.8,0,22.1,0c2.6,0,3.9,1.3,4,3.9c0,5.9,0,11.8,0,17.7c0,2.5-1.3,3.8-3.8,3.8C42.4,47.7,38.6,47.7,34.8,47.7z M35.1,33.8 c-1.3,0-2.6,0-3.8,0c-2.5,0-5,0-7.5,0c-1,0-1.5,0.6-1.5,1.6c0,1.1,0.9,0.7,1.4,0.7c1.3,0.1,2.6,0.1,3.8,0c1.8-0.1,3,0.7,3.9,2.2 c2,3.3,5,3.3,7,0c0.9-1.5,2.2-2.3,4-2.2c1.3,0,2.7,0,4,0c0.4,0,1.1,0.3,1.2-0.5c0.1-0.6,0-1.2-0.6-1.5c-0.4-0.2-1-0.2-1.5-0.2 C42.1,33.8,38.6,33.8,35.1,33.8z M35,26.9c3.8,0,7.7,0,11.5,0c0.4,0,1.1,0.3,1.2-0.6c0-0.7,0-1.3-0.8-1.6c-0.4-0.2-0.9-0.1-1.3-0.1 c-7.1,0-14.2,0-21.3,0c-0.3,0-0.5,0-0.8,0c-1,0.1-1.3,0.7-1.3,1.6c0,1.1,0.9,0.7,1.4,0.7C27.5,26.9,31.2,26.9,35,26.9z M34.9,31.5 c3.8,0,7.7,0,11.5,0c0.5,0,1.2,0.4,1.3-0.6c0-0.9-0.2-1.5-1.2-1.7c-0.4,0-0.8,0-1.2,0c-6.9,0-13.8,0-20.8,0c-0.4,0-0.8,0-1.2,0 c-1,0.1-1.2,0.8-1.2,1.7c0,1,0.8,0.6,1.3,0.6C27.3,31.5,31.1,31.5,34.9,31.5z'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.card-managment-page .general-info .media-buttons {
    margin-left: auto;
    display: inline-flex;
    flex-direction: column;
}

.card-managment-page .media-bookup {
    display: flex;
    padding: 0 0 30px 0;
    margin: 0;
}

.card-managment-page .bookup-cart .bookup-item-wrapper,
.card-managment-page .bookup-cart .bookup-cart-footer {
    border-top: 1px solid #C4C4C4;
    text-align: left;
}

.card-managment-page .bookup-cart .bookup-cart-footer {
    padding: 30px 0 0 0;
}

.bookup-cart .bookup-item-wrapper {
    padding: 30px 0;
}

.bookup-cart .bookup-cart-items:first-child {
    margin: 0;
}

.bookup-cart .bookup-cart-items {
    margin-top: 20px;
    display: inline-flex;
    width: 100%;
}

.bookup-cart .bookup-cart-subitems {
    margin-left: 30px;
    display: inline-flex;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 28px;
    padding: 8px 0;
    color: #1D1D1B;
    width: 85%;
}

.bookup-cart .bookup-cart-name {
    margin-right: 5px;
}

    .bookup-cart .bookup-cart-name .sub-names {
        font-size: 16px;
    }

.media-bookup .title,
.media-bookup .bookup-label {
    padding: 9px 0;
    font-style: normal;
    font-weight: bold;
    font-size: 1.1em;
    line-height: 28px;
    margin-right: 40px;
    margin-bottom: 5px;
}

.bookup-free-value-section {
    margin-left: auto;
}

.bookup-free-value-section {
    display: inline-flex;
}

.bookup-wrapper {
    max-width: 500px;
    display: inline-table;
}

.card-managment-page input[name="bookupValue"] {
    min-height: 46px;
    margin: 0;
}

.bookup-cart {
    text-align: right;
}

    .bookup-cart .bookup-cart-footer {
        display: inline-block;
    }

        .bookup-cart .bookup-cart-footer .total {
            font-style: normal;
            font-weight: 600;
            font-size: 22px;
            line-height: 28px;
            color: #1D1D1B;
            margin-right: 47px;
            padding: 6px 0;
        }

.card-managment-page .address-list-page .info,
.card-managment-page .order-list-page .info {
    margin: 0 0 20px;
    border-top: 1px solid #e6e6e6;
    background-color: #f9f9f9;
    padding: 30px 20px;
    line-height: 26px;
    color: #444;
}

.card-managment-page .bookup-inputs {
    margin: 0;
}

.card-managment-page .bookup-cart-remove {
    text-align: left;
    width: auto;
}

.card-managment-page .bookup-button-big {
    min-width: initial;
    margin: 0 5px 5px 0;
}

.card-managment-page .bookup-label {
    width: auto;
    display: inline-block;
}

.card-managment-page .ui-tabs-panel .panel-btn {
    display: inline-flex;
}

.card-managment-page .panel-btn .bookup-button-info {
    margin-left: 0 !important;
}

input.cardmanagement-button.with-icon,
button.cardmanagement-button.with-icon {
    margin: 0 5px;
    min-width: 46px;
    height: 46px;
}

span.cardmanagement-button.with-icon {
    max-width: 46px;
}

.bookup-cart-items .bookup-cart-subitems {
    width: 70%;
}

.bookup-inputs .bookup-free-value-section::after,
.bookup-wrapper::after,
.general-info::after,
.media-buttons::after {
    content: "";
    display: block;
    clear: both;
}

.feratel-card-validation .feratel-card-select {
    height: 46px;
    margin: 0;
}

.bookup-contract-button,
.bookup-inputs input {
    min-height: 46px;
}

.card-managment-page {
    font-size: 14px;
    line-height: 18px;
}

.discount-label {
    padding: 8px 30px 8px 8px;
    position: relative;
    margin-left: 40px;
    float: right;
    -webkit-border-radius: 0 4px 0 4px;
    -moz-border-radius: 0 4px 0 4px;
    border-radius: 0 4px 4px 0;
    background-color: #FF6600;
}

    .discount-label:after {
        right: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        border-color: rgba(136, 183, 213, 0);
        border-width: 16px;
        top: 50%;
        margin-top: -16px;
        border-right-color: #FF6600;
    }

    .discount-label:before {
        content: '';
        z-index: 2;
        position: absolute;
        top: 42%;
        right: 100%;
        width: 7px;
        height: 7px;
        opacity: .95;
        background: #ffffff;
        border-radius: 7px;
        -webkit-box-shadow: inset .5px 0 rgba(0, 0, 0, 0.6);
        box-shadow: inset .5px 0 rgba(0, 0, 0, 0.6);
    }


    .discount-label span {
        font-style: normal;
        font-weight: 600;
        font-size: 12px;
        line-height: 16px;
        display: flex;
        align-items: center;
        color: #fff;
    }

.renew-icon-wrapper {
    position: relative;
    float: right;
    line-height: 33px;
}

.renew-icon {
    padding: 8px 30px 8px 8px;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 5px;
    margin: 0 15px;
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><!-- Generator: Adobe Illustrator 27.9.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve"><style type="text/css">.st0{fill:%23FFFFFF;}</style><path class="st0" d="M10.2,3.5C7.8,3.8,5.8,5.2,4.7,7.3C4.2,8.5,4,9.5,4,10.8c0,1,0.2,1.8,0.6,2.6c0.9,1.9,2.6,3.3,4.6,3.8c0.7,0.2,0.6,0.2,0.8-0.2c0.3-0.5,0.3-0.4-0.1-0.5c-1.8-0.3-3.5-1.5-4.4-3.1c-0.9-1.5-1-3.4-0.4-5.1c0.7-2,2.5-3.5,4.5-3.9c0.5-0.1,1.5-0.1,2-0.1c0.9,0.1,1.9,0.5,2.6,1c2.2,1.5,3.2,4,2.5,6.6l-0.1,0.5l0.2,0.4c0.1,0.2,0.2,0.4,0.3,0.4c0,0,0.3-0.7,0.4-1.2c0.3-1.2,0.2-2.4-0.1-3.6c-0.7-2.3-2.6-4.2-5-4.8C11.9,3.5,11,3.4,10.2,3.5z"/><path class="st0" d="M10.7,6.9L10.6,7v1.6v1.6l-0.9,0.9C8.8,12,8.8,12,8.8,12.2c0,0.1,0,0.2,0.1,0.3c0.3,0.2,0.3,0.2,1.4-0.9l1-1V8.8V7l-0.1-0.1C11.1,6.7,10.8,6.7,10.7,6.9z"/><path class="st0" d="M14.5,11.4c-0.3,0.1-0.2-0.1-2.7,4.1c-0.6,1-1.4,2.3-1.7,2.8c-0.3,0.5-0.6,1-0.6,1.1c-0.1,0.3,0,0.7,0.2,0.9c0.3,0.2,0.1,0.2,4.9,0.2c2.5,0,4.6,0,4.6,0c0.1,0,0.2-0.1,0.4-0.2C19.9,20,20,20,20,19.8c0-0.1,0-0.3,0-0.4c0-0.1-0.4-0.8-0.9-1.7c-0.5-0.8-1.5-2.5-2.2-3.8c-0.7-1.2-1.4-2.3-1.4-2.4C15.2,11.4,14.8,11.3,14.5,11.4z M15.2,14c0.2,0.2,0.3,0.4,0.3,0.9c0,1-0.2,2.2-0.2,2.3c-0.2,0.3-0.6,0.3-0.8,0c-0.1-0.1-0.1-0.4-0.2-1.7c-0.1-1-0.1-1.2,0.1-1.4C14.5,13.9,14.9,13.8,15.2,14z M15,18.3c0.2,0.1,0.3,0.3,0.3,0.5c0,0.1,0,0.2-0.2,0.3c-0.1,0.1-0.2,0.2-0.4,0.2c-0.2,0-0.4-0.1-0.5-0.3c-0.1-0.2-0.1-0.4,0.1-0.5C14.6,18.2,14.8,18.2,15,18.3z"/></svg>');
}

.media-buttons {
    flex-wrap: wrap;
    flex-direction: row;
}

.media-package .linked-media {
    border: 1px solid #C4C4C4;
    box-sizing: border-box;
}

    .media-package .linked-media .media-item {
        position: relative;
    }

        .media-package .linked-media .media-item:not(:last-child):after {
            position: absolute;
            content: '';
            border-top: 1px solid #C4C4C4;
            width: 96%;
            transform: translateX(-50%);
            left: 50%;
            z-index: 1;
        }

        .media-package .linked-media .media-item .info {
            margin: 0;
            border-top: none;
        }

.media-package .bookup-cart {
    margin: 20px 0 30px 0;
}

.media-package .media-package-buttons {
    text-align: right;
    padding-right: 20px;
}

.media-package .prolong-package-button,
.media-package .delete-package-button {
    margin: 0;
}

.media-package .package-options-select {
    margin-top: -5px;
    height: 38px;
    border-bottom: none;
}

.media-item .upgrade-info {
    padding: 10px 0;
}

.media-item .package-upgrade-info {
    /*width: 50%;*/
    text-align: right;
    font-weight: bold;
}

@media all and (max-width: 481px) {
    .card-managment-page .general-info .media-buttons, .card-managment-page .general-info {
        display: block;
        margin: 0;
    }

    .feratel-card-validation {
        width: 100%;
    }

    .general-info .media-buttons button {
        display: inline-block;
    }

    .card-managment-page .media-bookup {
        display: block;
    }

    .bookup-inputs .bookup-free-value-section,
    .bookup-wrapper {
        display: block;
        width: 100%;
    }

    .bookup-inputs .bookup-label {
        width: 100%;
        text-align: left;
    }

    .bookup-inputs .bookup-free-value-section input,
    .bookup-wrapper input {
        float: left;
    }

    .bookup-cart .bookup-cart-subitems,
    .available-contracts .bookup-cart-items {
        display: block;
    }

    .general-info .DivColumn ul li {
        font-size: 14px;
        line-height: 31px;
    }

        .general-info .DivColumn ul li:first-child {
            font-size: 14px;
            line-height: 28px;
        }

    .media-bookup .title,
    .media-bookup .bookup-label {
        margin-right: 0;
        font-size: 14px;
        line-height: 28px;
    }

    .bookup-cart-items .bookup-cart-subitems {
        width: 85%;
        font-size: 13px;
        line-height: 22px;
        text-align: left;
        display: inline-block;
    }

    .bookup-cart-show-history-btn i {
        margin: 9px 0;
    }

    .bookup-contract {
        text-align: center;
    }

    .bookup-cart-items + .media-bookup {
        margin-left: 0;
    }

    input.cardmanagement-button.with-icon, button.cardmanagement-button.with-icon {
        margin: 0 5px;
    }

    .card-managment-page .bookup-inputs {
        margin-bottom: 15px;
    }

    .card-managment-page .bookup-cart-remove {
        margin: auto;
    }

    .bookup-cart .bookup-cart-footer .total {
        font-size: 20px;
        line-height: 28px;
        margin-right: auto;
    }

    .bookup-cart .bookup-cart-footer,
    .bookup-cart-footer button.cardmanagement-button.with-icon {
        margin: 0;
    }

    .cardmanagement-button,
    .card-managment-page .with-icon {
        font-size: 12px;
        line-height: 15px;
    }
}

@media (max-width: 769px) {
    .card-managment-page .page-title h1 {
        font-size: 20px;
        line-height: 32px;
    }

    .bookup-cart .bookup-cart-footer {
        display: flex;
    }

    .bookup-cart-footer .total * {
        display: block;
    }

    .card-managment-page .address-list-page .info,
    .card-managment-page .order-list-page .info {
        padding: 20px;
    }

    .bookup-cart .bookup-cart-name {
        margin-right: 0;
        text-align: right;
    }

    .bookup-cart .bookup-cart-sum {
        float: right;
        text-align: right;
    }

    .feratel-card-validation label {
        margin-left: 0;
    }

    .media-buttons .approval-container,
    .media-buttons .feratel-card-validation {
        padding-top: 30px;
    }

    .media-buttons, .feratel-card-validation,
    .media-item .upgrade-info {
        float: initial;
        padding: 30px 0;
        text-align: center;
    }
}

.media-history-pager button {
    vertical-align: middle
}

    .media-history-pager button.page-selected {
        background-color: rgb(246, 246, 246);
        font-size: 1.1em;
        font-weight: bold;
        color: black;
    }
