.sidebar-container{grid-area:sidebar;padding:10px;background-color:#dfdfdf;border-right:1px solid #ddd;font-family:Verdana,sans-serif;font-size:15px;transition:transform .3s ease-in-out}@media(max-width:768px){.sidebar-container{position:fixed;top:0;left:0;bottom:0;width:250px;z-index:100;transform:translate(-100%);box-shadow:2px 0 5px #0003;overflow-y:auto;-webkit-overflow-scrolling:touch}.sidebar-container.open{transform:translate(0)}.sidebar-header{font-size:1.5em;margin-bottom:15px}}.sidebar-header{color:#006400;font-size:2em;margin-top:-5px;margin-bottom:20px}.sidebar-section-title{display:block;text-decoration:none;color:#3d3d3d;border-top:1px solid silver;border-bottom:1px solid silver;margin-bottom:-1px;margin-top:6px;font-size:1.17em;font-weight:700}.sidebar-section-title:hover{background-color:#eee}.sidebar-section-title.active{background-color:#e8e8e8}.sidebar-link{display:block;color:#393;text-decoration:none;font-weight:600;font-family:verdana,arial,helvetica,sans-serif;padding:2px 0}.sidebar-link:hover{background-color:#eee}.sidebar-link.active{background-color:#e8e8e8;color:#111}.sidebar-sublink{display:block;color:#393;text-decoration:none;font-weight:500;font-family:verdana,arial,helvetica,sans-serif;padding:2px 0 2px 20px;font-size:.9em}.sidebar-sublink:hover{background-color:#eee}.sidebar-sublink.active{background-color:#f0f0f0;font-weight:700}.lesson-container{max-width:1200px;margin:0 auto;padding:20px;background-color:#fff;font-family:Verdana,sans-serif;font-size:15px;line-height:1.5;color:#333;box-sizing:border-box}.lesson-header{margin-bottom:20px}.lesson-content h1{color:#006400;font-size:2em;margin-top:-5px;border-bottom:1px solid #eee;padding-bottom:10px}.lesson-content h2{color:#006400;font-size:1.5em;margin-top:30px}.lesson-content h3{color:#3d3d3d;border-top:1px solid silver;border-bottom:1px solid silver;padding:5px 0;margin-top:20px;margin-bottom:10px}.lesson-content p{margin-bottom:1em;text-align:justify}.lesson-content ul,.lesson-content ol{margin-left:20px;margin-bottom:1em}.lesson-content li{margin-bottom:5px}.opdracht{color:#e04f2f;background-color:#ebebeb;border:1px solid #e04f2f;margin:2em 20px;padding:15px;border-radius:4px}.valop{color:#fff;background:#006400;border:1px solid black;margin:2em 20px;padding:10px;border-radius:4px}@media(max-width:768px){.lesson-container{padding:15px 10px}.lesson-content h1{font-size:1.6em}.lesson-content h2{font-size:1.3em}.lesson-content h3{font-size:1.1em}.opdracht,.valop{margin:1.5em 0;padding:12px}pre.code-block{padding:12px;font-size:13px}.lesson-content p{text-align:left}}.valop b{color:#fff}pre.code-block{background-color:#1e1e1e;color:#d4d4d4;padding:16px;border-radius:8px;font-family:Consolas,Monaco,Courier New,monospace;font-size:14px;line-height:1.5;overflow-x:auto;margin:15px 0;box-shadow:0 4px 6px #0000004d;border-left:4px solid #4CAF50}.code-keyword{color:#569cd6}.code-function{color:#dcdcaa}.code-comment{color:#6a9955;font-style:italic}.code-string{color:#ce9178}.code{color:#000;background:#ebebeb;border:1px solid gray;padding:2px 4px;border-radius:3px;font-family:monospace}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}body.no-scroll{overflow:hidden}.layout-container{display:grid;grid-template-columns:280px 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"header header" "sidebar main" "footer footer";min-height:100vh}.main-content{grid-area:main;padding:0}.footer-container{grid-area:footer;padding:10px 20px;text-align:center;background-color:#09650b;color:#b1d1b1}.header-inner{width:100%;max-width:1200px;display:flex;align-items:center;justify-content:center;padding:10px 50px;position:relative;transition:padding .3s ease}.hamburger-button{display:none}.main-overlay{display:none;position:fixed;inset:0;background:#00000080;z-index:90}@media(max-width:768px){.layout-container{grid-template-columns:100%;grid-template-areas:"header" "main" "footer"}.main-content{padding:10px;overflow-x:hidden}.header-inner{padding:20px 50px;min-height:80px}.hamburger-button{display:flex;align-items:center;justify-content:center;z-index:101;background:#0000004d!important;border-radius:4px;width:40px;height:40px}.layout-container.menu-open .main-overlay{display:block}}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}