Taka sytuacja występuje ponieważ Twoje zdjęcie próbuje dopasować się szerokością do szerokości okna przeglądarki (width:100%, oraz height:auto). Sprawia to że zdjęcie zawsze wyświetlane jest w całości w oryginalnych proporcjach. Niestety rozwiązanie takie skutkuje tym, że zdjęcie przestaje obejmować obszar jaki chcemy. Rozwiązanie na szybko, proponowałbym usunąć wpis:
.flexslider .slides img {
height:auto;
}
a wpis
.metaslider .slides img {
height: calc(100vh - 50px);
}
zamienić na
.metaslider .slides img {
height: 100vh;
}