diff --git a/index.html b/index.html new file mode 100644 index 0000000..0d039ef --- /dev/null +++ b/index.html @@ -0,0 +1,98 @@ + + + + + + + Pricing Lab + + + + + +
+

Company name

+ +
+

Pricing

+

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour + .

+
+
+
+

Free

+

$0 / mo

+
    +
  • 10 users included
  • +
  • 2GB of storage
  • +
  • Email support
  • +
  • Helpcenter access
  • + +
+ +
+
+

Pro

+

$15 / mo

+
    +
  • 20 users included
  • +
  • 10GB of storage
  • +
  • Priority email support
  • +
  • Helpcenter access
  • + +
+ +
+
+

Enterprise

+

$29 / mo

+
    +
  • 30 users included
  • +
  • 15GB of storage
  • +
  • Phone and email support
  • +
  • Helpcenter access
  • + +
+ +
+
+ +
+ + + + \ No newline at end of file diff --git a/stylesheet.css b/stylesheet.css new file mode 100644 index 0000000..7368e28 --- /dev/null +++ b/stylesheet.css @@ -0,0 +1,62 @@ +.grid{ + + display:grid; + grid-template-areas: + "header . nav" + ". pricing ." + "flexcard flexcard flexcard" + "footer footer footer"; + +} +.flexcard{ + + display:flex; + flex-wrap:wrap; + justify-content: space-evenly; + grid-area:flexcard; +} + +nav{ + grid-area:nav; + +} + +header{ + grid-area:header; + +} + /* #free{ +grid-area:free; + +} +#pro{ + grid-area:pro; + +} +#enterprise{ + grid-area:enterprise; + +} */ +footer{ + + grid-area:footer; + display:flex; + flex-wrap:wrap; + justify-content: space-evenly; + + +} +.pricing{ + grid-area:pricing; + text-align:center; + +} +ul{ + list-style: none; + padding:0; + +} +li{ +padding:3px 0; + +} \ No newline at end of file