Custom Order - Ginger - Share Train

<style type="text/css">
    @import url('https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap');

    .container{
        width:500px;
        height:auto;
        padding:20px;
        background-image: url('https://i.imgur.com/VTaiuzR.jpg');
        border: double 20px #87649a;
    }

    .titleBox{
        width: 500px;
        background: #dfdcef;
        margin-bottom: 10px;
        font-family: Playfair Display;
        color: #87649a;
        font-size: 34px;
        line-height: 34px;
        text-transform: uppercase;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .firstBox{
        width: 200px;
        height: 150px;
        background: green;
        display: inline-block;
        vertical-align: top;
        margin-bottom: 10px;
        margin-right: 10px;
    }

    .secondBox{
        width:286px;
        height:150px;
        background: #fff;
        display: inline-block;
        vertical-align: top;
        margin-bottom: 10px;
    }

    .thirdBox{
        width: 500px;
        background: #6d70b0;
        display: inline-block;
        vertical-align: top;
        margin-bottom: 10px;
        color: #dfdcef;
        font-family: 'Playfair Display';
        font-size: 30px;
        text-transform: uppercase;
        line-height: 30px;
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .fourthBox{
        width:500px;
        height:130px;
        background: green;
        display: inline-block;
        vertical-align: top;
        margin-bottom: 10px;
    }

    .fifthBox{
    width: 217px;
    height: 176px;
    background: white;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: justify;
    padding-left: 5px;
    padding-right: 5px;
    overflow: auto;
    font-family: 'Playfair Display';
    }

    .sixthBox{
        width:259px;
        height:176px;
        background: green;
        display: inline-block;
        vertical-align: top;
        margin-bottom: 10px;
    }

    .seventhBox{
    width: 253px;
    height: 322px;
    background: white;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 10px;
    margin-right: 10px;
    overflow: auto;
    }

    .eighthBox{
        width:233px;
        height:322px;
        background: #fff;
        display: inline-block;
        vertical-align: top;
        margin-bottom: 10px;
        overflow: auto;
    }

    .ninethBox{
        width:233px;
        height:322px;
        background: #fff;
        display: inline-block;
        vertical-align: top;
        margin-right: 10px;
        margin-bottom: 10px;
        overflow: auto
    }

    .tenthBox{
        width:253px;
        height:322px;
        background: white;
        display: inline-block;
        vertical-align: top;
        margin-bottom: 10px;
        overflow: auto;
    }

    a.allLinks:link, a.allLinks:visited {
        background-color: #c5b0d2;
        color: white;
        padding: 14px 25px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-family: Playfair Display;
        text-transform: uppercase;
        letter-spacing: 3px;
}
    a.allLinks:hover{
        color:#000;
    }

    a.navLinks:link, a.navLinks:visited {
    background-color: #c5b0d2;
    color: white;
    padding: 8px 3px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-family: Playfair Display;
    text-transform: uppercase;
    letter-spacing: 3px;
    width: 132px;
    margin-bottom: 3px;
}
    a.navLinks:hover{
        color:#000;
    }

    h1{
        margin: 0;
        text-align: center;
        text-transform: uppercase;
        font-weight: 100;
        font-size: 21px;
        background: #7d76b3;
        padding-top: 10px;
        padding-bottom: 10px;
        color: #fff;
        margin-bottom: 10px;
    }

    ::-webkit-scrollbar {display:none;}
</style>
<center>
<div class="container">
    <div class="titleBox">Dark Halo Affiliates Train</div>
    <div class="firstBox"><img src="https://i.imgur.com/ORBvua7.png"></div>
    <div class="secondBox">
        <h1>Find Our Content</h1>
        <a class="navLinks" href="https://www.roleplayer.me/home.php">Home</a>
        <a class="navLinks" href="">Message</a>
        <a class="navLinks" href="">Comment</a>
        <a class="navLinks" href="https://www.roleplayer.me/view_blog.php?id=0000476325">Our Guidelines</a>
        <a class="navLinks" href="">Share our Site</a>
        <a class="navLinks" href="https://themesbygingerxo.tumblr.com/">Our Tumblr</a>
    </div>
    <div class="thirdBox">This is where a quote will go</div>
    <div class="fourthBox"><img src="https://i.imgur.com/4ekqGpX.png"></div>
    <div class="fifthBox">
        <h1>About Us</h1>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. In nec quam blandit, consectetur sapien vitae, imperdiet magna. Ut at pulvinar nisi. Aenean lacus nulla, rhoncus a molestie ac, euismod ut magna. Donec pretium egestas tellus. Aenean ipsum nulla, commodo vitae ante sit amet, mollis consequat purus. Aenean in risus risus. Proin vitae convallis urna, nec hendrerit quam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
        <br><br>
        Vivamus urna nunc, vulputate et pellentesque vitae, finibus a ligula. Nullam finibus, metus at bibendum posuere, metus lacus suscipit felis, sit amet condimentum nisl neque id magna. Duis id semper orci. Suspendisse quis porttitor lectus. Cras fringilla dolor nec orci elementum imperdiet. Suspendisse ullamcorper feugiat urna ultrices ultrices. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Aenean aliquet posuere tortor. Vivamus vestibulum risus in neque lobortis auctor. Nullam eu lacus sit amet elit hendrerit sagittis ac a nulla. Sed ut viverra elit. Vivamus laoreet tristique odio id fringilla. Nunc feugiat pellentesque dui, varius dignissim metus tempor sit amet. Pellentesque cursus lorem feugiat arcu tempor mattis.
        <br><br>
        Morbi efficitur tellus eu nunc auctor, a volutpat lorem commodo. Curabitur convallis sit amet ante id mollis. Cras tristique ligula purus, in lobortis erat luctus vel. Nam auctor auctor bibendum. Proin auctor dolor ut arcu condimentum pellentesque. Integer luctus justo velit, sit amet iaculis nunc sodales non. Morbi rutrum commodo risus non porta. Duis ut efficitur sapien, vel iaculis nibh. Nam tincidunt libero eget massa accumsan aliquet. Mauris finibus, nulla id egestas aliquet, libero eros commodo felis, sit amet placerat velit nisi eu nunc. Aliquam malesuada sodales arcu et lobortis. Sed eget leo ipsum. Maecenas nec vehicula dui, ac elementum odio. Sed vel elementum magna, et fringilla leo.
        <br><br>
        Vivamus auctor elementum eros. Donec scelerisque est ut velit molestie eleifend. Quisque sed viverra est. Fusce at eros dictum, venenatis felis quis, bibendum lacus. Maecenas fringilla ipsum sit amet elit aliquam tincidunt. Duis placerat rhoncus efficitur. Integer vulputate lorem eu leo finibus tristique.
        <br><br>
        Vestibulum metus est, finibus et nisi id, lobortis tempor ex. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur ut mollis nulla. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aenean vitae neque mauris. Ut et elit ac eros euismod scelerisque. Morbi luctus justo id placerat congue. Nullam consequat pharetra lectus, et vestibulum ligula ullamcorper eget. Integer placerat neque sed nunc dignissim laoreet.

    </div>
    <div class="sixthBox"><img src="https://i.imgur.com/w5OZnPU.png"></div>
    <div class="seventhBox">
        <img src="https://i.imgur.com/EULMXy6.png">
    </div>
    <div class="eighthBox">
        <h1>Resource Sites</h1>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
        <a href="/" class="allLinks">Resource site</a>
    </div>
    <div class="ninethBox">
        <h1>Roleplay Groups</h1>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
        <a href="/" class="allLinks">Roleplay Groups</a>
    </div>
    <div class="tenthBox">
        <img src="https://i.imgur.com/0ZNOmxM.png">
    </div>
    <div class="thirdBox">This is where a quote will go</div>
</div>
</center>