@import url('https://fonts.googleapis.com/css?family=Open+Sans');

html, body {
font-family: 'Open Sans', sans-serif;
color: #333333;
text-align: center;

background-color: #205080;
/*background-color: #992626;*/
box-shadow: 0 1em 8em 2em rgba(0,0,0,0.5) inset;
}

a, a:visited{
color: #992626;
text-decoration: underline;
}
a:hover, a:active{
text-decoration: none;
}

header {
color: #cfdee6;
background-color: #000000;
box-shadow: 0 0.5em 1em rgba(0,0,0,0.5);
}

article figure {
color: #205080;
background-color: #cfdee6;
box-shadow: 0 0.5em 1em rgba(0,0,0,0.5);
}

article form {
color: #205080;
background-color: #cfdee6;
box-shadow: 0 0.5em 1em rgba(0,0,0,0.5);
}

article form input, article form textarea {
border: 0;
border-radius: 0;
box-shadow: 0 0.125em 0.25em rgba(0,0,0,0.5) inset;
}
article form input.button {
color: #cfdee6;
background-color: #205080;
box-shadow: none;
font-weight: bold;
}

img.pixelated{
image-rendering: pixelated;
image-rendering: crisp-edges;
image-rendering: -moz-crisp-edges;
}

aside#thanks {
color: #cfdee6;
background-color: #000000;
opacity: 0.75;
}

aside#thanks:target {
animation-name: fade-out;
animation-duration: 5s;
}
@keyframes fade-out {
0% 		{left: 0; opacity: 0.75; }
75%		{opacity: 0.75;}
100%	{left: 0; opacity: 0;}
}

footer {
color: #cfdee6;
background-color: #000000;
box-shadow: 0 0.5em 1em rgba(0,0,0,0.5);
}


/*KONAMI*/
.DuLt{
position: fixed;
bottom: 100%;
left: 5%;
width: 32px;
height: 64px;

background-position: top left;
background-size: 32px 64px;

image-rendering: pixelated;
image-rendering: crisp-edges;
image-rendering: -moz-crisp-edges;

animation-name: run-forest-run;
animation-duration: 10s;
animation-timing-function: linear;
}
@keyframes run-forest-run {
0% 		{bottom: 100%; left: 5%; background-image: url(../files/DuLt-jump.gif); animation-timing-function: linear;}
19.99% 	{bottom: 0; left: 5%; background-image: url(../files/DuLt-jump.gif); animation-timing-function: linear;}
20%		{bottom: 0; left: 5%; background-image: url(../files/DuLt-idle.gif);}
39.99%		{bottom: 0; left: 5%; background-image: url(../files/DuLt-idle.gif);}
40%		{bottom: 0; left: 5%; background-image: url(../files/DuLt-run.gif); animation-timing-function: ease-in;}
60%		{bottom: 0; left: 25%; background-image: url(../files/DuLt-run.gif); animation-timing-function: linear;}
100%	{bottom: 0; left: 100%; background-image: url(../files/DuLt-run.gif);}
}