/* || Variables */

:root {
    --grid-gap-x: 0.25rem;
    --grid-gap-y: 0.25rem;
    --footer-links-bg-colour: rgba(0,0,0,.5);
}

/*
@font-face {
    font-family:'Patua One';
    font-style:normal;
    font-weight:400;
    src:url(fonts/patua_one__regular.woff2) format('woff2');
    unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family:'Castoro Titling';
    font-style:normal;
    font-weight:400;
    src:url(./fonts/castoro_titling__regular.woff2) format('woff2');
    unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family:'Roboto Regular';
    font-style:normal;
    font-weight:300;
    src:url(fonts/roboto__regular.woff2) format('woff2');
    unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family:'Roboto Thin';
    font-style:normal;
    font-weight:200;
    src:url(fonts/roboto__thin.woff2) format('woff2');
    unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family:'Roboto Light';
    font-style:normal;
    font-weight:200;
    src:url(fonts/roboto__light.woff2) format('woff2');
    unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family:'Roboto Medium';
    font-style:normal;
    font-weight:200;
    src:url(fonts/roboto__medium.woff2) format('woff2');
    unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
*/

/* || Main */

body {
    font-family: 'Roboto Thin', Arial, sans-serif;
    font-style: normal;
    font-weight: 200;
    margin: auto;
    padding: 0;
    background-color: #fafaf2;
}

p {
    font-family: 'Roboto Thin', Arial, sans-serif;
    font-style: normal;
    font-weight: 200;
}

a {
    font-family: 'Roboto Thin', Arial, sans-serif;
    font-style: normal;
    font-weight: 200;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Patua One', 'Times New Roman', serif;
    font-style: normal;
    font-weight: 500;
}

button, input[type="submit"], input[type="reset"] {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    outline: inherit;
}

.all-elements-before-footer {
    margin: auto;
    max-width: 1460px;
    padding: 0;
}

/* || Link Spanner - anchors around divs */

.link-spanner {
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    position: absolute;
    z-index: 1;
}

/* || Featured Article */

.article-feature-colour-a.article-featured-text-outer {
    background-color: #38b6ff;
}

.article-feature-colour-b.article-featured-text-outer {
    background-color: hotpink;
}

.article-feature-colour-c.article-featured-text-outer {
    background-color: forestgreen;
}

.article-feature-colour-d.article-featured-text-outer {
    background-color: gold;
}

.article-featured-text-outer {
    grid-area: article-featured-upper-text-outer;
    margin: 0;
    padding: 0;
}
.article-featured-text-inner {
    margin: 0.5rem;
    padding: 0;
}

.article-featured-image {
    grid-area: article-featured-upper-image;
    background-size: 100% auto;
    background-position: center;
}

/* || Header */

.header{
    margin: auto;
    padding: 0;
    width: 100%;
}

.header-container{
    margin: auto;
    padding: 0;
    width: 100%;
}

.logo-container {
    margin: auto;
    padding: 0;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    gap: var(--grid-gap-x) var(--grid-gap-y);
    grid-auto-flow: row;
    grid-template-areas:
    "ad-top1 logo ad-top2";
}

.logo {
    grid-area: logo;
    margin: auto;
}

.ad-top1 {
    background-color: dodgerblue;
    grid-area: ad-top1;
}

.ad-top2 {
    background-color: mediumslateblue;
    grid-area: ad-top2;
}

nav {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    padding: 0;
    background-color: #333;
    color: white;
}

nav h1 {
    color: white;
    margin: 0;
}

nav ul {
    list-style-type: none;
    margin: auto;
    padding: 0.5rem;
}

nav li {
    display: inline;
    padding: 0.25rem;
    margin-right: 1rem;
}

nav a {
    color: white;
    text-decoration: none;
    font-family: 'Castoro Titling', 'Times New Roman', serif;
    font-style: normal;
    font-weight: 600;
}

.search_span {
    white-space: nowrap;
}

.search_button {
    position: relative;
    background: url("img/search_icon_light_026.png") no-repeat scroll 0 0 transparent;
    color: #000000;
    cursor: pointer;
    font-weight: bold;
    height: 26px;
    width: 26px;
    padding-bottom: 0.35rem;
}

.search_icon {

}

.search_textbox {
    position: relative;
    left: 0.35rem;

    font-family: 'Roboto Thin', Arial, sans-serif;
    font-style: normal;
    font-weight: 200;
    font-size: 1.3rem;
}

/* || Main with grid layout */

main {
    background-color: darkgrey;
    width: 100%;
    height: 6000px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}

/* || Article Page */

.article-page-container {
    background-color: lightgrey;
    width: 100%;
    height: 100%;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: var(--grid-gap-x) var(--grid-gap-y);
    grid-auto-flow: row;
    grid-template-areas:
    "ad-main-banner ad-main-banner ad-main-banner ad-main-banner ad-right-banner ad-right-banner"
    "ad-left-panel article-page-header article-page-header article-page-header ad-right-panel ad-right-panel"
    "ad-left-panel article-page-header article-page-header article-page-header ad-right-panel ad-right-panel"
    "ad-left-panel article-page-header article-page-header article-page-header ad-right-panel ad-right-panel"
    "ad-left-panel article-page-header article-page-header article-page-header ad-right-panel ad-right-panel"
    "ad-left-panel article-page-header article-page-header article-page-header ad-right-panel ad-right-panel"
    "ad-left-panel article-page-main article-page-main article-page-main ad-right-panel ad-right-panel"
    "social-media1 article-page-main article-page-main article-page-main about-us about-us"
    "social-media1 article-page-main article-page-main article-page-main about-us about-us"
    "articles-recent-posts article-page-main article-page-main article-page-main about-us about-us"
    "articles-recent-posts article-page-main article-page-main article-page-main about-us about-us"
    "articles-recent-posts article-page-main article-page-main article-page-main newsletter newsletter"
    "articles-recent-posts article-page-main article-page-main article-page-main newsletter newsletter"
    "articles-recent-posts article-page-main article-page-main article-page-main newsletter newsletter"
    "articles-recent-posts article-page-main article-page-main article-page-main newsletter newsletter"
    "article-categories article-spotlights-central article-spotlights-central article-spotlights-central newsletter newsletter"
    "article-categories article-spotlights-central article-spotlights-central article-spotlights-central social-media2 social-media2"
    "article-categories article-spotlights-central article-spotlights-central article-spotlights-central social-media2 social-media2"
    "article-categories article-spotlights-central article-spotlights-central article-spotlights-central social-media2 social-media2"
    "ad-left-panel-sticky article-spotlights-central article-spotlights-central article-spotlights-central articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky article-spotlights-central article-spotlights-central article-spotlights-central articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky ad-lower-banner1 ad-lower-banner1 ad-lower-banner1 articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky article-featured-lower1 article-featured-lower1 article-featured-lower1 articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky article-featured-lower1 article-featured-lower1 article-featured-lower1 articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    "ad-left-panel-sticky article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower ad-right-panel-sticky ad-right-panel-sticky"
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". ad-lower-banner2 ad-lower-banner2 ad-lower-banner2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-paging article-paging article-paging . ."
    ". article-paging article-paging article-paging . ."
    ". . . . . .";
}

.article-page-header {
    background-color: coral;
    grid-area: article-page-header;
}

.article-page-main {
    background-color: mediumvioletred;
    grid-area: article-page-main;
}

/* || Frontpage */

.frontpage-container {
    background-color: lightgrey;
    width: 100%;
    height: 100%;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: var(--grid-gap-x) var(--grid-gap-y);
    grid-auto-flow: row;
    grid-template-areas:
    "ad-main-banner ad-main-banner ad-main-banner ad-main-banner ad-right-banner ad-right-banner"
    "ad-left-panel article-featured-upper article-featured-upper article-featured-upper ad-right-panel ad-right-panel"
    "ad-left-panel article-featured-upper article-featured-upper article-featured-upper ad-right-panel ad-right-panel"
    "ad-left-panel article-featured-upper article-featured-upper article-featured-upper ad-right-panel ad-right-panel"
    "ad-left-panel article-spotlight1 article-spotlight2 article-spotlight3 ad-right-panel ad-right-panel"
    "ad-left-panel article-spotlight1 article-spotlight2 article-spotlight3 ad-right-panel ad-right-panel"
    "ad-left-panel ad-central-banner ad-central-banner ad-central-banner ad-right-panel ad-right-panel"
    "social-media1 article-featured-central article-featured-central article-featured-central about-us about-us"
    "social-media1 article-featured-central article-featured-central article-featured-central about-us about-us"
    "articles-recent-posts article-featured-central article-featured-central article-featured-central about-us about-us"
    "articles-recent-posts article-featured-central article-featured-central article-featured-central about-us about-us"
    "articles-recent-posts article-featured-central article-featured-central article-featured-central newsletter newsletter"
    "articles-recent-posts article-featured-central article-featured-central article-featured-central newsletter newsletter"
    "articles-recent-posts article-featured-central article-featured-central article-featured-central newsletter newsletter"
    "articles-recent-posts article-featured-central article-featured-central article-featured-central newsletter newsletter"
    "article-categories article-spotlights-central article-spotlights-central article-spotlights-central newsletter newsletter"
    "article-categories article-spotlights-central article-spotlights-central article-spotlights-central social-media2 social-media2"
    "article-categories article-spotlights-central article-spotlights-central article-spotlights-central social-media2 social-media2"
    "article-categories article-spotlights-central article-spotlights-central article-spotlights-central social-media2 social-media2"
    "ad-left-panel-sticky article-spotlights-central article-spotlights-central article-spotlights-central articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky article-spotlights-central article-spotlights-central article-spotlights-central articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky ad-lower-banner1 ad-lower-banner1 ad-lower-banner1 articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky article-featured-lower1 article-featured-lower1 article-featured-lower1 articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky article-featured-lower1 article-featured-lower1 article-featured-lower1 articles-recent-posts-mini-spotlights articles-recent-posts-mini-spotlights"
    "ad-left-panel-sticky article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    "ad-left-panel-sticky article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-featured-lower1 article-featured-lower1 article-featured-lower1 ad-right-panel-sticky ad-right-panel-sticky"
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower ad-right-panel-sticky ad-right-panel-sticky"
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". article-spotlights-lower article-spotlights-lower article-spotlights-lower . ."
    ". ad-lower-banner2 ad-lower-banner2 ad-lower-banner2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-featured-lower2 article-featured-lower2 article-featured-lower2 . ."
    ". article-paging article-paging article-paging . ."
    ". article-paging article-paging article-paging . ."
    ". . . . . .";
}

.ad-main-banner {
    background-color: darkorange;
    grid-area: ad-main-banner;
}

.ad-right-banner {
    background-color: crimson;
    grid-area: ad-right-banner;
}

.article-spotlight1 {
    background-color: darkorange;
    grid-area: article-spotlight1;
}

.article-spotlight2 {
    background-color: dodgerblue;
    grid-area: article-spotlight2;
}

.article-spotlight3 {
    background-color: slateblue;
    grid-area: article-spotlight3;
}

.ad-central-banner {
    background-color: cyan;
    grid-area: ad-central-banner;
}

.ad-left-panel {
    background-color: deeppink;
    grid-area: ad-left-panel;
}

.ad-right-panel {
    background-color: gold;
    grid-area: ad-right-panel;
}

.article-featured-upper {
    grid-area: article-featured-upper;
    display: block;
    height: 100%;
    margin: 0rem;
    /*margin: 0.25rem;*/
    padding: 0;
}

.article-featured-internal {
    background-color: lightpink;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 2fr 5fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
    "article-featured-upper-text-outer"
    "article-featured-upper-image";
    /*height: 98%;*/
    /*width: 99%;*/
    height: 100%;
    width: 100%;
}

.articles-recent-posts {
    background-color: chartreuse;
    grid-area: articles-recent-posts;
}

.about-us {
    background-color: greenyellow;
    grid-area: about-us;
}

.newsletter {
    background-color: slateblue;
    grid-area: newsletter;
}

.social-media2 {
    background-color: darkturquoise;
    grid-area: social-media2;
}

.social-media1 {
    background-color: yellow;
    grid-area: social-media1;
}

.ad-lower-banner1 {
    background-color: hotpink;
    grid-area: ad-lower-banner1;
}

.article-featured-central {
    background-color: crimson;
    grid-area: article-featured-central;
}

.article-featured-lower1 {
    background-color: turquoise;
    grid-area: article-featured-lower1;
}

.article-spotlights-central {  display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 0 0;
    grid-auto-flow: row;
    grid-template-areas:
    "article-spotlight4 article-spotlight5";
    grid-area: article-spotlights-central;
}

.article-spotlight4 {
    background-color: yellow;
    grid-area: article-spotlight4;
}

.article-spotlight5 {
    background-color: green;
    grid-area: article-spotlight5;
}

.article-spotlights-lower {
    background-color: lightcoral;
    grid-area: article-spotlights-lower;
}

.ad-lower-banner2 {
    background-color: cornflowerblue;
    grid-area: ad-lower-banner2;
}

.article-featured-lower2 {
    background-color: crimson;
    grid-area: article-featured-lower2;
}

.article-paging {
    background-color: greenyellow;
    grid-area: article-paging;
}

.article-categories {
    background-color: hotpink;
    grid-area: article-categories;
}

.ad-left-panel-sticky {
    background-color: darkviolet;
    grid-area: ad-left-panel-sticky;

    /* Stickiness */
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

.articles-recent-posts-mini-spotlights {
    background-color: darkorange;
    grid-area: articles-recent-posts-mini-spotlights;
}

.ad-right-panel-sticky {
    background-color: springgreen;
    grid-area: ad-right-panel-sticky;

    /* Stickiness */
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}


/* Responsive styles for article cards */
/*
@media screen and (min-width: 768px) {
    .articles {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .article-card {
        flex-basis: calc(50% - 1rem);
        margin-bottom: 1rem;
    }
}

@media screen and (min-width: 992px) {
    .article-card {
        flex-basis: calc(33.333% - 1rem);
    }
}*/



.articles {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: auto;
    grid-gap: 1rem;
}

.advertisements {
    flex: 1;
    padding-left: 1rem;
}

footer {
    width: 100%;
    text-align: center;
    padding: 0;
    margin: 0;
    background-color: #333;
    color: white;
    background-size: 100% auto;
    background-position: bottom;
    background-image: url('img/footer.jpg');
}

.footer-upper{
    width: 100%;
    height: 32rem;
    margin: 0rem;
}

.footer-links {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 2fr 20fr 2fr 20fr 2fr 20fr 2fr;
    grid-template-rows: 1fr 15fr 1fr;
    gap: 0% 0%;
    grid-template-areas:
    "footer-links-spacer-1-1 footer-links-spacer-2-1 footer-links-spacer-3-1 footer-links-spacer-4-1 footer-links-spacer-5-1 footer-links-spacer-6-1 footer-links-spacer-7-1"
    "footer-links-spacer-1-2 footer-links-col-a footer-links-spacer-3-2 footer-links-col-b footer-links-spacer-5-2 footer-links-col-c footer-links-spacer-7-2"
    "footer-links-spacer-1-3 footer-links-spacer-2-3 footer-links-spacer-3-3 footer-links-spacer-4-3 footer-links-spacer-5-3 footer-links-spacer-6-3 footer-links-spacer-7-3";
}

.footer-links ul {
    list-style-type: none;
    margin: auto;
    padding: 0;
}

.footer-links li {

}

.footer-links a {
    color: white;
    text-decoration: none;
    font-family: 'Roboto Thin', Arial, sans-serif;
    font-style: normal;
    font-weight: 200;
}

.footer-links-col-a {
    width: 100%;
    height: 100%;
    grid-area: footer-links-col-a;
    background-color: var(--footer-links-bg-colour);
}

.footer-links-col-b {
    width: 100%;
    height: 100%;
    grid-area: footer-links-col-b;
    background-color: var(--footer-links-bg-colour);
}

.footer-links-col-c {
    width: 100%;
    height: 100%;
    grid-area: footer-links-col-c;
    background-color: var(--footer-links-bg-colour);
}

.footer-links-col-a { grid-area: footer-links-col-a; }
.footer-links-col-b { grid-area: footer-links-col-b; }
.footer-links-col-c { grid-area: footer-links-col-c; }
.footer-links-spacer-1-1 { grid-area: footer-links-spacer-1-1; }
.footer-links-spacer-2-1 { grid-area: footer-links-spacer-2-1; }
.footer-links-spacer-3-1 { grid-area: footer-links-spacer-3-1; }
.footer-links-spacer-4-1 { grid-area: footer-links-spacer-4-1; }
.footer-links-spacer-5-1 { grid-area: footer-links-spacer-5-1; }
.footer-links-spacer-6-1 { grid-area: footer-links-spacer-6-1; }
.footer-links-spacer-7-1 { grid-area: footer-links-spacer-7-1; }
.footer-links-spacer-7-3 { grid-area: footer-links-spacer-7-3; }
.footer-links-spacer-6-3 { grid-area: footer-links-spacer-6-3; }
.footer-links-spacer-5-3 { grid-area: footer-links-spacer-5-3; }
.footer-links-spacer-4-3 { grid-area: footer-links-spacer-4-3; }
.footer-links-spacer-3-3 { grid-area: footer-links-spacer-3-3; }
.footer-links-spacer-2-3 { grid-area: footer-links-spacer-2-3; }
.footer-links-spacer-1-3 { grid-area: footer-links-spacer-1-3; }
.footer-links-spacer-1-2 { grid-area: footer-links-spacer-1-2; }
.footer-links-spacer-3-2 { grid-area: footer-links-spacer-3-2; }
.footer-links-spacer-5-2 { grid-area: footer-links-spacer-5-2; }
.footer-links-spacer-7-2 { grid-area: footer-links-spacer-7-2; }

.footer-lower{
    width: 100%;
    height: 70px;
}