CSS Utilities

Media Queries min-width and max-width

@media only screen and (min-width: 330px) {...}:

• If [device width] is greater than or equal to 330px, then do {...}

@media only screen and (max-width: 330px) {...}:

• If [device width] is less than or equal to 330px, then do {...}

---

Infinite rotate animation CSS3

/* Chrome, Safari, Opera */ 
@-webkit-keyframes rotate { 
  from {-webkit-transform: rotate(0deg);} 
  to {-webkit-transform: rotate(360deg);} 
} 

/* Standard syntax */ 
@keyframes rotate { 
  from {transform: rotate(0deg);} 
  to {transform: rotate(360deg);} 
} 

/* Mozilla */ 
@-moz-keyframes rotate { 
  from {-moz-transform: rotate(0deg);} 
  to {-moz-transform: rotate(360deg);} 
} 

/* Elements to rotate */
.rotate {
  -webkit-animation: rotate 1s ease-in-out infinite;
  -moz-animation: rotate 1s ease-in-out infinite;
  animation: rotate 1s ease-in-out infinite;
}