MOVU Components

Insurance 

<div class="row visible-xs">
    <div class="col-xs-12">
        <div class="baloise-logo pull-right"></div>
    </div>
    <div class="col-xs-12">
        <div class="card-insurance">
            <div class="content movu-spacing-16-left movu-spacing-16-right">
                <h3 class="title">moveasy insurances</h3>
                <hr class="easy-hr">
                <h3 class="movu-spacing-8-bottom movu-spacing-0-top">all-risk moving insurance</h3>
                <ul class="unordered-list movu-quiet-list">
                    <li>Eaque ipsa quae.</li>
                    <li>Packing of boxes (incl. boxes)</li>
                    <li>Eaque ipsa.</li>
                </ul>

                <hr class="border-insurance">
                <h3 class="movu-spacing-8-bottom movu-spacing-0-top">'bad frog insurance'</h3>
                <p>Do you not like you new apartment after all? Or is your neighbour just unbearable?</p>
                <ul class="unordered-list movu-quiet-list">
                    <li>Eaque ipsa quae ab illo inventore veritatis.</li>
                </ul>
            </div>
        </div>
    </div>
</div>

<div class="row desktop-view visible-sm">
    <div class="col-sm-12 col-md-8 col-lg-8 tablet-padding">
        <div class="row visible-sm visible-md movu-spacing-12-bottom">
            <div class="col-xs-12">
                <div class="baloise-logo pull-right"></div>
                <span class="pull-right powerd">Powered by</span>
            </div>
        </div>
        <div class="row border-insurance">
            <div class="col-sm-12">
                <h3 class="title pull-left">moveasy insurances</h3>
                <div class="baloise-logo pull-right visible-lg"></div>
                <span class="pull-right powerd visible-lg">Powered by</span>
                <hr class="border-desktop">
            </div>
            <div class="col-sm-6 no-padding-right movu-padding-16-bottom">
                <div class="border">
                    <div class="content movu-spacing-32-right">
                        <h3 class="movu-spacing-16-bottom movu-spacing-32-top">all-risk moving insurance</h3>
                        <ul class="unordered-list">
                            <li>Eaque ipsa quae.</li>
                            <li>Packing of boxes (incl. boxes)</li>
                            <li>Eaque ipsa.</li>
                        </ul>

                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="content movu-spacing-16-left">
                    <h3 class="movu-spacing-16-bottom movu-spacing-32-top">'bad frog insurance'</h3>
                    <p>Do you not like you new apartment after all? Or is your neighbour just unbearable?</p>
                    <ul class="badfrog-list unordered-list">
                        <li>Eaque ipsa quae ab illo inventore veritatis.</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row desktop-view hidden-xs hidden-sm">
    <div class="col-sm-12 col-md-8 col-lg-8 tablet-padding">
        <div class="row visible-sm visible-md movu-spacing-12-bottom">
            <div class="col-xs-12">
                <div class="baloise-logo pull-right"></div>
                <span class="pull-right powerd">Powered by</span>
            </div>
        </div>
        <div class="row border-insurance">
            <div class="col-sm-12">
                <h3 class="title pull-left">moveasy insurances</h3>
                <div class="baloise-logo pull-right visible-lg"></div>
                <span class="pull-right powerd visible-lg">Powered by</span>
                <hr class="border-desktop">
            </div>
            <div class="col-sm-6 movu-padding-16-bottom">
                <div class="border">
                    <div class="content">
                        <h3 class="movu-spacing-16-bottom movu-spacing-32-top">all-risk moving insurance</h3>
                        <ul class="unordered-list">
                            <li>Eaque ipsa quae.</li>
                            <li>Packing of boxes (incl. boxes)</li>
                            <li>Eaque ipsa.</li>
                        </ul>

                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="content">
                    <h3 class="movu-spacing-16-bottom movu-spacing-32-top">'bad frog insurance'</h3>
                    <p>Do you not like you new apartment after all? Or is your neighbour just unbearable?</p>
                    <ul class="badfrog-list unordered-list">
                        <li>Eaque ipsa quae ab illo inventore veritatis.</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
 
<div class="row visible-xs">
  <div class="col-xs-12">
    <div class="baloise-logo pull-right"></div>
  </div>
  <div class="col-xs-12">
    <div class="card-insurance">
      <div class="content movu-spacing-16-left movu-spacing-16-right">
        <h3 class="title">{{ title }}</h3>
        <hr class="easy-hr">
        <h3 class="movu-spacing-8-bottom movu-spacing-0-top">{{ subtitle }}</h3>
        {% render "@lists--quiet", { listClassName: "unordered-list movu-quiet-list" }, true %}
        <hr class="border-insurance">
        <h3 class="movu-spacing-8-bottom movu-spacing-0-top">{{ subtitleSecond }}</h3>
        <p>{{ description }}</p>
        <ul class="unordered-list movu-quiet-list">
          <li>Eaque ipsa quae ab illo inventore veritatis.</li>
        </ul>
      </div>
    </div>
  </div>
</div>

<div class="row desktop-view visible-sm">
  <div class="col-sm-12 col-md-8 col-lg-8 tablet-padding">
    <div class="row visible-sm visible-md movu-spacing-12-bottom">
      <div class="col-xs-12">
        <div class="baloise-logo pull-right"></div>
        <span class="pull-right powerd">Powered by</span>
      </div>
    </div>
    <div class="row border-insurance">
      <div class="col-sm-12">
        <h3 class="title pull-left">{{ title }}</h3>
        <div class="baloise-logo pull-right visible-lg"></div>
        <span class="pull-right powerd visible-lg">Powered by</span>
        <hr class="border-desktop">
      </div>
      <div class="col-sm-6 no-padding-right movu-padding-16-bottom">
        <div class="border">
          <div class="content movu-spacing-32-right">
            <h3 class="movu-spacing-16-bottom movu-spacing-32-top">{{ subtitle }}</h3>
            {% render "@lists" %}
          </div>
        </div>
      </div>
      <div class="col-sm-6">
        <div class="content movu-spacing-16-left">
          <h3 class="movu-spacing-16-bottom movu-spacing-32-top">{{ subtitleSecond }}</h3>
          <p>{{ description }}</p>
          <ul class="badfrog-list unordered-list">
            <li>Eaque ipsa quae ab illo inventore veritatis.</li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="row desktop-view hidden-xs hidden-sm">
  <div class="col-sm-12 col-md-8 col-lg-8 tablet-padding">
    <div class="row visible-sm visible-md movu-spacing-12-bottom">
      <div class="col-xs-12">
        <div class="baloise-logo pull-right"></div>
        <span class="pull-right powerd">Powered by</span>
      </div>
    </div>
    <div class="row border-insurance">
      <div class="col-sm-12">
        <h3 class="title pull-left">{{ title }}</h3>
        <div class="baloise-logo pull-right visible-lg"></div>
        <span class="pull-right powerd visible-lg">Powered by</span>
        <hr class="border-desktop">
      </div>
      <div class="col-sm-6 movu-padding-16-bottom">
        <div class="border">
          <div class="content">
            <h3 class="movu-spacing-16-bottom movu-spacing-32-top">{{ subtitle }}</h3>
            {% render "@lists" %}
          </div>
        </div>
      </div>
      <div class="col-sm-6">
        <div class="content">
          <h3 class="movu-spacing-16-bottom movu-spacing-32-top">{{ subtitleSecond }}</h3>
          <p>{{ description }}</p>
          <ul class="badfrog-list unordered-list">
            <li>Eaque ipsa quae ab illo inventore veritatis.</li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
 
{
  "title": "moveasy insurances",
  "subtitle": "all-risk moving insurance",
  "subtitleSecond": "'bad frog insurance'",
  "description": "Do you not like you new apartment after all? Or is your neighbour just unbearable?"
}

No notes defined.