JSFiddle - React, Tailwind, and code Playground

by otinanaipali

HTML

<section>
  <div>
    <div>
      <div class="normal-txt max-480">
        <h1>Does more, costs less, it's that <span class="brand">Ximple.</span></h1>
        <p>The most integrated, flexible and easy-to-use business software solution for your growing enterprise.</p>
        <p>Ximple Solutions is an ERP platform that unifies your entire organization onto one integrated business software suite. The real-time flow of information with customers, suppliers and your employees is made simple and efficient giving you the power
          to optimize your business performance.</p>
        <div class="cta">
          <a href="#" class="btn btn-primary btn-lg">Book a demo</a>
          <a href="#" class="btn btn-secondary btn-lg">Explore Ximple</a>
        </div>
      </div>
      <div class="home-img">
        <img src="http://ximple.theok.gr/img/home_img.png" />
      </div>
    </div>
  </div>
</section>

CSS

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  min-height: 100%;
}

body {
  background: #ccc;
}

section>div {
  display: table;
  border-collapse: collapse;
  width: 100%;
  height: 100%;
  min-height: 100%;
}

section>div>div {
  width: 100%;
  display: table-cell;
  vertical-align: middle;
  position: relative;
  min-height: 100%;
  background: #fc0;
  height: 100%;
}
section>div>div>div{
 display:inline-block;
 width: 45%;
}
img {
  width: 100%;
  height: auto;
}