title: remove spaces and gaps between div containers
body: <p>How can i remove the spaces between div containers (on the bottom part div that has a border of red)? below is my snippets and I use materializecss</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>/*############################ LOGIN STYLE ############################*/
  body{
      font: normal 15px "Roboto", sans-serif;
      font-size: 15px;
      padding: 0px;
      margin: 0px;
      background: #ebebeb;
  }
  a{text-decoration: none;}
  h1, h2, h3, h4, h5{font-family: 'mpsemibold', sans-serif;}
  a, .transation{
      -webkit-transition: all 200ms ease-in-out;
      -moz-transition: all 200ms ease-in-out;
      -ms-transition: all 200ms ease-in-out;
      -o-transition: all 200ms ease-in-out;
      transition: all 200ms ease-in-out;
  }
  .extend{max-width: 100%;max-height: 100%;}
  .clear{clear: both; float: none;}
  .center{margin-left: auto; margin-right: auto;}
  .thehide{display: none;}
  .align_left{float: left;}
  .align_right{float: right;}
  .display_table{display: table;}
  .inline{display: inline-block;}
  .bgwhite{background: #fff;}
  /* ###################### start ###################### */
  /* header */
  #topheader{
      background: #7d7d7d;
      padding: 15px;
  }
  .logo_wrapper, .menu_wrapper{
      width: 80%;
  }
  .logo{
      display: table;
      margin-bottom: 10px;
  }
  /* navigation */
  #topnav{
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    
  }
  #topnav li{
      float: left;
  }
  #topnav li a{
      display: block;
      padding: 5px 8px;
      color: #e5e5e5;
      text-transform: uppercase;
  }
  #topnav li a span{
      float: left;
      display: block;
  }
  #topnav li a span:first-child{
      margin-right: 3px;
  }
  #topnav li a span:last-child{
      padding-top: 2px;
  }
  #topnav li a.active_menu, #topnav li a:active, #topnav li a:hover{
      color: #fff;
  }
  #mobile_nav{
  top: 80px;
  left: 20px;
  position: fixed;
  z-index:99999;
  }
  /* dropdown */
  #topnav .dropdown_menu{
      z-index: 999;
      position: absolute;
      background: #263238;
      padding: 10px;
      margin-top: 15px;
      border-top: 2px solid #fff;
      
  }
  #topnav .dropdown_menu li{
      clear: both;
      float: none;
  }
  #topnav .dropdown_menu a{
      clear: both;
      float: none;
      display: block;
      padding: 5px 8px;
      font-size: 13px;
  }
  .side-nav li a{
      text-transform: uppercase;
  }
  /* dropdown */
  #topnav .dropdown_menu{
      
  }
  #topnav .dropdown_menu li{
      clear: both;
      float: none;
  }
  #topnav .dropdown_menu a{
      clear: both;
      float: none;
      
  }
  /* right option */
  .right_option_wrapper ul{padding: 0px; margin: 0px;}
  .right_option_wrapper ul li{
      float: left;
      margin: 0px 5px;
  }
  .right_option_wrapper ul:first-child{
      margin-right: 15px;
  }
  .right_option_wrapper ul li a{
   color: #fff;
   font-size: 25px;
  }
  #idty a{
      font: normal 15px 'Roboto', sans-serif;
      color: #fff;
      padding-top: 7px;
      display: block;
  }
  #idty a span{
      float: left;
  }
  #idty a span:first-child{
      margin-right: 3px;
  }
  .right_option_wrapper img{
  -webkit-border-radius: 5000px;
  -moz-border-radius: 5000px;
  border-radius: 5000px;
  }
  /* boxes */
  #boxes{
      padding: 7px;
  }
  .box{
      background: #76b729;
      margin: 5px;
      width: 23%;
      color: #fff;
      padding: 10px 15px;
      height: 90px;
  }
  .box_content_container{
      padding-top: 7px;
  }
  .box .icon{
      font-size: 4em;
      color: #fff;
      display: block;
      margin-right: 10px;
  }
  .box h1, h2{text-transform: uppercase; text-align: left; color: #fff; clear: both;}
  .box h1{
      padding: 0px;
      margin: 0px 0px 3px 0px;
      font: 400 30px 'Roboto', sans-serif;
  }
  .box h1 span{
      float: left;
      font: 400 30px 'Roboto', sans-serif;
      display: block;
  }
  .box h1 span:last-child{
      color: rgba(255,255,25,0.5);
      font: 300 15px 'Roboto', sans-serif;
      padding-top: 3px;
  }
  .box h2{
      margin: 0px;
      padding: 0px;
      font: 400 10px 'Roboto', sans-serif;
  }
  /* announcement and workflow */
  #second_container .s6{
      width: 49.5%;
      padding: 7px;
  }
  #second_container .col:first-child{
      margin-right: 5px !important;
  }
  .title_header{
      font: 500 18px 'Roboto', sans-serif;
      padding: 3px 5px;
      color: #263238;
      overflow: auto;
      margin: 0px;
      border-bottom: 1px solid #76b729;
      display: table;
      position: relative;
      color: #76b729;
  }
  .title_header span{
      float: left;
      display: block;
      padding: 0px;
  }
  .title_header span:first-child{
      margin-right: 7px;
  }
  .content{
      border-top: 1px solid #ccc;
      margin-top: -1px;
      padding: 0px;
  }
  .content_content{
      border-bottom: 1px solid #ccc;
      padding: 5px;
      padding: 0px;
      margin: 0px;
      
  }
  .content_content h1{
      font: 500 15px 'Roboto', sans-serif;
      color: #6c6c6c;
      padding: 0px 0px 3px 0px;
      text-align: left;
      border: 1px solid red;
      overflow: auto;
  }
  .content_content h1 span{
      float: left;
      display: block;
      text-align: left;
  }
  .content_content h1 span:first-child{
      margin-right: 3px;
  }
  .content_content p{
      font: 300 13px 'Roboto', sans-serif;
      color: #6c6c6c;
      padding: 5px;
      text-align: left;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
      &lt;head&gt;
          &lt;title&gt;test&lt;/title&gt;
          &lt;meta charset="UTF-8"&gt;
          &lt;meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/&gt;
          &lt;!-- materialize --&gt;
          &lt;script src="http://megamitch.ph/materializecss/js/materialize.min.js"&gt;&lt;/script&gt;
          &lt;link href="http://megamitch.ph/materializecss/css/materialize.css" rel="stylesheet"/&gt;
          
          &lt;!-- webfont --&gt;
          &lt;link href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet"/&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div id="mainwrapper" class="row extend clear center"&gt;
              &lt;div class="col s12 extend clear" id="topheader"&gt;
                  &lt;div class="clear extend"&gt;
                      &lt;a id="mobile_nav" data-activates="mobile-demo" style="visibility: hidden;" class="btn-floating btn-large waves-effect waves-light green"&gt;&lt;i class="mdi-content-add"&gt;&lt;/i&gt;&lt;/a&gt;
                      &lt;a href="index.html" class="left logo extend clear" title="MOT HRIS"&gt;Test&lt;/a&gt;
                      &lt;div class="right display_table right_option_wrapper"&gt;
                          &lt;ul class="left extend"&gt;
                              &lt;li&gt;&lt;a href="#"&gt;&lt;i class="ion-ios-help-outline"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="#"&gt;&lt;i class="ion-ios-list-outline"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="#"&gt;&lt;i class="ion-ios-information-outline"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt;
                          &lt;/ul&gt;
                          &lt;ul class="left extend "&gt;
                              &lt;li&gt;&lt;a href="#"&gt;&lt;img src="core/img/avatar.png" width="30" height="30"/&gt;&lt;/a&gt;&lt;/li&gt;
                              &lt;li id="idty"&gt;
                                  &lt;a href="#"&gt;&lt;span&gt;Corp&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;/li&gt;
                          &lt;/ul&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="extend clear nav-wrapper"&gt;
                      &lt;ul class="nav extend clear" id="topnav"&gt;
                          &lt;li&gt;&lt;a href="index.html" title="home" class="active_menu"&gt;Home&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="Company" class="xx"&gt;&lt;span&gt;Company&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="HR" class="xx"&gt;&lt;span&gt;HR&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;Assets&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;Employees&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="Expenses" class="xx"&gt;&lt;span&gt;expenses&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="HR" class="xx"&gt;&lt;span&gt;PERFORMANCE&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="Recruitment" class="xx"&gt;&lt;span&gt;recruitment&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;reporting&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="self service" class="xx"&gt;&lt;span&gt;self service&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;timesheets&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;Timeoff&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="training" class="xx"&gt;&lt;span&gt;training&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="more" class="xx"&gt;&lt;span&gt;more&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                      &lt;ul class="side-nav" id="mobile-demo"&gt;
                         &lt;li&gt;&lt;a href="index.html" title="home" class="active_menu"&gt;Home&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="Company" class="xx"&gt;&lt;span&gt;Company&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="HR" class="xx"&gt;&lt;span&gt;HR&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;Assets&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;Employees&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="Expenses" class="xx"&gt;&lt;span&gt;expenses&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="HR" class="xx"&gt;&lt;span&gt;PERFORMANCE&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="Recruitment" class="xx"&gt;&lt;span&gt;recruitment&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;reporting&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="self service" class="xx"&gt;&lt;span&gt;self service&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;timesheets&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="index.html" title="#"&gt;Timeoff&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="training" class="xx"&gt;&lt;span&gt;training&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                          &lt;li class="has_dp"&gt;
                              &lt;a href="#" title="more" class="xx"&gt;&lt;span&gt;more&lt;/span&gt;&lt;span class="mdi-navigation-arrow-drop-down"&gt;&lt;/span&gt;&lt;/a&gt;
                              &lt;ul class="dropdown_menu extend clear thehide"&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 1&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 2&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 3&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="#"&gt;dropdown menu 4&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                        &lt;/ul&gt;
                  &lt;/div&gt;
                  
              &lt;/div&gt;
              &lt;div class="clear extend" style="height: 15px;"&gt;&lt;/div&gt;
              &lt;div class="col s6" id="left_container"&gt;
                  &lt;div class="row clear bgwhite center" id="boxes"&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-ios-people left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;17&lt;/h1&gt;
                              &lt;h2&gt;Employees&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-calendar left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;&lt;span&gt;1&lt;/span&gt;&lt;span&gt;5.9%&lt;/span&gt;&lt;/h1&gt;
                              &lt;h2&gt;Time off today&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-android-calendar left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;0%&lt;/h1&gt;
                              &lt;h2&gt;ABSENCE RATE&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-calendar left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;&lt;span&gt;0&lt;/span&gt;&lt;span&gt;0%&lt;/span&gt;&lt;/h1&gt;
                              &lt;h2&gt;UNAUTHORIZED TODAY&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-pie-graph left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;65,369&lt;/h1&gt;
                              &lt;h2&gt;TOTAL BENEFITS&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-stats-bars left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;468,739&lt;/h1&gt;
                              &lt;h2&gt;TOTAL SALARY&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-arrow-graph-up-right left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;534,108&lt;/h1&gt;
                              &lt;h2&gt;total cost&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-arrow-graph-up-right left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;31,418&lt;/h1&gt;
                              &lt;h2&gt;average cost&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-share left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;&lt;span&gt;0&lt;/span&gt;&lt;span&gt;0%&lt;/span&gt;&lt;/h1&gt;
                              &lt;h2&gt;starters&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-share left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;&lt;span&gt;0&lt;/span&gt;&lt;span&gt;0%&lt;/span&gt;&lt;/h1&gt;
                              &lt;h2&gt;leavers&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-android-list left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;&lt;span&gt;0&lt;/span&gt;&lt;span&gt;0%&lt;/span&gt;&lt;/h1&gt;
                              &lt;h2&gt;training today&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-alert-circled left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;&lt;span&gt;0&lt;/span&gt;&lt;span&gt;0%&lt;/span&gt;&lt;/h1&gt;
                              &lt;h2&gt;warnings&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-arrow-up-a left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;&lt;span&gt;0&lt;/span&gt;&lt;span&gt;0%&lt;/span&gt;&lt;/h1&gt;
                              &lt;h2&gt;high performers&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-arrow-down-a left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;&lt;span&gt;0&lt;/span&gt;&lt;span&gt;0%&lt;/span&gt;&lt;/h1&gt;
                              &lt;h2&gt;low performers&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-person-stalker left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;0&lt;/h1&gt;
                              &lt;h2&gt;users&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-document-text left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;9&lt;/h1&gt;
                              &lt;h2&gt;documents&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-ios-list left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;2&lt;/h1&gt;
                              &lt;h2&gt;open requisitions&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="extend inline_block left box"&gt;
                          &lt;span class="icon ion-person left extend"&gt;&lt;/span&gt;
                          &lt;div class="box_content_container extend left"&gt;
                              &lt;h1&gt;2&lt;/h1&gt;
                              &lt;h2&gt;candidates&lt;/h2&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                 
                  &lt;div class="row extend center" id="second_container"&gt;
                      &lt;div class="col s6 bgwhite" id="announcement"&gt;
                          &lt;h1 class="title_header extend clear"&gt;&lt;span class="ion-speakerphone"&gt;&lt;/span&gt;&lt;span&gt;Announcement&lt;/span&gt;&lt;/h1&gt;
                          &lt;div class="row content extend clear"&gt;
                              &lt;div class="content_content extend clear"&gt;
                                 &lt;h1&gt;&lt;span&gt;Sample badge&lt;/span&gt;&lt;span&gt;Sample Title&lt;/span&gt;&lt;/h1&gt;
                                  &lt;p&gt;This is the sample content of this post&lt;/p&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="col s6 bgwhite" id="workflow"&gt;
                          
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="col s6" id="right_container"&gt;
                  sdasd
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>