@import url('https://fonts.googleapis.com/css2?family=Anton:wght@400&display=swap');

.receipt-holt-container {
    width: 100%;
    height: 100%;
    background: transparent; /* Transparent background */
    color: white;
    text-align: center;
    padding: 20px;
    box-sizing: border-box;
}

.content-wrapper {
    width: 100%;
    max-width: 600px;
    padding: 0 10px;
    margin: 0 auto;
}

.content-header {
    background-color: white;
    border: 2px solid black;
    border-bottom: none; /* No bottom border */
    padding: 10px;
    box-sizing: border-box;
    width: 100%;
    text-transform: uppercase;
}

.content-header h3 {
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.5em;
    margin: 0;
    color: black; /* Set header text color to black */
    font-weight: bold;
}

.content-box {
    background-color: white;
    border: 2px solid black;
    border-bottom: none; /* Connect with total box */
    height: 300px;
    overflow-y: scroll;
    width: 100%;
}

.scrolling-text p {
    margin: 10px 0;
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.2em;
    text-transform: uppercase;
    color: black; /* Set scrolling text to black */
}

.total-box {
    background-color: white;
    border: 2px solid black;
    border-top: none; /* Remove top border to connect to content box */
    padding: 10px;
    width: 100%;
    text-align: left;
}

.total-box p {
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.2em;
    text-transform: uppercase;
    color: black; /* Set total text color to black */
}

.highlight {
    background: yellow;
    color: black; /* Ensure highlight color is black */
}

.liberal-tax-hikes {
    color: red;
    font-weight: bold;
    text-decoration: underline wavy;
}

.receipt-holt-page header,
.receipt-holt-page footer,
.receipt-holt-page nav {
    display: none !important;
}

/* H1 to H6 Font Style */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Anton', sans-serif !important;
    font-weight: 400 !important;
}

/* Keyframes for animations */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-30px); }
    60% { transform: translateY(-15px); }
}



@keyframes scrollText {
    0% { transform: translateY(100%); }
    100% { transform: translateY(-100%); }
}





/* Shake animation */
@keyframes shake {
    0% { transform: translate(1px, 1px) rotate(0deg); }
    10% { transform: translate(-1px, -1px) rotate(-0.5deg); }
    20% { transform: translate(-1.5px, 0px) rotate(0.5deg); }
    30% { transform: translate(1.5px, 1px) rotate(0deg); }
    40% { transform: translate(1px, -1px) rotate(0.5deg); }
    50% { transform: translate(-1px, 1px) rotate(-0.5deg); }
    60% { transform: translate(-1.5px, 0.5px) rotate(0deg); }
    70% { transform: translate(1.5px, 0.5px) rotate(-0.5deg); }
    80% { transform: translate(-1px, -0.5px) rotate(0.5deg); }
    90% { transform: translate(1px, 1px) rotate(0deg); }
    100% { transform: translate(1px, -1px) rotate(-0.5deg); }
}

/* Wipe In and Out Keyframes */
@keyframes wipeIn {
    0% { opacity: 0; transform: translateX(-100%); }
    100% { opacity: 1; transform: translateX(0); }
}

@keyframes wipeOut {
    0% { opacity: 1; transform: translateX(0); }
    100% { opacity: 0; transform: translateX(100%); }
}

/* CTA Form Style */
.cta-form-container {
    background-color: rgba(211, 211, 211, 0.3); /* Light grey with transparency */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Drop shadow */
    padding: 20px;
    border-radius: 5px; /* Rounded corners */
    margin-top: 20px;
    width: 100%; /* Full width */
}

.cta-form {
    text-align: center;
}

.cta-form .cta-headline {
    font-size: 1.5em;
    color: white;
    font-weight: bold;
    margin-bottom: 20px;
    text-transform: uppercase;
}


/* Styles for .amount class within scrolling text */
.scrolling-text .amount {
    color: red;
    font-weight: bold;
    text-decoration: underline;
}

/* Scrolling text effect for the entire .scrolling-text section */
.scrolling-text {
    height: 100%; /* Adjust height to fit the content box */
    padding: 10px;
    box-sizing: border-box;
    color: #333;
    white-space: normal; /* Allow text wrapping */
    overflow-y: scroll; /* Allow vertical scrolling */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* Start from the top */
}

.scrolling-text p {
    margin: 10px 0;
    padding: 0;
    font-family: 'Courier New', Courier, monospace; /* Match font with header */
    font-size: 1.2em; /* Slightly larger font */
    text-transform: uppercase; /* Ensure uppercase */
    word-break: break-word; /* Allow long words to break and wrap */
}

/* Keyframes for scroll animation */
@keyframes scrollText {
    0% { transform: translateY(100%); }
    100% { transform: translateY(-100%); }
}