Грамотное оформление медиазапросов

div{
  border: 5px solid blue;
  height: 200px;
  width: 200px;
  color: green;
  text-align: center;
}
 
@media( max-width: 768px){
  div{
    color: red;
    font-size: 50px;
    border:1px solid green;
  }
}

       /* Custom, iPhone Retina */ 
       @media only screen and (min-width : 320px) {
        
    }
 
    /* Extra Small Devices, Phones */ 
    @media only screen and (min-width : 480px) {
 
    }
 
    /* Small Devices, Tablets */
    @media only screen and (min-width : 768px) {
 
    }
 
    /* Medium Devices, Desktops */
    @media only screen and (min-width : 992px) {
 
    }
 
    /* Large Devices, Wide Screens */
    @media only screen and (min-width : 1200px) {
 
    }

/* Large Devices, Wide Screens */
    @media only screen and (max-width : 1200px) {
 
    }
 
    /* Medium Devices, Desktops */
    @media only screen and (max-width : 992px) {
 
    }
 
    /* Small Devices, Tablets */
    @media only screen and (max-width : 768px) {
 
    }
 
    /* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 480px) {
 
    }
 
    /* Custom, iPhone Retina */ 
    @media only screen and (max-width : 320px) {
        
    }