How to adjust the style of the popup using CSS code?

By default, EcomSend popups provide an aesthetically responsive design. If you want to do some custom changes, here is the instruction.

[TOC]

## Popup
### Change font style
#### Heading
`.ecomsend__Modal__TitleText {font-size: 20px !important;}`

#### Description
`.ecomsend__Modal__TitleHelpText {font-size: 20px !important;}`

#### Placeholder
`.ecomsend__Input__Wrap .ecomsend__Input__Input::placeholder{color:#000;}`

#### Consent
`.ecomsend__Modal__PolicyBoxWrapper label {font-size: 20px;}`

#### Primary button
`.ecomsend__Button {font-size: 18px !important;}`

#### Secondary button
`.ecomsend__Modal__CloseText {font-size: 18px !important;}`

#### Footer text
`.ecomsend__Modal__DescriptionText {font-size: 18px !important;}`

### Consent
#### Change the color of the tick √
`.ecomsend__Modal__PolicyBoxWrapper svg path {fill: #ff1919;}`

#### Change the opacity of the checkbox
`.ecomsend__Modal__PolicyBoxWrapper input{opacity: 0.4;}`

### Close button
#### Change the color
`div.ecomsend__Modal__CloseButton svg path{ fill: #84C0EE !important;}`

#### Remove the close button
`div.ecomsend__Modal__CloseButton svg path{display: none !important;}`

## Sidebar widget
#### When showing on the right position, make the text flip to the right
```css
.ecomsend__Popover__Widget .ecomsend__Popover__Widget__right .ecomsend__Popover__Widget__Text {
 display: block;
 transform: rotate(-180deg);
 padding: 0 20px;
}
```

#### Reduce the size on mobile
```css
@media screen and (max-width: 768px){
  .ecomsend__Popover__Widget__CustomContainer {scale:0.85}
}
```

## Sticky discount bar
#### Adjust the height on desktop
```css
.ecomsend__Popover__Sticky {height: 50px;}
.ecomsend__Input__Input {height:40px;}
```

#### Adjust the height on mobile
```css
@media screen and (max-width: 768px){
.ecomsend__Popover__Sticky {height:55px !important;}
.ecomsend__Popover__Sticky__Container {scale:0.7; padding: 0px!important;} 
}
```

Need help? Feel free to contact us via online chat or email, our world-class 24/7 support team is always glad to help you 🧐