# Apply RTL mode

**URL:** https://community.elfsight.com/t/apply-rtl-mode/58473
**Category:** Event Calendar
**Created:** [June 24, 2024, 6:44pm UTC](https://community.elfsight.com/t/apply-rtl-mode/58473 "2024-06-24T18:44:56Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)
#### Post date: [June 24, 2024, 6:44pm UTC](https://community.elfsight.com/t/apply-rtl-mode/58473/1 "2024-06-24T18:44:56Z")

</div>

Add this code to the Custom CSS field on the Style tab of your [Event Calendar](https://elfsight.com/event-calendar-widget/) widget’s settings:

```auto
.eapp-events-calendar-events-calendar-component{
direction: rtl;
text-align: right;
font-family: sans-serif;
}
.global-styles, [class^="FlexContainer"] {
direction: rtl;
text-align: right;
}
.global-styles, .eapp-events-calendar-grid-item-imageContainer {
margin-left: 0!important;
margin-right: -32px;
}
.global-styles, .eapp-events-calendar-date-element-item {
text-align: right;
}

```

  

Guys, if this code was helpful, please drop us a line in the comments 🙂