.bkgd-col-o{
    background: rgba(0, 0, 0, 0)
}

.bkgd-col-1{
    background-color: #C072A2;
    border: none;
}

.bkgd-col-2{
    background-color: #729EA1;
    border: none;
}

.bkgd-col-3{
    background-color: #FFFFEA;
    border: none;
}

.bkgd-col-1a{
    background-color: #93567c;
}

.bkgd-col-2a{
    background-color: #587b7e;
}

.bkgd-col-3a{
    background-color: #afafa2;
}

#clickable {
    transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

#clickable.bkgd-col-2a:hover{
    background-color: #729EA1;
    box-shadow: 0 0 10px 7px #587b7e, inset 0 0 10px 3px #587b7e;
}

#clickable.bkgd-col-1:hover{
    background-color: #93567c;
}

#clickable.bkgd-col-2:hover{
    background-color: #587b7e;
}

.text-col-1{
    color: #C072A2;
}

.text-col-2{
    color: #729EA1;
}

.text-col-3{
    color: #FFFFEA;
}

:root {
    --bs-font-sans-serif: "Helvetica Neue", system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

}

.dropdown-body {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
    transition:
        max-height 0.5s ease,
        opacity 0.3s ease,
        padding 0.3s ease;
}

.dropdown-body.open {
    max-height: 1400px;
    opacity: 1;
    padding-top: 1rem;
    padding-bottom: 1rem;
}