@import "../bootstrap/scss/functions";
@import "../base/functions";
@import "../base/variables";
@import "../bootstrap/scss/variables";


.to-top {
	position: fixed;
	bottom: 5vh;
	right: 5vw;
	transform: scale(0);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	border-radius: $btn-border-radius;
	box-shadow: $btn-box-shadow;
	opacity: 0;
	background: $primary;
	color: color-contrast( $primary );
	will-change: transform;
	z-index: 10;
	transition: .2s;

	&.show {
		transform: scale(1);
		opacity: 1;
		transition: all .2s, transform .2s cubic-bezier(0.5, 0, 1, 2);
	}

	&.active,
	&:hover {
		background: $dark;
		color: color-contrast( $dark );
		cursor: pointer;
	}
}