@charset "utf-8";
/* CSS Document */

body {
	z-index: 0;
	background-color: black;
	margin: 35px 25px 25px 25px;
}

img {
	border: none;
}

.crop {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	opacity: 0.75;
	z-index: 1;
	filter: contrast(1.25);
}

.shade {
	opacity: 1.0;
	position: fixed;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	background-color: rgba(0,0,0,0.4);
	animation: shade ease 5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
	z-index: 2;
}

.anchor {
	position: relative;
	margin: auto;
	border-radius: 15px;
	width: 1000px;
	background-color: rgba(0,0,0,1);
	z-index: 3;
}

.tractor {
	position: relative;
	bottom:  10px;
	width: 135px;
	opacity: 0.85;
	filter: contrast(1.5);
	transform: rotateY(180deg);
}

.butterprint {
	position: relative;
	bottom: 8px;
	left: 7px;
	font-family: Custom;
	font-size: 70px;
	font-weight: normal;
	color: sienna;
	opacity: 0.85;
	filter: contrast(1.25);
}

@font-face {
  	font-family: Custom;
  	src: url("../fonts/Stamp.ttf");
}

.title {
	position: relative;
	top: 20px;
	right: 35px;
	font-family: Custom;
	font-size: 34px;
	font-weight: bold;
	color: goldenrod;
	opacity: 0.70;
	text-decoration: none;
	filter: contrast(1.25);
	animation: title ease 3s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@keyframes title {
 	0% {opacity: 0.0}
    100% {opacity: 0.70;}
}

.topic {
	position: relative;
	top: 12px;
	right: 30px;
	color: antiquewhite;
	font-size: 24px;
	font-weight: bold;
	font-family: Custom;
	opacity: 0.75;
	text-decoration: none;
	filter: contrast(1.25);
	animation: topic ease 3s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@keyframes topic {
 	0% {opacity: 0.0}
    100% {opacity: 0.75}
}

.photo {
	position: relative;
	top: 3px;
	width: 900px;
	filter: brightness(0.80) contrast(1.1) grayscale(0.0);
    border-radius: 0px;
    opacity: 1.0;
	animation: photo ease 1.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@keyframes photo {
 	0% {opacity: 0.0}
    100% {opacity: 1.0}
}

.watermark {
	background-image: url("../graphics/tractor.png");
	background-repeat: no-repeat;
	background-position: center;
}

.logo {
	position: relative;
	top: 1px;
	width: 350px;
	opacity: 0.95;
	filter: contrast(1.1);
	animation: logo ease 1.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@keyframes logo {
 	0% {opacity: 0.0}
    100% {opacity: 0.95}
}

.year {
	position: relative;
	left: 75px;
	bottom: -7px;
	opacity: 0.75;
	color: sienna;
	filter: contrast(1.25);
	font-family: Verdana;
	font-size: 24px;
	font-weight: bold;
	animation: year ease 4s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@keyframes year {
 	0% {opacity: 0.0;}
    100% {opacity: 0.80;}
}

.date {
	color:antiquewhite;
	font-size:18px;
	position:relative;
	top: 15px;
	left: -100px;
	opacity:.70;
}

.wildlife {
	font-family: Verdana;
	font-size: 11.5px;
	font-weight: normal;
	font-style: normal;
	color: antiquewhite;
	text-decoration: none;
	filter: contrast(1.25);
	opacity: 0.5;
	position: relative;
	right: 20px;
	bottom: 10px;
	animation: wildlife ease 7.0s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

.wildlife:hover {
	opacity: 0.5;
	text-decoration: underline;
	text-decoration-color: goldenrod;
}

@keyframes wildlife {
 	0% {opacity: 0.0;}
    100% {opacity: 0.5;}

}