/* ==== GRID SYSTEM ==== */
 
.row {
  position: relative;
  width: 100%;
                            
}

.row [class^="col"] {
  float: left;
  margin: 0;
  min-height: 0.125rem;     
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
  width: 100%;
}
 

.row::after {
	content: "";
	display: table;
	clear: both;
}
 
 

@media only screen and (min-width: 45em) {  /* 720px */
    
    .row {
  position: relative;
  width: 100%;
             display: -webkit-flex;  display: flex;               
}
    
    
    
  .col-1 {
    width: 8.33%;
  }

  .col-2 {
    width: 16.66%;
  }

  .col-3 {
    width: 25%;
  }

  .col-4 {
    width: 33.33%;
  }

  .col-5 {
    width: 41.65%;
  }

  .col-6 {
    width: 50%;
  }

  .col-7 {
    width: 58.32%;
  }

  .col-8 {
    width: 66.64%;
  }

  .col-9 {
    width: 74.98%;
  }

  .col-10 {
    width: 83.33%;
  }

  .col-11 {
    width: 91.68%;
  }

  .col-12 {
    width: 100%; 
  }

 
   
  .hidden-sm {
    display: block;
  }
}