


    .strich {
       position: relative;
       text-decoration: none;

        display:inline-block;
    }
    .strich:hover {

    }

   .strich:before {
        content: "";
        position: absolute;
        width: 50%;
        height: 3px;
        bottom: 0;
        top:35px;
        left: 25%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgba(22,159,215,1);

        visibility: hidden;
        -webkit-transition: all 0.4s ease-in-out 0s;
        -moz-transition: all 0.4s ease-in-out 0s;
        -o-transition: all 0.4s ease-in-out 0s;
        transition: all 0.4s ease-in-out 0s;
        -webkit-transform: scaleX(0);
        -moz-transform: scaleX(0);
        -o-transform: scaleX(0);
        transform: scaleX(0);
    }
    .strich:hover:before {
        visibility: visible;
        -webkit-transform: scaleX(1);
        -moz-transform: scaleX(1);
        -o-transform: scaleX(1);
        transform: scaleX(1);
    }


#hm   a  {
  color: #333333;
  text-decoration: none;
  position: relative;
}

#hm  a:after  {
  content: ''; /* content ist leer... */
  position: absolute;
  bottom: 0;
  left: 30%;
  width: 0%;
  border-bottom: 2px solid #009fe2;
   transition: width 0.3s ease-out;

}

#hm a:hover:after {
  width: 40%;
  margin-left: auto;
  margin-right: auto;
}