.responsive-type {
  font-size: 20px;
  display: block;
  background: indigo;
  color: #E0E0E0;
  overflow: hidden;
  position: relative;
  padding: .2em .5em;
  border: solid 5px #A47FC0;
  text-align: center;
  margin: 0;
}
.responsive-type:hover,.responsive-type:active,.responsive-type:visited,.responsive-type:focus{
  color: #E0E0E0;
}

@media (min-width: 600px) and (max-width: 900px) {
  .responsive-type {
    font-size: 4vw;
    /* for no calc support: 4vw @ 600px = 24px */
    font-size: calc( 20px + (40 - 20) * ( (100vw - 600px) / ( 900 - 600) ));
  }
}
@media (min-width: 900px) {
  .responsive-type {
    font-size: 60px;
    /* for no calc support - will jump */
    font-size: 40px;
  }
}

table{
  border-collapse: collapse;
  border-spacing: 0px;
  border: 1px solid #CBCBCB;
}
td,th {
  padding: 0.25rem .5rem;
  border: 1px solid #CBCBCB;
}