/* Container that clips the banner so it doesn't cause page scrolling */
.banner-container {
    position: fixed;
    bottom: 0;
    right: 0;
    width: 180px;  /* Increased from 150px to prevent text clipping */
    height: 180px; /* Increased from 150px to prevent text clipping */
    overflow: hidden;
    z-index: 9999;
    pointer-events: none; 
}

/* The diagonal banner itself */
.diagonal-banner {
    position: absolute;
    bottom: 45px;  /* Increased from 25px to push it higher up */
    right: -50px;  /* Adjusted from -60px to compensate for the height change */
    width: 260px;  /* Slightly wider to accommodate text at a higher position */
    background-color: #ff0000; 
    color: #ffffff;            
    text-align: center;
    line-height: 40px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    pointer-events: auto; 
    transform: rotate(-45deg); 
    box-shadow: 0 2px 10px rgba(0,0,0,0.3); 
}

.diagonal-banner a {
    color: #ffffff;
    text-decoration: none;
    display: block;
    width: 100%;
}