CSS snips

Center hero image

.hero{
    height:200px;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center
}
.hero div{
    min-width:100%; display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0
}
.hero img{
    min-width:100%;
    min-height:200px;
    width:auto !important;
    min-width:auto;
    max-width:2000px;
    display:block;
}

cover.php

<style>
.cover {
   display:flex;
   justify-content:center;
   align-items:center;
   width:100%;
   height:300px;
   color: #fff;
   background:#999 url(img/top.jpg) center center no-repeat;
   margin-bottom: 30px;
   background-size: cover;
   background-attachment: fixed;
   position:relative;
   z-index:1
}
.cover:after{
    content:' ';
    width:100%;
    height:100%;
    display:block;
    background:rgba(0,0,0, 0.16);
    position:absolute;
    z-index:-1;
    top:0;
    left:0
}
.cover h2 {
   text-align:center;
   margin: 0;
   text-shadow:0 1px 6px rgba(0, 0, 0, 0.4);
   font-size: 50px;
}
</style>

<div class="cover" style="background-image:url(<? the_post_thumbnail_url( 'full' );  ?>)">
   <h2><?php the_title()?></h2>
</div>

Keep VC tabs as tabs

body .vc_tta.vc_tta-tabs .vc_tta-tabs-container { display: block !important; }
body .vc_tta.vc_general .vc_tta-panel-heading { display: none !important; }