/* Per a mobils */
@media (max-width: 600px){
  div{
    width: 100%;
  }
}
  
  .par{
    list-style-type: circle;
    float: none;
    width: 50%;
  }

/* Per a tablets */
@media (min-width: 601px){
  #data{
    width: 23%;
    height: 700px;
    float: left;
  }
} 
  .par{
    list-style-type: none;
    float: right;
    width: 26.3%
  }

/* Per a PC */
@media (min-width: 780px){
  div{
    width: 35%;
    height: 700px;
    float: left;
  }
  
  .par{
    list-style-type: circle;
    float: none;
    width: 100%;
  }
}