Выравнивание изображение вертикально по центру

Всем привет. Помогите выровнять картинку вертикально по центру, относительно блоку див. Она по непонятно мне причине находится с небольшим смещением вниз.

<div align="center">

  <a href="http://google.com">

<div type="button" class="email-bt">

    <div class="text-call">

      <img src="https://i.ya-webdesign.com/images/constellation-transparent-starry-1.png">

    </div>

</div>

    </a>

</div>

.email-bt {

        background:#D81B33;

        border:2px solid #D81B33;

        border-radius:50%;

        box-shadow:0 8px 10px rgba(249,92,24,0.3);

        cursor:pointer;

        height:168px;

        text-align:center;

        width:168px;

        line-height: 168px;



        z-index:999;

        transition:.3s;

        -webkit-animation:email-an linear 1s infinite;

        animation:email-an linear 1s infinite;

}



.image-flex {

  display:flex;

  align-items: center;

  justify-content: center;

}



.email-bt .text-call{

        height:96%;

        width:96%;        

        border-radius:50%;

        position:relative;

        overflow:hidden;

padding:5px;

    line-height: normal;

    display: inline-block;

    vertical-align: middle;

}



.email-bt .text-call img{

display:block;

margin:auto;

}



.email-bt:hover {

        z-index:1;

        background:#fff;

        transition:.3s;

}



@-webkit-keyframes email-an {

        0% {

        box-shadow:0 8px 10px rgba(249,92,24,0.3),0 0 0 0 rgba(249,92,24,0.2),0 0 0 0 rgba(249,92,24,0.2)

}

40% {

        box-shadow:0 8px 10px rgba(249,92,24,0.3),0 0 0 15px rgba(249,92,24,0.2),0 0 0 0 rgba(249,92,24,0.2)

}

80% {

        box-shadow:0 8px 10px rgba(249,92,24,0.3),0 0 0 30px rgba(249,92,24,0),0 0 0 26.7px rgba(249,92,24,0.067)

}

100% {

        box-shadow:0 8px 10px rgba(249,92,24,0.3),0 0 0 30px rgba(249,92,24,0),0 0 0 40px rgba(249,92,24,0.0)

}

}@keyframes email-an {

        0% {

        box-shadow:0 8px 10px rgba(249,92,24,0.3),0 0 0 0 rgba(249,92,24,0.2),0 0 0 0 rgba(249,92,24,0.2)

}

40% {

        box-shadow:0 8px 10px rgba(249,92,24,0.3),0 0 0 15px rgba(249,92,24,0.2),0 0 0 0 rgba(249,92,24,0.2)

}

80% {

        box-shadow:0 8px 10px rgba(249,92,24,0.3),0 0 0 30px rgba(249,92,24,0),0 0 0 26.7px rgba(249,92,24,0.067)

}

100% {

        box-shadow:0 8px 10px rgba(249,92,24,0.3),0 0 0 30px rgba(249,92,24,0),0 0 0 40px rgba(249,92,24,0.0)

}

}



@keyframes opsimple {

0% {

    opacity: 0;

}

40% {

    opacity: 1;

}



80% {

    opacity: 1;

}

100% {

    opacity: 0;

}

}



@-webkit-keyframes opsimple {

0% {

    opacity: 0;

}

40% {

    opacity: 1;

}

80% {

    opacity: 1;

}

100% {

    opacity: 0;

}

}