@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
     #PortalPagina { width: 100%; position: relative; z-index: 0; font-family: "Poppins", sans-serif; background: #404241; color: white;
        img { width: 100%; }
        h1 { font-size: 30px; } 
        h2 { font-size: 25px; line-height: 30px; }
        p { font-size: 16px; line-height: 24px; }
        a { font-size: 16px; line-height: 30px; }
        
        .OmslagFoto { background: url(https://www.alternate.nl/download/b2c_nl/pic/merken/lenovo/2026/ThinkReeks/HeaderBG.jpg?v=1); text-align: center; padding: 200px; background-size: cover; 
            .Logo { width: 150px !important; }
            p { color: white; font-size: 30px; line-height: 50px; }
        }
        
        /* Menu */
        #PortalMenu { background: black !important; width: 60%; margin: -60px auto; 
            .navbar-collapse { justify-content: center; }
            .navbar-collapse .navbar-nav .nav-item { border-right: 3px solid #575757; padding: 0 10px; }
            .navbar-collapse .navbar-nav .nav-item:last-child { border: none; }
            .navbar-collapse .navbar-nav .nav-item a:hover { font-weight: bold; color: #e45c5a !important; }
            .navbar-collapse .navbar-nav .nav-item .nav-link { color: white; }
            .dropdown-item { padding: 8px 20px; }
            .container-fluid { flex-flow: row-reverse; align-items: start; }
            .navbar-toggler { background: white; }
        }
        
        /* Content */
        #Inleiding { text-align: center; background: black; 
            .SeoTekstvlak { padding: 70px 160px; }
        }
        
        #Series { padding: 50px; background: linear-gradient(45deg, #414242 0%, #6f7170 100%); 
            .row { background: #3c3d3d; height: stretch; margin-bottom: 50px; }
            div { padding: 0; height: stretch;}
            .SeoTekstvlak { padding: 30px !important;
                .Logo { width: 150px !important; margin-bottom: 20px; }
                a { background: #1670ad; padding: 10px 20px; color: white; border-radius: 4px; }
            }
            
            .carousel {
                img { height: stretch; object-fit: cover; }
                .carousel-indicators { place-items: end; }
                .carousel-indicators [data-bs-target] { width: 19px; height: 0; background: white; border-radius: 100%; }
                .carousel-control-prev-icon, .carousel-control-next-icon { transform: scale(1.5); }
            }
        }
        
    }

    @media screen and (max-width: 667px) { /* Mobile */
        #PortalPagina {
            h1 { font-size: 25px; }
            p { font-size: 14px; line-height: 23px;}
            .OmslagFoto { padding: 40px; }
            #Inleiding {
                .SeoTekstvlak { padding: 20px; }
                #PortalMenu { margin: 0px; .navbar-collapse .navbar-nav .nav-item { border-right: none; } }
            }
            #Series { padding: 30px; }
        }
    }

    @media screen and (min-width: 768px) and (max-width: 1032px) { /* Tablet */
        #PortalPagina {
            .OmslagFoto { padding: 110px; }
            #Inleiding {
                .SeoTekstvlak { padding: 70px 30px; }
            }
        }
    }