/* Import Fonts */
@import url('https://fonts.googleapis.com/css2?family=Pirata+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&display=swap');

/* Global Styles */
body {
    font-family: 'Playfair Display', serif;
    margin: 0;
    padding: 0;
    background-image: url('/images/Backgrounds/SandsOfTime.png');
    background-size: cover;
    background-position: center 0px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    color: #000000;
    padding-top: 60px; /* Pushes content below the header */
    
    transform: scale(var(--scale-factor));
    transform-origin: top left;
    transition: transform 0.1s ease-in-out;
}

/* Header */
header {
    position: fixed;
    width: 100%;
    height: 60px; /* Matches the required spacing */
    background-color: #000; /* Optional: Black background */
    z-index: 10;
}

/* Main Content */
main {
    position: relative;
    min-height: 100vh;
    z-index: 1;
    padding: 20px;
    color: #FFFFFF;
}