@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@700&display=swap');

body {
    background-image: url('./background.png');
    background-color: #ffd700; /* Bright yellow fallback */
    font-family: 'Comic Sans MS', 'Comic Neue', cursive;
    color: #0000ff; /* Bright blue */
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Hide horizontal scrollbar from marquee */
}

.container {
    width: 900px;
    margin: 10px auto;
    background-color: #ffff00; /* Even brighter yellow */
    border: 10px ridge #ff00ff; /* Magenta ridge border */
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
}

header {
    text-align: center;
    padding: 10px;
}

.logo {
    width: 500px;
    margin-bottom: 10px;
}

.welcome-marquee {
    font-size: 24px;
    font-weight: bold;
    color: #ff0000; /* Red */
    background-color: #00ffff; /* Cyan */
    padding: 5px;
    border: 3px dotted #00ff00; /* Green */
}

.sparkle {
    color: #ff00ff;
    animation: sparkle-anim 1s infinite;
}

@keyframes sparkle-anim {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.3); }
}

main {
    padding: 20px;
}

.main-content {
    display: flex;
    gap: 20px;
}

.left-column, .right-column {
    flex: 1;
    background: #ffffff;
    border: 5px inset #cccccc;
    padding: 15px;
}

h2 {
    color: #ff00ff; /* Magenta */
    text-decoration: underline wavy #00ff00; /* Green wavy underline */
    font-size: 28px;
    text-align: center;
}

p, li {
    font-size: 16px;
    line-height: 1.4;
}

ul {
    list-style-image: url('https://www.animatedimages.org/data/media/103/animated-arrow-image-0130.gif');
}

.content-gif {
    display: block;
    margin: 15px auto;
    border: 3px dashed red;
}

.blink {
    animation: blink-animation 1s steps(5, start) infinite;
}

@keyframes blink-animation {
    to {
        visibility: hidden;
    }
}

.buy-now-btn {
    display: block;
    margin: 20px auto;
    animation: pulse 0.7s infinite;
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

.small-text {
    font-size: 10px;
    text-align: center;
    color: #555;
}

.car-animation {
    width: 100%;
    overflow: hidden;
    height: 64px; /* image height */
    position: relative;
    background: url('https://i.gifer.com/origin/70/70275b2253a6a8f11b89721735ac9b6e_w200.gif'); /* scrolling road bg */
    border: 2px solid black;
    margin-top: 20px;
}

.car-animation img {
    position: absolute;
    bottom: 5px;
    animation: drive 5s linear infinite;
}

@keyframes drive {
    from { left: -64px; }
    to { left: 100%; }
}

.visitor-counter {
    margin-top: 30px;
    border: 4px groove red;
    padding: 10px;
    text-align: center;
    background-color: #c0c0c0; /* Silver */
}

.counter-box {
    background: #000000;
    color: #00ff00; /* Green LED text */
    padding: 10px;
    font-family: 'Courier New', Courier, monospace;
    font-size: 24px;
    margin-top: 5px;
}

footer {
    text-align: center;
    font-size: 12px;
    padding: 10px;
    background: #c0c0c0;
    border-top: 5px ridge #ff00ff;
}

