<h1>The grid-row Property</h1>
       
        <div class="main-div">
            <div class="grid-parent">
                <div class="grid-child grid-child-1">1</div>
                <div class="grid-child grid-child-2">2</div>
                <div class="grid-child grid-child-3">3</div>
                <div class="grid-child grid-child-4">4</div>
                <div class="grid-child grid-child-5">5</div>
                <div class="grid-child grid-child-6">6</div>
                <div class="grid-child grid-child-7">7</div>
                <div class="grid-child grid-child-8">8</div>
                <div class="grid-child grid-child-9">9</div>
                <div class="grid-child grid-child-10">10</div>
                <div class="grid-child grid-child-11">11</div>
                <div class="grid-child grid-child-12">12</div>
            </div>
        </div>

    *{
     font-family: 'Exo 2', sans-serif;
     padding: 0;
     margin: 0;
    }
    h1{
        font-size:30px;
        text-align: center;
        margin-bottom: 30px;
        margin-top: 20px;
    }
    h2{
        font-size: 20px;
        font-weight: 600;
        text-align: center;
        padding: 10px;margin-bottom: 20px;

    }
    .main-div{
      width: 950px;
      height: auto;
        border: 5px solid #70409F;
      padding: 10px;
      margin: 0 auto;
    }
    .grid-parent{
      display:grid;
      grid-template-columns: auto auto auto auto auto;
      
    }
   .grid-child{
     color: #000;
     margin: 5px;
    padding: 20px 10px;
  font-size: 30px;
  text-align: center;
     grid-row: 1/2;
   }

      .grid-child-1{
       background-color:#A6E7FF;
       grid-row: 1/4;
   }
   .grid-child-2{
        background-color: #FFDDD3;
        grid-row: 1/3;
   }
   .grid-child-3{
        background-color: #E6D0F7;
   }
   .grid-child-4{
       background-color: #C8F1D6;
     grid-row: 1/3;
   }
   .grid-child-5{
       background-color: #C3CDE6;
   }
   .grid-child-6{
       background-color: #E6D0F7;
   }
   .grid-child-7{
       background-color: #ffd1b0;
   }
   .grid-child-8{
       background-color: #ffebcc;
     grid-row: 1/4;
   }
   .grid-child-9{
       background-color: #94ffdb;
       grid-row: 2/ span 2;
   }
   .grid-child-10{
       background-color: #f9d989;
   }
   .grid-child-11{
       background-color: #ffc4c4;
   }
   .grid-child-12{
       background-color: #eaeacb;
   }

   .icon {
    text-align: center;
    font-size: 25px;
    margin-bottom: 5px;
}