*{
  box-sizing: border-box;
}
[class*="col-"]{
  float: left;
}
.renglon{
  overflow: auto;
}

/*Grid para celular*/
[class*="col-"]{
  width: 100%;
}

@media screen and (max-width: 599px){
  .col{width: 100%}
}

/*Grid para la Tablet*/
@media screen and (min-width: 600px){
  .col-t-1{width: 8.33%;}
  .col-t-2{width: 16.66%;}
  .col-t-3{width: 25%;}
  .col-t-4{width: 33.33%;}
  .col-t-5{width: 41.66%;}
  .col-t-6{width: 50%;}
  .col-t-7{width: 58.33%;}
  .col-t-8{width: 66.66%;}
  .col-t-9{width: 75%;}
  .col-t-10{width: 83.33%;}
  .col-t-11{width: 91.66%;}
  .col-t-12{width: 100%;}
}

/*Grid para PC*/
@media screen and (min-width: 768px){
  .col-1{width: 8.33%;}
  .col-2{width: 16.66%;}
  .col-3{width: 25%;}
  .col-4{width: 33.33%;}
  .col-5{width: 41.66%;}
  .col-6{width: 50%;}
  .col-7{width: 58.33%;}
  .col-8{width: 66.66%;}
  .col-9{width: 75%;}
  .col-10{width: 83.33%;}
  .col-11{width: 91.66%;}
  .col-12{width: 100%;}
}