Wiget output

Hi , I created a custom widget for siteorigin page builder for my theme , but it’s output without any html markup and any css style , and all my variables are surrounded with p tag .
any idea ??

    public function widget($args, $instance) {
        extract($args);
        echo $args['before_widget'];

        $title = empty($instance['title']) ? '' : $instance['title'];
        $mymail = empty($instance['mymail']) ? '' : $instance['mymail'];
        $mytel = empty($instance['mytel']) ? '' : $instance['mytel'];
        $mydescription = empty($instance['mydescription']) ? '' : $instance['mydescription'];
        $freelance = empty($instance['freelance']) ? false : $instance['freelance'] === "YES";
        $maplati = empty($instance['maplati']) ? '' : $instance['maplati'];
        $maplong = empty($instance['maplong']) ? '' : $instance['maplong'];
        $adresse = empty($instance['adresse']) ? '' : $instance['adresse'];
        $img_bg = empty($instance['img_bg']) ? '' : $instance['img_bg'];


        echo $before_title . $title . $after_title;
        ?>
        <div class="about-card">
            <div class="face2 card-face">
                <div id="cd-google-map">
                    <div id="google-container"></div>
                    <div id="cd-zoom-in"></div>
                    <div id="cd-zoom-out"></div>
                    <address><?php echo $adresse; ?></address>
                    <div class="back-cover" data-card-back="data-card-back"><i class="fa fa-long-arrow-left"></i>
                    </div>
                </div>
            </div>
            <div class="face1 card-face">
                <div class="about-cover card-face">
                    <a class="map-location" data-card-front="data-card-front"><img src="images/map-icon.png" alt="">
                    </a>
                    <div class="about-details">
                        <div><span class="fa fa-inbox"></span><span class="detail"><?php echo $mymail; ?></span>
                        </div>
                        <div><span class="fa fa-phone"></span><span class="detail"><?php echo $mytel; ?></span>
                        </div>
                    </div>

                    <div class="cover-content-wrapper">
                        <span class="about-description"><?php echo $mydescription; ?></span>
                        <?php
                        if ($freelance == 'YES') {
                            echo '<span class="status">';
                            echo '<span class="fa fa-circle"></span>';
                            echo '<span class="text">Available as <strong>freelance</strong></span>';
                            echo '</span>';
                        }
                        ?>
                    </div>
                </div>
            </div>
        </div>

        <?php
        echo $args['after_widget'];
    }