Compact slider/sticky compact slider widget

Change rating color

/* сhange header rating stars color */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-rating-stars .reputon-count-text {color: red;}

/* сhange header rating counter color */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-rating-stars .reputon-count-number {color: red;}

Rating stars

Rating counter

---

Change name color

/* change info slide only */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-info .reputon-name {color: red;}

/* change review slides only */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-slide-container .reputon-name {color: red;}

---

Change reviews counter color

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-info 
.reputon-reviews-count {color: red;}

---

Change reviews text color

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-slide .reputon-text {color: red;}

---

Change date text color

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-slide .reputon-date {color: red;}

---

Change widget font

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-badge {font-family: Comic Sans MS !important;}

---

Center review counter

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-reviews-count {align-self: center;}

---

Center rating name

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-name {text-align: center;}

---

Center rating

/* change info slide only */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-info .reputon-name {text-align: center;}
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-info .reputon-content {align-items: center;}

/* change review slides only */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-slide-container .reputon-top-part {justify-content: center;}
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-slide-container .reputon-content {align-items: center;}

---

Hide widget element

/* hide reviews counter */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-info .reputon-reviews-count {display: none;}

/* hide Facebook logo */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-info .reputon-image {display: none;}

/* hide name */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-info .reputon-name {display: none;}

/* hide rating stars */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-info .reputon-count-text {display: none;}

/* hide nrating counter */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-info .reputon-count-number {display: none;}

/* hide top border */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-badge {border: none;}

/* remove shadow */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-badge {box-shadow: none;}

---

Add margin above widget

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-badge {margin-top: 100px !important;}

---

Add margin below widget

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-badge {margin-bottom: 100px !important;}

---

Change top border color

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-badge {border-color: pink;}

---

Change background color

.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-container {background: antiquewhite;}

/* change color on element hover */
.reputon-facebook-reviews-widget .reputon-basic-slide .reputon-container:hover .reputon-slide {background: wheat;}

/* To change the widget section color, add this code to theme.liquid */
<style> 
section:has(.reputon-facebook-reviews-widget .reputon-basic-slide) {background: bisque;}
</style> 

---

Move the widget

/* move to block start */
.reputon-facebook-reviews-widget .reputon-basic-slide {
	margin-left: 0 !important;}

/* move to block center*/
.reputon-facebook-reviews-widget .reputon-basic-slide {
	margin: 0 !important;}

/* move to block end */
.reputon-facebook-reviews-widget .reputon-basic-slide {
	margin-right: 0 !important;}

/* center on mobile */
@media (max-width: 640px) {
  .reputon-facebook-reviews-widget .reputon-basic-slide .reputon-badge {
    transform-origin: center;}}

---

Apply black-and-white filter

.reputon-facebook-reviews-widget .reputon-basic-slide {filter: grayscale(100%);}

---

Questions about CSS or need assistance? We're excited to help: [e-mail] or live chat.