.o-footer {
	@include template(logo, menu, locations, info);
	@include font-size(base);
	@include z(z-footer);
	@include slant();
	padding-bottom: 0;
	background-color: palette(secondary, 400);
	color: palette(neutral, 0);
	transition: padding 600ms;

	.is-cookie-bar-visible & {
		padding-bottom: $site-cookieBar-height;
	}
}


.o-footer__main {
	@include contain();
	@include vspacing(
		'padding-top' 1
	);
}


.o-footer__body {
	display: grid;
	grid-row-gap: space(4);
	grid-template-columns: 1fr;
	grid-template-rows: repeat(4, auto);
	grid-template-areas:
		"logo"
		"info"
		"locations"
		"menu";

	@include mq(560) {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: repeat(2, auto);
		grid-row-gap: space(6);
		grid-template-areas:
			"logo info"
			"locations menu";
	}

	@include mq(800) {
		grid-template-columns: 10fr 7fr 7fr;
		grid-template-areas:
			"logo locations menu"
			"info locations menu";
	}

	@include mq($bp-max) {
		grid-template-columns: 5fr 3fr 4fr;
	}
}


.o-footer__logo {
	display: inline-block;
	transition: opacity 200ms linear;

	//&:hover {
	//	opacity: 0.5;
	//}
}


.o-footer__label {
	@include font-weight(bold);
	padding: 0 0 space(1);
	color: palette(primary);
}


.o-footer__menu {

}


.o-footer__list {
	margin: 0;
	list-style: none;

	@include mq(800) {
		margin-bottom: space(4);
	}
}


.o-footer__link {
	display: inline-flex;
	align-items: center;
	position: relative;
	z-index: 0;
	padding: space(0.5) 0;
	color: palette(neutral, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;

	& > i {
		flex: none;
		margin-right: space(2.5);
		color: palette(primary, 500);
	}

	&:hover {
		color: rgba(palette(neutral, 0), 0.5);
	}

	&:focus {
		outline-color: palette(primary, 500);
	}

	.is-active & {
		font-weight: bold;
	}
}


.o-footer__social {
	display: flex;
	list-style: none;
	margin: space(4) 0 0;
}


.o-footer__channel {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	margin-right: space(2);
}


.o-footer__icon {
	flex: auto;
	display: block;
	height: 100%;
	color: palette(primary);
	transition: all 150ms linear;
	opacity: 1;

	&:hover {
		color: rgba(palette(neutral, 0), 0.6);
	}

	&:focus {
		outline-color: palette(primary, 500);
	}
}


.o-footer__art {
	@include contain(784);
}


.o-footer__image {
	padding-bottom: 115px; // footer image height
	background: url("/img/footer_art.svg") no-repeat right bottom -3px;

	@include mq(1130){
		background-position: right bottom -3px;
	}
}


.o-footer__bottom {
	background-color: palette(secondary, 700);
}


.o-footer--simple {
	.o-footer__main {
		padding: space(6) 0 space(5);
	}
	.o-footer__body {
		grid-template-rows: repeat(2, auto);
		grid-template-areas:
			"logo"
			"info";

		@include mq(560) {
			grid-template-columns: auto 1fr auto;
			grid-template-rows: auto;
			grid-template-areas:
				"logo . info";
		}
	}
	.o-footer__list {
		margin-bottom: 0;
	}
}