Site Checking – dianecookjewelry.com

Site URL – https://www.dianecookjewelry.com/

1. (homepage-ipad-landscape) Want to change to 2 or 4 items/row?

Add to Design > Custom CSS

/* New in my shop tablet */
@media screen and (max-width:1024px) and (min-width:768px) and (orientation:landscape) {
    div#block-yui_3_17_2_1_1605910071186_19056 .summary-item {
    width: 24% !important;
    clear: none !important;
    margin-right: 1% !important;
    }
}

2. (product-detail-mobile). Want to change 1/6 to Arrow Slider?

Add to Design > Custom CSS

/* Product slide arrows control */
@media screen and (max-width:767px) {
.ProductItem-gallery-carousel-controls {
    display: flex !important;
}
/* arrows background */
.ProductItem-gallery-carousel-controls * {
    background: white;
}
.ProductItem-gallery-carousel-controls>div {
    justify-content: center !important;
}
.ProductItem .ProductItem-gallery-carousel-controls>div::after, .ProductItem .ProductItem-gallery-carousel-controls>div::before {
    border-color: black !important;
}
}

3. (in-person-page-tablet) Space between Follow me – Images – Icons look huge

Add to Design > Custom CSS

/* Follow me spacing */
@media screen and (max-width:991px) and (min-width:768px) {
[data-section-id="5f3efcb69e392b214a333e87"] {
    min-height: 10vh !important;
}
}

4. (policies-ipad) Want to increase text width on tablet?

Add to Policies Page Header

<style>
@media screen and (max-width:991px) and (min-width:768px) {
#page section:first-child .content {
    width: 90%;
}
}
</style>

5. (contact-ipad-landscape). Want to add space between Join my – top border?

Add to Contact Page Header

<style>
@media screen and (max-width:991px) and (min-width:768px) {
form.newsletter-form {
    padding-top: 20px;
}
}
</style>