@layer components{.webcam{position:relative;width:100%;height:auto;aspect-ratio:4/3;border-radius:var(--ant-kp-border-radius-xl);overflow:hidden;&:after{content:"";position:absolute;top:0;left:0;display:block;background:rgba(0,0,0,.2)}&:after,img{width:100%;height:100%}img{object-fit:cover}.webcam-label{top:18px;left:18px}.webcam-label,.webcam-name{position:absolute;z-index:1}.webcam-name{bottom:18px;left:16px;right:16px;color:var(--ant-kp-color-text-solid-light);text-transform:uppercase}.webcam-hover{position:absolute;top:0;left:0;background:var(--ant-color-bg-mask);z-index:2;opacity:0;transition:opacity .5s ease}.webcam-hover,.webcam-skeleton{width:100%;height:100%}&.disabled{.webcam-hover{opacity:1}}@media screen and (min-width:1200px){&:hover .webcam-hover{opacity:1}}}}@layer components{.page-webcams{padding-bottom:var(--ant-kp-layout-section-row-margin);.title{text-transform:uppercase;margin-top:var(--ant-margin);margin-bottom:var(--ant-kp-layout-section-row-margin)}.filters{margin-bottom:var(--ant-kp-layout-section-row-margin-m);.ant-typography.ant-typography-kpTertiary.ant{flex-shrink:0}}.filter-chips-list{flex-wrap:nowrap;overflow-x:auto;max-width:calc(100vw - var(--ant-kp-layout-margin) - var(--ant-margin-xs) - 50px);margin-right:calc(-1 * var(--ant-kp-layout-margin));padding-right:var(--ant-kp-layout-margin)}@media screen and (min-width:1200px){.filter-chips-list{margin-right:unset;padding-right:unset}}}.webcams-list{width:100%}}