/* Default styles (Tablet, Laptop, Desktop) */
.tablet-laptop {
    display: block;
}

.phone-only {
    display: none;
}

/* Media Query for Tablets and Laptops (screens between 768px and 1024px) */
@media only screen and (max-width: 1024x) and (min-width: 768px) {
    .tablet-laptop {
        display: block; /* Show this for tablets and laptops */
    }

    .phone-only {
        display: none; /* Hide for tablets and laptops */
    }
}

/* Media Query for Phones (screens smaller than 768px) */
@media only screen and (max-width: 768px) {
    .tablet-laptop {
        display: none; /* Hide for phones */
    }

    .phone-only {
        display: block; /* Show for phones */
    }
}