HTML tags define default Heading styles.
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Heading classes when typography style doesn't match the default HTML tag.
Heading-style-h1
Heading-style-h2
Heading-style-h3
Heading-style-h4
Heading-style-h5
Heading-style-h6
HTML tags define default text styles.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Block Quote
No bullet list
No bullet list
No bullet list
No bullet list
No bullet list
No bullet list
No bullet list
Text sizes classes when typography size doesn't match the default HTML tag.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Text weight classes when typography weight doesn't match the default HTML tag.
Text style classes when typography style doesn't match the default HTML tag.
Text alignment classes when typography alignment doesn't match the default HTML tag.
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
This is a block quote
The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.
This is a link inside of a rich text
- List item
- List item
- List item
- List item
- List item
- List item
Manage your colors easily with global color schemes simply adding the color scheme class to the section you want it applied to.
Scheme 1
Text color
Scheme 2
Text color
Scheme 3
Text color
Scheme 4
Text color
Linkable labels that categorize or highlight information on cards, products and posts
icon-height-xxsmall
icon-height-xsmall
icon-height-small
icon-height-medium
icon-height-large
icon-height-xlarge
icon-height-custom1
icon-1x1-xxsmall
icon-1x1-xsmall
icon-1x1-small
icon-1x1-medium
icon-1x1-large
icon-1x1-xlarge
icon-1x1-custom1
HTML embed icons enable you to control icon color on hover.
icon-embed-xxsmall
icon-embed-xsmall
icon-embed-small
icon-embed-medium
icon-embed-large
icon-embed-xlarge
icon-embed-custom1
Large radius is applied to elements which are 1 or 2 columns in width.
Medium radius is applied to elements which are between 2 and 3 columns in width.
Small radius is applied to elements which are smaller than 4 columns in width.
Shadows allow you to add depth and realism to designs by positioning elements on a z-axis.
Gut zu wissen
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.
<div class="hint-box">
<div class="hint-icon-holder">
<div class="icon-embed-xsmall w-embed">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
aria-hidden="true"
role="img"
class="iconify iconify--ic"
width="100%"
height="100%"
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 24 24"
>
<path
fill="currentColor"
d="M7 20h4c0 1.1-.9 2-2 2s-2-.9-2-2m-2-1h8v-2H5zm11.5-9.5c0 3.82-2.66 5.86-3.77 6.5H5.27c-1.11-.64-3.77-2.68-3.77-6.5C1.5 5.36 4.86 2 9 2s7.5 3.36 7.5 7.5m-2 0C14.5 6.47 12.03 4 9 4S3.5 6.47 3.5 9.5c0 2.47 1.49 3.89 2.35 4.5h6.3c.86-.61 2.35-2.03 2.35-4.5m6.87-2.13L20 8l1.37.63L22 10l.63-1.37L24 8l-1.37-.63L22 6zM19 6l.94-2.06L22 3l-2.06-.94L19 0l-.94 2.06L16 3l2.06.94z"
></path>
</svg>
</div>
</div>
<div class="hint-box-title-holder">
<p class="text-weight-bold">Gut zu wissen</p>
</div>
<p
id="w-node-e693e6fa-6919-1a2a-dcca-986e2f6e6348-bf73efe3">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo
ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et
<a href="#" target="_blank"><strong>magnis</strong></a> dis parturient
montes, nascetur ridiculus mus. Donec quam felis, ultricies nec,
pellentesque eu, pretium quis, sem.
</p>
</div>
Tipp
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.
<div class="hint-box2">
<div class="hint-icon-holder">
<div class="icon-embed-xsmall w-embed">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
aria-hidden="true"
role="img"
class="iconify iconify--ic"
width="100%"
height="100%"
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 24 24"
>
<path
fill="currentColor"
d="M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8"
></path>
</svg>
</div>
</div>
<div class="hint-box-title-holder">
<p class="text-weight-bold">Tipp</p>
</div>
<p id="w-node-_099ac3e5-2ebb-81b8-cac8-68f3eead6593-bf73efe3">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo
ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et
<a href="#" target="_blank"><strong>magnis</strong></a> dis parturient
montes, nascetur ridiculus mus. Donec quam felis, ultricies nec,
pellentesque eu, pretium quis, sem.
</p>
</div>
Gut zu wissen
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.
Tipp
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.
Schnellübersicht
Bullet Point 1: Lorem ipsum dolor
Bullet Point 2: Lorem ipsum dolor
Bullet Point 3: < CHF 5000
Bullet Point 4: 10 Jahre
Bullet Point 5: 25%
Bullet Point 6: Lorem ipsum dolor
%2520(1).png)
%2520(1)%2520(1).jpeg)
.jpeg)
.jpeg)
.jpeg)
1. Berechnung der überbaubaren Fläche
| Grundstücksgrösse | 600 m2 | |
| x | Geschossflächenzahl (GFZ) | 1,2 |
| davon bebaubare Wohnfläche (ca. 80%) | 576 m2 |
2. Berechnung der Wohnfläche
| Grundstücksgrösse | 600 m2 | |
| x | Geschossflächenzahl (GFZ) | 1,2 |
| = | Maximale bebaubare Fläche | 720 m2 |
| davon bebaubare Wohnfläche (ca. 80%) | 576 m2 |
3. Berechnung des Bauträgerergebnis vor Grundstückskosten
| Grundstücksgrösse | 600 m2 | |
| x | Geschossflächenzahl (GFZ) | 1,2 |
| = | Maximale bebaubare Fläche | 720 m2 |
| = | Maximale bebaubare Fläche | 720 m2 |
| davon bebaubare Wohnfläche (ca. 80%) | 576 m2 |