diff --git a/css/styles.css b/css/styles.css index 8b13789..c973261 100644 --- a/css/styles.css +++ b/css/styles.css @@ -1 +1,84 @@ +@media (max-width: 992px) { + .cookie-text-right, .cookie-text-left { + text-align: center; + } + #cookie-content { + text-align: center; + margin-bottom: 5px; + } +} + +@media (min-width: 992px) { + .cookie-text-right { + text-align: right; + } + + .cookie-text-left { + text-align: left; + } + + #cookie-content { + margin-bottom: 5px; + } +} + +* { + box-sizing: border-box; +} +#banner { + background-image: url('../img/milkbg.jpg'); + background-repeat: no-repeat; + background-position: center; + background-size: cover; + min-width: 768px; + height: 50em; +} + +#banner-content { + background-color: rgba(0,0,0,0.6); + border-radius: 5px; + color: #FFF; + width: 50%; + height: 50%; + position: relative; + top: 25%; + left: 25%; + text-align: center; + padding: 5%; +} + +#banner-content h1 { + font-size: 600%; + font-weight: bold; +} + +#banner-content p { + font-size: 125%; +} + + + +#about-us { + background-color: rgb(211,211,211); + font-size: 125%; +} + +#about-us img { + float: left; +} + +#contact-us { + background-color: rgb(25,160,207); + color: #FFF; + font-size: 125%; +} + +.title-bold { + font-weight: bold; +} + +.cookie-type img { + max-width: 100%; + max-height: 100%; +} \ No newline at end of file diff --git a/index.html b/index.html index e2bedec..f08a67b 100644 --- a/index.html +++ b/index.html @@ -2,46 +2,91 @@ Cookie Store + + + +
+ + +
+
+

The Cookies

+
+
+ + + +
+
+

About us

+ +
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod + tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, + quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo + consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse + cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non + proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+
+
+ +
+
+

Contact us

+
+ 100 Broadway Avenue,
+ New York, NY 10001
+ (212) 555-1234 +
+
+
+
+ -

Cookie Store

-

Buy our awesome cookies. All proceeds go to charity!

-

The Cookies

-

Thin Mint Cookies

-

Tasty mint chocolate cookies

- -

Peanut Butter Cookies

-

Yummy peanut buttery goodness!

- -

Short Bread Cookies

-

Santa's favorite classic.

- -

Smore's Cookies

-

Camp fire favorite!

- -

About us

-
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod -tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, -quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo -consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse -cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non -proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-

Contact us

-
- 100 Broadway Avenue,
- New York, NY 10001
- (212) 555-1234 -