/* FOR SHALLOW SCREENS */
@media screen and (min-width: 768px) and (max-height: 800px) {
    
}

@media (max-width: 767px) {
    
    /*
    .article-hero-container {min-height: 50vh; height: 50vh;}
    */
    
    .article-hero-container h1   {font-size: 30px;}
    .article-inner .standfirst p   {font-size: 16px;}

    .article-hero-container          {margin-bottom: 30px; height: calc(100vh - 145px);}
    .article-heading    {margin-bottom: 50px;}

   .related-articles       {padding-top: 0} 
   
   .related-articles h2   {font-size: 25px;}

    .related-articles h3    {font-size: 30px; margin-bottom: 0.9em}

    .article-inner .tvn-btn {margin: 80px auto;}

    .button {display: flex; justify-content: center}
   
   /* DELETE WHEN NOT NEEDED */
   .related-carouselx   {flex-direction: column;}
   .related-carouselx .slide  {width: 100%;}
}