|
|
| Regel 1: |
Regel 1: |
| − | == Kolommen à la S.Perquins ontwerp ==
| |
| − | <div style="display: flex; width: 100%; padding: 0; box-sizing: border-box; gap: 0;">
| |
| − | <!-- Eerste kolom -->
| |
| − | <div style="flex: 1; padding: 0;">
| |
| − | {| style="width: 100%; text-align: center; font-size: 1.0em; border-collapse: collapse; height: 100%;"
| |
| − | |-
| |
| − | | style="background-color: #87CEEB; padding: 5px; border-top-left-radius: 10px; border-top-right-radius: 10px;" | <span style="font-size: 1.6em; color: #1C3D5F; vertical-align: middle;">'''Kolom 1'''</span>
| |
| − | |-
| |
| − | | style="background-color: #B0E0E6; padding: 5px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;" | Lorem ipsum dolor sit amet, consectetur adipiscing elit. In consectetur bibendum libero quis luctus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent elit erat, tincidunt ut dolor in, aliquet porta sapien. Cras in odio ut tellus semper ultrices vel at magna. Ut condimentum mi at congue vulputate. Cras lacinia erat eu dictum lobortis. Phasellus et vulputate felis, sit amet malesuada orci. Mauris elit libero, vestibulum sit amet volutpat nec, rutrum eget nisi. Donec vehicula, nisl in congue posuere, tortor dolor ullamcorper ante, vel tempor enim lacus a nibh.
| |
| − | |}
| |
| − | </div>
| |
| − |
| |
| − | <!-- Tweede kolom -->
| |
| − | <div style="flex: 1; padding: 0;">
| |
| − | {| style="width: 100%; text-align: center; font-size: 1.0em; border-collapse: collapse; height: 100%;"
| |
| − | |-
| |
| − | | style="background-color: #FFCC66; padding: 5px; border-top-left-radius: 10px; border-top-right-radius: 10px;" | <span style="font-size: 1.6em; color: #7F5F33; vertical-align: middle;">'''Kolom 2'''</span>
| |
| − | |-
| |
| − | | style="background-color: #FFDD99; padding: 5px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;" | Donec id lacinia diam, id pretium ante. Aliquam at aliquet ipsum. Sed ut nisl justo. Aliquam a nisi nec elit aliquam tristique ac at augue. Cras a sapien erat. Donec posuere vulputate turpis in egestas. Aliquam elementum pretium mi sed aliquam. Fusce finibus volutpat velit non tempor. Duis a imperdiet lectus.
| |
| − | |}
| |
| − | </div>
| |
| − | </div>
| |
| − | === twee===
| |
| − | <div style="display: flex; width: 100%; padding: 0; box-sizing: border-box; gap: 0;">
| |
| − | <!-- Eerste kolom -->
| |
| − | <div style="flex: 1; display: flex; flex-direction: column; padding: 0; background-color: #B0E0E6; border-radius: 10px; box-sizing: border-box;">
| |
| − | <div style="background-color: #87CEEB; padding: 5px; text-align: center; border-top-left-radius: 10px; border-top-right-radius: 10px;">
| |
| − | <span style="font-size: 1.6em; color: #1C3D5F; vertical-align: middle;">'''Kolom 1'''</span>
| |
| − | </div>
| |
| − | <div style="flex: 1; padding: 5px; text-align: left;">
| |
| − | Lorem ipsum dolor sit amet, consectetur adipiscing elit. In consectetur bibendum libero quis luctus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent elit erat, tincidunt ut dolor in, aliquet porta sapien. Cras in odio ut tellus semper ultrices vel at magna. Ut condimentum mi at congue vulputate. Cras lacinia erat eu dictum lobortis. Phasellus et vulputate felis, sit amet malesuada orci. Mauris elit libero, vestibulum sit amet volutpat nec, rutrum eget nisi. Donec vehicula, nisl in congue posuere, tortor dolor ullamcorper ante, vel tempor enim lacus a nibh.
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − | <!-- Tweede kolom -->
| |
| − | <div style="flex: 1; display: flex; flex-direction: column; padding: 0; background-color: #FFDD99; border-radius: 10px; box-sizing: border-box;">
| |
| − | <div style="background-color: #FFCC66; padding: 5px; text-align: center; border-top-left-radius: 10px; border-top-right-radius: 10px;">
| |
| − | <span style="font-size: 1.6em; color: #7F5F33; vertical-align: middle;">'''Kolom 2'''</span>
| |
| − | </div>
| |
| − | <div style="flex: 1; padding: 5px; text-align: left;">
| |
| − | Donec id lacinia diam, id pretium ante. Aliquam at aliquet ipsum. Sed ut nisl justo. Aliquam a nisi nec elit aliquam tristique ac at augue. Cras a sapien erat. Donec posuere vulputate turpis in egestas. Aliquam elementum pretium mi sed aliquam. Fusce finibus volutpat velit non tempor. Duis a imperdiet lectus.
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − | === drie ===
| |
| − | <div style="display: flex; width: 100%; padding: 0; box-sizing: border-box; gap: 10px;">
| |
| − | <!-- Eerste kolom -->
| |
| − | <div style="flex: 1; background-color: #B0E0E6; border-radius: 10px; display: flex; flex-direction: column; padding: 0; box-sizing: border-box;">
| |
| − | <!-- Header -->
| |
| − | <div style="background-color: #87CEEB; padding: 10px; text-align: center; border-top-left-radius: 10px; border-top-right-radius: 10px;">
| |
| − | <span style="font-size: 1.6em; color: #1C3D5F;">'''Kolom 1'''</span>
| |
| − | </div>
| |
| − | <!-- Inhoud -->
| |
| − | <div style="flex: 1; padding: 10px; text-align: left;">
| |
| − | Lorem ipsum dolor sit amet, consectetur adipiscing elit. In consectetur bibendum libero quis luctus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent elit erat, tincidunt ut dolor in, aliquet porta sapien. Cras in odio ut tellus semper ultrices vel at magna. Ut condimentum mi at congue vulputate. Cras lacinia erat eu dictum lobortis. Phasellus et vulputate felis, sit amet malesuada orci. Mauris elit libero, vestibulum sit amet volutpat nec, rutrum eget nisi. Donec vehicula, nisl in congue posuere, tortor dolor ullamcorper ante, vel tempor enim lacus a nibh.
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − | <!-- Tweede kolom -->
| |
| − | <div style="flex: 1; background-color: #FFDD99; border-radius: 10px; display: flex; flex-direction: column; padding: 0; box-sizing: border-box;">
| |
| − | <!-- Header -->
| |
| − | <div style="background-color: #FFCC66; padding: 10px; text-align: center; border-top-left-radius: 10px; border-top-right-radius: 10px;">
| |
| − | <span style="font-size: 1.6em; color: #7F5F33;">'''Kolom 2'''</span>
| |
| − | </div>
| |
| − | <!-- Inhoud -->
| |
| − | <div style="flex: 1; padding: 10px; text-align: left;">
| |
| − | Donec id lacinia diam, id pretium ante. Aliquam at aliquet ipsum. Sed ut nisl justo. Aliquam a nisi nec elit aliquam tristique ac at augue. Cras a sapien erat. Donec posuere vulputate turpis in egestas. Aliquam elementum pretium mi sed aliquam. Fusce finibus volutpat velit non tempor. Duis a imperdiet lectus.
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| | == Welkomstbericht == | | == Welkomstbericht == |
| | <div style="width: 100%; background-color: #d0f0f9;border-width : 4px; border-style:solid; border-color:#d0f0f9; text-align: center; border-bottom: 2px solid #d0f0f9; border-top-left-radius: 50px; border-top-right-radius: 50px; border-bottom-left-radius: 50px; border-bottom-right-radius: 50px; font-family: Times New Roman"> | | <div style="width: 100%; background-color: #d0f0f9;border-width : 4px; border-style:solid; border-color:#d0f0f9; text-align: center; border-bottom: 2px solid #d0f0f9; border-top-left-radius: 50px; border-top-right-radius: 50px; border-bottom-left-radius: 50px; border-bottom-right-radius: 50px; font-family: Times New Roman"> |
