.dark .wyswyg-editor {
    color: #fff;
}

.wyswyg-editor h1,
.wyswyg-editor h2,
.wyswyg-editor h3,
.wyswyg-editor h4 {
    color: var(--bs-green);
    font-weight: 700;
    padding-top: 10px;
}

.text-area.with-arrow {
    position: relative;
}

.text-area.with-arrow .arrow:before {
    position: absolute;
    content: "";
    width: 100px;
    height: 2px;
    border-bottom: 2px dashed var(--bs-green);
    right: 0;
    top: 0;
}

.text-area.with-arrow .arrow:after {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    border-bottom: 2px solid var(--bs-green);
    border-right: 2px solid var(--bs-green);
    right: -5px;
    transform: rotate(-45deg);
    bottom: -6px;
}

span.arrow.arrow-1 {
    position: absolute;
    right: 15%;
    top: 28%;
}

span.arrow.arrow-2 {
    position: absolute;
}

@media(max-width: 767px) {
    .icon-faq {
        top: 32px;
    }
}

@media(max-width: 991px) {
    .text-area.with-arrow {
        padding-bottom: 80px;
    }
    .text-area.with-arrow .arrow:before {
        position: absolute;
        content: "";
        width: 2px;
        height: 60px;
        border-left: 2px dashed var(--bs-green);
        right: 0;
        top: 0;
    }
    .text-area.with-arrow .arrow:after {
        position: absolute;
        content: "";
        width: 10px;
        height: 10px;
        border-bottom: 2px solid var(--bs-green);
        border-right: 2px solid var(--bs-green);
        right: -4px;
        transform: rotate(45deg);
        bottom: -64px;
    }
    .arrow-cont {
        position: absolute;
        width: 40px;
        height: 90px;
        left: 50%;
        margin-left: -20px;
        bottom: 0;
    }
    span.arrow.arrow-1 {
        top: 0;
        right: 0;
    }
    span.arrow.arrow-2 {
        position: absolute;
        left: 0;
    }
}

@media(min-width: 992px) {
    span.arrow.arrow-2 {
        display: none;
    }
    .text-area.with-arrow {
        padding-right: 48%;
    }
}