diff --git a/css/styles.css b/css/styles.css index 540a75e..cd41d66 100644 --- a/css/styles.css +++ b/css/styles.css @@ -1,27 +1,42 @@ body { - font-family: 'Montserrat', sans-serif; - text-align: center; + font-family: 'Montserrat', sans-serif; + text-align: center; } + /* Headings */ + .big-heading { - font-family: 'Montserrat-Black'; - font-size: 3.5rem; - line-height: 1.5; + font-family: 'Montserrat-Black'; + font-size: 3.5rem; + line-height: 1.5; +} + +.big-heading-2 { + font-family: 'Montserrat-Black'; + font-size: 2.0rem; + line-height: 1.5; + padding-top: 80px; } .container-fluid { - padding: 7% 15%; + padding: 7% 15%; } + /* Sections */ + +.colored-section#title { + background-image: url("images/biking.jpg"); +} + .colored-section { - background-color: #ff4c68; - color: #ffffff; + background-color: #ff4c68; + color: #ffffff; } .white-section { - background-color: #ffffff; + background-color: #ffffff; } h1, @@ -30,144 +45,165 @@ h3, h4, h5, h6 { - font-family: 'Montserrat-Bold'; + font-family: 'Montserrat-Bold'; } h3 { - font-size: 1.5rem; + font-size: 1.5rem; } p { - color: #8f8f8f; + color: #8f8f8f; } + /* navigation bar */ + .navbar { - padding: 0 0 4.5rem; + padding: 0 0 4.5rem; } .section-heading { - font-size: 3rem; - line-height: 1.5; + font-size: 3rem; + line-height: 1.5; } .navbar-brand { - font-family: 'Ubuntu', sans-serif; - font-size: 2.5rem; - font-weight: bold; + font-family: 'Ubuntu', sans-serif; + font-size: 2.5rem; + font-weight: bold; } .navbar-item { - padding: 0px 18px; + padding: 0px 18px; } .navbar-link { - font-size: 1.2rem; - font-family: 'Montserrat-light', sans-serif; + font-size: 1.2rem; + font-family: 'Montserrat-light', sans-serif; } + /* Download Buttons */ + .download-btn { - margin: 5% 3% 5% 0; + margin: 5% 3% 5% 0; } + /* Title Section */ + #title .container-fluid { - padding: 3% 15% 7%; - text-align: left; + padding: 3% 15% 7%; + text-align: left; } + /* Title Image */ + .title-image { - width: 60%; - transform: rotate(25deg); - position: absolute; - right: 30%; + width: 60%; + transform: rotate(25deg); + position: absolute; + right: 30%; } + /* Features section */ + #features { - position: relative; - z-index: 1; + position: relative; + z-index: 1; } .feature-title { - font-size: 1.5rem; + font-size: 1.5rem; } .feature-box { - padding: 4%; + padding: 4%; } .feature-icon { - color: #ef8172; - margin-bottom: 1rem; + color: #ef8172; + margin-bottom: 1rem; } .feature-icon:hover { - color: #ff4c68; + color: #ff4c68; } + /* testimonial section */ + #testimonials { - background-color: #ef8172; + background-color: #ef8172; } + .testimonial-text { - font-size: 3rem; - line-height: 1.5; + font-size: 3rem; + line-height: 1.5; } .testimonial-img { - width: 10%; - border-radius: 100%; - margin: 20px; + width: 10%; + border-radius: 100%; + margin: 20px; } -.carousel-item { -} +.carousel-item {} + /* Press section */ + #press { - background-color: #ef8172; - padding-bottom: 3%; + background-color: #ef8172; + padding-bottom: 3%; } .press-img { - width: 15%; - margin: 20px 20px 50px; + width: 15%; + margin: 20px 20px 50px; } + /* Pricing Section */ + #pricing { - padding: 100px; + padding: 100px; } .price-text { - font-size: 3rem; - line-height: 1.5; + font-size: 3rem; + line-height: 1.5; } .pricing-col { - padding: 3% 2%; + padding: 3% 2%; } + /* CTA Section */ + /* Footer section */ -#footer { -} + +#footer {} .social-icon { - margin: 20px 10px; + margin: 20px 10px; } @media (max-width: 1028px) { - #title { - text-align: center; - } - - .title-image { - position: static; - transform: rotate(0); - } + #title { + text-align: center; + } + .title-image { + position: static; + transform: rotate(0); + } } + +.colored-section#title { + background-image: url("images/biking.jpg"); +} \ No newline at end of file diff --git a/images/bike_repair1.jpg b/images/bike_repair1.jpg new file mode 100644 index 0000000..bec3c83 Binary files /dev/null and b/images/bike_repair1.jpg differ diff --git a/images/bike_shop1.jpg b/images/bike_shop1.jpg new file mode 100644 index 0000000..ba46f2c Binary files /dev/null and b/images/bike_shop1.jpg differ diff --git a/images/biking.jpg b/images/biking.jpg new file mode 100644 index 0000000..653dad4 Binary files /dev/null and b/images/biking.jpg differ diff --git a/images/biking2.jpg b/images/biking2.jpg new file mode 100644 index 0000000..aaac6b0 Binary files /dev/null and b/images/biking2.jpg differ diff --git a/images/customers/Anthony.png b/images/customers/Anthony.png new file mode 100644 index 0000000..f17ac86 Binary files /dev/null and b/images/customers/Anthony.png differ diff --git a/images/customers/bobby.jpg b/images/customers/bobby.jpg new file mode 100644 index 0000000..e85babe Binary files /dev/null and b/images/customers/bobby.jpg differ diff --git a/images/customers/elizabeth.jpg b/images/customers/elizabeth.jpg new file mode 100644 index 0000000..17ad73b Binary files /dev/null and b/images/customers/elizabeth.jpg differ diff --git a/images/customers/keith.png b/images/customers/keith.png new file mode 100644 index 0000000..f3f9120 Binary files /dev/null and b/images/customers/keith.png differ diff --git a/images/owne_pic.jpg b/images/owne_pic.jpg new file mode 100644 index 0000000..7da120e Binary files /dev/null and b/images/owne_pic.jpg differ diff --git a/index.html b/index.html index 0e3d210..ebc0196 100644 --- a/index.html +++ b/index.html @@ -21,11 +21,12 @@