.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
  float: left;
  margin: 0 2% 0 0;
}

.col1.last, .col2.last, .col3.last, .col4.last, .col5.last, .col6.last, .col7.last, .col8.last, .col9.last, .col10.last, .col11.last, .col12 {
  margin: 0;
}

.col1 { width: 5.5%; }
.col2 { width: 14%; }
.col3 { width: 22.5%; }
.col4 { width: 31%; }
.col5 { width: 39.5%; }
.col6 { width: 48%; }
.col7 { width: 56.5%; }
.col8 { width: 65%; }
.col9 { width: 73.5%; }
.col10 { width: 82%; }
.col11 { width: 90.5%; }
.col12 { width: 99%; margin: 0; }




#mostrar_menu {
  display:none;
  position:relative;
  padding:7px 10px 7px 35px;
  font-weight:bold;
  background:#fff;
  text-transform:uppercase;
  border-radius:7px;
  box-shadow:0 1px 3px #666;
  text-decoration:none;
  float:right;
  margin:20px 10px 0px 0px;
}
#mostrar_menu:hover {background:#f3f3f3;}

#mostrar_menu span {
  display:inline-block;
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%2214px%22%20height%3D%2214px%22%20viewBox%3D%220%200%2014%2014%22%20style%3D%22enable-background%3Anew%200%200%2014%2014%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20style%3D%22fill%3A%23FFFFFF%3B%22%20d%3D%22M1%2C4h12c0.553%2C0%2C1-0.447%2C1-1s-0.447-1-1-1H1C0.447%2C2%2C0%2C2.447%2C0%2C3S0.447%2C4%2C1%2C4z%20M13%2C6H1%20C0.447%2C6%2C0%2C6.447%2C0%2C7c0%2C0.553%2C0.447%2C1%2C1%2C1h12c0.553%2C0%2C1-0.447%2C1-1C14%2C6.447%2C13.553%2C6%2C13%2C6z%20M13%2C10H1c-0.553%2C0-1%2C0.447-1%2C1%20s0.447%2C1%2C1%2C1h12c0.553%2C0%2C1-0.447%2C1-1S13.553%2C10%2C13%2C10z%22%2F%3E%3C%2Fsvg%3E");
  background-position: 5px 5px;
  background-repeat: no-repeat;
  background-color: #666;
  background-color: rgba(0,0,0,.4);
  -moz-border-radius: 12px;
  -webkit-border-radius: 12px;
  border-radius: 12px;
  top: 50%;
  position:absolute;;
  margin-top: -12px;
  width: 24px;
  height: 24px;
  left:7px;
}

span.icon {
  display:inline-block;
  background-image: url(images/icons.png);
  background-repeat: no-repeat;
  background-color: #666;
  background-color: rgba(0,0,0,.4);
  -moz-border-radius: 9px;
  -webkit-border-radius: 9px;
  border-radius: 9px;
  top: 50%;
  position:absolute;;
  margin-top: -9px;
  width: 18px;
  height: 18px;
  left:7px;
}
span.gear {background-position: -288px 0;}
span.mas {background-position: -0 50%;}
span.menos {background-position: -36px 50%;}
#menu_panel span.icon {
  left:auto;
  right:10px;
  top:20px;
}

#menu_panel {
  position: fixed;
  display:none;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  overflow:hidden;
  z-index:99999;
}
#menu_panel #cerrar_panel
{
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  z-index:99999;
  display:block;
}
#menu_panel div.menu_responsive {
  position:absolute;
  top:0px;
  left:0px;
  background:#fff;
  font-size:1.5em;
  z-index: 11000;
  height:100%;
}
#menu_panel h2 {padding:10px 10px 0px 10px;color:#000;}
#menu_panel li {
  background-color:#ededed;
  display:block;
  padding:0px;
  min-width:350px;
  position: relative;
}
#menu_panel a {
  padding:7px 20px;
  color:#000;
  display:block;
  border-top:1px solid #ddd;
  text-decoration: none;
  box-shadow:inset -5px 0 5px rgba(0,0,0,.15);
  font-weight:bold;
}
#menu_panel li:hover {background:none;}
#menu_panel ul {padding:0px;margin:0px;}
#menu_panel li li a{padding-left:30px;}
#menu_panel li li li a{padding-left:50px;}
#menu_panel ul ul {display:none;}

.fleft {float:left;}
.fright {float:right;}
.clear {clear:both;display:block;width:100%;}


.col321 {width:31%;margin:1%;display:inline-block;float:left;}
.col332 {width:31%;margin:1%;display:inline-block;float:left;}
.col432 {width:23%;margin:1%;display:inline-block;float:left;text-align:center;}
.row .col321:nth-child(3n+1) {clear:both;}
.col332:nth-child(3n+1) {clear:both;}
.col432:nth-child(4n+1) {clear:both;}
/* *********************************************************************************************************************
 * Small devices
 */

@media only screen and (max-width: 768px) {
    .col1, .col2, .col3, .col4{
      width: 31%;
    }

    .col5, .col6, .col7{
      width: 48%;
    }
    .col8, .col9, .col10, .col11 {
    float: none;
    clear:both;
    width: 99%;
  }
  .col432 {
    width:30%;
  }
  .col321 {
    width:48%;
  }
  .row .col321:nth-child(3n+1) {clear:none;}
  .row .col321:nth-child(2n+1) {clear:both;}
  .col332:nth-child(2n+1) {clear:both;}
  .col432:nth-child(4n+1) {clear:none;}
  .col432:nth-child(3n+1) {clear:both;}
  #mostrar_menu {
    display:block;
  }
}
@media only screen and (max-width: 480px) {

  .col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11 {
    float: none;
    width: 99%;
    clear:both;
  }
  .col332, .col432{
    width:46%;
    margin:2%;
  }
  .col321{
    width:96%;
    margin:2%;
    clear:both;
  }
  .col432:nth-child(4n+1) {clear:none;}
  .col432:nth-child(3n+1) {clear:none;}
  .col332:nth-child(2n+1) {clear:both;}
  .col432:nth-child(2n+1) {clear:both;}
}

