|
|
Regel 1: |
Regel 1: |
| /* Algemeen: basis layout fixen */
| |
| body {
| |
| font-size: 16px;
| |
| padding: 10px;
| |
| margin: 0;
| |
| background-color: #ffffff;
| |
| }
| |
|
| |
| /* Header styling */
| |
| #content h1.firstHeading {
| |
| font-size: 1.5rem;
| |
| text-align: center;
| |
| padding: 10px 0;
| |
| margin-bottom: 10px;
| |
| }
| |
|
| |
| /* Navigatie-menu optimaliseren */
| |
| #mw-panel {
| |
| display: none; /* Verberg sidebar op mobiel */
| |
| }
| |
|
| |
| #mw-head {
| |
| display: none; /* Verberg bovenste menu */
| |
| }
| |
|
| |
| /* Content container optimaliseren */
| |
| #content {
| |
| padding: 0 10px;
| |
| max-width: 100%;
| |
| }
| |
|
| |
| /* Tabellen responsief maken */
| |
| table {
| |
| width: 100% !important;
| |
| overflow-x: auto;
| |
| display: block;
| |
| }
| |
|
| |
| /* Afbeeldingen passend maken */
| |
| img {
| |
| max-width: 100%;
| |
| height: auto;
| |
| display: block;
| |
| margin: 0 auto;
| |
| }
| |
|
| |
| /* Footer aanpassen */
| |
| #footer {
| |
| font-size: 0.8rem;
| |
| text-align: center;
| |
| padding: 10px 0;
| |
| }
| |
|
| |
| /* Maak tekst op de hoofdpagina overzichtelijker */
| |
| .mainpage-box {
| |
| margin-bottom: 1rem;
| |
| padding: 10px;
| |
| background: #f8f8f8;
| |
| border-radius: 8px;
| |
| font-size: 0.95rem;
| |
| line-height: 1.5;
| |
| }
| |
|
| |
| @media screen and (max-width: 768px) { | | @media screen and (max-width: 768px) { |
| .tile-halves { | | .tile-halves { |
| display: flex; | | display: flex; |
| flex-direction: column !important; /* Stapel de blokken onder elkaar */ | | flex-direction: column !important; /* Stapel de blokken onder elkaar */ |
| gap: 20px; /* Optioneel: ruimte tussen de blokken */ | | gap: 20px; |
| } | | } |
|
| |
|
@media screen and (max-width: 768px) {
.tile-halves {
display: flex;
flex-direction: column !important; /* Stapel de blokken onder elkaar */
gap: 20px;
}
.tile-halves > * {
width: 100% !important; /* Laat elk blok de volle breedte gebruiken */
box-sizing: border-box;
}
}