<div id="modal-help">
    <div class="preview-help">
        <div class="a-title">
            <h2>
                <svg viewBox="0 0 56 56">
                    <use xlink:href="#face-employer"></use>
                </svg>
            <span>
                Tips on Builder
            </span>
            </h2>
        </div>
        <div class="a-modal-body">
            <h5>Simple design guide:</h5>
            <ul>
                <li>
                    Use sidebar settings to customize the view of your team showcase.
                </li>
                <li>
                    Turn ON/OFF elements on <b>‘Block Visibility’</b>.
                </li>
                <li>
                    Hover over the item on Builder section to <b>edit</b> (pencil icon).
                </li>
                <li>
                    <b>Re-arrange position</b> with drag & drop.
                </li>
                <li>
                    Use templates for beautiful pre-defined styles.
                </li>
            </ul>
            <p class="hint">Keep in mind font family on Builder in Admin panel doesn’t reflect font on your site.</p>
            <h5>Tips & Tricks:</h5>
            <ul>
                <li>
                    In Grid view you can turn off visibility of card <b>body</b> to remove employee box completely (including frame, shadow and separators).
                </li>
                <li>
                    You can <b>change opacity</b> of elements or blocks to find new and nice looking styles.
                </li>
                <li>
                    Set space between elements by editing <b>Top margin</b>.
                </li>
            </ul>
        </div>
    </div>
</div>