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

@font-face {
    font-family: 'Resifen';
    src: url('Resifen.woff2') format('woff2'),
        url('Resifen.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body {
	background: #103a9c;
	font-family: impact;
	color: white;
	font-size: 25px;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}

p1 {
	display: block;
-webkit-transform: rotate(0deg); /*Chrome, Safari, Opera */
transform: rotate(0deg);
position: absolute;
top: 135px;
left: 25px;
font-family: Resifen;
position: relative;
color: white;
text-shadow: 3px 2px 3px black;
font-size: 24px;
opacity: 0;
-webkit-animation: fadeIn 2s; /* Chrome, Safari, Opera */
        animation: fadeIn 3s;
        -webkit-animation-delay: 2s;
        animation-delay: 3s;
        -webkit-animation-fill-mode: forwards; 
	    animation-fill-mode: forwards;
}

h1{
	display: block;
-webkit-transform: rotate(0deg); /*Chrome, Safari, Opera */
transform: rotate(0deg);
position: absolute;
top: 655px;
left: 150px;
font-family: georgia;
position: relative;
color: pink;
text-decoration: none;
font-size: 36px;
opacity: 0;
-webkit-animation: fadeIn 5s; /* Chrome, Safari, Opera */
        animation: fadeIn 5s;
        -webkit-animation-delay: 5s;
        animation-delay: 5s;
        -webkit-animation-fill-mode: forwards; 
	    animation-fill-mode: forwards;
}
.frame {
	background-image: image("carmine2023.jpg");
	position: relative;
  width: 450px;
	height: 50px;
	margin: 0px auto;
}

.illustration {
	background: white url("carmine2023.jpg"); 
	width: 475px;
	height: 600px;
	margin: 0px auto;	
}

h1:hover {
  color: blue;@charset "utf-8";
/* CSS Document */