:root {
    --md-primary-fg-color:        #0077FA;
    --md-primary-fg-color--light: #49A5FE;
    --md-primary-fg-color--dark:  #0062D6;

    --md-accent-fg-color:                #3370FF;
    --md-accent-fg-color--transparent:   #3370FF19;
}

.md-typeset .icon-large {
    width: auto;
    height: 24px;
    vertical-align: middle;
    color: var(--md-default-fg-color);
}

.md-typeset .icon-small {
    width: auto;
    height: 16px;
    vertical-align: middle;
    color: var(--md-default-fg-color);
}

p > img {
    vertical-align: middle;
}

.gb-container {
    display: flex;
    align-items: stretch;
    gap: 24px;
    flex-wrap: wrap;
}

.gb-card {
    display: flex;
    min-width: 210px;
    /* height: 274px; */
    padding: 24px 28px;
    flex-direction: column;
    /* justify-content: center; */
    align-items: center;
    flex: 1 0 0;

    border-radius: 12px;
    border: 1px solid #DEE0E3;
    text-decoration: none;
}

.gb-card > .gb-card-image {
    min-width:  90px;
    max-width: 90px;
    max-height: 90px;
    min-height: 90px;
    align-items: center;
    display: flex;
    justify-content: center;
}

.gb-card > h4 {
    color: var(--md-typeset-color);
    transition: color 0.3s ease-in-out;
}

a.gb-card, a.gb-card:hover {
    color: #8F959E;
}

.gb-container .gb-card {
    /* ...existing styles... */
    transition: box-shadow 0.3s ease-in-out, border 0.3s ease-in-out;
}

.gb-card:hover {
    border-color: var(--md-primary-fg-color);
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1); /* adjust shadow as necessary */
}

.gb-card:hover > h4 {
    color: var(--md-primary-fg-color);
}

.gb-mol-hydrophilic {
    color: #009ce0;
}

.gb-mol-hydrophobic {
    color: #fcc400;
}

.gb-mol-antigen {
    color: #9370db;
}

.gb-mol-heavy-chain {
    color: #4783ff;
}

.gb-mol-light-chain {
    color: #ff6347;
}

.gb-mol-hcdr {
    color: #5bb0ff;
}

.gb-mol-lcdr {
    color: #ffa269;
}

.gb-mol-hydrogen-bond {
    color: #2b83ba;
}

.gb-mol-hydrophobic-interaction {
    color: #808080;
}

.gb-mol-halogen-bond {
    color: #40ffbf;
}

.gb-mol-ionic {
    color: #f0c814;
}

.gb-mol-metal-coordination {
    color: #8c4099;
}

.gb-mol-cation-pi {
    color: #ff8000;
}

.gb-mol-pi-stacking {
    color: #8cb366;
}

.gb-mol-weak-hydrogen-bond {
    color: #c5ddec;
}

.gb-mol-plddt-0-50 {
    color: #fd7d4d;
}

.gb-mol-plddt-50-70 {
    color: #fed936;
}

.gb-mol-plddt-70-90 {
    color: #6acbf1;
}

.gb-mol-plddt-90-100 {
    color: #0d57d3;
}