To increase Banner Slideshow arrow size, you can follow these.
#1. On All pages
/* Banner Slideshow arrow size */ .user-items-list-banner-slideshow .user-items-list-banner-slideshow__arrow-button { width: 100px !important; height: 100px !important; } svg.user-items-list-banner-slideshow__arrow-icon { width: 50px !important; height: 50px !important; }
#2. On Desktop Only
Use this code to Custom CSS box
@media screen and (min-width:768px) { .user-items-list-banner-slideshow .user-items-list-banner-slideshow__arrow-button { width: 100px !important; height: 100px !important; } svg.user-items-list-banner-slideshow__arrow-icon { width: 50px !important; height: 50px !important; } }
#3. On Mobile Only
@media screen and (max-width:767px) { .user-items-list-banner-slideshow .user-items-list-banner-slideshow__arrow-button { width: 100px !important; height: 100px !important; } svg.user-items-list-banner-slideshow__arrow-icon { width: 50px !important; height: 50px !important; } }
#4. Specific Banner Slideshow
First, you need to find Slideshow ID.
Next, use CSS code like this
section[data-section-id="667a87bcafdd5271c4af6ced"] { .user-items-list-banner-slideshow .user-items-list-banner-slideshow__arrow-button { width: 100px !important; height: 100px !important; } svg.user-items-list-banner-slideshow__arrow-icon { width: 50px !important; height: 50px !important; }}