# Small/ minimized compact rating widget

## Remove widget elements

{% code overflow="wrap" %}
```css
/* remove logo */
.reputon-google-reviews-widget .reputon-small .reputon-image {
display: none;}

/* remove rating count */
.reputon-google-reviews-widget .reputon-small .reputon-rating-count {display: none;}

/* remove rating stars */
.reputon-google-reviews-widget .reputon-small .reputon-rating-stars {display: none;}

/* remove reviews count */
.reputon-google-reviews-widget .reputon-small .reputon-reviews-count {display: none;}
```
{% endcode %}

***

## Change rating counter color

{% code overflow="wrap" %}
```css
.reputon-google-reviews-widget .reputon-small .reputon-rating-count {color: red;}
```
{% endcode %}

<figure><img src="https://3311081497-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRkZZ4LuP4fAqhhizix17%2Fuploads%2FATc3E5AfScAZfWXKc181%2Fimage.png?alt=media&#x26;token=df2964ae-fd7e-4191-b7bb-6fb6e07a2173" alt=""><figcaption></figcaption></figure>

***

## Change rating stars color

{% code overflow="wrap" %}
```css
.reputon-google-reviews-widget .reputon-small .reputon-rating-stars {color: red;}
```
{% endcode %}

<figure><img src="https://3311081497-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRkZZ4LuP4fAqhhizix17%2Fuploads%2FeaRoVaJvnd4LBLtv3Os1%2Fimage%201.png?alt=media&#x26;token=d3495d0f-cc3a-43de-bba9-d49d3a0fac2d" alt=""><figcaption></figcaption></figure>

***

## Change widget reviews count color

{% code overflow="wrap" %}
```css
.reputon-google-reviews-widget .reputon-small .reputon-reviews-count {color: red;}
```
{% endcode %}

<figure><img src="https://3311081497-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRkZZ4LuP4fAqhhizix17%2Fuploads%2FsRbPBTOqw85M0RHFt8Me%2Fimage%202.png?alt=media&#x26;token=d4975c78-57d8-48ab-8027-417e3d426d1b" alt=""><figcaption></figcaption></figure>

***

## Apply black-and-white filter

{% code overflow="wrap" %}
```css
.reputon-google-reviews-widget .reputon-small {filter: grayscale(100%);}
```
{% endcode %}

<figure><img src="https://3311081497-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRkZZ4LuP4fAqhhizix17%2Fuploads%2Fp4fCdpv2DreSxx70MLmM%2Fimage%203.png?alt=media&#x26;token=52de61b7-4dc3-4427-80df-05fe7947eeae" alt=""><figcaption></figcaption></figure>

***

## Change background color

{% code overflow="wrap" %}
```css
/* change widget background */
.reputon-google-reviews-widget .reputon-small .reputon-container {background: antiquewhite;}

/* change close button */
.reputon-google-reviews-widget .reputon-small .reputon-bt-close {background: antiquewhite;}

/* change color when hover at element */
.reputon-google-reviews-widget .reputon-small .reputon-container:hover {background: wheat;}

/* To change the background color of the widget section, add this code to your theme.liquid file. */
<style> 
	section:has(.reputon-google-reviews-widget .reputon-small) {background: bisque;}
</style> 
```
{% endcode %}

<figure><img src="https://3311081497-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRkZZ4LuP4fAqhhizix17%2Fuploads%2F4pooWCMHYUpc0WDzSUcV%2Fimage%204.png?alt=media&#x26;token=50264e8f-2fc8-4bce-9581-c4e57dc1c590" alt=""><figcaption></figcaption></figure>

***

## Move widget

{% code overflow="wrap" %}
```css
/* move to the start of the block */
.reputon-google-reviews-widget {justify-content: flex-start !important;}
.reputon-google-reviews-widget .reputon-small {margin: 0 !important;}

/* move to the end of the block */
.reputon-google-reviews-widget {justify-content: flex-end !important;}
.reputon-google-reviews-widget .reputon-small {margin: 0 !important;}

/* center on mobile devices */
@media (max-width: 640px) {
  .reputon-google-reviews-widget .reputon-small .reputon-badge {transform-origin: center;}}
```
{% endcode %}

***

## **Hide widget on mobile**

{% code overflow="wrap" %}
```css
@media (max-width: 460px) { 
	.reputon-google-reviews-widget .reputon-small.reputon-reviews-holder {display: none; }}
```
{% endcode %}

***

**Have questions or need help with CSS?** **We're excited to help at** [**support@reputon.com**](mailto:support@reputon.com) **or** [**live chat**](https://go.crisp.chat/chat/embed/?website_id=d24ef16e-6e05-49e9-bd59-a6f3bde0658a)**.**
