@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'Crowsink';
    src: url('Crowsink-lxgl5.woff2') format('woff2'),
        url('Crowsink-lxgl5.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
	
	body {
	background:blue;
	font-family: 'Crowsink';
	color: #a9095f;
	
}
.PicThree{
	position: absolute;
	top:140px;
	left:50px;
	color: #095ca9;
	background: url(PicEleven.png);
	width:293px;
		height:436px;
	scale: 75%;
	text-indent: -9999px;
	-webkit-transition: 1s;
        transition: 1s;
}


.PicTwo{
	position: absolute;
	top:300px;
	left:780px;
	color: #5f09a9;
	background: url(PicTwo.png);
	width:317px;
		height:238px;
	text-indent: -9999px;
	-webkit-transition: 1s;
        transition: 1s;
}

.Home{
	position: absolute;
	top:590px;
	left:530px;
	color: #095ca9;
		-webkit-transition: 2s;
        transition: 2s;
	        -webkit-animation-delay: 2s;
        animation-delay: 2s;
}

.Home:hover{
    background-size: cover;
    -webkit-transform: scale(1.25);
    transform: scale(1.25); 
}

.Back{
	position: absolute;
	top:590px;
	left:30px;
	color: #095ca9;
		-webkit-transition: 2s;
        transition: 2s;
	        -webkit-animation-delay: 2s;
        animation-delay: 2s;
}

.Back:hover{
    background-size: cover;
    -webkit-transform: scale(1.25);
    transform: scale(1.25); 
}

.frame{
	position: relative;
	background: yellow url("EOSblank.png");
	width:800px;
	height:640px;
	margin:0px auto;
}
a{
	text-decoration: none;
	text-shadow: 2px 1px 2px grey;
	opacity: 0;
        -webkit-animation: fadeIn 1s; /* Chrome, Safari, Opera */
        animation: fadeIn 1s;
        -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	    animation-fill-mode:forwards;
}
	
	/* Chrome, Safari, Opera */
@-webkit-keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}

/* Standard syntax */
@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
} 

h1{
	font-size: 80px;
	 -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
  transform: rotate(0deg);
	opacity: 1;
	text-shadow: 1px 2px 3px lightblue;
	position:absolute;
top:0px;
	left:220px;
	opacity: 0;
        -webkit-animation: fadeIn 2s; /* Chrome, Safari, Opera */
        animation: fadeIn 2s;
        -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	    animation-fill-mode:forwards;
}

h2{
	font-size: 25px;
	 -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
  transform: rotate(0deg);
	opacity: 1;
	text-shadow: 1px 2px 3px lightblue;
	position:absolute;
top:150px;
	left:370px;
	width: 400px;
	opacity: 0;
        -webkit-animation: fadeIn 2s; /* Chrome, Safari, Opera */
        animation: fadeIn 2s;
        -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	    animation-fill-mode:forwards;
}

p{
	font-size: 30px;
}