diff --git a/starter_code/images/facebook.png b/starter_code/images/facebook.png new file mode 100644 index 0000000..3a72823 Binary files /dev/null and b/starter_code/images/facebook.png differ diff --git a/starter_code/images/navicon.png b/starter_code/images/navicon.png new file mode 100644 index 0000000..c20df3f Binary files /dev/null and b/starter_code/images/navicon.png differ diff --git a/starter_code/images/twiter.png b/starter_code/images/twiter.png new file mode 100644 index 0000000..27f7455 Binary files /dev/null and b/starter_code/images/twiter.png differ diff --git a/starter_code/images/youtube.png b/starter_code/images/youtube.png new file mode 100644 index 0000000..ff9fdcb Binary files /dev/null and b/starter_code/images/youtube.png differ diff --git a/starter_code/index.html b/starter_code/index.html index bf06bff..012fc62 100644 --- a/starter_code/index.html +++ b/starter_code/index.html @@ -1,20 +1,217 @@ - - - - - - - - - - - Where work happens | Slack - - - - - - - + + + + + + + + + + + + + Where work happens | Slack + + + + + + + +
+
+
+
+
+

Where work happens

+

When your team needs to kick off a new project, hire a new employee, deplay some code, review + whatever,bladi + bladi blah.

+
+
+
+
+
+
+ +
+
+
+

Already using Slack? Sign in

+
+
+
people +
+
+ +
+
+ +
+
+

You're in good company

+

Millions of people bladiblahbleh bluriblu gatos que pochis. Lorem ipsum dolor sit amet consectetur adipisicing + elit. Voluptatibus, dolores, consequatur assumenda saepe officia at ducimus accusantium tempore velit facere + deserunt ipsa accusamus molestiae nostrum perferendis cupiditate dolore corporis est?

+ DISCOVER WHY +
+ +
+
+
ABN
+
c1
+
lerel +
+
losan +
+
oracl
+
TM
+
+ +
+
+ + + +
+
+
+

Try it for free

+

already using slack? click

+
+
+
+
+
+
+
+ +
+
+
+
+
+ + +
+
+ +
+ slackLogo +
+
+
+ +
+ +
+

Company

+

About us

+

Careers

+

Blog

+

Press

+

Brand Guidelines

+
+ +
+

Product

+

why slack

+

enterprise

+

Customer Stories

+

Pricing

+

Security

+
+ +
+

Resources

+

Download

+

Help Center

+

Guides

+

Partners

+

Events

+

App directory

+

API

+
+ +
+

Extras

+

Podcast

+

Slack Shop

+

Slack at work

+

Slack Fund

+
+ +
+ +
+ +
+ +
+ +
+ + + + + \ No newline at end of file diff --git a/starter_code/stylesheets/style.css b/starter_code/stylesheets/style.css index cff873e..122b1f3 100644 --- a/starter_code/stylesheets/style.css +++ b/starter_code/stylesheets/style.css @@ -5,3 +5,178 @@ main-titles dark-grey: #2C303F; paragraph grey: #5b5e6d; nav grey: #5b5e6d; */ +img { + width: 100%; +} + +.menu { + border-bottom: 1px solid #ccc; + display: flex; + justify-content: space-between; + padding: 10px; + align-items: center; +} + +.menu .logo { + width: 180px; +} + +.menu .navicon { + width: 30px; +} + +.menu ul { + display: flex; + margin: 0; + list-style: none; +} + +.menu a { + color: gray; + margin-left: 20px; + text-decoration: none; +} + +.firstSec { + margin-top: 100px; + margin-bottom: 100px; + justify-items: center; +} + +.rightCol { + align-items: center; + justify-content: center; + padding-left: 40px; +} + +.rightCol h1 { + text-align: center; + justify-content: center; + +} + +.rightCol p { + text-align: center; + margin: 10px; +} + +.formAndAll { + padding: 20px 10px; +} + +.grayBG { + background-color: rgb(186, 179, 179); + background-size: cover; + text-align: center; + padding: 4%; + +} + +.grayBG h { + font-size: 2em; + color: rgb(186, 179, 179); + +} + +.grayBG p { + margin: 20px; + font-size: 1 em; +} + +.justText { + padding: 40px; + +} + + +.justText a { + + background-color: aliceblue; + text-align: center; + color: rgb(66, 101, 208); + font-size: larger; + justify-content: center; + border-radius: 7px; + border-width: 8px; + border-color: rgb(66, 101, 208); + text-decoration: none; + align-self: center; + padding: 20px; +} + +.sponsors { + padding: 50px 20px; +} + +.sponsors img { + width: 60%; + margin-top: 15px; + margin-bottom: 30px; + +} + +.moreInfo { + margin-top: 40px; + margin-bottom: 40px; + margin-left: 30px; + padding-right: 0; + justify-content: space-between; +} + +.lastSection img { + width: 30%; +} + +.lastSection h4 { + text-transform: uppercase; + color: darkgray; + font-size: 1em; + text-align: left; + +} + +.buttCont { + + background-color: rgb(48, 118, 179); + text-align: center; + color: rgb(183, 185, 189); + font-size: larger; + justify-content: center; + border-radius: 7px; + border-width: 8px; + border-color: rgb(230, 231, 234); + text-decoration: none; + align-self: center; + padding: 8px; + margin-top: 100px; + width: 80%; +} + +footer { + flex-wrap: wrap; + background-color: black; + display: flex; + justify-content: space-between; + padding: 10px; + color: white; + +} + +footer img { + width: 40px; +} + +footer li img { + filter: invert(1); +} + +footer ul { + list-style: none; + display: flex; +} + +footer li { + margin-right: 10px; + + +} \ No newline at end of file