.side-strip.left-side { left: 0; } .side-strip.right-side { right: 0; } .side-strip img { height: 100vh; /* full viewport height */ width: 100%; object-fit: cover; /* crop nicely */ } /* Optional fade effect for left side */ .side-strip.left-side::after { content: ""; position: absolute; top: 0; right: 0; width: 20px; height: 100%; background: linear-gradient(to right, rgba(253, 248, 243, 1), rgba(253, 248, 243, 0)); pointer-events: none; } /* Header */ header { background-color: rgba(226, 200, 163, 0.85); text-align: center; padding: 20px; border-bottom: 4px solid #b18b5e; position: relative; z-index: 1; } header h1 { font-family: 'Courier New', monospace; font-size: 2.5em; color: #3b2f2f; } /* Navigation */ nav ul { list-style: none; margin-top: 10px; } nav ul li { display: inline; margin: 0 15px; } nav ul li a { text-decoration: none; color: #3b2f2f; font-weight: bold; } nav ul li a:hover { color: #6b4f2a; } /* Main Content */ main { background-color: rgba(255, 255, 255, 0.85); padding: 20px; margin-top: 20px; border: 2px solid #d2b48c; border-radius: 5px; position: relative; z-index: 1; } /* Articles */ article h2 { font-family: 'Courier New', monospace; margin-bottom: 10px; } article p { margin-bottom: 15px; } /* Footer */ footer { text-align: center; font-size: 0.9em; padding: 15px; margin-top: 20px; background-color: rgba(226, 200, 163, 0.85); border-top: 4px solid #b18b5e; position: relative; z-index: 1; }
grace's space
Home
About
Contact
Post Title
This is where your blog content will go. Replace this text with your first post.
