diff --git a/css/styles.css b/css/styles.css new file mode 100644 index 0000000..540a75e --- /dev/null +++ b/css/styles.css @@ -0,0 +1,173 @@ +body { + font-family: 'Montserrat', sans-serif; + text-align: center; +} + +/* Headings */ +.big-heading { + font-family: 'Montserrat-Black'; + font-size: 3.5rem; + line-height: 1.5; +} + +.container-fluid { + padding: 7% 15%; +} + +/* Sections */ +.colored-section { + background-color: #ff4c68; + color: #ffffff; +} + +.white-section { + background-color: #ffffff; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + font-family: 'Montserrat-Bold'; +} + +h3 { + font-size: 1.5rem; +} + +p { + color: #8f8f8f; +} + +/* navigation bar */ +.navbar { + padding: 0 0 4.5rem; +} + +.section-heading { + font-size: 3rem; + line-height: 1.5; +} + +.navbar-brand { + font-family: 'Ubuntu', sans-serif; + font-size: 2.5rem; + font-weight: bold; +} + +.navbar-item { + padding: 0px 18px; +} + +.navbar-link { + font-size: 1.2rem; + font-family: 'Montserrat-light', sans-serif; +} + +/* Download Buttons */ +.download-btn { + margin: 5% 3% 5% 0; +} + +/* Title Section */ +#title .container-fluid { + padding: 3% 15% 7%; + text-align: left; +} + +/* Title Image */ +.title-image { + width: 60%; + transform: rotate(25deg); + position: absolute; + right: 30%; +} + +/* Features section */ +#features { + position: relative; + z-index: 1; +} + +.feature-title { + font-size: 1.5rem; +} + +.feature-box { + padding: 4%; +} + +.feature-icon { + color: #ef8172; + margin-bottom: 1rem; +} + +.feature-icon:hover { + color: #ff4c68; +} + +/* testimonial section */ +#testimonials { + background-color: #ef8172; +} +.testimonial-text { + font-size: 3rem; + line-height: 1.5; +} + +.testimonial-img { + width: 10%; + border-radius: 100%; + margin: 20px; +} + +.carousel-item { +} + +/* Press section */ +#press { + background-color: #ef8172; + padding-bottom: 3%; +} + +.press-img { + width: 15%; + margin: 20px 20px 50px; +} + +/* Pricing Section */ +#pricing { + padding: 100px; +} + +.price-text { + font-size: 3rem; + line-height: 1.5; +} + +.pricing-col { + padding: 3% 2%; +} + +/* CTA Section */ + +/* Footer section */ +#footer { +} + +.social-icon { + margin: 20px 10px; +} + +@media (max-width: 1028px) { + #title { + text-align: center; + } + + .title-image { + position: static; + transform: rotate(0); + } +} diff --git a/images/Erwind.jpg b/images/Erwind.jpg deleted file mode 100644 index b697d79..0000000 Binary files a/images/Erwind.jpg and /dev/null differ diff --git a/images/Jule.jpg b/images/Jule.jpg deleted file mode 100644 index f62ce8b..0000000 Binary files a/images/Jule.jpg and /dev/null differ diff --git a/index.html b/index.html index d05182f..0e3d210 100644 --- a/index.html +++ b/index.html @@ -1,250 +1,223 @@ - - - - - - - - + - - Module 4 - Labo - - + + TinDog + + + + + + + - - - - - - - - + + + + - - - - - - -
-

Welcome to Nice Scissors

-

We'll take care of your hair!

-
+
+
- - -
-
Service
-
Calendar
-
Payment
-
Where to find us
-
- - -
-

Let us tell you about our expertise

-

We can cut hair

-

Align wheels

-

Write in uppercase

-

centered and uppercase

-
- - - - -
-

Service description

-

Here is a list of services offered

- - - - - - - - - - - - - - - - - - - - - -
ServiceDescription
HaircutBla bla
DryingBla bla
ColoringBla bla
-
- - - - -
-

Alert

-

We have something important to say

-
- - Please read! You must read. + +
+ - - - - -
-

Button States

- - - -
+ - - - - -
-

Modal Example

- - - - - - - - - -
-

Meet our hairdressers

-
-
- Card image -
-

Jules

-

Jules has been cutting hair for 10 years.

- See Profile -
-
-
- Card image -
-

Jules

-

The curly hair specialist

- - See Profile -
-

Jules has been cutting hair for 10 years ...

-
-
-
+
+ + + + +
+ +
+ +
+
+ +

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.

+
+
- - - -
-

More information

- Meet our mechanics -
-
- Card image -
-

Erwind

-

Erwind knows all about bikes.

-
-
+
+ + + + +
+ - - - - -
-
-

Erwind's and friends bike shop

-

Bike fixing is our business

+ +
+ + + + +
+ tc-logo + tnw-logo + biz-insider-logo + mashable-logo + +
+ + + + +
+ +

A Plan for Every Dog's Needs

+

Simple and affordable price plans for your and your dog.

+ + +
+
+
+
+

Chihuahua

+
+
+

Chihuahua

+

Free

+

5 Matches Per Day

+

10 Messages Per Day

+

Unlimited App Usage

+ +
-
-
-
- Choose a service -
-
-
-

Here is our list of services

-
-
-
-
- -
-
-
-

What date?

- - -
- -
- -
-
-
-
-
-
-
- -
-
-
-

Your information so we can contact you

-

Form to enter name, email, phone

-
-
-
+
+ +
+
+
+

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.

+ + +
+
+ + + + + + + diff --git a/styles/style.css b/styles/style.css deleted file mode 100644 index 16210b2..0000000 --- a/styles/style.css +++ /dev/null @@ -1,12 +0,0 @@ - -/* Style sheet - color picker www.w3schools.com/colors/colors_picker.asp -*/ - -/* Bootstrap default font-family is Helvetica Neue */ -h1 { - font-family: "Times New Roman", Times, serif; - text-shadow: 3px 3px 1px black; - -} -