﻿/* Footer */

footer {
	width: calc(100% - 2em);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	border-top: 1px solid #bbb;
	margin: 2em;
	margin-bottom: 0.5em;
	box-sizing: padding-box;
	color: #777;
}

	footer div.left {
	}

		footer div.left h1 {
			font-size: 0.7em;
			font-weight: normal;
			font-family: var(--bodyFont);
		}

	footer div.right {
		display: flex;
		flex-direction: row;
	}

		footer div.right ul {
			display: flex;
			flex-direction: row;
			align-items: flex-end;
			justify-content: flex-end;
			list-style: none;
			font-size: 0.7em;
			margin: 0;
			padding: 0;
		}

			footer div.right ul li {
				margin: 0.4em;
				background-color: #ddd;
				padding: 0.4em;
				border-radius: 0.5em;
			}

				footer div.right ul li a {
					text-decoration: none;
					color: inherit;
				}

	footer.mobile {
		display: flex;
	}

	footer.desktop {
		display: none;
	}

/* Responsive Breakpoints */
/* ###################### */

@media screen and (min-width: 640px) {
	footer {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

		footer div.right ul {
			flex-direction: row;
		}

			footer div.right ul li {
				margin: 0;
				margin-left: 1em;
				background-color: inherit;
				border-radius: 0;
			}

		footer.mobile {
			display: none;
		}

		footer.desktop {
			display: flex;
		}
}

@media screen and (min-width: 1024px) {

}

@media screen and (min-width: 1200px) {
}