/* img-slot-course-functional.css — 2 page(s): course-functional.html, en/course-functional.html */

.img-slot{display:inline-block;position:relative;vertical-align:top;width:240px;
height:160px;overflow:hidden;font:13px/1.3 system-ui,-apple-system,sans-serif;
color:rgba(0,0,0,.55)}
.img-slot>img,.img-slot-zoom>img{position:absolute;left:0;top:0;width:100%;height:100%;
object-fit:cover;display:block;max-width:none}
.img-slot-zoom{position:absolute;inset:0}
.img-slot-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
justify-content:center;gap:6px;text-align:center;padding:12px;box-sizing:border-box}
.img-slot-empty svg{opacity:.45}
.img-slot-cap{max-width:90%;font-weight:500;letter-spacing:.01em}
.img-slot-ring{position:absolute;inset:0;pointer-events:none;border:1.5px dashed rgba(0,0,0,.25)}
#cf1 img{object-position:50% -0.001677%}
#cf2 img{object-position:50% 50%}
#cf3 img{object-position:50% 50%}
#cf4 img{object-position:50% -0.001677%}
#cf5 img{object-position:50% 50%}
#cf6 img{object-position:50% 50%}
@media(min-width:768px){
#cf1 img{object-position:50% 40.53%}
#cf2 img{object-position:50% 24.15%}
#cf4 img{object-position:50% 30.51%}
}
@media(min-width:1440px){
#cf1 img{object-position:50% 39.81%}
#cf2 img{object-position:50% 20.45%}
#cf4 img{object-position:50% 29.02%}
}