## Links

### Application links

#### Unsing markdown anchors
```
[Go home](/)
```

[Go home](/)

```
[Signup](/signup)
```

[Signup](/signup)

```
[Open overlay](?c[overlay]=terms)
```

[Open overlay](?c[overlay]=terms)


#### Using Route component
```
<Route to="/signup">Signup</Route>
```

<Route to="/signup">Signup</Route>

### External link

```
[Visit google.com](https://google.com)
```

[Visit google.com](https://google.com)

## Image usage

`DynamicContent` will replace an existing `img` tag with our own custom `Picture` component

### Markdown usage
```
![Logo](//images.ctfassets.net/dbq0oal15rwl/6cArBzrLnhuCS6hndoUvMy/395884a5d01c643bc9eabb8915e363ee/online_casino.png "The Logo title")
```

![Logo](//images.ctfassets.net/dbq0oal15rwl/6cArBzrLnhuCS6hndoUvMy/395884a5d01c643bc9eabb8915e363ee/online_casino.png)

### HTML usage

```
<img src="//images.ctfassets.net/dbq0oal15rwl/6cArBzrLnhuCS6hndoUvMy/395884a5d01c643bc9eabb8915e363ee/online_casino.png" alt="Logo" title="The logo title" width="240" />
```

<img src="//images.ctfassets.net/dbq0oal15rwl/6cArBzrLnhuCS6hndoUvMy/395884a5d01c643bc9eabb8915e363ee/online_casino.png" alt="Logo" title="The logo title" width="240" />


## Picture usage

### Custom dimension

*Default*: `200px`

```
<Picture src="URL" alt="Dreamz" width="300" />
```

<Picture src="//images.ctfassets.net/dbq0oal15rwl/6cArBzrLnhuCS6hndoUvMy/395884a5d01c643bc9eabb8915e363ee/online_casino.png" alt="Dreamz" width="300" />


### Image aligned left

```
Picture align="left" src="URL" alt="Dreamz"
```

<Picture align="left" src="//images.ctfassets.net/dbq0oal15rwl/6cArBzrLnhuCS6hndoUvMy/395884a5d01c643bc9eabb8915e363ee/online_casino.png" alt="Dreamz" />
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sodales eu massa ut convallis. Aenean rutrum dolor purus. Curabitur pharetra ipsum purus, vel sollicitudin mi pulvinar nec.

<br />

### Image aligned right

```
Picture align="right" src="SOURCE" alt="Dreamz"
```

<Picture align="right" src="//images.ctfassets.net/dbq0oal15rwl/6cArBzrLnhuCS6hndoUvMy/395884a5d01c643bc9eabb8915e363ee/online_casino.png" alt="Dreamz" />
Integer sed sapien ornare, hendrerit arcu sit amet, faucibus lectus. Etiam ornare, nisl vitae porttitor laoreet, orci nisi mattis ipsum, vel volutpat nisl tellus et diam. Donec ac dui rutrum, commodo magna sagittis, semper massa. Morbi pharetra ligula consectetur gravida iaculis. Donec scelerisque orci vel nibh porta bibendum. Fusce varius ex eu dapibus ornare. Quisque tempus mi id sem laoreet gravida.

<br />

### Image aligned center

```
Picture align="center" src="SOURCE" alt="Dreamz"
```

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sodales eu massa ut convallis. Aenean rutrum dolor purus. Curabitur pharetra ipsum purus, vel sollicitudin mi pulvinar nec.
<Picture align="center" src="//images.ctfassets.net/dbq0oal15rwl/6cArBzrLnhuCS6hndoUvMy/395884a5d01c643bc9eabb8915e363ee/online_casino.png" alt="Dreamz" />

<br />

### Large image

Images that have a width set larger than the available viewport, will be scale down to max container width.

```
Picture src="SOURCE" alt="Dreamz" width="1400"
```

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sodales eu massa ut convallis. Aenean rutrum dolor purus. Curabitur pharetra ipsum purus, vel sollicitudin mi pulvinar nec.

<Picture src="//images.ctfassets.net/dbq0oal15rwl/6cArBzrLnhuCS6hndoUvMy/395884a5d01c643bc9eabb8915e363ee/online_casino.png" alt="Dreamz" width="1400" />