<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<link href='https://fonts.googleapis.com/css?family=Oswald:400,700,300' rel='stylesheet' type='text/css'>
<section class="intro">
<div class="intro-block">
<div class="centerfold-wrap">
<div class="hex-master-wrap">
<div class="hover-notify">Hover Me!</div>
<div class="grid-1">
<div class="hex-wrap backend" data-title="BACKEND" data-content="backend-desc" data-color="#333333">
<div class="hex-init"></div>
<div class="hex-borders">
<div class="border-1"></div>
<div class="border-2"></div>
<div class="border-3"></div>
</div>
<div class="label"><img src="https://i.imgur.com/3XjDZGJ.png"/></div>
<div class="hexagon">
<div class="hex-inner-1">
<div class="hex-inner-2"></div>
</div>
</div>
</div>
<div class="hex-wrap frontend" data-title="FRONTEND" data-content="frontend-desc" data-color="#16A085">
<div class="hex-init"></div>
<div class="hex-borders">
<div class="border-1"></div>
<div class="border-2"></div>
<div class="border-3"></div>
</div>
<div class="label"><img src="https://i.imgur.com/f8WewU1.png"/></div>
<div class="hexagon">
