Positioning titles and img

How do I position "mean design" to be on top of the logo and the description below the logo? the whole thing should be center vertically and horizontally It looks like this now Heres the code now .title { text-align: center; position: absolute; color: white; top: 50%; left: 50%; transform: translate(-50%, -50%); } #logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 350px; } <div class="cover-wrapper"> <div class="title"> <h1 id="mean">Mean Design.</h1> <img class="img-responsive" id="logo" src="MeanDesignLogo.png"> <h6 id="des">ui/ux • web design • graphic design • illustration</h6> </div> </div> <!-- cover wrapper -->