My second footer block for the Mobirise Website builder.

Project Download:

https://www.dropbox.com/s/4uv52r99dy2o1s4/project.mobirise?dl=1

HTML Code Snippet:

<section group="Footers" global once mbr-class="{'mbr-reveal': reveal, 'mbr-parallax-background': bg.parallax}">
    <mbr-parameters>
    <!-- Block parameters controls (Blue "Gear" panel) -->
        <input type="range" inline title="Top" name="paddingTop" min="0" max="8" step="1" value="2">
        <input type="range" inline title="Bottom" name="paddingBottom" min="0" max="8" step="1" value="2">
        <input type="checkbox" title="Reveal effect" name="reveal">
        <fieldset type="background" name="bg" parallax>
            <input type="image" title="Background Image" value="../_images/jumbotron.jpg">
            <input type="color" title="Background Color" value="#141414" selected>
        </fieldset>
        <input type="checkbox" title="Overlay" name="overlay" condition="bg.type !== 'color'" checked>
        <input type="color" title="Overlay Color" name="overlayColor" value="#3C3C3C" condition="overlay && bg.type !== 'color'">
        <input type="range" inline title="Opacity" name="overlayOpacity" min="0" max="1" step="0.1" value="0.5" condition="overlay && bg.type !== 'color'">
    <!-- End block parameters -->
    </mbr-parameters>
    <div class="mbr-overlay" mbr-if="overlay && bg.type !== 'color'" opacity="{{overlayOpacity}}" bg-color="{{overlayColor}}"></div>
    <div class="container text-center">
        <div class="media-container-row mbr-white">
            <div class="col-12 col-md-6 pb-3 pb-md-0 text-md-left">
                <p class="mbr-text mb-0 mbr-fonts-style" mbr-theme-style="display-7" data-app-selector=".media-container-row .mbr-text" data-app-placeholder="Type Text">
                    © Copyright 2018 Fors Freelance - All Rights Reserved
                </p>
            </div>
             <div class="col-12 col-md-4 text-md-right">
                <p class="mbr-text mb-0 mbr-fonts-style" mbr-theme-style="display-7" data-app-selector=".media-container-row .mbr-text" data-app-placeholder="Type Text">
                    <span class="fa fa-facebook-f mbr-iconfont" style="font-size: 14px; color: rgb(255, 255, 255);"></span>
                    <span class="fa fa-twitter mbr-iconfont" style="font-size: 14px; color: rgb(255, 255, 255);"></span>
                    <span class="fa fa-google-plus mbr-iconfont" style="font-size: 14px; color: rgb(255, 255, 255);"></span>
                    <span class="fa fa-linkedin mbr-iconfont" style="font-size: 14px; color: rgb(255, 255, 255);"></span>
                </p>
            </div>
        </div>
    </div>
</section>

CSS Code Snippet:

border-top: solid 1px #EEE;
padding-top: (@paddingTop * 15px);
padding-bottom: (@paddingBottom * 15px);
& when (@bg-type = 'image') {
  background-image: url(@bg-value);
}
& when (@bg-type = 'color') {
  background-color: @bg-value;
}
.media-container-row .mbr-text {
  color: #ffffff;
}
.fa {
  margin: 0 10px 0 10px;
}