.fa {
    transition: transform 0.3s ease-in-out;
}

.card-header {
    position: relative;
    cursor: pointer;
}

.toggle-icon {
    transition: transform 0.5s;
    right: 10px;
}

@media screen and (max-width: 768px) {
    .important-content {
        padding-top: 1em;
    }
}


label {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
    display: inline-block;
}


input[type="checkbox"]:checked+label {
    color: #367689;
}


input[type="checkbox"]:checked+label::before {
    content: "\2713 ";
    color: #367689;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    bottom: 4px;
}

input[type="checkbox"]:checked+label h4 {
    display: inline-block;
    vertical-align: middle;
}

label:hover {
    cursor: pointer;
    color: #367689;
}