# Countdown bar

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2FSikcHYgmhR0Ha09oDqXk%2Fcd-b.jpg?alt=media&#x26;token=c0f522a9-1bfc-48ed-b116-0247fbe1321d" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
**Steps:**&#x20;

1. In the theme editor **(Customize)**, click **Add section.**
2. Locate **Countdown bar**
3. Make necessary changes. > **Save.**
   {% endhint %}

## General settings

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2F3w4Wh22eSVYrNa2pydXt%2Fcd-g.jpg?alt=media&#x26;token=3a4b4464-5e0a-477b-a3fd-2f9fbb81a106" alt=""><figcaption></figcaption></figure>

* **Width** - With of this section 3 options : Container / Stretched / Full width
* **Background image**

### Countdown

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2FWfgEEpmrl1tar1erSsEp%2Fcd-c.jpg?alt=media&#x26;token=d34436d3-230b-4b68-a91b-a23008a5c6bd" alt=""><figcaption></figcaption></figure>

* **End time** -  Date format: YYYY/MM/DD HH:MM:SS
* **Style** - Hightlight / Simple / Outline
* **Font family** - Body / Heading
* **Number size** - from Heading 1 to Heading 6
* **Text type** - Long / Short

### Content

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2Fyay9KeTGoh11g1tw9r1F%2Fcd-co.jpg?alt=media&#x26;token=9e3d9f82-3065-44c3-a146-f9ab4a0ad6b1" alt=""><figcaption></figcaption></figure>

* **Subheading**
* **Heading**
* **Heading size**
* **Content**
* **Button** - Leave the label blank to hide the button.
* **Button link**
* **Button style**
* **Show arrow icon**

### Colors

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2FseMGlRGg5lybjmchJqq8%2Fcd-col.jpg?alt=media&#x26;token=54615e7c-028c-40df-99b0-e28c92e18c10" alt=""><figcaption></figcaption></figure>

* **Background**
* **Text color**
* **Border**&#x20;
* **Overlay color**
* **Overlay opacity**
* **Overlay gradient**

### Section padding

<figure><img src="https://1556176885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPgk3wauuyAKlfkLLpBvA%2Fuploads%2Fc0cazMLYpU5yjLuS4vGl%2Fpadding-c.jpg?alt=media&#x26;token=d8c91b56-445e-4ea5-bbc5-f825cf08e577" alt="" width="280"><figcaption></figcaption></figure>

* **Top padding**
* **Bottom padding**