IcarusImeji-Caddy/public/assets/sass/layout/_footer.scss

///
/// Massively by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///

/* Footer */

	#footer {
		@include color(alt);
		@include vendor('display', 'flex');
		background-color: _palette(alt, bg);
		color: _palette(fg-light);
		cursor: default;
		position: relative;
		margin: 0 auto;
		width: calc(100% - #{_size(padding) * 2});
		max-width: _size(wrapper);
		z-index: 2;

		> section {
			@include vendor('flex-basis', '50%');
			@include vendor('flex-grow', '1');
			@include vendor('flex-shrink', '1');
			@include padding((_size(padding) * 2), (_size(padding) * 2));
			border-left: solid 2px _palette(alt, border);

			&:first-child {
				border-left: 0;
			}

			&.split {
				@include vendor('display', 'flex');
				@include vendor('flex-direction', 'column');
				padding: 0;

				> section {
					@include padding((_size(padding) * 2) - 1, (_size(padding) * 2));
					border-top: solid 2px _palette(alt, border);

					&:first-child {
						@include padding((_size(padding) * 2) - 1, (_size(padding) * 2), (_size(padding), 0, 0, 0));
						border-top: 0;
					}

					&:last-child {
						@include padding((_size(padding) * 2) - 1, (_size(padding) * 2), (0, 0, _size(padding), 0));
					}
				}

				&.contact {
					> section {
						@include vendor('display', 'flex');
						@include vendor('align-items', 'center');
						padding: (_size(padding) * 1.575) (_size(padding) * 2);

						> * {
							margin-bottom: 0;
						}

						> :first-child {
							@include vendor('flex-shrink', '0');
							@include vendor('flex-grow', '0');
							width: 6rem;
						}

						> :last-child {
							@include vendor('flex-shrink', '1');
							@include vendor('flex-grow', '1');
						}

						&:first-child {
							padding: (_size(padding) * 2) (_size(padding) * 2) ((_size(padding) * 2) - 1) (_size(padding) * 2);
						}

						&:last-child {
							padding: ((_size(padding) * 2) - 1) (_size(padding) * 2) (_size(padding) * 2) (_size(padding) * 2);
						}

						&.alt {
							@include vendor('align-items', 'flex-start');

							> :last-child {
								margin-top: -0.325rem;
							}
						}
					}
				}
			}
		}

		form label,
		h3,
		p {
			font-size: 0.8rem;
		}

		@include breakpoint(medium) {
			display: block;

			> section {
				border-top: solid 2px _palette(alt, border);

				&:first-child {
					border-top: 0;
				}

				&.split {
					> section {
						@include padding((_size(padding) * 2), (_size(padding) * 2));

						&:first-child {
							@include padding((_size(padding) * 2), (_size(padding) * 2));
						}

						&:last-child {
							@include padding((_size(padding) * 2), (_size(padding) * 2));
						}
					}

					&.contact {
						> section {
							padding: (_size(padding) * 2);

							&:first-child {
								padding: (_size(padding) * 2);
							}

							&:last-child {
								padding: (_size(padding) * 2);
							}
						}
					}
				}
			}

			form label,
			h3,
			p {
				font-size: 0.9rem;
			}
		}

		@include breakpoint(small) {
			> section {
				@include padding((_size(padding) * 1), (_size(padding) * 1));

				&.split {
					> section {
						@include padding((_size(padding) * 1), (_size(padding) * 1));

						&:first-child {
							@include padding((_size(padding) * 1), (_size(padding) * 1));
						}

						&:last-child {
							@include padding((_size(padding) * 1), (_size(padding) * 1));
						}
					}

					&.contact {
						> section {
							padding: (_size(padding) * 1);

							&:first-child {
								padding: (_size(padding) * 1);
							}

							&:last-child {
								padding: (_size(padding) * 1);
							}
						}
					}
				}
			}
		}

		@include breakpoint(xsmall) {
			width: 100%;
		}
	}

	#copyright {
		@include color-typography(invert);
		position: relative;
		color: transparentize(_palette(invert, fg), 0.75);
		cursor: default;
		font-family: _font(family-heading);
		font-size: 0.8rem;
		font-weight: _font(weight-heading);
		letter-spacing: 0.075em;
		line-height: 1.5;
		text-align: center;
		text-transform: uppercase;
		margin: (_size(padding) * 2) auto (_size(padding) * 4) auto;
		width: calc(100% - #{_size(padding) * 2});
		max-width: _size(wrapper);
		z-index: 2;

		a {
			color: inherit;
			border-bottom-color: inherit;
		}

		ul {
			list-style: none;
			margin: 0;
			padding-left: 0;

			li {
				border-left: solid 2px;
				display: inline-block;
				line-height: 1;
				margin-left: 1rem;
				padding-left: 1rem;

				&:first-child {
					border-left: 0;
					margin-left: 0;
					padding-left: 0;
				}
			}
		}

		@include breakpoint(large) {
			margin: (_size(padding) * 2) auto;
		}

		@include breakpoint(xsmall) {
			ul {
				li {
					border-left: 0;
					margin: 1rem 0 0 0;
					padding-left: 0;
					display: block;

					&:first-child {
						margin-top: 0;
					}
				}
			}
		}
	}