/*
	Utilities
		Layout
 */
/* Floats */
.u-clear {
	clear: both;
	width: 100%;
}
.u-pull-right {
	float: right;
}
.u-pull-left {
	float: left;
}
@media #{$md} {
	.u-pull-right-md {
		float: right;
	}
}
/* Dimensions */
.u-full-width {
	width: 100%;
}
picture.u-full-width > * {
	width: 100%;
	min-width: 100%;
}
/* Margin / Padding */
.u-no-margin {
	margin: 0;
}
.u-no-margin-top {
	margin-top: 0;
}
.u-margin-bottom-small {
	margin-bottom: map-get($gutters, small);
}
.u-no-padding-top {
	padding-top: 0;
}
.u-no-padding-bottom {
	padding-bottom: 0;
}
/* Alignment */
.u-middle {

	.no-flexbox & {
		text-align: center;
	}
	.flexbox & {
		display: flex;
		justify-content: center;
		align-items: center;
	}
}
/* Flexbox */
.u-flex {
	display: block;

	.flexbox & {
		display: flex;
	}
}
.flexbox .u-vertical-middle {
	display: flex;
	align-items: center;
}
.flexbox .u-vertical-bottom {
	display: flex;
	align-items: flex-end;
}
/* Misc */
.u-block {
	display: block;
}
.u-offset-parent {
	position: relative;
}
.u-overflow-visible {
	overflow: visible;
}
.u-overflow-hidden {
	overflow: hidden;
}
.u-no-wrap {
	white-space: nowrap;
}
/* Visible / Hidden */
.u-visually-hidden {
	opacity: 0;
}
.u-hidden {
	display: none;
}
.u-visible {
	display: block;
}
@each $bp in $breakpoints {
	@if map-get($bp, max-width) == null {
		.u-hidden-#{map-get($bp, name)} {
			display: none;
		}
		.u-visible-#{map-get($bp, name)} {
			display: block;
		}
		.u-inline-block-#{map-get($bp, name)} {
			display: inline-block;
		}
	} @else {
		@media screen and (max-width: #{map-get($bp, max-width)}) {
			.u-hidden-#{map-get($bp, name)} {
				display: none;
			}
			.u-visible-#{map-get($bp, name)} {
				display: block;
			}
			.u-inline-block-#{map-get($bp, name)} {
				display: inline-block;
			}
		}
	}
}