<link href="https://fonts.googleapis.com/css?family=Lato:300,400,400i,700,700i,800,800i&amp;subset=latin-ext" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="http://e-aydin.com/files/mozaik/css/mozaik.min.css">

<div id="body">
  <div class="sira container">
    <!-- header -->
    <div class="sutun-12">
      <div class="sira">
        <div class="sutun-6 moz-merkez">.sutun-6 .moz-merkez</div>
        <div class="sutun-6 moz-sag">.sutun-6 .moz-sag</div>
      </div>
    </div>
  </div>
</div>
body{margin:0; padding:0;background: #e1dbbb;}
#body{
    color:#555;
    padding:50px;
    font-family: 'Lato', arial;
    font-size:16px;
  }
  .container{
    width:600px !important;
  }
  [class*='sutun-'] {
  	overflow-x: hidden;
    text-align: center;
  	color: #fff;
    border:3px solid #e1dbbb;
  	border-radius: 5px;
    background: #000;
    font-size:11px;
  	font-weight: 600;
  }

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.