.bg__type-header {
    display: block;
    height: 30px;
    padding-left: 4px;
    font-weight: 600;
    font-size: 13px;
    line-height: 33px;
    cursor: pointer;

    > .title {
        text-transform: capitalize;
        cursor: pointer;
    }

    .fa {
        width: 20px;
        margin-right: 0px;
        padding-right: 0px;
        padding-left: 0;
        box-sizing: border-box;
    }

    .bg__info {
        padding-right: 0;
        &.left {
            padding-right: 0;
        }
    }

    .edit {
        color: $clSecondary;
        position: absolute;
        right: 0;
        padding: 0px 10px;
        width: 30px;
        text-align: center;
        transition: background-color 0.3s ease-out;
        cursor: pointer;
        font-size: 19px;
        &:hover {
            background-color: $clGrey;
        }

        &.active:after {
            transform: rotate(45deg);
        }

        &:after {
            display: inline-block;
            transition: transform 0.3s ease-out;
            content: '+';
        }
    }

    &:hover {
        .edit {
            background-color: $clGrey;
        }
    }
}
