diff --git a/index.html b/index.html index 60b1afe13..1f8f86932 100644 --- a/index.html +++ b/index.html @@ -6,11 +6,58 @@ Responsive Cake webpage - + - +
+
+ + photo-of-cake +

Almost before we knew it, we had left the ground.

+
+
+
+

Welcome



+

+ We are made for goodness. We are made for love...We are made for all of the beautiful things that you and I know. We are made to tell the world that there are no outsiders...all are welcome. +

+
+


+
+ +


+
+ + + + + + + + + + + + +


+ + + + +
\ No newline at end of file diff --git a/style.css b/style.css index 6de1b3567..ae9e4aab2 100644 --- a/style.css +++ b/style.css @@ -1 +1,73 @@ -/* Add your styling here */ +header { + border: 1px solid; + background-color: #ededed; +} +nav { + font-size: 17px; + display: block; + flex-direction: row; + margin-left: 270px; + margin-top: 20px; + +} +li { + list-style-type: none; +} +.cake { + width: 90px; + height: 120px; + margin-left: 30px; + margin-top: -40px; +} +p { + width: 170px; + margin-left: 180px; + margin-top: -40px; + font-size: 17px; + color: rgb(85, 85, 131); +} +h1 {margin-left: 30px;} +.para { + width: 350px; + margin-left: 30px; +} +.img-1 { + width: 200px; + height: 120px; + margin-left: 80px; + margin-top: 60px; + + +} +.img-di { + background-color: #ededed; + height: 250px; +} +img { + width: 130px; + height: 70px; +} +.flex { + display: grid; + grid-template-columns: auto auto; + gap: 15px; + justify-content: space-between; + +} +.grid-item { + height: 100%; + width: 100%; +} +.footer { + display: grid; + gap: 10px; + +} + +@media screen and (min-width: 900px) { + +nav { + display: block; + flex-direction: row; +} + }