diff --git a/inc/header.php b/inc/header.php
index 1f0b65f..ad88e5a 100755
--- a/inc/header.php
+++ b/inc/header.php
@@ -2,6 +2,7 @@
+
diff --git a/public/css/main.css b/public/css/main.css
index 3cd8915..5e33b1b 100755
--- a/public/css/main.css
+++ b/public/css/main.css
@@ -48,6 +48,10 @@ a {
background-color: var(--page-bg);
}
+ .container {
+ padding: 4rem;
+ }
+
#landing {
display: block !important;
}
@@ -100,32 +104,45 @@ a {
@media only screen and (max-width: 1024px) {
.hamburger-container {
- padding: 1rem 1rem 2rem 1rem;
+ flex: 1 0 2rem;
+ margin: auto;
}
.hamburger {
+ float: right;
+ margin: auto;
display: flex;
flex-direction: column;
- width: 5rem;
- height: 100%;
+ width: 40%;
+ height: 50%;
+ min-width: 2rem;
+ min-height: 2rem;
cursor: pointer;
justify-content: space-between;
}
+ .container {
+ padding: 4rem 0;
+ }
+
.hamburger-line {
height: 0;
width: 100%;
- border: 0.25rem var(--button-text) solid;
+ border: 0.2rem var(--button-text) solid;
}
.hamburger-open {
display: none;
- font-size: 5rem;
line-height: 1;
color: var(--button-text);
text-align: center;
}
+ .hamburger.is-open p {
+ margin: 0;
+ height: 2rem;
+ }
+
.hamburger.is-open .hamburger-line {
display: none;
}
@@ -164,12 +181,18 @@ a {
background-color: var(--banner-bg);
padding: 1rem;
height: 100%;
+ display: flex;
+ flex-direction: column;
}
- .main-banner img {
+ .main-banner-icon {
+ flex: 3 0 0;
display: block;
- margin: 0.5rem 2rem;
- height: 6rem;
+ }
+
+ .main-banner-icon img {
+ max-width: 100%;
+ max-height: 100%;
}
.main-banner-header {
@@ -177,15 +200,23 @@ a {
flex-direction: row;
justify-content: space-between;
margin-bottom: 1rem;
+ padding: 0 1rem;
+ gap: 1rem;
+ }
+
+ .main-banner-content {
+ flex: 1 1 0;
+ position: relative;
}
.main-banner-buttons {
+ position: relative;
flex-direction: column;
margin: 0 auto;
- padding-top: 12rem;
- gap: 4rem;
+ top: calc(100% - 200px - 1rem);
+ height: 200px;
+ justify-content: space-between;
width: 70%;
- min-width: 300px;
}
.main-banner-buttons a {
@@ -196,7 +227,6 @@ a {
background-color: var(--button-bg);
padding: 1rem 0;
color: var(--button-text);
- font-size: 4rem;
}
#landing {
@@ -216,9 +246,29 @@ a {
flex-direction: column;
}
- .main-banner-content {
- width: 100%;
- position: relative;
+}
+
+
+@media only screen and (max-width: 1024px) and (min-width: 360px) {
+
+ .main-banner-buttons a {
+ font-size: 3rem;
+ }
+
+ .hamburger-open {
+ font-size: 3rem;
+ }
+
+}
+
+@media only screen and (max-width: 360px) {
+
+ .main-banner-buttons a {
+ font-size: 2rem;
+ }
+
+ .hamburger-open {
+ font-size: 2rem;
}
}
@@ -324,7 +374,6 @@ nav a:hover {
display: block;
flex: 1 0 0;
font-size: 24px;
- padding: 4rem;
}
.container ol {
diff --git a/public/index.php b/public/index.php
index ac113c9..e022b85 100755
--- a/public/index.php
+++ b/public/index.php
@@ -12,14 +12,16 @@
-
+
+
+