diff --git a/css/main.css b/css/main.css index 5f346ec..055f3ee 100644 --- a/css/main.css +++ b/css/main.css @@ -1,23 +1,62 @@ html { - background-color: #252627; + background-color: #FAFAF8; } body { - font-family: Open Sans, Arial; - color: #D3D4D4; + font-family: 'Quicksand', sans-serif; + color: #222; font-size: 14px; - margin: 2em auto; - max-width: 800px; - padding: 1em; line-height: 1.4; - text-align: justify + text-align: justify; +} + +h1, h2, h3, h4, h5, h6 { + font-weight: lighter; + font-family: 'Merriweather', serif; +} + +small { + font-size: 60%; +} + +a { + color: #4B88A2; +} + +a:link, a:visited { + text-decoration: none; +} + +a:hover { + text-decoration: underline; + font-size: 101%; } .masthead { + font-family: 'Merriweather', serif; text-align: center; - font-size: 400%; + font-size: 500%; } .nav { text-align: center; } + +.break { + height: 20px; +} + +.container { + width: 100vw; + height: fit-content; + padding-top: 20px; + padding-bottom: 20px; + + border: 1px solid #EEE; + background-color: #FFF; +} + +.text { + margin: 2em auto; + max-width: 700px; +} diff --git a/index.html b/index.html index edc4d9d..22c69c1 100644 --- a/index.html +++ b/index.html @@ -6,7 +6,7 @@ - +
@@ -14,12 +14,28 @@
+

+
+ +
+ +
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum enim nulla, fermentum ut convallis non, pellentesque nec eros. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Nam ultricies suscipit varius. Nulla sagittis lacus id porttitor luctus. Cras massa dolor, molestie eu est a, sodales imperdiet lectus. Vestibulum volutpat nibh mi, quis sagittis turpis suscipit a. Sed nulla urna, bibendum a ligula non, porttitor gravida nunc. Suspendisse ut ligula dictum, lacinia mi eu, scelerisque odio. + + + small pp + +
+
+ + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum enim nulla, fermentum ut convallis non, pellentesque nec eros. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Nam ultricies suscipit varius. Nulla sagittis lacus id porttitor luctus. Cras massa dolor, molestie eu est a, sodales imperdiet lectus. Vestibulum volutpat nibh mi, quis sagittis turpis suscipit a. Sed nulla urna, bibendum a ligula non, porttitor gravida nunc. Suspendisse ut ligula dictum, lacinia mi eu, scelerisque odio. + +