.read-button {
        margin-left: 70px;
    }

/* Styles for Christmas Image */
.cny-img {
    display: block;
    max-width: 126%; /* Default size for larger screens */
    height: auto;
    margin-top: -5px;
}

/* Styles for Lowest Price Image */
.lowest-price-img {
    display: block;
    max-width: 145%; /* Default size for larger screens */
    height: auto;
    margin-left:72px; 
    margin-right:40px;
    margin-top: -33px;
}

.custom-size {
    width: 80%; 
    margin-top: 78px; 
    margin-left: 207px; 
    font-size: 14px;
}

#new{

    margin-left:44em;
    width: 32em; /* Maintain the max width */
    margin-top:-35em;

}

    /* Small Screens */
@media (min-width: 250px) and (max-device-width: 320px) { 

    .read-button {
        margin-left: 23px;
        font-size: 14px;
        width: 11rem;
    }

    .cny-img {
        margin-left: 30px;
        width: 85%;
        margin-top: 9px;
    }

    .lowest-price-img{
        margin-left: 40px;
        margin-bottom: -7rem;
        width: 80%;
        margin-top: 1px;
    }

    .custom-size {
        margin-left:2px;
        font-size: 14px;
        width: 100%;
        margin-top: 112px;
        margin-bottom: 1rem;
    }

    #new{

        margin-left:0em;
        width: 24em; /* Maintain the max width */
        margin-top:-3em;
        font-size: small;
    
    }
    

}

    /* Small Screens */
@media (min-width: 375px) and (max-device-width: 767px) { 

    .read-button {
        margin-left: 26px;
        font-size: 14px;
        width: 11rem;   
    }

    .cny-img {
        margin-left: 64px;
        width: 70%;
        margin-top: 20px;
    }

    .lowest-price-img{
        margin-left: 45px;
        margin-bottom: -7rem;
        width: 80%;
        margin-top: 1px;
    }

    .custom-size {
        margin-left:2px;
        font-size: 14px;
        width: 100%;
        margin-top: 112px;
        margin-bottom: 1rem;
    }

    #new{

        margin-left:0px;
        width: 33em; /* Maintain the max width */
        margin-top:-3em;
        font-size: small;
    
    }

}

@media (min-width: 767px) and (max-device-width: 999px) {

    .read-button {
        margin-left: 15rem;
        font-size: 18px;
        width: 14rem;
        
        }

        .cny-img {
            margin-left: 179px;
            max-width: 22rem; 
        }

        .lowest-price-img{
            margin-left: 4px;
            margin-bottom: -7rem;
            margin-top: 31rem;
            max-width: 22rem;
        }

        .custom-size{

            margin-left:-249px;
            width: 31rem; /* Maintain the max width */
            margin-top: 62rem;

        }

        #fallback-content{

            margin-left: 92px;
            width: 75%; /* Maintain the max width */
            margin-top:-32px;
     
        }

        #new{

            margin-left: 138px;
            width: 62%; /* Maintain the max width */
            margin-top:-35px;
     
        }
    
 
 }

    @media (min-width: 1000px) and (max-device-width: 1240px) {
        .read-button {
        margin-left: 2rem;
        font-size: 14px;
        width: 11rem;
        
        }


        .cny-img {
            margin-left: 0rem;
            max-width: 16rem; 
            margin-top: 6rem;
        }

        .lowest-price-img{
            margin-left: 2rem;
            margin-bottom: 2rem;
            margin-top: 0rem;
            max-width: 22rem;
        }

        #new{

            margin-left:0em;
            width: 29em; /* Maintain the max width */
            margin-top:-3em;
            font-size: small;
        
        }

        .custom-size {

            margin-left:164px;
            font-size: 10px;
            width: 80%;
            margin-top: 69px;


        }

        #new {
            margin-left: 0em;
            width: 31em;
            margin-top: 8em;
            font-size: small;
        }
    }

    /* Snowflake Styles */
    .snowflakes {
        z-index: -1;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none; /* Allow clicks to pass through */
        overflow: hidden;
    }

    .snowflake {
        position: absolute;
        top: -10%;
        color: #ffffff; /* Change color as needed */
        font-size: 1.6em; /* Adjust size as needed */
        animation: fall linear infinite;
        animation-delay: var(--delay);
        opacity: var(--opacity);
        font-size: calc(1.2em + (0.5 * var(--size)));
    }

    .snowflake:nth-child(1) { font-size: 1em; } /* Adjust size for specific snowflake */
    .snowflake:nth-child(2) { font-size: 1em; }
    .snowflake:nth-child(3) { font-size: 2.3em; }
    .snowflake:nth-child(4) { font-size: 1em; }
    .snowflake:nth-child(5) { font-size: 1em; }
    .snowflake:nth-child(6) { font-size: 1.7em; } /* Adjust size for specific snowflake */
    .snowflake:nth-child(7) { font-size: 1em; }
    .snowflake:nth-child(8) { font-size: 1em; }
    .snowflake:nth-child(9) { font-size: 1em; }
    .snowflake:nth-child(10) { font-size: 2.3em; }
    .snowflake:nth-child(11) { font-size: 1em; } /* Adjust size for specific snowflake */
    .snowflake:nth-child(12) { font-size: 1em; }
    .snowflake:nth-child(13) { font-size: 1.7em; }
    .snowflake:nth-child(14) { font-size: 1em; }
    .snowflake:nth-child(15) { font-size: 1em; }
    .snowflake:nth-child(16) { font-size: 1em; } /* Adjust size for specific snowflake */
    .snowflake:nth-child(17) { font-size: 2.3em; }
    .snowflake:nth-child(18) { font-size: 1em; }
    .snowflake:nth-child(19) { font-size: 1em; }
    .snowflake:nth-child(20) { font-size: 1em; }


    @keyframes fall {
        0% {
            transform: translateY(0%) rotate(0deg) translateX(0);
        }
        100% {
            transform: translateY(230vh) rotate(360deg) translateX(var(--wind));
        }
    }

    /* Randomize snowflake positions and animation duration */
    .snowflake:nth-child(1) { left: 5%; animation-duration: 20s; --delay: 0s; --size: 1; --opacity: 0.8; --wind: -2%; }
    .snowflake:nth-child(2) { left: 10%; animation-duration: 18s; --delay: 5s; --size: 1.2; --opacity: 0.6; --wind: 2%; }
    .snowflake:nth-child(3) { left: 15%; animation-duration: 19s; --delay: 7s; --size: 0.8; --opacity: 0.9; --wind: -1%; }
    .snowflake:nth-child(4) { left: 20%; animation-duration: 17s; --delay: 3s; --size: 1.5; --opacity: 0.7; --wind: 1%; }
    .snowflake:nth-child(5) { left: 25%; animation-duration: 21s; --delay: 14s; --size: 1; --opacity: 0.5; --wind: -3%; }
    .snowflake:nth-child(6) { left: 30%; animation-duration: 22s; --delay: 6s; --size: 1.2; --opacity: 0.6; --wind: 2%; }
    .snowflake:nth-child(7) { left: 35%; animation-duration: 19s; --delay: 9s; --size: 0.8; --opacity: 0.9; --wind: -1%; }
    .snowflake:nth-child(8) { left: 40%; animation-duration: 16s; --delay: 2s; --size: 1.5; --opacity: 0.7; --wind: 1%; }
    .snowflake:nth-child(9) { left: 45%; animation-duration: 18s; --delay: 12s; --size: 1; --opacity: 0.5; --wind: -3%; }
    .snowflake:nth-child(10) { left: 50%; animation-duration: 24s; --delay: 15s; --size: 1.2; --opacity: 0.6; --wind: 2%; }
    .snowflake:nth-child(11) { left: 55%; animation-duration: 21s; --delay: 13s; --size: 0.8; --opacity: 0.9; --wind: -1%; }
    .snowflake:nth-child(12) { left: 60%; animation-duration: 22s; --delay: 7s; --size: 1.5; --opacity: 0.7; --wind: 1%; }
    .snowflake:nth-child(13) { left: 65%; animation-duration: 17s; --delay: 4s; --size: 1; --opacity: 0.5; --wind: -3%; }
    .snowflake:nth-child(14) { left: 70%; animation-duration: 19s; --delay: 16s; --size: 1.2; --opacity: 0.6; --wind: 2%; }
    .snowflake:nth-child(15) { left: 75%; animation-duration: 20s; --delay: 6s; --size: 0.8; --opacity: 0.9; --wind: -1%; }
    .snowflake:nth-child(16) { left: 80%; animation-duration: 18s; --delay: 10s; --size: 1.5; --opacity: 0.7; --wind: 1%; }
    .snowflake:nth-child(17) { left: 85%; animation-duration: 22s; --delay: 18s; --size: 1; --opacity: 0.5; --wind: -3%; }
    .snowflake:nth-child(18) { left: 90%; animation-duration: 23s; --delay: 11s; --size: 1.2; --opacity: 0.6; --wind: 2%; }
    .snowflake:nth-child(19) { left: 95%; animation-duration: 18s; --delay: 8s; --size: 0.8; --opacity: 0.9; --wind: -1%; }
    .snowflake:nth-child(20) { left: 97%; animation-duration: 15s; --delay: 1s; --size: 1.5; --opacity: 0.7; --wind: 1%; }    

