Cacher is the code snippet organizer for pro developers

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />

html a:hover {
  text-decoration: none;
  color: white;
}

html a {
  text-decoration: none;
  color: white;
}

#brand {
  padding: 0px 15px 10px;
}

html div {
  font-family: Monospace;
}

#nav {
  background-color: black;
  color: white;
}

#nav li {
  list-style: none;
  display: inline-block;
  padding: 15px 15px 0px 15px;
  text-decoration: none;
}

#nav li a:hover {
  color: black;
}

#nav li a {
  text-decoration: none;
  color: white;
}

#home {
  background: url("http://i.imgur.com/VjvlNgO.jpg") no-repeat center center fixed;
  background-size: cover;
  height: 855px;
  padding: 20%;
  color: white;
  text-decoration: none;
}

.bg-overlay {
  background: rgba(0, 0, 0, 0.3);
  height: 855px;
}

#buttonRow {
  padding: 12px;
  align: center;
}

#about {
  background: url("http://i.imgur.com/BXs3zAz.jpg") no-repeat center center fixed;
  background-size: cover;
  height: 855px;
  padding: 10% 20%;
  color: white;
}

.bg-overlay2 {
  margin-top: -50px;
  background: rgba(255, 255, 255, 0.2);
  height: 650px;
}

#profilePic {
  border: solid 1px;
  border-radius: 50%;
  border-color: white;
  margin: 20px;
}

#projects {
  background-image: url("http://i.imgur.com/iqXzFWb.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-attachement: fixed;
  background-position: center center;
  height: 855px;
  padding: 5% 20%;
  color: black;
}

.project-container {
  border: solid 1px;
  margin: 10px
}

#footer {
  background-color: black;
  min-height: 50px;
  padding: 25px 20px;
  color: white;
}

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<div class="container-fluid">
  
  
  
    <nav id="nav" class="navbar navbar-default navbar-fixed-top">
      <div class="navbar-header" style="display: inline-block">
        <h3 id="brand">Martin Mehl</h3>
      </div>
      <div>
        <ul class="nav navbar-right nav-inverted">
          <li><a href="#home">Home</a></li>
          <li><a href="#about">Über mich</a></li>
          <li><a href="#projects">Projekte</a></li>
        </ul>
      </div>
    </nav>
  
  
  
<!-- HOME SECTION -->
  <a name="home">
    <div class="bg-overlay">
      <div id="home" class="row">
        <h1 class="section-heading">@mehlleniumfalke</h1>

        <p>Web Developer, Nerd, Gamer</p>

        <div id="buttonRow" class="row">
          <p>Follow me:</p>
          <a target="_blank" href="https://github.com/mehlleniumfalke"><div class="btn btn-default">Github</div></a>
          <a target="_blank" href="https://plus.google.com/u/0/102324008643326442392"><div class="btn btn-danger">Google+</div></a>
          <a target="_blank" href="https://twitter.com/mehl89"><div class="btn btn-info">Twitter</div></a>
          <a target="_blank" href="https://www.facebook.com/m.mehl.md"><div class="btn btn-primary">Facebook</div></a>
        </div>
      </div>
    </div>
  </a>
  
 <!-- ABOUT SECTION -->
  <a name="about">
    <div class="bg-overlay2">
      <div id="about" class="row">

        <div class="col-xs-8">
          <h1>Über mich</h1>
          <p>Ich bin 26 Jahre alt, aus Magdeburg, Web Entwickler und mache eine Ausbildung zum Fachinformatiker für Anwendugnsentwicklung bei @webvariants in Magdeburg. Neben der Ausbildung arbeite ich als Freelancer in der IT Branche und realisiere auch Systemintegratorische Projekte wie das Errichten von Netzwerken in privaten Haushalten, kleinen Unternehmen oder Vereinen. Ebenfalls übernehme ich die Konfiguration von Einzelsystemen für Privatanwender. Wenn sie eine Anfrage an mich richten möchten schreiben sie eine E-Mail an: martin.mehl@webvariants.de  </p>
        </div>
        <div class="col-xs-4">
          <img id="profilePic" class="img-responsive" src="http://i.imgur.com/x46V6vX.jpg" />
        </div>
      </div>
    </div>
  </a>
  
  
<!-- PROJECTS SECTION -->
  <a name="projects">
    <div class="bg-overlay3">
      <div id="projects" class="row">
        
        <h1>Projekte</h1>
        <p>Hier sind einige Showcases und Demos von meiner Arbeit als Web Entwickler.</p>
        
        <div class="container">
          <div class="row">
            <div class="project-container col-xs-4">
              <h1>clocky WebApp</h1>
              <p>Eine WebApp zur Buchung von Arbeitszeit, geordnet nach Projekten und Tags.<br><br> Technologien: Angular, Bootstrap, Firebase</p>
              <br>
              <div class="col-xs-6">
                <button class="btn btn-default">Demo</button>
              </div>
              <div class="col-xs-6">
                <p>Letzte Aktivität: 30.11.2015</p>
              </div>
           </div>
         

            <div class="col-xs-4 project-container">
              <h1>Scrum Chrome Extension</h1>
              <p>Chrome Extension für die Anzeige & Verteilung von Scrum Points auf trello.com.<br><br> Technologien: jQuery, Javascript, CSS, Firebase</p>
              <br>
              <div class="col-xs-6">
              <button class="btn btn-default">Demo</button>
              </div>
              <div class="col-xs-6">
              <p>Letzte Aktivität: 15.11.2015</p>
              </div>
            </div>        
          </div>
   
          <div class="row">
            <div class="project-container col-xs-4">
              <h1>Portfolio Page</h1>
              <p>Persönliche Portfolio Webseite mit Demos von meiner Arbeit als Web Developer.<br><br> Technologien: HTML, CSS, Bootstrap</p>
              <br>
              <div class="col-xs-6">
              <button class="btn btn-default" >Gist @Github</button>
              </div>
              <div class="col-xs-6">
              <p>Letzte Aktivität: 06.12.2015</p>
              </div>
            </div>
            <div class="col-xs-4 project-container">
              <h1>w8er - erscheint demnächst...</h1>
              <p>clocky 2.0 mit einem neuem FrontEnd, mehr Möglichkeiten und Features für Nutzer und einem Admin Bereich.<br><br> Technologien: Angular, Angular-Material, Bootstrap, Firebase </p>
              <br>
              <div class="col-xs-6">
              <button class="btn btn-default" disabled="true">Demo</button>
              </div>
              <div class="col-xs-6">
              <p>Letzte Aktivität:  </p><br>
              </div>
            </div>        
          </div>
        </div>
      </div>
    </div>
  </a>
  <div id="footer" class="row container-fluid">
    <div class="col-xs-12" align="center">
      <p>c by mehlleniumfalke</p>
    </div>
  </div>
</div>