# Layouts & Theme

This section covers the documentation about the classes which builds the layout or could be used to customize the layout as per your need.

The following classes could be applied to \<body> tag to achieve the desired layout for your project:

```css
/* Layout Related Classes
-------------------------------- */
/* Below is a unique class for default layout. For other layouts, 
you can replace default (after --) with the name of those layouts.
for example .dt-layout--crm */
.dt-layout--default  



/* Sidebar Related Classes (Only for layouts with sidebar)
-------------------------------- */
/* To fix the sidebar */
.dt-sidebar--fixed   

/* To make the sidebar folded */
.dt-sidebar--folded  

/* To expend the sidebar
(Drift uses this on on-hover event when the sidebar is in folded mode) */
.dt-sidebar--expended  



/* Header Related Classes (Only for default layouts)
-------------------------------- */
/* To fix the header */
.dt-header--fixed   



/* Framing Related Classes 
--------------------------------- */
/* To make the framing fluid */
.dt-layout--full-width  

/* To make the framing covered from all four sides */
.dt-layout--framed   

/* To make the framing in boxed style (or fixed width) */
.dt-layout--boxed    



/* Theme Related Classes (only for default layout)
---------------------------------- */
/* To apply the semi-dark theme */
.theme-semidark      

/* To apply the light theme */
.theme-light         

/* To apply the dark theme */
.theme-dark          
```

The following classes are related to the layouts with drawer and will be applied to sidebar:

```css
/* to convert the sidebar into drawer */
.dt-drawer

/* To switch the drawer position either right or left */
.position-right
.position-left
```


---

# 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://docs-drift.g-axon.work/stylesheets/layouts.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.
