# CSS Structure

{% hint style="info" %}
Budgy has a light and a dark pre-made appearance. Those CSS files have the same strucutre they only differ in color adjustments.
{% endhint %}

CSS files which are responsible for the look and feel can be found in **css** folder: 

* <mark style="color:blue;">**style.css**</mark>
* <mark style="color:blue;">**style-login.css**</mark>
* **style-dark.css**
* **style-login-dark.css**

The structure is the following.

**style.css** *(responsible for main areas such as calculator home, profile page etc.)*

```css
01. PRELOADER
02. GENERAL
03. MODAL ALERT
04. MODAL DIALOG
05. INFO MESSAGES
06. HEADER
07. SUB HEAEDR
08. FOOTER
09. HERO
10. SERVICES
11. BANNER
12. CONTAINERS
13. FORM ELEMENTS
14. BACK TO TOP
15. RESPONSIVE
```

**style-login.css** *(responsible for login and password reset areas)*

```css
01. PRELOADER
02. GENERAL
03. LOGIN
04. FLOAT LABELS
05. SHOW-HIDE PASSWORD
06. PASSWORD STRENGHT
07. CHECKBOXES
08. FORM LINKS
09. FORM BUTTON
10. INFO MESSAGE
11. RESPONSIVE
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ultimatewebsolutions.gitbook.io/budgy-documentation/css-structure.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.