Problems with customising Envato FullPage - how to add more horizontally-sliding sections? They don'

I’m still a newbie to coding. I’m trying to customise Envato FullPage so it has multiple horizontally and vertically-scrolling slides.

Here, I’ve tried simply copying the horizontally-scrolling section (adjusting IDs and section titles, as I did), and pasting it after the preceding pages.

I’ve been searching through the javaScript and CSS for where the IDs are referring, but I can’t find it. Can you please help me? I’m completely fumbling in the dark.

Ideally, I’d like something like the following:

“Home Page” ↓ “About 1” → “About 2” ↓ “Gallery 1” → “Gallery 2” → “Gallery 3” → “Gallery 4” ↓ “Shop” ↓ “Contact” ↓ “Blog”

BTW, the original Envato version I am using is written differently to other versions around. I like the visual format of this one.

(NB below code is edited for relevance)

<head>  
<link rel="stylesheet" type="text/css" href="fullpage.css" />
<link rel="stylesheet" type="text/css" href="examples.css" />
<style> 
</head>
<body>

<div id="fullpage">
<div class="section " id="section0">
    <video id="myVideo" loop muted data-autoplay>
        <source src="imgs/wbybg.mp4" type="video/mp4">
        <source src="imgs/wbybg.webm" type="video/webm"</video>

/* These first pages work fine:
* --------------------------------------- */        
<div class="layer"><h1>Home Page over video bg</h1></div></div>

<div class="section" id="section1">             
<div class="slide" id="slide1"><h1>1st horizontal slide</h1></div>      
<div class="slide" id="slide2"><h1>2nd horizontal slide</h1></div></div>

<div class="section" id="section2"><h1>Vertically-Scrolling Single Page<br>after horizontal section</h1></div></div>

/* I've added the next section - unsuccessfully
* --------------------------------------- */    
<div class="section" id="section3">
<div class="slide" id="slide4"><h1>Horizontal Sliders Section #2 <br>1st horizontal slide</h1></div>
<div class="slide" id="slide5"><h1>Horizontal Sliders Section #2 <br>2nd horizontal slide</h1></div></div>


<script type="text/javascript" src="fullpage.js"></script>
<script type="text/javascript" src="examples.js"></script>

<script type="text/javascript">
var myFullpage = new fullpage('#fullpage', {
    verticalCentered: true,
    sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE']
});
</script>

</body>