---?image=template/img/pencils.jpg
@title[Sidebox Templates]

## @color[black](Sidebox<br>Slide Templates)

@fa[arrow-down text-black]

@snap[south docslink span-50]
[The Template Docs](https://gitpitch.com/docs/the-template)
@snapend


+++?image=template/img/bg/blue.jpg&position=left&size=30% 50%
@title[Sidebox + Heading]

@snap[west text-white]
@size[3em](A.)
@snapend

@snap[east span-75]
<h2>Sunt in @css[text-pink](culpa) officia</h2>
@snapend

@snap[north-east template-note text-gray]
Sidebox with heading body template.
@snapend


+++?image=template/img/bg/orange.jpg&position=left&size=30% 50%
@title[Sidebox + Image Body]

@snap[west text-white]
@size[3em](B.)
@snapend

@snap[east span-70]
![FRIDAY](template/img/friday.gif)
@snapend

@snap[north-east template-note text-gray]
Sidebox with image body template.
@snapend


+++?image=template/img/bg/green.jpg&position=left&size=30% 50%
@title[Sidebox + Mixed Body]

@snap[west text-white]
@size[3em](C.)
@snapend

@snap[east span-70]
@fa[bath fa-5x text-blue]
<br><br>
How to write clean code.
@snapend

@snap[north-east template-note text-gray]
Sidebox with mixed body template.
@snapend


+++?image=template/img/bg/pink.jpg&position=left&size=30% 50%
@title[Sidebox + Text Body]

@snap[west text-white]
@size[3em](D.)
@snapend

@snap[east span-70]
Ut enim ad minim veniam, quis @css[text-pink](nostrud exercitation ullamco laboris) nisi ut aliquip ex ea commodo.
<br><br>
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
@snapend

@snap[north-east template-note text-gray]
Sidebox with text body template.
@snapend
