diff --git a/innovedus_cms/mysite/static/css/footer.css b/innovedus_cms/mysite/static/css/footer.css
new file mode 100644
index 0000000..e71099e
--- /dev/null
+++ b/innovedus_cms/mysite/static/css/footer.css
@@ -0,0 +1,261 @@
+.site-footer {
+ background: #0e1b42;
+ color: #ffffff;
+ padding: 28px 0 20px;
+ font-size: 14px;
+}
+
+.footer-shell {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+.footer-ad-slot {
+ width: 100%;
+}
+
+.footer-separator {
+ width: 100%;
+ max-width: 790px;
+ height: 1px;
+ background: #ffffff4d;
+ margin: 0 auto 40px;
+}
+
+.footer-main {
+ width: 100%;
+ max-width: 790px;
+ display: grid;
+ grid-template-columns: 220px 220px 180px;
+ grid-template-areas:
+ "b1 b2 b3"
+ "b1 b2 b4";
+ column-gap: 40px;
+ row-gap: 20px;
+ align-items: start;
+}
+
+.footer-col--brand {
+ grid-area: b1;
+ min-width: 0;
+}
+
+.footer-brand-content img {
+ max-width: 100%;
+ height: auto;
+ margin-bottom: 12px;
+}
+
+.footer-brand-content p {
+ margin: 0 0 8px;
+ font-size: 12px;
+ line-height: 1.75;
+}
+
+.footer-col--menu {
+ grid-area: b2;
+ min-width: 0;
+}
+
+.footer-menu-list {
+ margin: 0;
+ padding: 0;
+ list-style: none;
+ column-count: 2;
+ column-gap: 40px;
+}
+
+.footer-menu-list li {
+ break-inside: avoid;
+ margin: 0 0 14px;
+}
+
+.footer-menu-list a {
+ color: #ffffff;
+ text-decoration: none;
+ line-height: 1.35;
+}
+
+.footer-menu-list a:hover {
+ text-decoration: underline;
+}
+
+.footer-fixed-links{
+ grid-area: b3;
+ width: 100%;
+}
+
+.footer-fixed-links ul{
+ margin: 0;
+ padding: 0;
+ list-style: none;
+ display: flex;
+ justify-content: space-between;
+}
+
+.footer-fixed-links a {
+ font-size: 10px;
+ line-height: 1.35;
+}
+
+.footer-fixed-links a:hover {
+ text-decoration: underline;
+}
+
+.footer-socials {
+ grid-area: b4;
+ width: 100%;
+ display: flex;
+ justify-content: space-between;
+}
+
+.footer-socials .icon {
+ width: 25px;
+ height: 25px;
+ --fill-0: #ffffff;
+}
+
+.footer-socials .icon .icon-cutout {
+ fill: #0e1b42;
+}
+
+.footer-powered {
+ margin-top: 24px;
+ text-align: center;
+ font-size: 12px;
+ font-weight: 100;
+ line-height: 1.35;
+}
+
+@media (min-width: 1024px) {
+ .footer-fixed-links,
+ .footer-socials {
+ align-self: end;
+ }
+}
+
+@media (min-width: 768px) and (max-width: 1023px) {
+ .footer-separator {
+ max-width: 616px;
+ }
+
+ .footer-main {
+ max-width: 616px;
+ display: grid;
+ grid-template-columns: 220px 150px 1fr;
+ grid-template-areas:
+ "b1 b2 b2"
+ "b1 b4 b3";
+ gap: 32px;
+ }
+
+ .footer-col--right:nth-child(3) {
+ flex-direction: row;
+ align-items: flex-start;
+ }
+
+ .footer-menu-list {
+ column-count: 3;
+ }
+}
+
+@media (max-width: 767px) {
+ .site-footer {
+ padding: 24px 0 16px;
+ }
+
+ .site-footer .site-container {
+ max-width: 494px;
+ }
+
+ .footer-separator {
+ max-width: 494px;
+ }
+
+ .footer-main {
+ max-width: 494px;
+ display: grid;
+ grid-template-columns: 220px 150px 1fr;
+ grid-template-areas:
+ "b1 b2 b3"
+ "b1 b4 .";
+ gap: 20px;
+ }
+
+ .footer-menu-list {
+ column-gap: 0px;
+ }
+
+ .footer-menu-list li {
+ margin: 0 0 6px;
+ }
+
+ .footer-col--right {
+ grid-column: auto;
+ align-items: flex-start;
+ gap: 20px;
+ }
+
+ .footer-fixed-links {
+ flex-wrap: wrap;
+ gap: 18px;
+ }
+
+ .footer-fixed-links ul {
+ display: block;
+ }
+
+ .footer-fixed-links ul li {
+ margin: 0 0 4px;
+ }
+}
+
+@media (max-width: 574px) {
+ .footer-separator {
+ max-width: 289px;
+ }
+
+ .footer-main {
+ max-width: 220px;
+ margin-inline: auto;
+ justify-content: center;
+ grid-template-columns: 1fr;
+ grid-template-areas:
+ "b2"
+ "b1"
+ "b4"
+ "b3";
+ gap: 20px;
+ }
+
+ .footer-col--menu,
+ .footer-col--right,
+ .footer-fixed-links,
+ .footer-socials {
+ width: 100%;
+ }
+
+ .footer-menu-list {
+ text-align: center;
+ }
+
+ .footer-fixed-links ul {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 12px 18px;
+ }
+
+ .footer-menu-list a {
+ font-size: 16px;
+ }
+
+ .footer-fixed-links a {
+ font-size: 12px;
+ }
+
+ .footer-socials .icon {
+ width: 35px;
+ height: 35px;
+ }
+}
diff --git a/innovedus_cms/mysite/static/css/mysite.css b/innovedus_cms/mysite/static/css/mysite.css
index ff7a0c6..4bee7c3 100644
--- a/innovedus_cms/mysite/static/css/mysite.css
+++ b/innovedus_cms/mysite/static/css/mysite.css
@@ -66,7 +66,7 @@ a {
.main-menu {
display: flex;
align-items: center;
- gap: 24px;
+ gap: 18px;
list-style: none;
margin: 0;
padding: 0;
@@ -276,7 +276,7 @@ a {
border: 0;
background: transparent;
outline: none;
- width: 181px;
+ width: 153px;
}
.template-darkbackground .header-search input[type="search"] {
@@ -287,129 +287,6 @@ a {
color: #ffffff88;
}
-footer {
- background: #0e1b42;
- color: #ffffff;
- padding: 24px 0;
- font-size: 14px;
-}
-
-.footer-inner {
- display: flex;
- justify-content: center;
- gap: 48px;
- align-items: flex-start;
- text-align: left;
-}
-
-footer .company-info {
- max-width: 300px;
- margin: 0;
- padding: 0 16px;
-}
-
-footer .copyright img {
- margin: 10px 0;
- width: 265px;
- height: 37px;
-}
-
-footer .copyright p {
- font-size: 10px;
- text-align: left;
- margin: 0;
-}
-
-.footer-socials {
- display: flex;
- gap: 12px;
- margin: 16px 0;
- flex-wrap: wrap;
-}
-
-.footer-socials .icon {
- width: 32px;
- height: 32px;
- --fill-0: #ffffff;
-}
-
-.footer-socials .icon circle {
- fill: #ffffff;
- fill-opacity: 0.85;
-}
-
-.footer-socials .icon .icon-cutout {
- fill: #0e1b42;
-}
-
-.newsletter-subscribe-form {
- margin-top: 16px;
-}
-
-.newsletter-subscribe-form label {
- display: block;
- margin-bottom: 8px;
- font-size: 12px;
- font-weight: 700;
-}
-
-.newsletter-subscribe-controls {
- display: flex;
- align-items: center;
- gap: 8px;
-}
-
-.newsletter-subscribe-controls input[type="email"] {
- width: 180px;
- max-width: 100%;
- padding: 8px;
- border: 1px solid #ffffff66;
- border-radius: 4px;
- background: #ffffff;
- color: #0e1b42;
-}
-
-.newsletter-subscribe-controls button {
- border: 1px solid #ffffff;
- border-radius: 4px;
- background: transparent;
- color: #ffffff;
- padding: 8px 12px;
- cursor: pointer;
-}
-
-.newsletter-subscribe-controls button:hover {
- background: #ffffff;
- color: #0e1b42;
-}
-
-footer .footer-links {
- padding: 0 16px;
-}
-
-footer .footer-links li {
- list-style-type: none;
-}
-
-footer .footer-links a {
- font-size: 14px;
-}
-
-footer .footer-divider {
- align-self: stretch;
- display: flex;
- align-items: center;
- padding: 0 8px;
- width: 1px;
- border-left: 1px solid #ffffff;
-}
-
-footer .footer-sections {
- display: flex;
- gap: 32px;
- flex-wrap: wrap;
-}
-
.block-title {
display: inline-block;
width: 197px;
@@ -470,39 +347,6 @@ footer .footer-sections {
}
@media (max-width: 768px) {
- .footer-inner {
- flex-direction: column;
- align-items: center;
- text-align: center;
- }
-
- footer .company-info,
- footer .footer-links {
- max-width: 100%;
- }
-
- .footer-socials {
- justify-content: center;
- }
-
- .newsletter-subscribe-controls {
- justify-content: center;
- }
-
- footer .footer-sections {
- justify-content: center;
- }
-
- footer .footer-divider {
- width: 100%;
- padding: 12px 0;
- border-left: 0;
- border-top: 1px solid #ffffff;
- }
-
- footer .copyright p {
- text-align: center;
- }
}
@media (min-width: 575px) and (max-width: 767px) {
diff --git a/innovedus_cms/mysite/templates/base.html b/innovedus_cms/mysite/templates/base.html
index f34b3cf..c0d08b0 100644
--- a/innovedus_cms/mysite/templates/base.html
+++ b/innovedus_cms/mysite/templates/base.html
@@ -34,6 +34,7 @@
{# Global stylesheets #}
+
{% block extra_css %}
{# Override this in templates to add extra stylesheets #}
diff --git a/innovedus_cms/mysite/templates/includes/footer.html b/innovedus_cms/mysite/templates/includes/footer.html
index 94a6ef1..4c5e73c 100644
--- a/innovedus_cms/mysite/templates/includes/footer.html
+++ b/innovedus_cms/mysite/templates/includes/footer.html
@@ -1,84 +1,90 @@
{% load navigation_tags %}
-