diff --git a/css/styles.css b/css/styles.css index e69de29b..85075a04 100644 --- a/css/styles.css +++ b/css/styles.css @@ -0,0 +1,200 @@ +body { + font-family: "Montserrat", sans-serif; + text-align: center; +} + +/* Title Section */ + +#title .container-fluid { + padding: 3% 15% 7%; + text-align: left; +} + +/* Fonts */ +h1, h2, h3, h4, h5, h6 { + color: white; + font-family: "Montserrat", sans-serif; + font-weight: 800; +} + +p { + color: #8f8f8f; +} +/* Headings */ + +.section-heading { + color: #343a40; + font-size: 3rem; + line-height: 1.5; +} + +.boldmontserrat { + color: white; + font-family: "Montserrat-Black", sans-serif; + font-size: 2rem; +} + +.boldubuntu { + color: white; + font-family: "Ubuntu", sans-serif; + font-size: 2rem; + font-weight: bold; +} + +/* Containers */ + +.container-fluid { + padding: 7% 10%; +} + +/* Sections */ + +.colored-section { + background-color: #ff4c68; + color: #fff; + +} + +.white-section { + background-color: #fff; +} + +.arrow-return-top { + position: fixed; + right: 0.5%; + bottom: 0.5%; + z-index: 10; + text-decoration: none; + color: #8f8f8f; +} + +.arrow-return-top:hover { + color: black; +} + +/* Navigation bar */ +.navbar { + padding: 0 0 4.5rem; +} + +.nav-item { + padding: 0 18px; +} + +.nav-link { + font-size: 1.2rem; + font-family: 'Montserrat', sans-serif; + font-weight: lighter; +} + +/* End nav bar */ +/* Title Section */ +.download-button { + margin: 5% 3% 5% 0; +} + +.dogphoneimage { + padding-top: 10px; + width: 45%; + transform: rotate(25deg); + position: absolute; + right: 30%; +} + +/* We are targeting viewport with max-width */ +@media (max-width: 1028px) { + + #title { + color: #fff; + text-align: center; + } + + .dogphoneimage { + position: static; + transform: rotate(0); + } +} + +/* Features Section */ +#features { + position: relative; +} + +.feature-title { + color: #343a40; + font-size: 1.5rem; +} + +.featurescol { + padding: 4%; +} + +.featuresicon { + margin-bottom: 1rem; + color: #ef8172; +} + +.featuresicon:hover { + color: #ff4c68; +} + +/* Testimonial section */ +#testimonials { + background-color: #ef8172; +} + +.testimonial-text { + font-size: 3rem; + line-height: 1.5; +} + +.testimonial-image { + width: 20%; + border-radius: 100%; + margin: 20px; +} + +#press { + background-color: #ef8172; + padding-bottom: 3%; +} + +.press-logo { + width: 15%; + margin: 20px 20px 50px; +} + +/* Pricing section*/ +#pricing { + padding: 100px; +} + +.pricing-card-title { + color: #343a40; + font-size: 1.5rem; +} + +.price-text { + color: black; + font-size: 3rem; + line-height: 1.5; +} + +.pricing-column { + padding: 3% 2%; +} + +/* Footer Section */ + +#footer { + background-color: white; +} + +.footer-icon { + margin: 3% 1%; + color: #343a40 +} + +.footer-icon:hover { + color: black; +} diff --git a/images/chihu.jpeg b/images/chihu.jpeg new file mode 100644 index 00000000..7156a87d Binary files /dev/null and b/images/chihu.jpeg differ diff --git a/images/TechCrunch.png b/images/techcrunch.png similarity index 100% rename from images/TechCrunch.png rename to images/techcrunch.png diff --git a/index.html b/index.html index 5a19d4c7..5791a104 100644 --- a/index.html +++ b/index.html @@ -1,30 +1,68 @@ - - + + + - TinDog - - + - - -
- - + + + + + + + + + + TinDog + - + + + +
+ +
+ + + + + + + +
+
+

Meet new and interesting dogs nearby.

+ + +
+
+ iphone-mockup +
+
-
-

Meet new and interesting dogs nearby.

- - -
-
- iphone-mockup
@@ -32,101 +70,165 @@

Meet new and interesting dogs nearby.

-
- -

Easy to use.

-

So easy to use, even your dog could do it.

- -

Elite Clientele

-

We have all the dogs, the greatest dogs.

- -

Guaranteed to work.

-

Find the love of your dog's life or your money back.

+
+
+ +
+
+ +

Easy to use.

+

So easy to use, even your dog could do it.

+
+
+ +

Elite Clientele

+

We have all the dogs, the greatest dogs.

+
+
+ +

Guaranteed to work.

+

Find the love of your dog's life or your money back.

+
+
+
-
- -

I no longer have to sniff other dogs for love. I've found the hottest Corgi on TinDog. Woof.

- dog-profile - Pebbles, New York - - +
+ +
-
- tc-logo - tnw-logo - biz-insider-logo - mashable-logo +
+ + + +
-
+
-

A Plan for Every Dog's Needs

+

A Plan for Every Dog's Needs

Simple and affordable price plans for your and your dog.

- -

Chihuahua

-

Free

-

5 Matches Per Day

-

10 Messages Per Day

-

Unlimited App Usage

- - - -

Labrador

-

$49 / mo

-

Unlimited Matches

-

Unlimited Messages

-

Unlimited App Usage

- - - -

Mastiff

-

$99 / mo

-

Pirority Listing

-

Unlimited Matches

-

Unlimited Messages

-

Unlimited App Usage

- +
+
+
+
+

Chihuahua

+
+
+

Free

+

5 Matches Per Day

+

10 Messages Per Day

+

Unlimited App Usage

+ +
+
+
+ +
+
+
+

Labrador

+
+
+

$49 / mo

+

Unlimited Matches

+

Unlimited Messages

+

Unlimited App Usage

+ +
+
+
+ +
+
+
+

Mastiff

+
+
+

$99 / mo

+

Pirority Listing

+

Unlimited Matches

+

Unlimited Messages

+

Unlimited App Usage

+ +
+
+
+
-
+
+
-

Find the True Love of Your Dog's Life Today.

- - +

Find the True Love of Your Dog's Life Today.

+ + +
-