text under bootstrap element

Question

i want to position my bootstrap element under another:

this is my html code:

<!--Home-->
<section id="home" class="home">
    <div class="container">
            <h1 class="quote">Welcome.</h1>


    </div>
</section>

<!--Section 2 : OVer mij-->
<section id="about" class="about section-padding">
    <div class="container">
        <h1 class="home-heading">About</h1>
        <blockquote class="abouttext" class="">
            Welcome to our website. We are offering a custom website just for you!
            We can use bootstrap, HTML, css and javascript for your custom website.
            Just send your design and we will make the website just how you like it!
            Just tell us what you want, or give us a design. We'll make it just how you like.
        </blockquote>
    </div>
</section>
<!--Section 3: services-->
<section id="services" class="contact section-padding">
    <div class="container">
        <h1 class="home-heading">Our sevices</h1>

        <!--images gallery-->
        <br>
        <br>
        <br>
        <br>
        <br>
        <div class="row">
            <div class="col-md-4">
                <div class="thumbnail">
                    <a href="#">
                        <img src="http://placehold.it/350x150">
                        <div class="caption">
                            <p>Website #1</p>
                        </div>
                    </a>
                </div>
            </div>
            <div class="col-md-4">
                <div class="thumbnail">
                    <a href="#">
                        <img src="http://placehold.it/350x150">
                        <div class="caption">
                            <p>Website #3</p>
                        </div>
                    </a>
                </div>
            </div>
            <div class="col-md-4">
                <div class="thumbnail">
                    <a href="#">
                        <img src="http://placehold.it/350x150">
                        <div class="caption">
                            <p>Website #3</p>
                        </div>
                    </a>
                </div>
            </div>
        </div>

    </div>

This code has to be under the pictures above:

    <div class="container servicetext">
    <h1>We offer a selected amount of pre-made templates, but we can also make your own personal website.
        We can also upload your site to your webserver if you prefer that.It's all up to you.
    </h1>
    </div>
</section>

here is my css:

/*Main*/
.section-padding{
    padding-top:100px;
    padding-bottom: 100px;
}
/*home*/
.home {
    height:100vh;
    display:flex;
    justify-content: center;
    align-items: center;
    background-color:#0f1b07 ;
    text-align:center;
    color:white;
}

.home-heading {
    font-size:52px;
}
/*home quote*/
.quote {

    font-size: 50px;
}
/*about*/
.about {

    height:70vh;
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
    text-align:center;
    color:#0f1b07;
}
/*abouttext*/
.abouttext {

}
/*contact*/
.contact {

    display:flex;
    justify-content: center;
    align-items: center;
    background-color: #5c821a;
    text-align:center;
    color:white;

}

i'm using bootstrap 3.3.7. thanks in advance, hope my question is clear.

Answer 1

Whenever you want to stack in bootstrap you have to create another row:

<div class="row">
    <div class="col-md-4">
        <div class="thumbnail">
            <a href="#">
                <img src="http://placehold.it/350x150">
                <div class="caption">
                    <p>Website #1</p>
                </div>
            </a>
        </div>
    </div>
    <!-- more of that -->
</div>
<!-- something else -->
<div class="row">
    <div class="col-md-12">
        <div class="container servicetext">
            <h1>We offer a selected amount of pre-made templates, but we can also make your own personal website.
        We can also upload your site to your webserver if you prefer that.It's all up to you.
            </h1>
        </div>
    </div>
</div>