* {
    font-family: Mulish,sans-serif;
    text-shadow:none;
}

.card {
    background-color: white;    
}

.tile h3 {
    color: #000066;
    text-align: center;
    font-weight: normal !important;
}

.ui-shadow:not(.ui-btn):not(.item) {
    box-shadow: none;
    border: 1px solid #dce2fe;
}

.ui-icon-carat-r:after {
    display: none;
    visibility: hidden;    
}

.ui-page-theme-b .ui-btn, html .ui-bar-b .ui-btn, html .ui-body-b .ui-btn, html body .ui-group-theme-b .ui-btn, html head + body .ui-btn.ui-btn-b, .ui-page-theme-b .ui-btn:visited, html .ui-bar-b .ui-btn:visited, html .ui-body-b .ui-btn:visited, html body .ui-group-theme-b .ui-btn:visited, html head + body .ui-btn.ui-btn-b:visited, .ui-page-theme-b .ui-btn:hover, html .ui-bar-b .ui-btn:hover, html .ui-body-b .ui-btn:hover, html body .ui-group-theme-b .ui-btn:hover, html head + body .ui-btn.ui-btn-b:hover  {
    background: #3498db;
    /* border: 0px; */
    /* border-bottom: 2px solid #e1e6fe; */
    color: #ffffff;
}

.header.ui-bar-b .ui-btn.ui-btn-active {
    background: #217bb8;
    color: white;    
}

.header.ui-bar-b .ui-btn:hover {
    background: #2f8fcf;
    color: white;    
}

html {
    zoom: 1.3;
}

* {
    text-shadow:none !important;
}

.ui-li-count.ui-btn-up-c {
    /* display: none; */
}

td.label {
    width: 100px;
    font-weight: 200;
}

#emvCardStatus td {
    vertical-align: middle;
}

.light {
    font-weight: 200;
}

.lightblue, .magenta, .orange, .blue, .ui-btn.ui-btn-e  {
    background: #ff0064;
    color: white;
    border: 1px solid #e3085e;
    border-radius: 8px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
}

 .magenta, .cancelWrite, .cancelRequest {
    background: #ff0064 !important;
    color: white !important;
    border: 1px solid #ff0064 !important;
}

.lightblue, .blue {
    background: #3498db;
    color: white;
    border: 1px solid #3498db;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
    border-radius: 8px !important;
}


.header {
    border: none;
}

#ordertd .clearOrder {
    background: #eff1fe;
    font-weight: normal;
    border: 1px solid #000066;
    color: #000062;
    min-width: 100px;
}

#ordertd .ui-btn-icon-left:after {
    background-color: #000062;
}

#ordertd .ui-btn-icon-right:after {
    background-color: #ff0064;
}

#ordertd .startPayment, #startCcvPaymentButton {
    margin-left: 0px;
    background: #ff0064;
    color: white;
    border: 1px solid #ff0064;
    min-width: 80px;
    border-radius: 0px 20px 20px 0px;
}

.ui-header {
    background: white;
}

.triple {
    width: 313px;
    border: 1px solid #ffffff;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
    padding-left: 20px;
    padding-top: 7px;
    padding-bottom: 0px;
}

#accountinfo {
    display: inline-block;
    width: 100%;
}

hr {
    background-color: #dce2fe; 
    height: 1px; 
    border: 0;
}

#accountinfo label {
    display: inline-block;
    min-width: 100px;
}

#orderList .ui-bar-b.ui-last-child {
    border-top: 1px solid #e1e6fe;
}

#ordertd .ui-li-icon {
    /* display: none; */
}

#ordertd li a {
    color: #000066; 
}


#ordertd li :hover {
    /* color: #ffffff; */
}

.emptyLine strong {
    font-weight: normal !important;
    color: #000066; 
}

.totalLineDescription {
    min-height: 24px;
}

.ui-navbar .ui-btn {
    text-align: center;
}

.ui-navbar .ui-li-icon {
    display: none;
    visibility: hidden;
}

.ui-bar-b .ui-btn:focus {
    box-shadow: none !important;
}

.ui-btn:focus {
    box-shadow: none !important;
}

.ui-bar-b {
    background: #3498db;
    border-color: #3498db;
}

#activate, #activate li {
    background: #2980b9 !important;
}

#activate ul {
    border: 0px !important; 
}

.header {
    background: #eff1fe;
}

.ui-dialog-contain {
    background-color: white;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

#paymentResult div header  {
    background: white;
    border: 0px;
}

#paymentResult div header h3  {
    display: none;
    visibility: hidden;
}


#paymentAmount {
    text-align: center;
}

.refundProduct, .refundPurse {
    border: 0px !important;
}

.ui-content {
    padding-top: 14px;
}

#cardStatus, #purseStatus {
    min-height: 88px;
    border-bottom: 1px solid #cbcdd8;
}

.serviceRole #actionPanel {
    top: 75px;
    padding: 0px;
    border: 0px;
    box-shadow: none;
    background: #eff1fe;
    z-index: 99;
}

#actionPanel .ui-btn {
    border-radius: 20px 0px 0px 20px;
    border: 1px solid aliceblue;
    /* position: relative; */
    /* right: 2px; */
}

.actionSubTitle {
    display: none !important;
    visibility: hidden;
}

.ui-content .ui-listview {
    border-radius: 6px;
}

.description {
    text-align: center;
}

.header a {
    height: 40px;
    align-content: center;
}

#emvCardInfo {
    width: 100%;
    
     /*default value is row*/
}

#emvcard {
    position: relative;
    vertical-align: middle;
    display: flex;
    align-items:center;
}

#card .card {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
    color: #000066;
    background-color: white;
    margin: 4px;
    width: 270px;
    max-width: 400px;
    min-width: 250px;
    /* min-height: 100px; */
    border-radius: 10px;
    padding: 20px;
    float: left;
}

#emvcard .rightimg {
    position: absolute;
    right: 20px;
    top: 6px;
    height: 80px;
    border-radius: 80px;
}

#card h4 {
    margin-bottom: 4px;
    margin-top: 0px;
    display: inline-block;
}

#emvservice h3 {
    margin-bottom: 8px;
    margin-top: 0px;
    color: #ff0064;
    text-align: center;
    font-size: small;
}

.smallicon {
    height: 25px;
    vertical-align: bottom;
}

.xsmallicon {
    height: 20px;
    vertical-align: middle;
}

.date {
    float: right;
    font-weight: 200;
}

.amount {
    float: right;
    font-weight: 700;
}

.travel-dots {
    margin-top: 2px;
    width: 9px;
    height: 17px;
    background-image: url("../layout/images/connectiondot.svg");
    background-repeat: repeat-y;
    background-position-x: center;
}

.trip {
    padding: 6px;
    padding-top: 10px;
    font-size: 12px;
    font-weight: 200;
    line-height: 0px;
    /* padding-bottom: 18px; */
    /* border-bottom: 1px #dce2fe; */
    /* margin-bottom: 8px; */
}

#salesExtension, #topupButton {
    display: none;
    visibility: hidden;
}

@media only screen and (max-width: 760px) {
    #orderContent, #emvCardInfo {
        padding: 1px;
        padding-top: 15px;
        zoom: 0.8;
    }
    #orderTable {
        margin-left: 4px;
        width: 98%;
    }
    
    #card .card {
        width: 88%;
    }

    .ui-navbar .ui-btn {
        padding-left: 4px;
        padding-right: 4px;
    }
}

/* Sunmi layout changes */
@media only screen and (max-width: 420px) {
    .serviceRole #cardcontent {
        margin-right: 0px;
    }
    html {
        zoom: 0.92;
    }
    .ui-datebox-griddate-week {
        width: 32px;
    }
    #ct_applicationStatus {
        white-space: normal;
    }
}

#emvservice {
    padding-top: 10px;
}

#orderTable .statusGreen, #orderTable .statusBlue, #productInfoStatus {
    border-left: 0px !important;
}

#orderList li {
    border: 0px;
}

.element-item.button {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
    border: 1px solid #eff1fe;
}

#startPayment {
    border-radius: 6px;
}

span.green, span.magenta {
    min-width: 40px;
    display: inline-block;
    border-radius: 8px;
    padding: 3px;
    text-align: center;
}

.ui-loader {
    z-index: 999;
}

#emvCardProducts {
    display: inline-flex;
}

#emvCardInfo label {
    font-weight: 200;
    display: inline-block;
    min-width: 100px;
}

#emvBalance {
    font-weight: bold;
    font-size: larger;
    text-align: center;
}

#personalised {
    text-align: center;
}