Welcome to my Website!

This is a paragraph! Here's how you make a link: Neocities.

Here's how you can make bold and italic text.

Here's how you can add an image:

Here's how to make a list:

First thing
Second thing
Third thing

To learn more HTML/CSS, check out these tutorials!

/* PAGE BACKGROUND */ body { margin: 0; padding: 0; font-family: "Georgia", serif; background: url('https://i.imgur.com/0lp2m7J.jpeg') no-repeat center fixed; background-size: cover; color: #f8f1ff; text-shadow: 0 0 8px rgba(0,0,0,0.45); overflow-x: hidden; } /* DREAMY OVERLAY */ .overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(50, 0, 60, 0.35); backdrop-filter: blur(4px); z-index: -1; } /* HEADERS */ header { text-align: center; padding: 60px 20px 20px; } header h1 { font-size: 3.5em; letter-spacing: 3px; margin: 0; font-weight: 300; } header h2 { font-size: 1.5em; font-weight: 300; opacity: 0.9; } /* CONTENT BOX */ .content { max-width: 800px; margin: auto; background: rgba(40, 0, 50, 0.45); padding: 30px; border-radius: 20px; box-shadow: 0 0 40px rgba(0,0,0,0.5); backdrop-filter: blur(8px); } /* TEXT STYLES */ .intro, .quote, section p { line-height: 1.7; font-size: 1.1em; } .quote { font-style: italic; font-size: 1.3em; margin: 20px 0; text-align: center; } /* GALLERY */ .gallery h3, .lyrics h3 { font-size: 1.8em; text-align: center; margin-bottom: 10px; } .images { display: flex; gap: 20px; flex-wrap: wrap; justify-content: center; margin-top: 20px; } .images img { width: 300px; border-radius: 15px; box-shadow: 0 0 25px rgba(0,0,0,0.6); transition: transform 1s ease, filter 1s ease; filter: sepia(20%) saturate(120%) contrast(90%); } .images img:hover { transform: scale(1.05); filter: sepia(10%) saturate(130%) contrast(110%); } /* FOOTER */ footer { text-align: center; margin: 40px 0 20px; font-size: 0.9em; opacity: 0.7; }