scss mixins

mixins.scss

// aspect ratio
@mixin ratio($width:16, $height:9) {
	width: 100%;
	overflow: hidden;
	padding-top: ($height / $width) * 100%;
	position: relative;

	> * {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-size: cover;
		background-position: center;
	}
}
// zoom on background-image
@mixin zoom($value: 1.05) {
	&:hover > * {
		transform: scale($value);
	}

	> * {
		transition: transform $duration*2 $timing;
	}

}