CSS snippets

reset.css

/*
----------------------------------------
Tantek Celik's Whitespace Reset
     Author:    Tantek Celik, Shane Riley
    Version:    (CC) 2010 Some Rights Reserved - http://creativecommons.org/licenses/by/2.0
Description:  Resets default styling of browsers to a common base
----------------------------------------
*/

ul, ol { list-style: none; }
h1, h2, h3, h4, h5, h6, pre, code { font-size: 1em; }
ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote,
fieldset, input, dl, dt, dd, figure, figcaption {
  margin: 0;
  padding: 0;
}
a img, :link img, :visited img, fieldset { border: none; }
address { font-style: normal; }
header, section, article, nav, footer, hgroup, details, summary, figure, main {
  display: block;
}
mark {
  color: inherit;
  background-color: transparent;
}
abbr { border: none; }
summary::-webkit-details-marker { display: none; }

snippets.css

@import "./reset.css";

:root {
  font-size: 62.5%; /* 62.5% of the typical browser default font-size of 16px, */
	             /* is 10px. Which makes 1rem = 10px. */
}

html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

/*
----------------------------------------
Responsive
----------------------------------------
*/

/* CSS for all cell phones and shared cross-browser CSS */

@media screen and (min-width: 481px) {
  /* CSS for tablets and larger */
}

@media screen and (min-width: 961px) {
  /* CSS for small desktop and laptop screens and larger */
}

@media screen and (min-width: 1501px) {
  /* CSS for large laptop and desktop displays */
}

@media print {
  /* CSS for printers */
}

/*
----------------------------------------
// lobotomized owl
// https://alistapart.com/article/axiomatic-css-and-lobotomized-owls
// ------------------
----------------------------------------
*/

* + * {
	margin-top: 1.5em;
}

/* BOOK-LIKE, JUSTIFIED PARAGRAPHS */
p {
	text-align: justify;
}

p + p {
margin-top: 0;
text-indent: 2em;
}

/* COMPACT MODULES */
.compact * + * {
	margin-top: 0.75em;
}

/* WIDGETS WITH POSITIONING */
.margins-off > * {
	margin-top: 0;
}