I have an accordian short code, but can not make it RTL

Question

In the theme that I use, there is a shortcode making googd accordians. I am making the site RTL. Accordian's title and content have been RTL. But the plus sign (the square) does not follow the CSS rules added. I was wondering if anyone could help me make the plus sign RTL.

Page URL: http://sciself.com/?page_id=4766

HTML code is as follows,

<div id="text-13" class="widget widget_text">
    <div class="textwidget">
        <div class="accordian">
            <h5 class="toggle">
                <a href="#">
                    <span class="arrow">
                    </span>
                    title
                </a>
            </h5>
            <div class="toggle-content " style="display: none;">
                text
            </div>
            <h5 class="toggle">
                <a href="#">
                    <span class="arrow">
                    </span>
                    title
                 </a>
             </h5>
             <div class="toggle-content " style="display: none;">
                 text
             </div>
             <h5 class="toggle">
                 <a href="#">
                     <span class="arrow">
                     </span>
                     title
                 </a>
             </h5>
             <div class="toggle-content " style="display: none;">
                 text
             </div>
         </div>
     </div>
 </div>

and CSS rules added are,

#text-13 .textwidget .accordian .toggle-content {
    font-family: bkoodak !important;
    direction: rtl !important;
    text-align: justify !important;
}
#text-13 .textwidget .accordian h5.toggle a {
    font-family: bkoodak !important;
    direction: rtl !important;
    float: right !important;
}

Answer 1

in the .arrow class in the line "2073" in your style.css add property like so:

 h5.toggle span.arrow {
        float:right;
        direction:rtl;
        margin-right:0;
        margin-left:17px;
        }

also your form need to be rtl, in the .gform_fields class add this property:

.gform_fields{
direction:rtl;
text-align:right;
}

موفق باشید :)

Answer 2

Try this:

h5.toggle span.arrow {
    float:right;
    direction:rtl;
    margin-left:10px;
    font-family:bkoodak;
}