beatmenu

<div class="logo"></div>

<center>

<a>Home</a>

<a>Work</a>

<a>Ego</a>

<a>Contact</a>

</center>

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300);

@font-face {

  font-family: gotham;

  src: url(Gotham-Light.otf);

}

body{

  margin:50px;

}

.logo {

  background: url(http://maracujaminds.de/images/logo3.svg)no-repeat center center; 

  height: 180px;

  margin:20px;

  background-size:  auto 100% ;

    -webkit-transition: all .2s ease;

  -moz-transition: all .2s ease;

  -o-transition: all .2s ease;

  -ms-transition: all .2s ease;

  transition: all .2s ease;

}

a {

  cursor:pointer;

  text-decoration: none;

  padding: 4px 8px;

  font-family: 'Open Sans', sans-serif;

  font-size: 13px;

  color: #222222;

  border-radius: .15em;

  transition: all .1s ease;

  box-sizing: border-box;

  display: inline-block;

  -webkit-border-radius: .2em;

          border-radius: .2em;

}

a:hover {

  background-color: #222222;

  color: #fff;

  box-shadow: 3px 3px 10px #000 inset;

}a:active {

  background-color: #222222;

  color: #fff;

  box-shadow: 3px 3px 10px #000 inset;

}