@import "../fonts/Roboto/font.css";
*{
    margin: 0;
    padding: 0;
}
body{
    font-family: "Roboto";
}

a{
    text-decoration: none;
}
.uk-button {line-height: 40px!important;}

.header-main{position: relative;display: flex;align-items: center;justify-content: space-between;width: 100%;padding: 10px 0;margin-bottom: 20px;border-bottom: 1px solid #e4e4e4}
.header-logo img{width: 315px;height: 85px;object-fit: contain}
.banner-box{display: flex;align-items: center}
.banner-box img{width: 100%;height: 100px;object-fit: contain}
.header-user-icon{margin-right: 10px}
.header-user-basket-count{position: relative;margin-right: 20px}
.basket-count-btn{position: absolute;top: -15px;left: 16px;background: #e63638;font-size: 12px;font-weight: bold;padding: 3px 8px;color: white;border-radius: 4px;}
.header-right{display: flex;align-items: center;justify-content: end}

.thm-btn--header-black {padding: 15px 20px;background-color: #0c111d;}
.thm-btn--header-black i {margin-left: 10px;}
.thm-btn--new {overflow: hidden;color: #fff;border-radius: 7px;-webkit-border-radius: 7px;-moz-border-radius: 7px;-ms-border-radius: 7px;-o-border-radius: 7px;-webkit-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;z-index: 1;font-size: 16px;font-weight: 500;line-height: 16px;border-style: none;align-self: center;position: relative;display: inline-flex;align-items: center;justify-content: center;text-transform: inherit;}
.thm-btn--new::before {position: absolute;content: '';z-index: -1;height: 200%;width: 200%;left: 50%;bottom: -200%;transform: translateX(-50%);border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;-ms-border-radius: 50%;-o-border-radius: 50%;-webkit-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;background: #e63638;}
.thm-btn--new:hover {color: #fff;transform: translateY(-2px);}
.thm-btn--new:hover::before {bottom: -70%;}

.page-left-box{/*background: #e4eaf7;*/padding: 20px;border-radius: 15px;position: relative;z-index: 1}
.page-left-box::before{    position: absolute;top: 0;left: 0;height: 100%;width: 100%;content: '';z-index: -1;border-radius: 8px;-webkit-border-radius: 8px;-moz-border-radius: 8px;-ms-border-radius: 8px;-o-border-radius: 8px;background: linear-gradient(122deg, rgba(255, 217, 17, 0) 0%, rgba(233, 226, 255, 0.8) 34.54%, #cae1f7 62.5%, rgba(250, 232, 138, 0.56) 100%), radial-gradient(74.51% 50% at 50% 100%, white 24.0899994969%, white 100%);}
.section-head{height: 50px;border: 1px solid #e5e5e5;padding: 0 18px;position: relative;font-size: 16px;line-height: 50px;text-transform: uppercase;font-weight: 500;color: #0c111d;border-radius: 4px 8px 8px 0px;}
.section-head::before {content: "";display: block;position: absolute;width: 5px;height: calc(100% + 2px);top: -1px;left: -1px;border-radius: 4px;background: #e63638;}
.sub-title {font-weight: 500;font-size: 14px;width: 100%;background: #fff;padding: 5px 15px;margin-bottom: 15px;display: inline-flex;align-items: center;border-radius: 8px;-webkit-border-radius: 8px;-moz-border-radius: 8px;-ms-border-radius: 8px;-o-border-radius: 8px;color: #0c111d;box-shadow: 0 2px 4px 0 rgba(44, 64, 94, 0.08), 0 1px 1px 0 rgba(44, 64, 94, 0.04), 0 0 0 1px rgba(44, 64, 94, 0.06);}
.sub-title i {margin-right: 6px;font-size: 16px;color: #e63638}
.bottom-banner{margin-top: 20px}
.bottom-banner img{}

.left-section{position: relative;z-index: 2;font-size: 18px;text-transform: uppercase;line-height: 25px;font-weight: 500;color: #0c111d}
.left-name{font-size: 16px;line-height: 20px;font-weight: 400;color: #000}
.left-name a{color: #000}
.bottom-list{margin-top: 20px}
.left-banner-box{margin-top: 20px}

.xb-item--item {padding-left: 20px;margin-left: 20px;margin-top: 10px;margin-bottom: 10px;position: relative;}
.xb-item--item::before {position: absolute;content: '';left: 0;top: 0;width: 4px;height: 100%;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;background: #e63638;}
.xb-item--number {font-size: 20px;font-weight: 400;display: block;margin-bottom: 7px;color: #000;line-height: 20px;}
.pg-det-btn .cp-btn {font-size: 18px;margin-top: 7px;display: block;text-align: center;padding: 5px 20px;line-height: 25px;}
.cp-btn {font-weight: 500;color: #fff;border-radius: 8px;-webkit-border-radius: 8px;-moz-border-radius: 8px;-ms-border-radius: 8px;-o-border-radius: 8px;-webkit-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;background: #000;display: inline-block;}
.pg-det-btn .cp-btn:hover {background: #e63638;color: #fff;}

.digital-list-price-box ul{padding-left: 30px;margin: 0}
.digital-list-price-box ul li{list-style: none;padding-bottom: 10px;margin-bottom: 10px;border-bottom: 1px solid #e4e4e4}
.digital-list-price{display: flex;align-items: center;justify-content: space-between}
.digital-list-price-name{display: flex;justify-content: space-between;font-size: 16px;line-height: 20px;font-weight: 400;color: #363636}
.digital-list-price-name-pap{display: flex;justify-content: space-between;font-size: 16px;line-height: 20px;font-weight: 400;color: #363636}
.digital-list-price-data{display: flex;justify-content: end;font-size: 14px;font-weight: bold;}
.digital-list-price-btn{padding: 5px 10px;border-radius: 10px;font-size: 14px;background: #069539;color: #fff}

.default-list-price-box ul{padding-left: 30px;margin: 0}
.default-list-price-box ul li{list-style: none;margin-bottom: 10px}
.default-list-price{display: flex;align-items: center;justify-content: space-between}
.default-list-price-name{font-size: 16px;line-height: 20px;font-weight: 400;color: #363636}
.default-list-price-btn{padding: 5px 10px;border-radius: 10px;font-size: 14px;background: #069539;color: #fff}

.login-area {padding: 20px;min-height: 400px;background: #f6f6f8;position: relative;overflow: hidden;border: 2px solid #e7e8ec;border-radius: 15px;-webkit-border-radius: 15px;-moz-border-radius: 15px;-ms-border-radius: 15px;-o-border-radius: 15px;}
.login-area::before {position: absolute;content: '';top: 0;left: 0;height: 100%;width: 100%;opacity: 0;z-index: 1;-webkit-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;background: linear-gradient(122deg, rgba(255, 217, 17, 0) 0%, rgba(233, 226, 255, 0.8) 34.54%, #cae1f7 62.5%, rgba(250, 232, 138, 0.56) 100%), radial-gradient(74.51% 50% at 50% 100%, white 24.0899994969%, white 100%);}
.login-area:hover::before {opacity: 1;}
.login-item-btn .cp-btn {font-size: 18px;margin-top: 15px;display: block;text-align: center;padding: 13px 20px;line-height: 25px;border: none;}
.login-item-btn .cp-btn:hover {background: #e63638;color: #fff;}

.search-area{display: flex;align-items: center;justify-content: space-between;margin-bottom: 20px;border-bottom: 1px solid #d1d1d1;padding-bottom: 20px;}
.search-txt{    margin-right: 10px;font-size: 19px;line-height: 20px;font-weight: 500;color: #000;text-align: end;display: flex;justify-content: end;}
.search-txt i{color: #e63638;width: 40px;font-size: 22px;height: 40px;background: #f8f8f8;display: flex;align-items: center;justify-content: center;border-radius: 5px;}
.bottom-info{margin: 15px 0;text-align: center}
.bottom-info p{font-size: 16px;line-height: 20px;color: #676a7b}
.bottom-info a{color: #e63638}
.ds-sign-in-link-item a{color: #e63638}
.login-btn{padding: 5px 25px;background: #e63638;border-radius: 8px;color: #fff}
.page-over{padding: 30px 0}

.signin-body{position: relative}
.signup-box{position: absolute;right: 0;padding: 5px 15px;background: #e63638;border-radius: 20px}
.signup-box a{font-size: 16px;line-height: 20px;font-weight: 600;color: #fff}
.signin-box{width: 600px;margin: auto;position: relative}
.signin-width{position: relative;z-index: 2;width: 400px;margin: auto}
.signup-width{position: relative;z-index: 2;width: 400px;margin: auto}
.phone-list{padding-left: 30px;display: flex;align-items: baseline;justify-content: space-between}
.list-name{margin-right: 15px;font-size: 16px;line-height: 29px;font-weight: 400;color: #363636}
.list-data{padding: 7px 17px;border-radius: 10px;margin-bottom: 10px;font-size: 14px;line-height: 20px;font-weight: 600;background: #fff;color: #0c111d;box-shadow: 0 2px 4px 0 rgba(44, 64, 94, 0.08), 0 1px 1px 0 rgba(44, 64, 94, 0.04), 0 0 0 1px rgba(44, 64, 94, 0.06);}
.list-data i{margin-right: 10px;font-size: 16px;color: #e63638}
.list-data a{color: #363636}
.bottom-box{padding: 15px;border: 1px solid #e4e4e4;border-radius: 10px}
.bottom-title{font-size: 10px;line-height: 16px;font-weight: 600;color: #000;text-align: center}
.qr-img{width: 100px;margin: auto}
.uk-width-1-7\@m{width: 15%;}

.ss-card {
    box-shadow: 0 0 20px 0 rgb(76 87 125 / 30%)!important;
}
.ss-card-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.card-body {
    flex: 1 1 auto;
    padding: 1rem 1rem;
}
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 0.25rem;
}
.coreOrder-box {
    display: flex;
}
.checkout-text .total-price {
    font-size: 28px;
    font-weight: 700;
}
.checkout-text{display: flex;align-items: center;justify-content: space-between}
.ss-card-item-in {display: flex;align-items: center;}
.ss-card-item-nth{padding-left: 10px}
.basket {margin-bottom: 30px;padding: 15px;background: white;border-radius: 8px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);}

.basket-item {display: flex;padding: 20px;box-sizing: border-box;flex-wrap: wrap;background: #ededed;border-radius: 10px;margin-bottom: 20px}
.basket-item > *{margin-right: 20px;}
.my-card-title{font-size: 18px;line-height: 30px;text-transform: uppercase;font-weight: bold;border-bottom: 1px solid #d1d7dc;padding-bottom: 15px;margin-bottom: 15px;}
.basket-item-order{border: 0;}
.basket-item__thumbnail {
    position: relative;
    flex: 0 1 auto;
    min-width: 130px;
    max-width: 130px;
    border: 2px solid #ddd;
    border-radius: 8px;
}
.basket-item__context {
    flex: 1 1;
    font-size: 12px;
}
.basket-item__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
}
.basket-item--price{display: flex;align-items: center}
.basket-item-data{font-size: 18px;line-height: 22px;font-weight: 500;color: #000}
.basket-item__actions > * {display: block;}


.basket-item__thumbnail img {
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.05);
    object-fit: cover;
    object-position: top;
    border-radius: 8px;
}
.basket-item__name, .basket-item__name a {
    padding-bottom: 10px;
    font-size: 18px;
    line-height: 22px;
    font-weight: 500;
    color: #000;
}
.action_button-danger{padding: 10px 15px;background: #fff;border-radius: 10px;color: #f0506e;font-size: 16px;font-weight: 500}
.basket-item__desc {
    display: flex;
    align-items: center;
}
.basket-item__desc p{
    margin: 0;
}
.basket-item__desc ul{
    padding: 0;
}
.basket-item__desc ol{
    padding: 0;
}

.btn {
    display: inline-block;
    font-weight: 600;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.coreOrder-right-box{padding: 15px;background: white;border-radius: 8px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);}
.coreOrder-top-info{display: flex;align-items: center;justify-content: space-between;border-bottom: 1px solid #ededed;padding-bottom: 5px;margin-bottom: 5px}
.coreOrder-item{font-size: 16px;color: #023a51}
.btn-dark {background: #fff;color: #000;border: 2px solid #e63638;}
.btn-dark:hover {color: #fff;background-color: #1c1f23;border-color: #1a1e21;}

.home-list-box{padding: 10px;background: #f6f6f8;position: relative;overflow: hidden;cursor: pointer;border: 1px solid #e7e8ec;border-radius: 15px;-webkit-border-radius: 15px;transition: 1s ease-in-out}
.home-list-box:not(:last-child) {margin-bottom: 30px;}
.home-list-box::before {position: absolute;content: '';top: 0;left: 0;height: 100%;width: 100%;opacity: 0;z-index: 1;-webkit-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;background: linear-gradient(122deg, rgba(255, 217, 17, 0) 0%, rgba(233, 226, 255, 0.8) 34.54%, #cae1f7 62.5%, rgba(250, 232, 138, 0.56) 100%), radial-gradient(74.51% 50% at 50% 100%, white 24.0899994969%, white 100%);}
.home-list-box:hover::before {opacity: 1;}
.home-list-box:hover {transform: scale(1.03);transition: 1s ease-in-out}
.home-list-box .home-list-item {position: relative;z-index: 2;padding: 10px;background: #fff;border: 1px solid #e6e7ec;border-radius: 10px;-webkit-border-radius: 10px;-moz-border-radius: 10px;-ms-border-radius: 10px;-o-border-radius: 10px;}
.home-list-img{width: 100%;height: 310px;overflow: hidden;border-radius: 8px;}
.home-list-img img{width: 100%;height: 100%;object-fit: cover;transition: 1s ease-in-out; object-position: top;}
.home-list-date{margin: 10px 0;font-size: 16px;line-height: 20px;font-weight: 500;color: #0c111d}
.home-list-date i{color: #e63638}
.button-container {display: block;}
.bookmark {width: 100%;display: flex;align-items: center;justify-content: center;margin-bottom: 10px;font-size: 12px;text-transform: uppercase;font-weight: 500; text-align: center;padding: 5px 15px;color: #e63638;border: 2px solid #e63638; border-radius: 8px;transition: 1s ease-out}
.read-button {width: 100%;border: 2px solid #e63638;color: #e63638;text-align: center;padding: 5px 15px;text-decoration: none;border-radius: 8px;cursor: pointer;font-size: 12px;text-transform: uppercase;font-weight: 500;transition: 1s ease-out}

.home-list-bottom-info {bottom: 0;left: 0;position: absolute;width: 100%;z-index: 0;right: 0;padding: 10px 20px;box-sizing: border-box;}
.home-list-date {opacity: 0;-webkit-transform: translate3d(0, 20px, 0);transform: translate3d(0, 20px, 0);transition: .25s ease-out}
.button-container {opacity: 0;-webkit-transform: translate3d(0, 40px, 0);transform: translate3d(0, 40px, 0);transition: .35s ease-in}
.home-list-box:hover .home-list-bottom-info {background:linear-gradient(180deg, transparent 0, hsl(359.32deg 1.2% 64.91% / 63%) 70%);border-bottom-left-radius: 10px;border-bottom-right-radius: 10px}
.home-list-box:hover .home-list-date {opacity: 1;transform: translateZ(0);}
.home-list-box:hover .button-container {opacity: 1;transform: translateZ(0);}
.home-list-box:hover .home-list-img img{transform: scale(1.1);transition: 1s ease-in-out}
.bookmark:hover{transform: scale(1.0);transition: 1s ease-in-out}
.read-button:hover{transform: scale(1.0);transition: 1s ease-in-out}

.signup{display: flex;align-items: center;padding-left: 30px;margin-bottom: 30px}
.signup p{margin-bottom: 0}
.list-head{display: flex;align-items: center;flex-wrap: wrap}

.pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 20px 0;
}
@media only screen and (max-width: 479px) {
    .pagination {
        margin-bottom: 20px;
    }
}

.pagination.center {-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: end;-ms-flex-align: end;align-items: flex-end;}
.pagination li {border: 2px solid #ededed;}

.pagination .uk-disabled{padding: 10px 15px}
.pagination li a {font-size: 12px;font-weight: 500;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;line-height: 25px;padding: 10px 15px;text-transform: uppercase;color: #e63638;}

@media only screen and (max-width: 479px) {
    .pagination li a {
        width: 55px;
        height: 40px;
    }
}

.pagination li:hover {border: 2px solid #e63638;font-weight: 500;color: #000;}
.pagination li.active {cursor: default;pointer-events: none;font-weight: bold;color: #fff;background-color: #e63638;border: 2px solid #e63638}

@media (max-width: 900px) {
    .header-logo img{width: 220px;height: 70px;}
    .mobile-header-top{display: flex}
    .mobile-btm{display: block}
    .ss-card-item{display: block}
    .ss-card-item-in{display: block}
    .ss-card-item-nth{padding-left: 0}
    .gap-2 a{margin-bottom: 10px;margin-top: 10px}
    .ss-card #list-target{padding: 0!important;}
    .list-head{display: block}
    .list-head div{margin-bottom: 10px}
    .login-btn{padding: 15px}
    .header{margin: 0}
    .signin-box{width: auto}
    .signin-width{width: auto}
    .left-section{margin-bottom: 60px}
    .signup-box{top: 30px; z-index: 100}
    .digital-list-price-name{width: 150px}
    .signin-body{margin-top: 20px}
    .thm-btn--new{padding: 13px}
    .uk-padding-remove-left{padding-left: 15px!important;}
    .thm-btn--header-black i{margin-left: 0;font-size: 18px;}
    .basket-item__desc{display: block}
    .basket-item__thumbnail{margin-bottom: 10px;min-width: 100%;max-width: 100%;}
    .search-area{display: block;margin-top: 20px}
    .search-txt{display: none}
    .basket-item{display: block}
    .basket-item__actions{justify-content: start;align-items: self-start;margin-top: 10px;}
    .basket{margin-top: 20px}
}