.collapsible {
    background-color: rgb(241, 93, 91);
    color: white;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    margin-top: 1rem;
}

.collapsible::after {
    content: "▼";
}

.collapsible {
    display: flex;
    justify-content: space-between;
}


.active, .collapsible:hover {
    background-color: rgb(151, 207, 208);
    color: black;
}

.active {
    display: flex;
    justify-content: space-between;
}

.active::after {
    content: "▲";
}

.content {
    padding: 0 18px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    border-top: 0;
    border-left: 2px solid;
    border-right: 2px solid;
    border-bottom: 2px solid;
}

h3 {
    margin-top: 3rem;
}