Difference between revisions of "Template:US AFRL CarrollHS/footer"

Line 3: Line 3:
 
<style>
 
<style>
  
.footer2 {
 
width: 100%;
 
bottom: 0px;
 
left: 0px;
 
height: auto;
 
position: relative;
 
background-color: #6975B9;
 
clear: both;
 
}
 
 
.footer2 p{
 
top: 20px;
 
bottom: 20px;
 
color: #001438;
 
}
 
 
.footer3 {
 
background-color: #001438;
 
height: auto;
 
}
 
 
.footer3 p {
 
top: 20px;
 
bottom: 20px;
 
color: #FFF;
 
 
}
 
  
 
</style>
 
</style>
  
<!-- Footer -->
+
<footer class="page-footer font-small cyan darken-3">
<footer class="page-footer font-small blue pt-4">
+
  
     <!-- Footer Links -->
+
     <!-- Footer Elements -->
     <div class="container-fluid text-center text-md-left">
+
     <div class="container">
  
       <!-- Grid row -->
+
       <!-- Grid row-->
 
       <div class="row">
 
       <div class="row">
  
 
         <!-- Grid column -->
 
         <!-- Grid column -->
         <div class="col-md-6 mt-md-0 mt-3">
+
         <div class="col-md-12 py-5">
 
+
           <div class="mb-5 flex-center">
           <!-- Content -->
+
          <h5 class="text-uppercase">Footer Content</h5>
+
          <p>Here you can use rows and columns here to organize your footer content.</p>
+
  
 +
            <!-- Facebook -->
 +
            <a class="fb-ic">
 +
              <i class="fa fa-facebook fa-lg white-text mr-md-5 mr-3 fa-2x"> </i>
 +
            </a>
 +
            <!-- Twitter -->
 +
            <a class="tw-ic">
 +
              <i class="fa fa-twitter fa-lg white-text mr-md-5 mr-3 fa-2x"> </i>
 +
            </a>
 +
            <!-- Google +-->
 +
            <a class="gplus-ic">
 +
              <i class="fa fa-google-plus fa-lg white-text mr-md-5 mr-3 fa-2x"> </i>
 +
            </a>
 +
            <!--Linkedin -->
 +
            <a class="li-ic">
 +
              <i class="fa fa-linkedin fa-lg white-text mr-md-5 mr-3 fa-2x"> </i>
 +
            </a>
 +
            <!--Instagram-->
 +
            <a class="ins-ic">
 +
              <i class="fa fa-instagram fa-lg white-text mr-md-5 mr-3 fa-2x"> </i>
 +
            </a>
 +
            <!--Pinterest-->
 +
            <a class="pin-ic">
 +
              <i class="fa fa-pinterest fa-lg white-text fa-2x"> </i>
 +
            </a>
 +
          </div>
 
         </div>
 
         </div>
 
         <!-- Grid column -->
 
         <!-- Grid column -->
 
        <hr class="clearfix w-100 d-md-none pb-3">
 
 
        <!-- Grid column -->
 
        <div class="col-md-3 mb-md-0 mb-3">
 
 
            <!-- Links -->
 
            <h5 class="text-uppercase">Links</h5>
 
 
            <ul class="list-unstyled">
 
              <li>
 
                <a href="#!">Link 1</a>
 
              </li>
 
              <li>
 
                <a href="#!">Link 2</a>
 
              </li>
 
              <li>
 
                <a href="#!">Link 3</a>
 
              </li>
 
              <li>
 
                <a href="#!">Link 4</a>
 
              </li>
 
            </ul>
 
 
          </div>
 
          <!-- Grid column -->
 
 
          <!-- Grid column -->
 
          <div class="col-md-3 mb-md-0 mb-3">
 
 
            <!-- Links -->
 
            <h5 class="text-uppercase">Links</h5>
 
 
            <ul class="list-unstyled">
 
              <li>
 
                <a href="#!">Link 1</a>
 
              </li>
 
              <li>
 
                <a href="#!">Link 2</a>
 
              </li>
 
              <li>
 
                <a href="#!">Link 3</a>
 
              </li>
 
              <li>
 
                <a href="#!">Link 4</a>
 
              </li>
 
            </ul>
 
 
          </div>
 
          <!-- Grid column -->
 
  
 
       </div>
 
       </div>
       <!-- Grid row -->
+
       <!-- Grid row-->
  
 
     </div>
 
     </div>
     <!-- Footer Links -->
+
     <!-- Footer Elements -->
  
 
     <!-- Copyright -->
 
     <!-- Copyright -->
Line 115: Line 59:
  
 
   </footer>
 
   </footer>
  <!-- Footer -->
 
 
<div class=footer2>
 
 
<p>Facebook</p>
 
<p>Twitter</p>
 
<p>Instagram</p>
 
<p>Youtube</p>
 
 
<div class="footer3">
 
<p>Follow our social media!</p>
 
</div>
 
 
</div>
 
 
  
 
</html>
 
</html>

Revision as of 14:14, 14 October 2018