Gridarea4-5

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)">
    <meta name="dcterms.created" content="Mon, 15 Jan 2018 00:09:05 GMT">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <title></title>
    <style>

body {
  margin: 2vh;
  background-color: #d7f7f7;
}
.margin-b{margin-bottom: 2vh;}

.wrapper_C4 {
        display: grid;
        grid-gap: 2vh;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        background-color: #f7f7f7;
        color: #444;
    }
	.wrapper_C5 {
        display: grid;
        grid-gap: 2vh;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
        background-color: #f7f7f7;
        color: #444;
    }

    .box {
        background-color: white;
        color: black;
        border-radius: 5px;
        padding: 2vh;
        font-size: 150%;


    }
	.thin{height: 7vh; }
	.body{height: 66vh; }


	.a5-1 {
        grid-column: 1 / span 1;
    }
	.a5-2 {
        grid-column: 2 / span 1;
    }
	.a5-3 {
        grid-column: 3 / span 1;
    }
	.a5-4 {
        grid-column: 4 / span 1;
    }
	.a5-5 {
        grid-column: 5 / span 1;
    }
	.b5-1 {
        grid-column: 1 / span 1;
    }
	.b5-2 {
        grid-column: 2 / span 1;
    }
	.b5-3 {
        grid-column: 3 / span 1;
    }
	.b5-4 {
        grid-column: 4 / span 1;
    }
	.b5-5 {
        grid-column: 5 / span 1;
    }
	.c5-1 {
        grid-column: 1 / span 1;
    }
	.c5-2 {
        grid-column: 2 / span 1;
    }
	.c5-3 {
        grid-column: 3 / span 1;
    }
	.c5-4 {
        grid-column: 4 / span 1;
    }
	.c5-5 {
        grid-column: 5 / span 1;
    }


    .


	</style>
    <!--[if IE]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  </head>
  <body>
<div class="wrapper_C4 margin-b">
  <div class="box a5-1 thin">Height 7vh but 2vh padding</div>
  <div class="box a5-2 thin">Height 7vh but 2vh padding</div>
  <div class="box a5-3 thin">Height 7vh but 2vh padding</div>
  <div class="box a5-4 thin">Height 7vh but 2vh padding</div>

  <div class="box b5-1 thin">Height 7vh but 2vh padding</div>
  <div class="box b5-2 thin">Height 7vh but 2vh padding</div>
  <div class="box b5-3 thin">Height 7vh but 2vh padding</div>
  <div class="box b5-4 thin">Height 7vh but 2vh padding</div>


  <div class="box c5-1 thin">Height 7vh but 2vh padding</div>
  <div class="box c5-2 thin">Height 7vh but 2vh padding</div>
  <div class="box c5-3 thin">Height 7vh but 2vh padding</div>
  <div class="box c5-4 thin">Height 7vh but 2vh padding</div>

</div>
<div class="wrapper_C5">
  <div class="box a5-1 thin">Height 7vh but 2vh padding</div>
  <div class="box a5-2 thin">Height 7vh but 2vh padding</div>
  <div class="box a5-3 thin">Height 7vh but 2vh padding</div>
  <div class="box a5-4 thin">Height 7vh but 2vh padding</div>

  <div class="box b5-1 thin">Height 7vh but 2vh padding</div>
  <div class="box b5-2 thin">Height 7vh but 2vh padding</div>
  <div class="box b5-3 thin">Height 7vh but 2vh padding</div>
  <div class="box b5-4 thin">Height 7vh but 2vh padding</div>


  <div class="box c5-1 thin">Height 7vh but 2vh padding</div>
  <div class="box c5-2 thin">Height 7vh but 2vh padding</div>
  <div class="box c5-3 thin">Height 7vh but 2vh padding</div>
  <div class="box c5-4 thin">Height 7vh but 2vh padding</div>

</div>
  </body>
</html>