@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; }

            }

        }

    }