Setting Validate Copy Format

body,
html {
  margin: 0;
  padding: 0;
  font-family: 'Lato', sans-serif;
  font-weight: 400;
  color: #999999;
  font-size: 20px;
  line-height: 1;
}
body{
  padding-bottom: 200px;
}

h1, h2, h3, h4, h5, h6{
  margin: 0;
}


h1{
  font-size: 41px;
  padding-bottom: 20px;
  color: #2d3950;
}

p {
  line-height: 32px;
  color: #8b9297;
}
p:last-child {
  margin: 0;
}


/*default values*/

a,
i {
  -webkit-transition: all .33s ease-in-out;
  -moz-transition: all.33s ease-in-out;
  -ms-transition: all .33s ease-in-out;
  -o-transition: all .33s ease-in-out;
  transition: all .33s ease-in-out;
}

a {
  color: #252525;
}

a:hover {
  color: #72d0f4;
  text-decoration: none;
}

a:focus {
  color: #fff;
  text-decoration: none;
}
img{
  max-width: 100%;
  height:auto;
}
ol,
ul {
  margin: 0;
  list-style: none;
}
.clear {
  clear: both;
}



/*
Universal Classes
*/
.center{
  text-align: center;
}
.full{
  padding-right: 0;
  padding-left: 0;
}
.lt-background{
  background: #f6f9f9;
}

/** Trick to vertically align with bootstrap **/


/*.valign {
display: table;
}
*/

.valign .col-xs-1,
.valign .col-sm-1,
.valign .col-md-1,
.valign .col-lg-1,
.valign .col-xs-2,
.valign .col-sm-2,
.valign .col-md-2,
.valign .col-lg-2,
.valign .col-xs-3,
.valign .col-sm-3,
.valign .col-md-3,
.valign .col-lg-3,
.valign .col-xs-4,
.valign .col-sm-4,
.valign .col-md-4,
.valign .col-lg-4,
.valign .col-xs-5,
.valign .col-sm-5,
.valign .col-md-5,
.valign .col-lg-5,
.valign .col-xs-6,
.valign .col-sm-6,
.valign .col-md-6,
.valign .col-lg-6,
.valign .col-xs-7,
.valign .col-sm-7,
.valign .col-md-7,
.valign .col-lg-7,
.valign .col-xs-8,
.valign .col-sm-8,
.valign .col-md-8,
.valign .col-lg-8,
.valign .col-xs-9,
.valign .col-sm-9,
.valign .col-md-9,
.valign .col-lg-9,
.valign .col-xs-10,
.valign .col-sm-10,
.valign .col-md-10,
.valign .col-lg-10,
.valign .col-xs-11,
.valign .col-sm-11,
.valign .col-md-11,
.valign .col-lg-11,
.valign .col-xs-12,
.valign .col-sm-12,
.valign .col-md-12,
.valign .col-lg-12 {
  float: none;
  display: table-cell;
  vertical-align: middle;
}

/*
Navigation
*/
/*.container{
border: 1px solid red;
}
*/

header{
  padding: 30px 0;
}
nav{
  text-align: right;
  
}
nav li{
  display: inline-block;
}

nav ul{
  display: inline-block;
}

nav li a{
  text-transform: uppercase;
  padding: 0 10px;
  font-size: 15px;
}

.slide img{
  width: 100%;
}


.intro{
  padding: 80px 0 110px;
}


/*
Section Icon
*/

.section-icon{
  padding: 60px 0;
}

.section-icon i{
  font-size: 70px;
  color: #fff;
  background: url(../images/icon-background.jpg);
  height: 100px;
  width: 100px;
  display: table-cell;
  vertical-align: middle;
}
.section-icon span{
  font-size: 15px;
  
  line-height:22px;
  color:#999999
    
    
}
.test{
  display: table;
  margin: 0 auto 15px;
}

Setting Validate Copy Format

<!DOCTYPE html>
<html>

<head>
  <title>Template</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
  <!-- CSS FILES -->
  <!--Add Google Font then delete this line-->
  <link href='https://fonts.googleapis.com/css?family=Lato:400,300,700' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
  <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
  <link rel="stylesheet" type="text/css" href="css/style.css">
  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
  </head>

  <body>
    <header>    
      <div class="container">
        <div class="row valign">
          <div class="col-md-6">
            <img src="images/logo.jpg" alt="Logo">
          </div>
          <!-- end col-6 -->
          <div class="col-md-6">
            <nav>
              <ul>
                <li><a href="">Home</a></li>
                <li><a href="">About Us</a></li>
                <li><a href="">Our Services</a></li>
                <li><a href="">Works</a></li>
                <li><a href="">Contact Us</a></li>
              </ul>
            </nav>
          </div>
          <!-- end col-6 -->
        </div>
        <!-- end row -->
      </div>
      <!-- end container -->
    </header>
    <!-- end header -->

    <div class="container-fluid">
      <div class="row slide">
        <div class="col-md-12 full">
          <img src="images/slide.jpg" alt="Slide">
        </div>
        <!-- end col-12 -->
      </div>
      <!-- end row -->
    </div>
    <!-- end container-fluid -->
    <div class="container-fluid lt-background">
      <div class="container">
        <div class="row center intro">
          <div class="col-md-12">
            <h1>Simple &amp; pure design.</h1>
            <p>Designers everywhere gush with admiration upon seeing a web design and exclaim "its beautiful, it's so clean!". There are a countless number of webdesign round-ups dedicated to 'clean' design and it is a term thrown around quite a bit in the web design community. It can be easy to spot a good example of clean design.</p>
          </div>
          <!-- end col-12 -->
        </div>
        <!-- end row -->
      </div>
      <!-- end container -->
    </div>
    <!-- end container-fluid -->
    <div class="container">
      <div class="row section-icon center">
        <div class="col-md-12">
          <div class="row valign">
            <div class="col-md-4">
              <div class="test">
                <i class="fa fa-mobile" aria-hidden="true"></i>
                <h4>Optimized for all devices</h4>
                <span>STRICT has been designed to be fully responsive on all devices</span>
              </div>
            </div>
            <div class="col-md-4">
              <div class="test">
                <i class="fa fa-mobile" aria-hidden="true"></i>
                <h4>Optimized for all devices</h4>
                <span>STRICT has been designed to be fully responsive on all devices</span>
              </div>
            </div>
            <div class="col-md-4">
              <div class="test">
                <i class="fa fa-mobile" aria-hidden="true"></i>
                <h4>Optimized for all devices</h4>
                <span>STRICT has been designed to be fully responsive on all devices</span>
              </div>
            </div>
          </div>
        </div>
        <!-- end col-12 -->
      </div>
      <!-- end row -->
    </div>
    <!-- end container -->

    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <script type="text/javascript" src="/js/custom.js"></script>
  </body>

  </html>

Copy Format

Download