/*
	This file includes css logic rules that can be applied everywhere, not css for display
*/

* {
	box-sizing: border-box;
}

html {
	-webkit-font-smoothing: antialiased;
}

.clearfix::after {
	content: "";
	clear: both;
	display: table;
}

@-webkit-keyframes reset {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@-webkit-keyframes fade-in {
	0% {
		opacity: 0;
	}

	40% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-moz-keyframes reset {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@-moz-keyframes fade-in {
	0% {
		opacity: 0;
	}

	40% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes reset {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@keyframes fade-in {
	0% {
		opacity: 0;
	}

	40% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.instaFade {
	-webkit-animation-name: reset, fade-in;
	-webkit-animation-duration: 1.5s;
	-webkit-animation-timing-function: ease-in;

	-moz-animation-name: reset, fade-in;
	-moz-animation-duration: 1.5s;
	-moz-animation-timing-function: ease-in;

	animation-name: reset, fade-in;
	animation-duration: 1.5s;
	animation-timing-function: ease-in;
}

.quickFade {
	-webkit-animation-name: reset, fade-in;
	-webkit-animation-duration: 2.5s;
	-webkit-animation-timing-function: ease-in;

	-moz-animation-name: reset, fade-in;
	-moz-animation-duration: 2.5s;
	-moz-animation-timing-function: ease-in;

	animation-name: reset, fade-in;
	animation-duration: 2.5s;
	animation-timing-function: ease-in;
}

.delayOne {
	-webkit-animation-delay: 0, .5s;
	-moz-animation-delay: 0, .5s;
	animation-delay: 0, .5s;
}

.delayTwo {
	-webkit-animation-delay: 0, 1s;
	-moz-animation-delay: 0, 1s;
	animation-delay: 0, 1s;
}

.delayThree {
	-webkit-animation-delay: 0, 1.5s;
	-moz-animation-delay: 0, 1.5s;
	animation-delay: 0, 1.5s;
}

.delayFour {
	-webkit-animation-delay: 0, 2s;
	-moz-animation-delay: 0, 2s;
	animation-delay: 0, 2s;
}

.delayFive {
	-webkit-animation-delay: 0, 2.5s;
	-moz-animation-delay: 0, 2.5s;
	animation-delay: 0, 2.5s;
}

.show {
	display: block;
}

.hide {
	display: none;
}

.animatezoom {
	-webkit-animation: animatezoom 0.2s;
	animation: animatezoom 0.2s
}

@-webkit-keyframes animatezoom {
	from {
		-webkit-transform: scale(0)
	}

	to {
		-webkit-transform: scale(1)
	}
}

@keyframes animatezoom {
	from {
		transform: scale(0)
	}

	to {
		transform: scale(1)
	}
}

.logo-div {
	display: inline-block;
}

.logo-img {
	width: 170px;
	height: 170px;
}

#warning-view {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/* pointer-events: none; */
	z-index: 999999;
	text-align: center;
	background-color: hsla(0, 0%, 0%, 0.7);
	color: white;
}

#warning-view .warning-text {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

canvas.snow {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 9999;
}

.marquee {
	white-space: nowrap;
	overflow: hidden;
	box-sizing: border-box;
}

.marquee:hover>* {
	display: inline-block;
	/* padding-left: 100%; */
	animation: marquee 8s linear infinite;
}

@keyframes marquee {
	0% {
		transform: translate(0, 0);
	}

	100% {
		transform: translate(-100%, 0);
	}
}