diff --git a/css/style.css b/css/style.css index 92f3c1c..767d1f5 100644 --- a/css/style.css +++ b/css/style.css @@ -6,6 +6,9 @@ html { } body { + display:flex; + flex-direction:comlumn; + color: #333333; font-family: Arial, Helvetica, sans-serif; font-size: 16px; @@ -27,7 +30,7 @@ h6 { } p { - font-family: Arial, Helvetica, sans-serif; + font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande'; line-height: 1.6; margin: 0 0 1.6rem; } @@ -50,25 +53,87 @@ hr { } /* Layout */ +.main { + background-color:rgb(187, 183, 184); + display:flex; + flex-direction:column; + justify-content:center; + align-items:center; + width:100%; + height:100vh; +} .container { - padding: 0; - margin: 0 auto; - width: 100%; + background:linear-gradient(rgb(125, 125, 243), rgb(241, 135, 152), white); + padding: 20px; + margin: 50px, 50px; + display:flex; + flex-direction:column; + justify-content:center; + align-items:center; + width: 90%; + height:90%; max-width: 1000px; + border: 4px solid black; +} +.quote_card{ + padding: 50px; + margin: 70px; + + + +} +.quote { + color: #333333; + font-family: Arial, Helvetica, sans-serif; + font-weight: bold; + font-style:italic; + font-size: 20px; + line-height: 1.6; + +} +.author { + padding: 50px; + color: #333333; + font-family: Arial, Helvetica, sans-serif; + font-size: 14px; + line-height: 1.6; } /* Media Queries */ @media (min-width: 699px) { - - /* CSS HERE */ + .container { + background:radial-gradient(rgb(171, 241, 171), rgb(235, 235, 160), white); + padding: 20px; + margin: 50px, 50px; + display:flex; + flex-direction:column; + justify-content:center; + align-items:center; + width: 90%; + height:90%; + max-width: 1000px; + border: 4px solid black; + } } /* Desktop Media Query */ @media (min-width: 999px) { - - /* CSS HERE */ + .container { + background:linear-gradient(rgb(243, 243, 245), rgb(243, 5, 152), rgb(19, 18, 18)); + padding: 20px; + margin: 50px, 50px; + display:flex; + flex-direction:column; + justify-content:center; + align-items:center; + width: 90%; + height:90%; + max-width: 1000px; + border: 4px solid black; + } + } diff --git a/index.html b/index.html index 197befc..d6f5f8c 100644 --- a/index.html +++ b/index.html @@ -4,27 +4,27 @@ My Quote Page - + -
+
-
+
-
+
-

Dude, suckin at something is the first step at being sorta good at something.

-

Jacob "Jake" the Dog, Sr.

+

"Have you ever noticed that anybody driving slower than you is an idiot, and anyone going faster than you is a maniac?"

+

George Carlin

-
+ -
+ -
+