From 44536c392adb850c7c1cd5f0ba6c40e51144d71b Mon Sep 17 00:00:00 2001 From: Jansen Date: Wed, 3 Apr 2019 14:48:22 -0700 Subject: [PATCH 01/12] Position nav elements --- index.html | 2 + styles/normalize.css | 349 +++++++++++++++++++++++++++++++++++++++++++ styles/style.css | 10 ++ 3 files changed, 361 insertions(+) create mode 100644 styles/normalize.css create mode 100644 styles/style.css diff --git a/index.html b/index.html index 69f30be..4a4f90b 100644 --- a/index.html +++ b/index.html @@ -3,6 +3,8 @@ Startrly + +
diff --git a/styles/normalize.css b/styles/normalize.css new file mode 100644 index 0000000..c45a85f --- /dev/null +++ b/styles/normalize.css @@ -0,0 +1,349 @@ +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ + +/* Document + ========================================================================== */ + +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in iOS. + */ + + html { + line-height: 1.15; /* 1 */ + -webkit-text-size-adjust: 100%; /* 2 */ + } + + /* Sections + ========================================================================== */ + + /** + * Remove the margin in all browsers. + */ + + body { + margin: 0; + } + + /** + * Render the `main` element consistently in IE. + */ + + main { + display: block; + } + + /** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ + + h1 { + font-size: 2em; + margin: 0.67em 0; + } + + /* Grouping content + ========================================================================== */ + + /** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ + + hr { + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ + } + + /** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + + pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ + } + + /* Text-level semantics + ========================================================================== */ + + /** + * Remove the gray background on active links in IE 10. + */ + + a { + background-color: transparent; + } + + /** + * 1. Remove the bottom border in Chrome 57- + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ + + abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + text-decoration: underline dotted; /* 2 */ + } + + /** + * Add the correct font weight in Chrome, Edge, and Safari. + */ + + b, + strong { + font-weight: bolder; + } + + /** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + + code, + kbd, + samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ + } + + /** + * Add the correct font size in all browsers. + */ + + small { + font-size: 80%; + } + + /** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + + sub, + sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; + } + + sub { + bottom: -0.25em; + } + + sup { + top: -0.5em; + } + + /* Embedded content + ========================================================================== */ + + /** + * Remove the border on images inside links in IE 10. + */ + + img { + border-style: none; + } + + /* Forms + ========================================================================== */ + + /** + * 1. Change the font styles in all browsers. + * 2. Remove the margin in Firefox and Safari. + */ + + button, + input, + optgroup, + select, + textarea { + font-family: inherit; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ + } + + /** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ + + button, + input { /* 1 */ + overflow: visible; + } + + /** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ + + button, + select { /* 1 */ + text-transform: none; + } + + /** + * Correct the inability to style clickable types in iOS and Safari. + */ + + button, + [type="button"], + [type="reset"], + [type="submit"] { + -webkit-appearance: button; + } + + /** + * Remove the inner border and padding in Firefox. + */ + + button::-moz-focus-inner, + [type="button"]::-moz-focus-inner, + [type="reset"]::-moz-focus-inner, + [type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; + } + + /** + * Restore the focus styles unset by the previous rule. + */ + + button:-moz-focusring, + [type="button"]:-moz-focusring, + [type="reset"]:-moz-focusring, + [type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; + } + + /** + * Correct the padding in Firefox. + */ + + fieldset { + padding: 0.35em 0.75em 0.625em; + } + + /** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ + + legend { + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ + } + + /** + * Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ + + progress { + vertical-align: baseline; + } + + /** + * Remove the default vertical scrollbar in IE 10+. + */ + + textarea { + overflow: auto; + } + + /** + * 1. Add the correct box sizing in IE 10. + * 2. Remove the padding in IE 10. + */ + + [type="checkbox"], + [type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ + } + + /** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ + + [type="number"]::-webkit-inner-spin-button, + [type="number"]::-webkit-outer-spin-button { + height: auto; + } + + /** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ + + [type="search"] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ + } + + /** + * Remove the inner padding in Chrome and Safari on macOS. + */ + + [type="search"]::-webkit-search-decoration { + -webkit-appearance: none; + } + + /** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ + + ::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ + } + + /* Interactive + ========================================================================== */ + + /* + * Add the correct display in Edge, IE 10+, and Firefox. + */ + + details { + display: block; + } + + /* + * Add the correct display in all browsers. + */ + + summary { + display: list-item; + } + + /* Misc + ========================================================================== */ + + /** + * Add the correct display in IE 10+. + */ + + template { + display: none; + } + + /** + * Add the correct display in IE 10. + */ + + [hidden] { + display: none; + } \ No newline at end of file diff --git a/styles/style.css b/styles/style.css new file mode 100644 index 0000000..2e7c39a --- /dev/null +++ b/styles/style.css @@ -0,0 +1,10 @@ +nav ul { + display: grid; + grid-template-columns: 6fr 2fr 1fr; +} + +nav li { + list-style-type: none; + + /* display: inline-block */ +} \ No newline at end of file From 81d4c734874329190fba1f2fca825f783b0d85cd Mon Sep 17 00:00:00 2001 From: Jansen Date: Wed, 3 Apr 2019 15:37:56 -0700 Subject: [PATCH 02/12] Position intro section --- index.html | 2 +- styles/style.css | 21 ++++++++++++++++++--- 2 files changed, 19 insertions(+), 4 deletions(-) diff --git a/index.html b/index.html index 4a4f90b..07ea48b 100644 --- a/index.html +++ b/index.html @@ -25,7 +25,7 @@ -
+

Startrly

A catchy tagline for a great solution Some Call to Action diff --git a/styles/style.css b/styles/style.css index 2e7c39a..64f0d1c 100644 --- a/styles/style.css +++ b/styles/style.css @@ -5,6 +5,21 @@ nav ul { nav li { list-style-type: none; - - /* display: inline-block */ -} \ No newline at end of file +} + +.intro { + height: 25vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-around; + background-color: red; +} + +.intro sub { + margin-bottom: 5vh; +} + +/* h1, sub, a { + border-style: dotted; +} */ \ No newline at end of file From 4c876eea8ba011c3896d85e0356f35c435100361 Mon Sep 17 00:00:00 2001 From: Jansen Date: Thu, 4 Apr 2019 09:01:15 -0700 Subject: [PATCH 03/12] Position blockquotes and authors --- index.html | 4 ++-- styles/style.css | 19 ++++++++++++++++++- 2 files changed, 20 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 07ea48b..29f8a4c 100644 --- a/index.html +++ b/index.html @@ -32,7 +32,7 @@

Startrly

-
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
@@ -70,7 +70,7 @@

Why?

-
+
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
diff --git a/styles/style.css b/styles/style.css index 64f0d1c..e8ca587 100644 --- a/styles/style.css +++ b/styles/style.css @@ -13,13 +13,30 @@ nav li { flex-direction: column; align-items: center; justify-content: space-around; - background-color: red; + /* background-color: red; */ + border-bottom: 1px solid grey; } .intro sub { margin-bottom: 5vh; } +.testimonial { + /* display: flex; */ + margin-top: 10vh; + height: 25vh; + /* flex-direction: row; */ + text-align: center; +} + +.testimonial p { + background-color: olive; + text-align: right; + margin-top: 10vh; + margin-right: 25vh; + +} + /* h1, sub, a { border-style: dotted; } */ \ No newline at end of file From 708017ce8467b14bf5bd8f6383e18c6518347288 Mon Sep 17 00:00:00 2001 From: Jansen Date: Thu, 4 Apr 2019 14:43:10 -0700 Subject: [PATCH 04/12] Clean up blockquotes and autor sections --- index.html | 2 +- styles/style.css | 43 ++++++++++++++++++++++++++++++++++++------- 2 files changed, 37 insertions(+), 8 deletions(-) diff --git a/index.html b/index.html index 29f8a4c..67b4179 100644 --- a/index.html +++ b/index.html @@ -42,7 +42,7 @@

Startrly

-
+

Why?

  • diff --git a/styles/style.css b/styles/style.css index e8ca587..306f218 100644 --- a/styles/style.css +++ b/styles/style.css @@ -22,21 +22,50 @@ nav li { } .testimonial { - /* display: flex; */ margin-top: 10vh; height: 25vh; - /* flex-direction: row; */ - text-align: center; + text-align: left; } .testimonial p { - background-color: olive; + /* background-color: olive; */ text-align: right; margin-top: 10vh; margin-right: 25vh; } -/* h1, sub, a { - border-style: dotted; -} */ \ No newline at end of file +/* .selling-points { + display: flex; + flex-direction: column; + background-color: red; +} + +.selling-points ul li { + display: flex; + flex-direction: row; + flex-wrap: wrap; +} + +.selling-points ul { + display: flex; + flex-direction: row; + list-style-type: none; +} + +.selling-points ul li { + background-color: white; + display: flex; + flex-wrap: wrap; +} + +.selling-points strong, +.selling-points p { + color: red; + text-align: center; + flex-wrap: wrap; +} + +.selling-points h2 { + text-align: center; +} */ From 5a45a0dbc39a2f9bf3c4089f2d5d5239069e1d84 Mon Sep 17 00:00:00 2001 From: Jansen Date: Thu, 4 Apr 2019 17:26:01 -0700 Subject: [PATCH 05/12] Position Why section --- index.html | 32 +++++++++++++---------- styles/style.css | 67 ++++++++++++++++++++++++++++++++++++------------ 2 files changed, 69 insertions(+), 30 deletions(-) diff --git a/index.html b/index.html index 67b4179..afd3dc4 100644 --- a/index.html +++ b/index.html @@ -46,25 +46,31 @@

    Startrly

    Why?

    • - - Comfortable -

      - Et quas molestias excepturi sint occaecati cupiditate non providents, ut aut reiciendis voluptatibus maiores. -

      -
      • -
    • - - Robust -

      + + + Comfortable +

      + Et quas molestias excepturi sint occaecati cupiditate non providents, ut aut reiciendis voluptatibus maiores. +

      + +
      • +
    • + + + Robust +

      At vero eos et accusamus et iusto odio dignissimos ducimus qui. Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam.

      +
    • - - Convenient -

      + + + Convenient +

      Itaque earum rerum hic tenetur a sapiente delectus.

      +
diff --git a/styles/style.css b/styles/style.css index 306f218..1548dac 100644 --- a/styles/style.css +++ b/styles/style.css @@ -1,3 +1,4 @@ +/* NAVIGATION BAR */ nav ul { display: grid; grid-template-columns: 6fr 2fr 1fr; @@ -7,6 +8,7 @@ nav li { list-style-type: none; } +/* TAGLINE SECTION */ .intro { height: 25vh; display: flex; @@ -21,6 +23,7 @@ nav li { margin-bottom: 5vh; } +/* QUOTES */ .testimonial { margin-top: 10vh; height: 25vh; @@ -35,37 +38,67 @@ nav li { } -/* .selling-points { - display: flex; - flex-direction: column; - background-color: red; +/* WHY SECTION */ +.selling-points { + padding-bottom: 5vw; } -.selling-points ul li { - display: flex; - flex-direction: row; - flex-wrap: wrap; +.selling-points h2 { + text-align: center; + padding-top: 3vw; +} + +.selling-points img { + float: left; } .selling-points ul { display: flex; flex-direction: row; + flex-wrap: wrap; list-style-type: none; + + justify-content: space-between; + + padding: 0; } .selling-points ul li { - background-color: white; - display: flex; - flex-wrap: wrap; + /* border: 2px solid pink; */ + + /* display: flex; + flex-direction: row; + flex-wrap: wrap; */ + + margin: 16px; } -.selling-points strong, +/* .selling-points ul > li > *:first-child { + border: 5px solid green; + margin-right: 1.5vw; + height: 15vw; +} */ + +/* .selling-points ul > li > *:last-child { + border: 5px solid purple; +} */ + .selling-points p { color: red; - text-align: center; - flex-wrap: wrap; } -.selling-points h2 { - text-align: center; -} */ +.selling-points img { + padding-bottom: 0px; +} + +.selling-points strong, +.selling-points p { + max-width: 25vw; + justify-content: center; +} + +/* MEET THE TEAM */ + +/* SPONSORS */ + +/* FOOTER */ \ No newline at end of file From 3aebed3a2add38c486d2a92d7efa910cf63db892 Mon Sep 17 00:00:00 2001 From: Jansen Date: Thu, 4 Apr 2019 17:38:09 -0700 Subject: [PATCH 06/12] Adjust padding for img --- styles/style.css | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/styles/style.css b/styles/style.css index 1548dac..9f6517a 100644 --- a/styles/style.css +++ b/styles/style.css @@ -50,6 +50,8 @@ nav li { .selling-points img { float: left; + padding-right: 1.5vw; + padding-bottom: 1vw; } .selling-points ul { @@ -87,9 +89,9 @@ nav li { color: red; } -.selling-points img { - padding-bottom: 0px; -} +/* .selling-points img { + +} */ .selling-points strong, .selling-points p { From a80d4c5b46397f8ca177510df35ade5bdaf38ada Mon Sep 17 00:00:00 2001 From: Jansen Date: Thu, 4 Apr 2019 17:39:30 -0700 Subject: [PATCH 07/12] Clean up comments --- styles/style.css | 21 --------------------- 1 file changed, 21 deletions(-) diff --git a/styles/style.css b/styles/style.css index 9f6517a..315081e 100644 --- a/styles/style.css +++ b/styles/style.css @@ -15,7 +15,6 @@ nav li { flex-direction: column; align-items: center; justify-content: space-around; - /* background-color: red; */ border-bottom: 1px solid grey; } @@ -31,7 +30,6 @@ nav li { } .testimonial p { - /* background-color: olive; */ text-align: right; margin-top: 10vh; margin-right: 25vh; @@ -66,33 +64,14 @@ nav li { } .selling-points ul li { - /* border: 2px solid pink; */ - - /* display: flex; - flex-direction: row; - flex-wrap: wrap; */ margin: 16px; } -/* .selling-points ul > li > *:first-child { - border: 5px solid green; - margin-right: 1.5vw; - height: 15vw; -} */ - -/* .selling-points ul > li > *:last-child { - border: 5px solid purple; -} */ - .selling-points p { color: red; } -/* .selling-points img { - -} */ - .selling-points strong, .selling-points p { max-width: 25vw; From b1a6ee0d422829ce7658a64dee1d4b6b51e7a2c3 Mon Sep 17 00:00:00 2001 From: Jansen Date: Thu, 4 Apr 2019 18:05:27 -0700 Subject: [PATCH 08/12] Position Team section --- index.html | 2 +- styles/style.css | 28 ++++++++++++++++++++++++++++ 2 files changed, 29 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index afd3dc4..903378e 100644 --- a/index.html +++ b/index.html @@ -86,7 +86,7 @@

Why?

-
+

Meet the team

  • diff --git a/styles/style.css b/styles/style.css index 315081e..c3bc5e9 100644 --- a/styles/style.css +++ b/styles/style.css @@ -80,6 +80,34 @@ nav li { /* MEET THE TEAM */ +.team h2 { + text-align: center; +} + +.team ul { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; + align-items: center; +} + +.team li { + list-style-type: none; + text-align: center; + width: 30%; + +} + +.team span { + display: block; + +} + +.team img { + border-radius: 50%; +} + /* SPONSORS */ /* FOOTER */ \ No newline at end of file From 3aff058fe7a70cac2e7f7ad73074c25dbbfe1078 Mon Sep 17 00:00:00 2001 From: Jansen Date: Thu, 4 Apr 2019 18:18:14 -0700 Subject: [PATCH 09/12] Add borders to team images --- styles/style.css | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/styles/style.css b/styles/style.css index c3bc5e9..6d1d3b1 100644 --- a/styles/style.css +++ b/styles/style.css @@ -80,8 +80,16 @@ nav li { /* MEET THE TEAM */ +.team { + /* background-color: lightcoral; */ + padding-bottom: 3vw; + padding-top: 3vw; +} + .team h2 { text-align: center; + /* padding-top: 5vw; */ + padding-bottom: 5vw; } .team ul { @@ -96,16 +104,18 @@ nav li { list-style-type: none; text-align: center; width: 30%; - } .team span { display: block; + padding: 3%; } .team img { border-radius: 50%; + border: 3px double; + border-color: lightgray; } /* SPONSORS */ From eeffd380afd20ad73acef483a7c5f98c5d3c5b07 Mon Sep 17 00:00:00 2001 From: Jansen Date: Thu, 4 Apr 2019 18:45:30 -0700 Subject: [PATCH 10/12] Position sponsors; add borders between sections --- index.html | 4 ++-- styles/style.css | 35 +++++++++++++++++++++++++++++++++-- 2 files changed, 35 insertions(+), 4 deletions(-) diff --git a/index.html b/index.html index 903378e..3d489f3 100644 --- a/index.html +++ b/index.html @@ -118,7 +118,7 @@

    Meet the team

-
+

Sponsors

  • @@ -140,7 +140,7 @@

    Sponsors

-
+

Support

    diff --git a/styles/style.css b/styles/style.css index 6d1d3b1..cddfa60 100644 --- a/styles/style.css +++ b/styles/style.css @@ -27,6 +27,7 @@ nav li { margin-top: 10vh; height: 25vh; text-align: left; + border-bottom: 1px solid grey; } .testimonial p { @@ -39,6 +40,7 @@ nav li { /* WHY SECTION */ .selling-points { padding-bottom: 5vw; + border-bottom: 1px solid grey; } .selling-points h2 { @@ -81,7 +83,7 @@ nav li { /* MEET THE TEAM */ .team { - /* background-color: lightcoral; */ + background-color: lightcoral; padding-bottom: 3vw; padding-top: 3vw; } @@ -120,4 +122,33 @@ nav li { /* SPONSORS */ -/* FOOTER */ \ No newline at end of file +.sponsors { + border-bottom: 1px solid grey; +} + +.sponsors h2 { + text-align: center; +} + +.sponsors ul { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; + align-content: center; +} + +.sponsors li { + list-style-type: none; + width: 25%; +} + +.sponsors img { + padding: 10%; +} + +/* FOOTER */ + +.footer li { + list-style-type: none; +} \ No newline at end of file From 0652e01f158062cc43165fa5c7d1ea0ef849ea3a Mon Sep 17 00:00:00 2001 From: Jansen Date: Thu, 4 Apr 2019 18:56:36 -0700 Subject: [PATCH 11/12] Add button --- styles/style.css | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/styles/style.css b/styles/style.css index cddfa60..12a02b5 100644 --- a/styles/style.css +++ b/styles/style.css @@ -18,6 +18,16 @@ nav li { border-bottom: 1px solid grey; } +.intro a:link, a:visited { + color: gray; + padding: 14px 25px; + text-align: center; + text-decoration: none; + border: 1px solid; + border-radius: 8px; + display: inline-block; +} + .intro sub { margin-bottom: 5vh; } @@ -70,10 +80,6 @@ nav li { margin: 16px; } -.selling-points p { - color: red; -} - .selling-points strong, .selling-points p { max-width: 25vw; From 766ef8148ed643718a664f7755c1ed3dece42178 Mon Sep 17 00:00:00 2001 From: Jansen Date: Fri, 5 Apr 2019 09:13:28 -0700 Subject: [PATCH 12/12] Style blockquotes and author; Edit button so it changes color when mouse hovers over it --- styles/style.css | 64 ++++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 57 insertions(+), 7 deletions(-) diff --git a/styles/style.css b/styles/style.css index 12a02b5..c39d6fd 100644 --- a/styles/style.css +++ b/styles/style.css @@ -1,3 +1,7 @@ +body { + font-family: Arial, Helvetica, sans-serif; +} + /* NAVIGATION BAR */ nav ul { display: grid; @@ -10,12 +14,21 @@ nav li { /* TAGLINE SECTION */ .intro { - height: 25vh; + height: 30vh; display: flex; flex-direction: column; align-items: center; justify-content: space-around; border-bottom: 1px solid grey; + +} + +.intro h1 { + margin-top: 15vw; +} + +.intro a { + margin-bottom: 15vw; } .intro a:link, a:visited { @@ -28,8 +41,14 @@ nav li { display: inline-block; } +.intro a:hover { + background-color: lightblue; + color: white; +} + .intro sub { margin-bottom: 5vh; + font-size: 1.2em; } /* QUOTES */ @@ -40,11 +59,24 @@ nav li { border-bottom: 1px solid grey; } +.testimonial blockquote::before, +.testimonial blockquote::after { + content: ' " '; +} + +.testimonial p, +.testimonial blockquote { + font-style: italic; +} + .testimonial p { text-align: right; margin-top: 10vh; margin-right: 25vh; - +} + +.testimonial p::before { + content: "- " } /* WHY SECTION */ @@ -89,14 +121,12 @@ nav li { /* MEET THE TEAM */ .team { - background-color: lightcoral; padding-bottom: 3vw; padding-top: 3vw; } .team h2 { text-align: center; - /* padding-top: 5vw; */ padding-bottom: 5vw; } @@ -129,6 +159,11 @@ nav li { /* SPONSORS */ .sponsors { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-around; + border-bottom: 1px solid grey; } @@ -146,15 +181,30 @@ nav li { .sponsors li { list-style-type: none; - width: 25%; + margin: 1em; } .sponsors img { - padding: 10%; + width: 300px; + height: auto; } /* FOOTER */ +.footer { + display: grid; + grid-template-columns: .5fr 3fr; +} + +.footer div { + /* display: flex; + flex-direction: row */ +} + .footer li { list-style-type: none; -} \ No newline at end of file +} + +.footer h3 { + padding-inline-start: 40px; +}