|
|
Line 186: |
Line 186: |
| <div class="cart"> | | <div class="cart"> |
| | | |
− | <div class="container-fluid blue-bg">
| + | |
− | <div class="container">
| + | |
− | <h2 class="pb-3 pt-2" style="color:#C27099;"><img style="width:50%;" src="https://static.igem.org/mediawiki/2019/c/cf/T--DUT_China_B--HPbanner1.svg">Contact lab with society</h2>
| + | |
− | <!--first section-->
| + | |
− | <div class="row align-items-center how-it-works">
| + | |
− | <div class="col-2 text-center bottom">
| + | |
− | <div class="circle">1</div>
| + | |
− | </div>
| + | |
− | <div class="col-6">
| + | |
− | <h5 style="color:#ED8D8D;">Fully Responsive</h5>
| + | |
− | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed porttitor gravida aliquam. Morbi orci urna, iaculis in ligula et, posuere interdum lectus.</p>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <!--path between 1-2-->
| + | |
− | <div class="row timeline">
| + | |
− | <div class="col-2">
| + | |
− | <div class="corner top-right"></div>
| + | |
− | </div>
| + | |
− | <div class="col-8">
| + | |
− | <hr/>
| + | |
− | </div>
| + | |
− | <div class="col-2">
| + | |
− | <div class="corner left-bottom"></div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <!--second section-->
| + | |
− | <div class="row align-items-center justify-content-end how-it-works">
| + | |
− | <div class="col-6 text-right">
| + | |
− | <h5 style="color:#ED8D8D;">Using Bootstrap</h5>
| + | |
− | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed porttitor gravida aliquam. Morbi orci urna, iaculis in ligula et, posuere interdum lectus.</p>
| + | |
− | </div>
| + | |
− | <div class="col-2 text-center full">
| + | |
− | <div class="circle">2</div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <!--path between 2-3-->
| + | |
− | <div class="row timeline">
| + | |
− | <div class="col-2">
| + | |
− | <div class="corner right-bottom"></div>
| + | |
− | </div>
| + | |
− | <div class="col-8">
| + | |
− | <hr/>
| + | |
− | </div>
| + | |
− | <div class="col-2">
| + | |
− | <div class="corner top-left"></div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | | + | |
− | <!--second section-->
| + | |
− | <div class="row align-items-center how-it-works">
| + | |
− | <div class="col-2 text-center full">
| + | |
− | <div class="circle">3</div>
| + | |
− | </div>
| + | |
− | <div class="col-6">
| + | |
− | <h5 style="color:#ED8D8D;">Fully Responsive</h5>
| + | |
− | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed porttitor gravida aliquam. Morbi orci urna, iaculis in ligula et, posuere interdum lectus.</p>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <!--path between 2-3-->
| + | |
− | <div class="row timeline">
| + | |
− |
| + | |
− | <div class="col-2">
| + | |
− | <div class="corner top-right"></div>
| + | |
− | </div>
| + | |
− | <div class="col-8">
| + | |
− | <hr/>
| + | |
− | </div>
| + | |
− | <div class="col-2">
| + | |
− | <div class="corner left-bottom"></div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <div class="row align-items-center justify-content-end how-it-works">
| + | |
− | <div class="col-6 text-right">
| + | |
− | <h5 style="color:#ED8D8D;">Using Bootstrap</h5>
| + | |
− | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed porttitor gravida aliquam. Morbi orci urna, iaculis in ligula et, posuere interdum lectus.</p>
| + | |
− | </div>
| + | |
− | <div class="col-2 text-center top">
| + | |
− | <div class="circle">4</div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
| </div> | | </div> |
| <hr> | | <hr> |