diff --git a/airbnb/index.html b/airbnb/index.html index 4884712..4957568 100644 --- a/airbnb/index.html +++ b/airbnb/index.html @@ -1 +1,50 @@ - + + + + + + Airbnb + + + + + +
+

Book unique homes and experiences.

+
+ +
+ + + + +
+
+ + +
+ +
+ + +
+
+ + + + + +
+ +
+

Explore Airbnb

+ + +
+ + + diff --git a/airbnb/styles.css b/airbnb/styles.css index b9ad8b6..1633a7d 100644 --- a/airbnb/styles.css +++ b/airbnb/styles.css @@ -1 +1,73 @@ -/* Add your CSS here */ +*, *::before, *::after { + box-sizing: border-box; +} + +body { + font-family: sans-serif; +} + +header { + display: flex; + align-items: center; + background-color: gray; + background-image: url("https://placekitten.com/2000/100"); + height: 6rem; +} + +h1{ + color: white; + margin-left: 10px; +} + +label { + display: block; + margin-top: 2rem; + text-transform: uppercase; + color: gray; + font-weight: bold; + margin-bottom: 1rem; +} + +input { + display: block; + width: 100%; + height: 3rem; + font-size: 1rem; +} + +form > section { + display: flex; +} +section > section { + width: 50%; +} + +.search { + background-color: #ff5c5c; + color: white; + margin: 1rem 0 1rem 0; +} + +.explore ul { + display: flex; + padding-left: 0; + justify-content: space-around; +} + +.explore li { + width: 30%; + list-style: none; + border: thin solid lightgray; + height: 75px; +} + +.explore li a { + width: 100%; + height: 100%; + text-align: center; + display: flex; + align-items: center; + text-decoration: none; + color: gray; + font-weight: bold; +} diff --git a/amazon/index.html b/amazon/index.html index 4884712..ba161b4 100644 --- a/amazon/index.html +++ b/amazon/index.html @@ -1 +1,47 @@ - + + + + + + Amazon + + + + +
+ +
+

Computer & Technology Books

+ +

Browse a wide selection of programming guides, + Android resources, and Java books.

+
+ +
+ +

Shop by category

+ + +
+
+ + + + diff --git a/amazon/styles.css b/amazon/styles.css index b9ad8b6..7151013 100644 --- a/amazon/styles.css +++ b/amazon/styles.css @@ -1 +1,42 @@ -/* Add your CSS here */ +*, *::after, *::before { + box-sizing: border-box; +} + +main { + font-family: sans-serif; + padding: 10px; +} + +h1 { + color: #ff6a00; + margin-bottom: 1rem; +} + +p { + color: gray; + font-size: .8rem; +} + +h2 { + margin-top: 2rem; + border-bottom: thin solid lightgray; + padding-bottom: 1rem; +} + +ul { + display: flex; + flex-wrap: wrap; + padding: 0; +} + +li { + list-style: none; + width: 25%; + margin-bottom: 2rem; + text-align: center; +} +li a { + display: block; + text-decoration: none; + font-weight: bold; +} diff --git a/github/index.html b/github/index.html index 4884712..e40ffaa 100644 --- a/github/index.html +++ b/github/index.html @@ -1 +1,52 @@ - + + + + + + GitHub + + + + +
+

Come help us make collaboration even better

+

At GitHub we build the tools that make collaborating and + writing software easier for everyone. We've built a company we + truly love working for, and we think you will too.

+
+ + + +
+ +
+ +
+
+

A diverse and inclusive workplace

+

At GitHub, we think that a diverse company is a strong company, and + we work hard to foster a supportive and welcoming workplace. Learn + more about our commitment to diversity and inclusion and see our + current demographic data.

+
+ +
+

Work happier

+

Build amazing things with autonomy, self-direction, and a healthy + work-life balance. We offer flexible work schedules for all of + our employees and unlimited PTO. We also believe that if a job allows for it, + you should work wherever you're happiest.

+
+
+ + + diff --git a/github/styles.css b/github/styles.css index b9ad8b6..7ed0451 100644 --- a/github/styles.css +++ b/github/styles.css @@ -1 +1,100 @@ -/* Add your CSS here */ +*, *::after, *::before { + box-sizing: border-box; +} + +body { + font-family: sans-serif; +} + +h1 { + text-align: center; + margin-top: 8rem; + font-size: 3rem; + width: 60%; + margin-left: auto; + margin-right: auto; +} + +li { + display: inline; + list-style: none; +} +ul { + padding-left: 0; +} + +a { + text-decoration: none; +} + +p { + color: gray; +} + +header p { + width: 70%; + font-size: 1.5rem; + margin-left: auto; + margin-right: auto; + text-align: center; +} + +nav { + position: absolute; + top: 0; +} + +.current::before{ + content: "/ "; + color: gray; +} + +.links li{ + display: block; + width: 30%; + text-align: center; +} +.links ul{ + display: flex; + width: 50%; + margin: 3rem auto 4rem auto; + justify-content: space-around; +} + +.links a { + font-size: 1.2rem; +} + +h2 { + font-weight: normal; +} + +.info { + display: flex; + flex-direction: row; + justify-content: center; +} + +.info::before { + content: url("https://placekitten.com/100/100"); + order: 1; + margin: 1rem; +} + +.diversity { + width: 30%; + order: 2; + margin-right: 2rem; +} + +.info::after { + content: url("https://placekitten.com/100/100"); + order: 3; + margin: 1rem; + margin:left: 2rem; +} + +.happy { + width: 30%; + order: 4; +} diff --git a/instagram/index.html b/instagram/index.html index 4884712..d532045 100644 --- a/instagram/index.html +++ b/instagram/index.html @@ -1 +1,83 @@ - + + + + + + Instagram + + + + +
+
+ +

About Us

+ +

The Team

+ +
+

Kevin Systrom (CEO, co-founder)

+ +

Kevin Systrom (@kevin) + is the CEO and co-founder of Instagram, a community of more than 1 billion + who capture and share the world's moments on the service. He is responsible + for the company's overall vision and strategy as well as day-to-day operations.

+ +

Since the beginning, Kevin has focused on simplicity and + inspiring creativity through solving problems with thoughtful product design. + As a result, Instagram has become the home for visual storytelling for + everyone from celebrities, newsrooms and brands, to teens, musicians and + anyone with a creative passion.

+ +

Prior to founding Instagram, Kevin was part of the startup Odeo, which later + became Twitter, and spent two years at Google working on products like Gmail + and Google Reader. He graduated from Stanford University with a BS in + Management Science & Engineering and serves on the boards of Walmart and KCRW.

+
+ +
+

Mike Krieger (CTO, co-founder)

+ +

Mike Krieger (@mikeyk) is the CTO and + co-founder of Instagram, a global community of more than 1 billion. As the + head of engineering, Mike focuses on building products that bring out the + creativity in all of us.

+ +

A native of Sao Paulo, Brazil, Mike holds an MS in Symbolic Systems from + Stanford University. Prior to founding Instagram, he worked at Meebo as a + user experience designer and front-end engineer.

+ +
+
+ + +
+ + + diff --git a/instagram/styles.css b/instagram/styles.css index b9ad8b6..e47a9f9 100644 --- a/instagram/styles.css +++ b/instagram/styles.css @@ -1 +1,70 @@ -/* Add your CSS here */ +*, *::before, *::after { + box-sizing: border-box; +} + +body { + padding: 0; + margin: 0; +} +main { + background-color: #efeaea; + padding: 10px; + display: flex; + flex-direction: row-reverse; + font-family: sans-serif; +} + +h1 { + font-weight: normal; + font-size: 2rem; +} +h2 { + font-weight: normal; +} + +article { + width: 80%; + border: thin solid lightgray; + background-color: white; + padding: 0 30px 100px 30px; +} + + +p { + margin: 10px 0 10px 0; +} + +aside { + width: 20%; + border: thin solid lightgray; + background-color: white; + padding: 0; +} + +aside h2 { + color: gray; + margin-left: 20px; + text-transform: uppercase; + font-size: 1rem; +} + +aside a { + text-decoration: none; + display: flex; + height: 3rem; + color: black; + padding-left: 25px; + align-items: center; +} + +aside a:hover { + border-left: medium solid black; + font-weight: bold; +} + +ul { + padding: 0; +} +li { + list-style: none; +} diff --git a/stevens-college/index.html b/stevens-college/index.html index 4884712..f8a8bf9 100644 --- a/stevens-college/index.html +++ b/stevens-college/index.html @@ -1 +1,30 @@ - + + + + + + Stevens College + + + + +
+

Computer Software Engineering Technology

+ + Placeholder for a vimeo embed + + + +

Computers have become a major factor in the development and + operation of the modern industry. From providing means of communications, + to operating machines, to facilitating international commerce, to systems + animation, computers and their related software programs makes + things possible.

+
+ + + diff --git a/stevens-college/styles.css b/stevens-college/styles.css index b9ad8b6..62fc623 100644 --- a/stevens-college/styles.css +++ b/stevens-college/styles.css @@ -1 +1,51 @@ -/* Add your CSS here */ +body { + margin: 0; + background-color: #f3f3f3; +} +main { + width: 430px; + font-family: sans-serif; + padding: 10px; + margin-left: auto; + margin-right: auto; +} + +h1 { + margin-top: 0; + font-size: 2.5rem; + text-transform: uppercase; +} + +img { + display: block; + margin-left: auto; + margin-right: auto; +} + +ul { + display: flex; + padding-left: 0; + justify-content: space-around; + margin: 2rem 0 2rem 0; +} + +li { + list-style: none; +} + +li a { + display: flex; + color: white; + text-decoration: none; + text-transform: uppercase; + background-color: #a5002e; + border: thin solid #a5002e; + height: 2rem; + width: 7rem; + align-items: center; + justify-content: center; +} +li a:hover { + background-color: white; + color: #a5002e; +}