.altcards-hidden{display:none}

.custom-select{position:relative;display:inline-block;width:100%;font-weight:700}
.custom-select select{display:none}

.select-selected{
    background-color:#fff;
    max-height:36px;
    overflow:hidden;
    line-height:26px;
    border-radius:4px;
}

.select-items div,
.select-selected{
    color:#3a3939;
    padding:5px 8px;
    border:1px solid #d7dde0;
    cursor:pointer;
}

.select-selected:after{
    position:absolute;
    content:"";
    top:43px;
    right:10px;
    width:0;
    height:0;
    border:4px solid transparent;
    border-color:#3a3939 transparent transparent transparent;
}

.select-selected.select-arrow-active:after{
    border-color:transparent transparent #166534 transparent;
    top:38px;
}

.select-selected.select-arrow-active{
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
}

.select-items{
    position:absolute;
    background-color:#fff;
    left:0;
    right:0;
    z-index:99;
    box-shadow:0 1px 3px rgba(0,0,0,0.08);
}

.select-items div{
    margin-top:-1px;
    text-transform:none;
    font-weight:500;
}

.select-hide{display:none}
.select-items div:hover,
.same-as-selected{background-color:rgb(248, 249, 250)}

.altcards-select{
    max-width:240px;
    margin:0 0 20px;
}

.altcards-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:14px;
}

.altcard{
    background:#fff;
    border:1px solid #e5ebe7;
    border-radius:4px;
    padding:16px;
    box-shadow:1px 1px 0px 0px #dde2e4;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.altcard:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 24px rgba(0, 0, 0, 0.14);
    border-color:#cfdcea;
}

.altcard.is-current{
    background:#f8fbff;
    border-color:#c9d9ea;
}

.altcard-top h3{
    margin:8px 0 2px;
    font-size:18px;
    line-height:1.2;
}

.altcard-top h3 a{
    color:inherit;
    text-decoration:none;
}

.altcard-account{
    margin:0 0 10px;
    color:#647487;
    font-size:13px;
}

.altcard-badge{
    display:inline-flex;
    border-radius:4px;
    padding:5px 8px;
    font-size:12px;
    font-weight:800;
    line-height:1;
}

.altcard-badge.positive{
    background:#e9f8ef;
    color:#166534;
}

.altcard-badge.neutral{
    background:#f1f4f7;
    color:#506070;
}

.altcard-badge.muted{
    background:#eaf1fb;
    color:#23527c;
}

.altcard-rate{
    padding:8px 0 4px;
    border-top:1px solid #eef2f6;
    border-bottom:1px solid #eef2f6;
}

.altcard-rate span{
    display:block;
    font-size:28px;
    line-height:1;
    font-weight:900;
    letter-spacing:-.04em;
}

.altcard-rate small{
    display:block;
    margin-top:5px;
    color:#647487;
    font-size:13px;
    font-weight:700;
}

.altcard-return{
    margin-top:7px;
}

.altcard-return span,
.altcard-return em{
    display:block;
    color:#647487;
    font-size:13px;
    font-style:normal;
}

.altcard-return strong{
    display:block;
    margin:2px 0;
    font-size:20px;
    line-height:1.1;
    letter-spacing:-.03em;
}

.altcard-facts{
    list-style:none;
    padding:0;
    margin:7px 0 0;
    border-top:1px solid #eef2f6;
}

.altcard-facts li{
    display:flex;
    justify-content:space-between;
    gap:10px;
    padding:4px 0;
    border-bottom:1px solid #eef2f6;
    font-size:13px;
}

.altcard-facts span{color:#647487}
.altcard-facts strong{text-align:right}

.altcard-current-note{
    background:#eaf1fb;
    border-radius:4px;
    padding:9px 10px;
    font-size:13px;
    font-weight:700;
    color:#23527c;
    text-align:center;
}

.rate-summary-box{
    background:#fff;
    border:1px solid #e7eaf0;
    border-radius:3px;
    padding:16px;
}

.rate-summary-box h3{
    margin-top:0;
    margin-bottom:8px;
    font-size:20px;
}

.rate-summary-box p{margin-bottom:0}

.savings-rate-table{
    border-collapse:separate;
    border-spacing:0;
    width:100%;
}

.savings-rate-table th{
    border-bottom:0;
    padding:0 0 10px 0;
}

.savings-rate-table td{border:0}

.savings-rate-table tbody tr.rate-box-head td{
    background:#fff;
    padding:14px 16px 6px;
    border-top:1px solid #e5ebe7;
}

.savings-rate-table tbody tr.rate-box-head td:first-child{
    border-left:1px solid #e5ebe7;
    border-radius:4px 0 0 0;
}

.savings-rate-table tbody tr.rate-box-head td:last-child{
    border-right:1px solid #e5ebe7;
    border-radius:0 4px 0 0;
}

.savings-rate-table tbody tr.rate-box-detail td{
    background:#fff;
    padding:0 16px 14px;
    border-left:1px solid #e5ebe7;
    border-right:1px solid #e5ebe7;
    border-bottom:1px solid #e5ebe7;
    border-radius:0 0 4px 4px;
}

.savings-rate-table tbody tr.rate-box-spacer td{
    height:14px;
    padding:0;
    border:0;
    background:transparent;
    line-height:0;
    font-size:0;
}



.rate-bindning{
    font-weight:700;
    font-size:16px;
    margin-bottom:4px;
}

.rate-bank-rate{
    font-weight:800;
    font-size:20px;
    white-space:nowrap;
    text-align:right;
}

.rate-market-meta{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    font-size:14px;
}

.rate-good{
    color:#166534;
    background:#e9f8ef;
    padding:2px 6px;
    border-radius:4px;
    font-weight:700;
}

.rate-low{
    color:#b42318;
    font-weight:700;
    opacity:.85;
}

.rate-neutral{
    color:#475467;
    font-weight:700;
}

.rate-bar-wrap{
    margin:14px 0 9px;
    padding:0 5px;
}

.rate-bar{
    position:relative;
    height:8px;
    background:linear-gradient(90deg,#e7ece9,#cfd8d2);
    border-radius:999px;
}

.rate-average-marker{
    position:absolute;
    top:-5px;
    width:2px;
    height:18px;
    background:#667085;
    transform:translateX(-50%);
    border-radius:2px;
}

.rate-bank-marker{
    position:absolute;
    top:-6px;
    width:20px;
    height:20px;
    background:#166534;
    border:3px solid #fff;
    transform:translateX(-50%);
    border-radius:50%;
}

.rate-compare-bottom{
    position:relative;
    height:22px;
    margin-top:6px;
    font-size:13px;
    color:#667085;
}

.rate-compare-bottom .label-min{
    position:absolute;
    left:0;
    font-size:12px;
}

.rate-compare-bottom .label-max{
    position:absolute;
    right:0;
    font-size:12px;
}

.rate-compare-bottom .label-avg{
    position:absolute;
    white-space:nowrap;
    font-size:12px;
}

.label-avg-center,
.label-avg-left,
.label-avg-right{
    transform:translateX(-50%);
}

.label-avg{font-size:12px}

@media (max-width:991px){
    .altcards-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width:575px){
    .rate-bank-rate{
        font-size:18px;
    }

    .rate-market-meta{
        gap:4px;
    }

    .rate-compare-bottom .label-avg{
        left:50%!important;
        transform:translateX(-50%)!important;
        text-align:center;
    }
}
.sr-only{
width:1px;
height:1px;
padding:0;
margin:-1px;
overflow:hidden;
clip:rect(0,0,0,0);
white-space:nowrap;
border:0;
}




.rate-range-fill{
    position:absolute;
    top:50%;
    height:8px;
    transform:translateY(-50%);
    border-radius:999px;
    background:currentColor;
    opacity:.22;
    z-index:2;
}

.rate-bank-marker,
.rate-average-marker{
    z-index:3;
}

.rate-bank-marker-min,
.rate-bank-marker-max{
    z-index:4;
}

.rate-bank-rate .small,
.rate-market-meta + .small{
    font-size:.85rem;
}