/* .............................................................................
HEADER / TOP BAR
Top bar with logo.
............................................................................. */
.topBar {position: absolute;z-index: 10;top: 0; height: var(--topbar-height); left: var(--width-std-left); display: flex; align-items: center;}
.topBar__logo {font-size: 17em;margin-left: -0.229em;width: 1em;}

	/* Smaller */
	@media (max-width:62rem) {
		.topBar__logo {font-size: 12em;}
	}
	
	@media (max-width:46rem) {
		.topBar__logo {font-size: 9em; margin-left: 0;}
	}



/* .............................................................................
FOOTER
Footer with contact link, logo and links.
............................................................................. */
.footer {text-align: center; padding-top: var(--base-spacing-top); padding-bottom: calc(0.5 * var(--base-spacing-bottom)); }
.footer > * {margin-top: 5%; }
.footer__link { }
.footer__logo {display: flex; justify-content: center; }
.footer__logo > * {font-size: 14em; margin-left: -0.22em;width: 1em; }
.footer__links {margin-top: 4%; font-size: 0.8em; }

	/* Spacing */
	@media (max-width:62rem) {
		.footer > * {margin-top: 7%; }
		.footer__logo > * {font-size: 12em; }
	}

	@media (max-width:46rem) {
		.footer {padding-top: calc(1em + var(--base-spacing-top)); }
		.footer > * {margin-top: 2.5em;}
		.footer__logo > * {font-size: 10em; }
		.footer__links .listInline {display: block;margin: 0;}
		.footer__links .listInline li {padding: 0.5em 0;}
	}