/* Georgia Default */
@font-face {
font-family: 'GeorgiaWeb';
src: url('/Fonts/Georgia/georgia.woff2') format('woff2'),
     url('/Fonts/Georgia/georgia.ttf') format('truetype');
font-weight: 400;
font-style: normal;
font-display: block; }

/* Georgia Italic */
@font-face {
font-family: 'GeorgiaWeb';
src: url('/Fonts/Georgia/georgia_italic.woff2') format('woff2'),
     url('/Fonts/Georgia/georgia_italic.ttf') format('truetype');
font-weight: 400;
font-style: italic;
font-display: block; }

/* Georgia Negrita */
@font-face {
font-family: 'GeorgiaWeb';
src: url('/Fonts/Georgia/georgia_bold.woff2') format('woff2'),
     url('/Fonts/Georgia/georgia_bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
font-display: block; }

/* Georgia Italic Negrita */
@font-face {
font-family: 'GeorgiaWeb';
src: url('/Fonts/Georgia/georgia_italic.woff2') format('woff2'),
     url('/Fonts/Georgia/georgia_italic.ttf') format('truetype');
font-weight: 700;
font-style: italic;
font-display: block; }

/*  ------
    Cursor
    ------  */

* {cursor: url("/Cursor/Black/Def.png"), default;}

h3 a:hover {cursor: url("/Cursor/Black/Point.png"), pointer;}

p a:hover {cursor: url("/Cursor/Black/Point.png"), pointer;}

.Credit_Img:hover {cursor: url("/Cursor/Black/Point.png"), pointer;}

footer img {cursor: url("/Cursor/Black/Pen.png"), pointer;}

/* h1 */

h1 {
font-family: 'GeorgiaWeb', Georgia; 
text-align: center;
font-size: clamp(4rem, 2.1667rem + 7.3333vw, 6.75rem);
margin-top: calc(clamp(0.35rem, -0.0833rem + 1.7333vw, 1rem) - 0.425rem);
margin-bottom: clamp(0.35rem, -0.0833rem + 1.7333vw, 1rem);
filter:
drop-shadow(0 0 2px rgb(0, 110, 81))
drop-shadow(0 0 4px rgb(40, 255, 198))
drop-shadow(0 0 12px rgba(22, 218, 166, 0.85));
}

/* body */

body {
will-change: background-position;
font-family: 'GeorgiaWeb', Georgia; 
background-image: url("/Tiles/TealGrey.png");
background-repeat: repeat;
animation: LittleMove 6s linear infinite;
margin: 0;}

@keyframes LittleMove {
0% { background-position: 0 0; }
100% { background-position: -192px -192px; } }

/*  ---------
    Container 
    ---------  */

.Container {
display: flex;
flex-direction: column;
background-color: rgba(0, 0, 0, 0.65);
filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, 0.85));
margin: 0 auto;

padding: clamp(0.5rem, 0.0446rem + 1.4286vw, 0.9375rem) clamp(0.5rem, 0.0446rem + 1.4286vw, 0.9375rem) clamp(0.5rem, 0.0446rem + 1.4286vw, 0.9375rem) clamp(0.5rem, 0.0446rem + 1.4286vw, 0.9375rem);

width: clamp(260px, 8.75rem + 40vw, 540px);
height: fit-content;
}

.Container a {
text-decoration: none;
color: rgb(255, 255, 255);}

.Container a:hover {
color: rgb(0, 220, 250);}

.Container u {
color: rgb(120, 0, 255);}

.Container u:hover {
color: rgb(255, 255, 255);}

h3 {
text-align: center;
font-size: clamp(1.7625rem, 1.5107rem + 1.3429vw, 2.35rem);
margin: clamp(0.35rem, 0.2857rem + 0.3429vw, 0.5rem) 0 clamp(0.35rem, 0.2857rem + 0.3429vw, 0.5rem) 0;
}

hr {
color: white;
width: 100%;
}

/*  --------
    Creditos 
    --------  */

h4 {
color: white;

text-align: center;
font-size: clamp(1.5rem, 1.2857rem + 1.1429vw, 2rem);
margin: 0 0 1.15rem 0;

text-shadow: 2px 2px 0px #000000, 2px 2px 2px #000000, 2px 2px 4px #000000;
}

h5 {
color: white;
font-size: clamp(1.0875rem, 0.9321rem + 0.8286vw, 1.45rem);
margin: 0 0 0.25rem 0;
text-shadow: 2px 2px 0px #000000, 2px 2px 2px #000000, 2px 2px 4px #000000;
}

ul {
list-style: none;
padding: 0;
margin: 0;
text-align: center;
}

li {
margin: 0rem auto;
background-color: rgba(255, 255, 255, 0.175);
padding: 8px;
border-radius: 8px;
width: fit-content;
border-style: dashed;
border-width: 2px;
border-color: rgb(255, 255, 255);
transition: box-shadow 0.195s ease;
}

li:hover {
box-shadow: 0px 0px 10px rgb(255, 255, 255);
}

abbr {
margin: 0;
padding: 0;}

p {
margin: 0 0 0.65rem 0;
font-size: clamp(0.95rem, 0.8214rem + 0.6857vw, 1.25rem);
text-shadow: 2px 2px 0px #000000, 2px 2px 2px #000000, 2px 2px 4px #000000;
}

.Credit_Img {
margin: 0;
padding: 0;
height: 80px;
width: auto;
filter: drop-shadow(0 0 10px rgb(0, 255, 128,0.5));
}

.Credit_Img:hover {
filter: drop-shadow(0 0 8px rgba(120, 0, 255,0.75));
}


/*  ------
    Footer 
    ------  */

footer {
display: flex;
justify-content: center;
align-items: center;

margin: 0 auto;

width: clamp(240px, calc(170px + 17vw), 340px);

font-family: 'GeorgiaWeb', Georgia;

margin-top: 2rem;
margin-bottom: 2rem;

padding: 4px 4px 4px 8.5px; 
border-radius: 12.5px;

background-color: rgba(0, 0, 0, 0.65);
filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, 0.85));

text-align: center;
font-size: clamp(1.1rem, 1.0464rem + 0.2857vw, 1.225rem);
}

footer span {
color: white;
text-shadow: 2.5px 2.5px 0px #000000;
}

footer img {
width: 70px;
height: auto;
margin-left: 6.5px;
padding-bottom: 4px;
filter: drop-shadow(2.5px 2.5px 4px rgb(0, 0, 0));
}

footer img:hover{
animation: Scale-Pop 0.325s steps(2) forwards;
}

@keyframes Scale-Pop {
0% { transform: scale(1, 1); }
25% { transform: scale(4.2, 0.4); }
50% { transform: scale(0.5, 3.1); }
100% { transform: scale(1.3, 1.3); }
}