html{
    scroll-behavior: smooth;
}

.ledger-ctn{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    background: var(--tertiary-50, #F6FBFE);
}

.ledger-ctn-inner{
    display: flex;
    max-width: 1320px;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    margin: 0 auto;
    align-self: stretch;
}

.ledger-ctn-inner-filter{
    display: flex;
    max-width: 1320px;
    padding: 32px var(--spacing-module-sm-2xs, 56px);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: var(--border-radius-lg, 8px) var(--border-radius-lg, 8px) 0 0;
    background: linear-gradient(0deg, #F6FBFE 0%, #FFF 100%);
    margin-top:32px;
}

.ledger-ctn-inner-filter-btns{
    display: flex;
    flex-wrap: wrap;
    padding: 12px;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    border-radius: var(--border-radius-md, 4px);
    border: 1px solid var(--border-primary, #DADADB);
}

.ledger-ctn-inner-filter-btns a{
    display: flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: var(--border-radius-none, 0);
    border: var(--border-width-sm, 1px) solid var(--border-action2, #29ABE2);
    color: var(--text-body-primary, #050A38);
    text-align: center;
    font-family: var(--type-font-family-body, Baskerville);
    font-size: var(--fontsize-body-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-md, 24px); /* 150% */
    text-decoration: none;
    transition:.35s;
}

.ledger-ctn-inner-filter-btns a:hover,.ledger-ctn-inner-filter-btns a:active{
    background: var(--surface-action2, #DAEFFA);
}

.ledger-item-ctn{
    display: flex;
    flex:1;
    align-items: flex-start;
    gap: 72px;
    align-self: stretch;
    padding: 32px 80px;
}

.ledger-cat-ctn{
    max-width:300px;
    width:100%;
}

.ledger-cat-ctn h2{
    color: var(--text-headings-primary, #2A375E);
    font-family: var(--type-font-family-heading, "All Round Gothic");
    font-size: var(--fontsize-heading-h2, 48px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h2, 56px); 
}

.ledger-item-ctn .ledger-sub-items-ctn{
    
}

.ledger-item{
    display: inline;
    margin-right:12px;
  }

.ledger-item-title-link,.ledger-item-title{
    color: var(--text-body-secondary, #303031);
    font-family: var(--type-font-family-sub-heading, "All Round Gothic");
    font-size: var(--fontsize-heading-h6, 18px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--line-height-heading-h6, 24px); /* 133.333% */
    text-decoration: none;
    transition:text-decoration .3s;
    display: inline;
}

.ledger-item-title-link:hover{
    text-decoration: underline!important;
    cursor: pointer!important;
}

.ledger-item-attribution{
    color: var(--text-body-secondary, #303031);
    font-family: var(--type-font-family-body, Baskerville);
    font-size: var(--fontsize-body-lg, 20px);
    font-style: italic;
    font-weight: 400;
    line-height: var(--line-height-body-lg, 32px);
    display: inline;
}

.ledger-item-divider{
    color: var(--text-body-secondary, #303031);
    font-family: var(--type-font-family-body, Baskerville);
    font-size: var(--fontsize-body-lg, 20px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--line-height-body-lg, 32px);
    display: inline;
}


@media only screen and (max-width: 1000px) {
    .ledger-item-ctn{
        flex-direction: column;
        gap:16px;
        padding:24px;
    }
}