.brif-video{ width:100%; height: 322px; } @supports ( aspect-ratio: 16/9 ){ .brif-video{ height:auto; aspect-ratio: 16/9; } } figure.brif-video { display: flex; align-items:center; position:relative; z-index:1; overflow: hidden; transition: all 200ms ease-out; cursor: pointer; margin:0 auto 1rem; } .brif-video img{ width:100%; height:100%; object-postition:center; object-fit:cover; } .brif-video:after{ content:''; background: url("data:image/svg+xml,%3C%3Fxml version='1.0'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' version='1.1' width='32' height='32' x='0' y='0' viewBox='0 0 512.00213 512' style='enable-background:new 0 0 512 512' xml:space='preserve' class=''%3E%3Cg%3E%3Cpath xmlns='http://www.w3.org/2000/svg' d='m501.453125 56.09375c-5.902344-21.933594-23.195313-39.222656-45.125-45.128906-40.066406-10.964844-200.332031-10.964844-200.332031-10.964844s-160.261719 0-200.328125 10.546875c-21.507813 5.902344-39.222657 23.617187-45.125 45.546875-10.542969 40.0625-10.542969 123.148438-10.542969 123.148438s0 83.503906 10.542969 123.148437c5.90625 21.929687 23.195312 39.222656 45.128906 45.128906 40.484375 10.964844 200.328125 10.964844 200.328125 10.964844s160.261719 0 200.328125-10.546875c21.933594-5.902344 39.222656-23.195312 45.128906-45.125 10.542969-40.066406 10.542969-123.148438 10.542969-123.148438s.421875-83.507812-10.546875-123.570312zm0 0' fill='%23ec0000' data-original='%23ff0000' style='' class=''/%3E%3Cpath xmlns='http://www.w3.org/2000/svg' d='m204.96875 256 133.269531-76.757812-133.269531-76.757813zm0 0' fill='%23ffffff' data-original='%23ffffff' style='' class=''/%3E%3C/g%3E%3C/svg%3E") no-repeat center center; background-size: 57px 35px; position: absolute; top:0; height: 100%; width: 100%; opacity: .7; transition: opacity 0.2s ease-out; } .brif-video.cta:before{ content: 'Нажмите для старта'; position: absolute; bottom:1rem; left: 1rem; right: 1rem; text-align: center; padding: 3px; background: #fff; color: #000; font-weight: bold; } .brif-video:hover:after{ opacity: 1; } .video-loaded:after{ content:none!important; } .video-schema-wrap h2, .video-schema-wrap p, .video-schema-wrap br, .video-schema-wrap span { display: none; }