e class="fake-code bottom-margin">
<!--     -->h1 {
<!--     -->  font-size: 30px;
<!--     -->}
<!--     -->
<!--     -->/* XS, SM */
<!--     -->@media (max-width: 991px) {
<!--     -->  h1 {
<!--     -->    font-size: 20px;
<!--     -->  }
<!--     -->}
<!--  --></pre>
          <p>
            Here are some pre-made media queries of the most popular cases, for easy copying and pasting.
          </p>
          <pre class="fake-code">
<!--     -->/* XS */
<!--     -->@media (max-width: 767px) {
<!--     