@media (max-width: 768px) {
    .cormorantInfant{
        font-weight: 500;
    }

    .sticky-navbar{
        font-size: 1.5rem;
        padding: 30px 0;
    }

    .landingPage h1 {
        margin-top: -20rem;
        text-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5) !important;
        font-size: 5rem;
    }

    .landingPage img{
        object-fit: cover;
        object-position: 40%;
    }

    /* 2 - Welcome section */
        .welcome{
            height: 45rem;
        }

        .welcome h1{
            font-size: 2.75rem;
        }

        .welcome p{
            font-size: 1.2rem !important;
            width: 80%;
            margin-bottom: 0px;
        }
          
          #countdown li {
            font-size: 1.5em;
          }
          
          #countdown li span {
            font-size: 4.5rem;
          }
          

        #countdown li {
            font-size: 0.75rem;
            padding: 10px;
        }
        
        #countdown li span {
            font-size: calc(2rem);
        }

    /* 3 - Place & Date section */
        .place_date{
            height: fit-content;
        }

        .place_date h1{
            font-size: 2.75rem;
            margin-bottom: 5rem;
        }

        .place_date .threeColumn h2{
            font-size: 1.5rem;
        }

        .columnItem {
            width: 100%;
        }

        .placeDescription {
            max-width: 80%;
        }

        .threeColumn {
            flex-direction: column;
            gap: 7rem;   
        }


    /* 4 - Wedding Overview */
        .rsvp{
            height: fit-content;
            padding: 10% 0 10% 0;
        }

        .centered-hr {
            width: 55%;
            margin: -2% 0% 7% 0%;
        }

        .rsvp img{
            width: 80%;
            border-radius: 10px;
            box-shadow: 5px 0px 30px rgba(0, 0, 0, 0.6);
        }


        .rsvpButton{
            font-size: 1.3rem;
            padding: 15px 20px;
            margin-top: -15px;
        }        

        .rsvpButton:hover{
            transform: scale(1);
        }        


    /* 5 - Carousel */
        .image_carousel{
            height: fit-content;
            padding: 10% 0 10% 0;
        }

        .logos-slide {
            animation: slide 25s linear infinite;
        }

        .image_carousel img{
            max-width: 50vw;
        }

    /* 6 - FAQ */
        .faq_section {
             width: 85%;
        }

        .faq_text{
            font-size: 20px;
        }
        
        .faq_content p{
            font-size: 18px !important;
            margin-left: 3em;
            width: 63vw;
            font-weight: 500;
        }

        .faq_content a button{
            font-weight: 300;
        }

        .address-button{
            margin: 5% 0 5% 0;
        }
        

    /* 7 - Gallery */
        .gallery {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr));
            justify-content: center;
        }

        .gallery h1{
            margin-top: 0 !important;
        }

    /* 8- Footer */
        .footer{
            padding: 10% 0 10% 0;
        }

        .footer-container img {
            width: 80%;
        }

        .advertisement{
            padding-top: 5%;
        }
}