/* 05.06. Footer */
.footer {
	&-top {
		font-size: ptr(16);
		background-color: $gray-dark;
		color: #999999;
		padding: ptr(58) 0 ptr(37);

		&__headings {
			color: $gray-lighter;
			font-size: ptr(12);
			font-family: $tertiary-font;
			letter-spacing: $tertiary-font-letter-spacing;
			margin-bottom: ptr(17);
		}

		a {
			color: $gray-light;
		}

		.widget {
			margin-bottom: ptr(30);

			@include media-breakpoint-up(lg) {
				margin-bottom: 0;
			}
		}

		.icon-container {
			display: inline-block;
			margin-right: (3rem / 16);
			width: (20rem / 16);
		}
	}

	&-middle {
		position: relative;
		vertical-align: middle;
		width: 100%;
		font-family: $tertiary-font;
		letter-spacing: $tertiary-font-letter-spacing;
		font-weight: bold;
		font-size: ptr(12);
		border-top: 1px solid rgba(250, 250, 250, .1);
		text-transform: uppercase;
		color: $gray-lighter;
		padding: ptr(28) 0 ptr(25);
		display: flex;
		flex-direction: column;

		@include media-breakpoint-up(lg) {
			align-items: center;
			flex-direction: row;
		}

		.fa {
			vertical-align: middle;
			color: #999999;
		}

		&__container {
			background-color: $gray-dark;
		}

		&__left,
		&__right {
			text-align: center;
			margin-bottom: 15px;

			@include media-breakpoint-up(lg) {
				margin-bottom: 0;
			}
		}

		&__left {
			order: 1;

			@include media-breakpoint-up(lg) {
				float: left;
				text-align: left;
				width: 50%;
			}
		}

		&__right {
			order: 2;

			@include media-breakpoint-up(lg) {
				text-align: right;
				width: 50%;
			}
		}

		&__back-to-top {
			order: 3;
			display: inline-block;
			width: 100%;
			text-align: center;
			position: relative;
			color: $brand-primary;
			transition: $primary-transition;

			@include media-breakpoint-up(lg) {
				float: right;
				width: ptr(150);
				padding-bottom: 1px;
				margin-left: ptr(30);
			}

			&:focus {
				color: $brand-primary;
				text-decoration: none;
			}

			&:hover {
				color: darken($brand-primary, 5);
				text-decoration: none;
			}

			+ .footer-middle__right {
				@include media-breakpoint-up(lg) {
					width: calc(50% - #{ptr(180)});
				}
			}

			&::before {
				@include media-breakpoint-up(lg) {
					position: absolute;
					content: '';
					height: ptr(45);
					width: 1px;
					left: 0;
					top: ptr(-12);
					background-color: rgba(250, 250, 250, .1);
				}
			}

			&::after {
				position: absolute;
				content: '\f0d8';
				font-family: 'FontAwesome';
				top: -13px;
				left: calc(50% - #{ptr(3)});

				@include media-breakpoint-up(lg) {
					top: -18px;
				}
			}
		}
	}

	&-bottom {
		text-align: center;
		font-size: ptr(14);
		padding: ptr(18.5) 0;
		background-color: #222222;

		a {
			color: $gray-light;
			font-weight: bold;
		}
	}

	&__map {
		background-image: url('assets/images/map.png');
		min-height: ptr(177);
		background-size: contain;
		background-repeat: no-repeat;
	}
}