// Clearing and floating
// ------------------------------------------------------------------------------

.clear {
	clear: both;
	&::before,
	&::after {
		clear: both;
	}
}

.float_left {
	float: left;
	margin-right: $space_3;
}

.overflow {
	overflow: auto;
}



// General positioning attributes
// ------------------------------------------------------------------------------

.center_50 {
	margin-right: 25%;
	margin-left: 25%;
}
.center_25 {
	margin-right: 37.5%;
	margin-left: 37.5%;
}

.width_full {
	width: 100%;
	margin-right: 0;
	margin-left: 0;
}

%size_content {
	box-sizing: content-box;
}

%size_content_solo {
	@extend %size_content;

	*,
	::before,
	::after {
		box-sizing: $box_sizing;
	}
}



// Structure attributes
// ------------------------------------------------------------------------------

%full_viewport {
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
}

%full_parent {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

// Fixed elements
.pos_rel {
	position: relative;
}
.pos_fix {
	position: fixed;
}
.pos_bottom {
	bottom: 0;
}

// Absolute elements
.pos_full_view {
	@extend %full_viewport;
	background-color: rgba($alpha_color, .5);
}

.hover_back_change {
	background-color: darken($basic_back_color, 10%);
	transition: background-color .2s ease-in-out;
	&:hover {
		background-color: $basic_back_color;
	}
}