diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 000000000..4da93fc9e Binary files /dev/null and b/.DS_Store differ diff --git a/css/style.css b/css/style.css index 5cb025cef..14494d153 100755 --- a/css/style.css +++ b/css/style.css @@ -1,9 +1,8 @@ - - /* We are using the 'Roboto' font from Google. This has already been added to your HTML header */ +/* We are using the 'Roboto' font from Google. This has already been added to your HTML header */ body { - font-family: 'Roboto', sans-serif; - -webkit-font-smoothing: antialiased; + font-family: "Roboto", sans-serif; + -webkit-font-smoothing: antialiased; } /** @@ -16,4 +15,147 @@ body { * - When using Flexbox, remember the items you want to move around need to be inside a parent container set to 'display: flex' */ +/* .main { + background-image: url(./homepage-desktop.png); +} */ + +.karmalogo { + justify-self: flex-start; + margin: 10px; + padding-left: 40px; +} + +h1 { + padding-top: 80px; + text-align: center; + color: aliceblue; + font-weight: lighter; +} + +#main { + margin: 0; + border: 0; + padding: 0; + background-image: url("../img/first-background.jpg"); + background-size: 100%; + height: 500px; + background-repeat: no-repeat; + color: aliceblue; + text-align: center; +} + +.container { + text-align: center; + align-items: center; + margin-top: 30px; +} + +.btn1 { + background-color: rgb(242 90 42); + color: white; + padding: 15px 32px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 14px; + border-radius: 10% 10% 10% 10%; +} + +.last { + font-size: 20px; + text-align: center; + color: black; + margin-top: 20px; +} + +ul { + list-style-type: none; + margin: 0; + padding: 0; + overflow: hidden; + color: rgb(71, 65, 65); + display: flex; + justify-content: flex-end; +} + +nav { + display: flex; + justify-content: space-between; +} + +a:hover { + color: rgb(242 90 42); +} + +li { + display: inline-block; + padding-top: 30px; +} + +li a { + color: rgb(57, 54, 54); + text-align: center; + padding: 14px 16px; + text-decoration: none; +} + +.icons { + display: flex; + flex-direction: row; + justify-content: space-evenly; +} + +.iconsp { + display: flex; + flex-direction: row; + justify-content: space-evenly; +} + +.footer { + display: flex; + text-align: center; + margin-top: 30px; + display: flex; + justify-content: center; +} + +.social { + display: flex; + direction: row; + display: block; +} + +.copyright { + color: darkgrey; + /* display: flex; +flex-direction: row; +justify-content: space-evenly; +padding-top: 10px; */ +} + +#main2 { + display: flex; + flex-direction: row; + justify-content: center; + margin: 1rem; + padding: 1rem; +} + +.part2{ + background-color: lightpink; + + padding: 10px; +} +.btn2 { + background-color: rgb(242 90 42); + color: white; + padding: 15px; + margin: 20px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 14px; + + +} \ No newline at end of file diff --git a/index.html b/index.html index 3e742ef04..66f913897 100755 --- a/index.html +++ b/index.html @@ -1,19 +1,125 @@ - - - + + + Karma - - - - - - - + + + + + + +
+ +
+ +
+
+

Introducing Karma

+

Bring WiFi with you, everywhere you go

+
+
+ +
+
+
+ +
+
+

Everyone need a little Karma.

+
+
+ +
+
+ icon-devices + + icon-coffee + + icon-refill +
+ +
+

Interner for all devices

+

Boost your productivity

+

Pay as you Go

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

"Wherever I am, i just don't worry about my connections anymore "

+

+ +
+ +
+ + + diff --git a/level-2/store.html b/level-2/store.html new file mode 100644 index 000000000..e69de29bb