.works-language-row { justify-content:flex-end; padding:0 0 12px; }
.animation-work .cover-content-container { position:relative; }
.animation-video { display:none; position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:#000; filter:none; }
.animation-play { position:absolute; z-index:4; right:14px; bottom:14px; width:44px; height:44px; border:1px solid #aaa; background:rgba(0,0,0,.65); color:#fff; cursor:pointer; font:16px/1 Arial,sans-serif; border-radius:50%; }
.animation-play span { display:block; padding-left:3px; }
.animation-play:hover { background:#fff; color:#000; }
.animation-play:focus-visible { outline:2px solid #fff; outline-offset:4px; }
.animation-work .details-wrap { pointer-events:none; padding:0; top:0; bottom:0; }
.animation-work .details-inner { padding:18px 22px 60px; }
.animation-work .title { font-size:15px; line-height:1.3; }
.animation-description { color:#ddd; font:12px/1.5 Arial,Helvetica,sans-serif; margin:10px 0 0; }
.animation-work:focus-within .details-wrap { opacity:1; }
.animation-work:focus-within .cover-image:after { opacity:.9; }
.animation-work.is-active .animation-video { display:block; z-index:3; }
.animation-work.is-active .cover-normal { visibility:hidden; }
.animation-work.is-active .details-wrap,.animation-work.is-active .cover-image:after { opacity:0; }
.animation-work.is-active .animation-play { display:none; }
.animation-error { position:absolute; z-index:5; left:12px; right:12px; bottom:58px; background:#000; color:#fff; padding:8px; font:12px/1.4 Arial,sans-serif; }
@media (hover:none) { .animation-work .details-wrap { opacity:1; } .animation-work .cover-image:after { opacity:.75; } }
@media (min-width:541px) and (max-width:768px) { .animation-work .details-inner { padding:10px 12px 48px; } .animation-description { font-size:11px; line-height:1.3; margin-top:5px; } .animation-work .title { font-size:13px; } .animation-play { right:8px; bottom:8px; } }

/* Only the animation hover captions: series heading and centred copy. */
.animation-work .details { align-items:center; justify-content:center; }
.animation-work .details-inner { padding:16px 22px; text-align:center; }
.animation-work .animation-series { color:#ddd; font:12px/1.4 Arial,Helvetica,sans-serif; text-align:center; margin:0 0 8px; }
.animation-work .animation-description { text-align:center; }
@media (min-width:541px) and (max-width:768px) {
 .animation-work .details-inner { padding:10px 12px; }
 .animation-work .animation-series { font-size:11px; margin-bottom:5px; }
}
