diff --git a/css/skeleton.css b/css/skeleton.css index 66c1b0c..7ee3a59 100644 --- a/css/skeleton.css +++ b/css/skeleton.css @@ -127,10 +127,10 @@ /* Base Styles –––––––––––––––––––––––––––––––––––––––––––––––––– */ html { - font-size: 100%; } + font-size: 85%; } body { - font-size: 1em; /* currently ems cause chrome bug misinterpreting rems on body element */ - line-height: 1; + font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */ + line-height: 1.6; font-weight: 400; font-family: sans-serif; color: var(--body-text); @@ -144,12 +144,22 @@ h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 2rem; font-weight: 300; } -h1 { font-size: 2.0rem; line-height: 1.5; letter-spacing: -.1rem;} -h2 { font-size: 1.6rem; line-height: 1.4; letter-spacing: -.1rem; } -h3 { font-size: 1.2rem; line-height: 1.3; letter-spacing: -.1rem; } -h4 { font-size: 1.0rem; line-height: 1.3; letter-spacing: -.08rem; } -h5 { font-size: 1.0rem; line-height: 1.3; letter-spacing: -.05rem; } -h6 { font-size: 1.0rem; line-height: 1.3; letter-spacing: 0; } +h1 { font-size: 3.0rem; line-height: 1.2; letter-spacing: -.1rem;} +h2 { font-size: 2.6rem; line-height: 1.25; letter-spacing: -.1rem; } +h3 { font-size: 2.4rem; line-height: 1.3; letter-spacing: -.08rem; } +h4 { font-size: 1.8rem; line-height: 1.35; letter-spacing: -.05rem; } +h5 { font-size: 1.5rem; line-height: 1.5; letter-spacing: 0; } +h6 { font-size: 1.2rem; line-height: 1.6; letter-spacing: 0; } + +/* Larger than phablet */ +@media (min-width: 550px) { + h1 { font-size: 5.0rem; } + h2 { font-size: 4.2rem; } + h3 { font-size: 3.6rem; } + h4 { font-size: 3.0rem; } + h5 { font-size: 2.4rem; } + h6 { font-size: 1.5rem; } +} p { margin-top: 0; } @@ -166,7 +176,9 @@ a:hover { –––––––––––––––––––––––––––––––––––––––––––––––––– */ summary:hover { - color: #0FA0CE; } + color: #0FA0CE; + margin-top: 1em +} /* Buttons