/*
**********************************************************************************************************************************
**  Copyright (c) 2014-2023 Mateusz Filipczak	
**  Kontakt z autorem: kontakt@mclama.pl
**  Discord: dc.mclama.pl <-> Fejm
**
**  Rozpowszechnianie, powielanie i modyfikowanie tego pliku bez pisemnej zgody autora jest surowo zakazane.		
**
**********************************************************************************************************************************/
html {
	height: 100%;
}
body {
	margin: 0;
	padding: 0;
	color: #fff;
	background-color: #111;
    background-attachment: fixed;
    background-size: contain;
    background-position: center top;
    background-image: url(../img/ol.jpg);
    background-repeat: repeat-x;
}
.importantNote {
	text-align: center;
	font-family: 'Roboto', serif;
}
h1.importantNote {
	color: #999;
}
h1.importantNote span.holo {
	animation-name: holoText;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}
h2.importantNote {
	color: #888;
}
#by {
	font-size: 11px;
	font-family: 'Roboto', serif;
	color: #666;
	text-align: center;
	margin-top: 16px;
	text-shadow: 0px -1px 0px #000;
}
#by a {
	color: #666;
	font-weight: 700;
	text-decoration: none;
	transition: color 250ms;
}
#by a:hover {
	color: #f3c142;
	text-decoration: underline;
}
#copyright {
	font-size: 11px;
	font-family: 'Roboto', serif;
	color: #888;
	text-align: center;
	margin-top: 3px;
	margin-bottom: 20px;
	text-shadow: 0px -1px 0px #000;
}
#copyright span {
	color: #777;	
}
.itNoJoke {
	width: 400px;
	height: 415px;
	margin: 25px auto;
}
#master {
	width: 400px;
	height: 400px;
	background-image: url('../img/Fejm_400_w_compressed.png');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
	position: absolute;
	z-index: 3;
	opacity: 0;
	will-change: background-position,transform,filter;
    transition: filter 350ms;
	animation: hop 700ms ease-in-out 150ms infinite alternate forwards, show 500ms ease-in-out 0s forwards;
	filter: drop-shadow( 0px 0px 32px #fb87b6);
}
#master a {
	display: block;
	width: 100%;
	height: 100%;
}
#master:hover {
	filter: drop-shadow( 0px 0px 32px #ddd);
}
@keyframes show { 
	0% { 
		background-size: 0px 0px;
		opacity: 0;
	} 
	100% { 
		background-size: 400px 400px;
		opacity: 1;
	} 
}
@keyframes hop { 
	0% { 
		margin-top: 0px;
	} 
	100% { 
		margin-top: 16px;
	} 
}
@keyframes holoText { 
	0% { 
		color: #999;
	} 
	100% { 
		color: #eee;
	} 
}