.article {
  width:100%;
  max-width:1000px;
  margin:0 auto;
 /* height:1000px;*/
  position:relative;
}
.ul {
  display:flex;
  top:0px;
  z-index:10;
  padding-bottom:14px;
}
.li {
  list-style:none;
  flex:1;
}
.li:last-child {
  border-right:1px solid #DDD;
}
.button {
  width:100%;
  border: 1px solid #DDD;
  border-right:0;
  border-top:0;
  padding: 10px;
  background:#FFF;
  font-size:14px;
  font-weight:bold;
  height:60px;
  color:#999
}
.li.active .button {
  background:#F5F5F5;
  color:#000;
}
.tabla { border-collapse:collapse; table-layout:fixed; width:100%; }
.th { background:#F5F5F5; display:none; }
.td, .th {
  height:45px
}
.td,.th { border:1px solid #DDD; padding:2px 10px; empty-cells:show; }
.td,.th {
  text-align:left;
}
.td+.td, .th+.th {
  text-align:center;
  display:none;
}
.td.default {
  display:table-cell;
}
.bg-purple {
  border-top: 3px solid #122c52;
    background-color: #2458a3;
    color: white;
}
.bg-blue {
  border-top:3px solid #cccccc;
}
.sep {
  background:#F5F5F5;
  font-weight:bold;
}
.txt-l { font-weight:bold; }
.txt-top { position:relative; top:-9px; left:-2px; }
.tick { font-size:18px; color:#2458a3; }
.hide {
  border:0;
  background:none;
}

@media (min-width: 640px) {
  .ul {
    display:none;
  }
  .td,.th {
    display:table-cell !important;
  }
  .td,.th {
    width: 610px;
	    font-size: 16px;
  
  }
  .td+.td, .th+.th {
    width: 130px;
  }
}