diff --git a/assets/images/facebook-icon.svg b/assets/images/facebook-icon.svg new file mode 100644 index 0000000..411b9bc --- /dev/null +++ b/assets/images/facebook-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/instagram-icon.svg b/assets/images/instagram-icon.svg new file mode 100644 index 0000000..b4ca66b --- /dev/null +++ b/assets/images/instagram-icon.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/youtube-icon.svg b/assets/images/youtube-icon.svg new file mode 100644 index 0000000..de6f9a7 --- /dev/null +++ b/assets/images/youtube-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/styles/main.css b/assets/styles/main.css index 8a98bf3..a0d0c55 100644 --- a/assets/styles/main.css +++ b/assets/styles/main.css @@ -148,6 +148,33 @@ body{ line-height: 24px; } +.page-footer{ + display: flex; + flex-direction: column; + align-items: center; + padding: 38px 0; + background: #000000; +} + +.footer-icons{ + display: flex; + list-style: none; + margin-bottom: 16px; + +} + +.footer-icon{ + margin: 0 8px; +} + +.footer-text{ + font-size: 10px; + line-height: 12px; + text-transform: uppercase; + color: #BDBDBD; +} + + @media screen and (max-width: 414px) { .main-banner-desktop, @@ -183,6 +210,14 @@ body{ font-size: 14px; } + .page-foote{ + padding-bottom: 26px; + } + + .footer-text{ + max-width: 280px; + text-align: center; + } } diff --git a/index.html b/index.html index e845d83..7810547 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,8 @@ M3 Landing Page - + + @@ -123,5 +124,25 @@ + +