/* post.css */

h1 {
    font-size: 2rem; /* Sets the font size for the title */
    color: #cf79f1; /* Sets the color for the title */
    margin-bottom: 20px; /* Adds some margin below the title */
    text-align: center; /* Centers the text */
}


img {
    max-width: 100%; /* Makes sure the image doesn't overflow its container */
    height: auto; /* Keeps the image's aspect ratio */
    display: block; /* Makes the image a block element */
    margin: 0 auto 50px; /* Centers the image and adds some margin below it */
}

#content {
    font-size: 1rem; /* Sets the font size for the content */
    line-height: 1.6; /* Sets the line height for the content (for readability) */
    color: #f110ae; /* Set content color to white for better contrast against dark background */
    border: 2px solid #25021b; /* Add a border around the image */
    border-radius: 5px; /* Optional: Rounds the corners of the border */
}

.navigation-btn {
    display: inline-block;
    padding: 10px 20px;
    color: #fff;
    background-color: #cf79f1; /* Use the magenta color for button backgrounds */
    text-decoration: none;
    border-radius: 5px;
    transition: background-color 0.3s ease;
    margin: 5px;

    /* New styles */
    font-weight: 700; /* Makes the text bold */
    letter-spacing: 1px; /* Adds some spacing between the letters */
    text-transform: uppercase; /* Makes the text uppercase */
}

.navigation-btn:hover {
    background-color: #a822dd; /* Darker color on hover */
}

.navigation-btn-container {
    text-align: center; /* Centers the buttons */
    margin-bottom: 20px; /* Adds some margin below the buttons */
}

.disabled {
    color: #999;
    background-color: #eee;
    cursor: not-allowed;
}