diff --git a/img/beaver.svg b/img/beaver.svg new file mode 100644 index 0000000..7d708d3 --- /dev/null +++ b/img/beaver.svg @@ -0,0 +1,141 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/img/duck.svg b/img/duck.svg new file mode 100644 index 0000000..40c2523 --- /dev/null +++ b/img/duck.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/equal.svg b/img/equal.svg new file mode 100644 index 0000000..f34d18b --- /dev/null +++ b/img/equal.svg @@ -0,0 +1,41 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/img/platypus.svg b/img/platypus.svg new file mode 100644 index 0000000..b18db54 --- /dev/null +++ b/img/platypus.svg @@ -0,0 +1,67 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/img/plus.svg b/img/plus.svg new file mode 100644 index 0000000..4e0eb08 --- /dev/null +++ b/img/plus.svg @@ -0,0 +1,37 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/index.html b/index.html index 460d716..9ca786e 100644 --- a/index.html +++ b/index.html @@ -150,8 +150,16 @@

RESCU
-
-

WHAT IS A PLATYPUS?

+
+

WHAT IS A PLATYPUS?

+
+
+ + + + + +
diff --git a/style.css b/style.css index 4b4d66b..7a19a02 100644 --- a/style.css +++ b/style.css @@ -346,7 +346,7 @@ a:hover { background-color: #189090; } -/* Rescued section style*/ +/* Rescued section style and What is a platypus*/ .row { display: flex; @@ -373,6 +373,10 @@ a:hover { flex: 100%; max-width: 100%; } + .equation-icon{ + width: 75px; + height: 75px; + } } @media (min-width: 768px) and (max-width: 991.98px) { @@ -383,6 +387,10 @@ a:hover { flex: 50%; max-width: 100%; } + .equation-icon{ + width: 125px; + height: 125px; + } } @media (min-width: 992px) { @@ -393,6 +401,17 @@ a:hover { flex: 100%; max-width: 33.33%; } + .equation-icon{ + width: 200px; + height: 200px; + } +} + +@media (max-width: 576px) { + .equation-icon{ + width: 75px; + height: 75px; + } } /* footer style */