.apecweb.video-materials .gallery { grid-template-columns:repeat(3,minmax(0,1fr)); gap:50px 50px; }
.video-materials .card a { text-decoration:none; }
.video-cover { position:relative; aspect-ratio:3/2; background:#102038; overflow:hidden; }
.apecweb.video-materials .card .video-cover img { position:absolute; inset:0; width:100%; height:100%; aspect-ratio:auto; object-fit:cover; }
.video-placeholder { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:14px; opacity:.5; }
.apecweb.video-materials .video-cover img[hidden] { display:none; }
.video-play-icon { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:flex; /*align-items:center; justify-content:center;*/ width:56px; height:56px; border:1px solid #fff; border-radius:50%; color:#fff; background:rgba(0,0,0,.3); font-size:26rem; padding: 9px 16px;}
.video-materials .card a:hover .video-play-icon { background:rgba(0,0,0,.6); }
.video-materials .card a:focus-visible { outline:3px solid #9edbff; outline-offset:4px; }
.video-detail video { display:block; width:100%; background:#000; aspect-ratio:16/9; margin:28px 0 20px; }
.video-caption { text-align:center; margin:20px 0; font-size: 18rem; color: rgba(255,255,255,.5); }
@media(max-width:700px) { .apecweb.video-materials .gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 16px; } }
@media(max-width:450px) { 
    .apecweb.video-materials .gallery { grid-template-columns:1fr; } 
    .video-caption { font-size: 15rem; }
}