.bvw-widget { font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.bvw-widget * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.bvw-widget { position: fixed; z-index: 9999; left: 20px; width: 110px; bottom: 20px; overflow: hidden; -webkit-transition: transform 0.3s linear, border-radius 0.3s ease-out,box-shadow 0.2s ease-out,background-color 0.3s ease,border-color 0.3s ease, width 0.4s linear; transition: transform 0.3s linear, border-radius 0.3s ease-out,box-shadow 0.2s ease-out,background-color 0.3s ease,border-color 0.3s ease, width 0.4s linear; border-radius: 20px; background: rgba(0, 0, 0, 0.3); transform-origin: 0 100%; box-shadow: 0px 5px 15px 0px rgba(12, 12, 38, 0.2); }
.bvw-widget:hover::after, .bvw-widget.opened::after { border-color: #131344; }
.bvw-widget:not(.opened):hover { transform: scale(1.05); }
.bvw-widget:not(.opened):hover .bvw-widget__close { opacity: 1; }
.bvw-widget::before { content: ''; display: block; position: relative; width: 100%; height: 0; padding-bottom: calc(var(--aspect-ratio, 1.77) * 100%); }
.bvw-widget::after { content: ''; position: absolute; left: 0; top: 0; transition: border-color 0.3s ease; right: 0; bottom: 0; border-radius: 20px; pointer-events: none; z-index: 20; border: 3px solid #fff; }
.bvw-widget.opened { width: 320px; }
.bvw-widget.opened .bvw-widget__player { opacity: 1; transition-delay: 0.3s; pointer-events: all; }
.bvw-widget.opened .bvw-widget__preview { opacity: 0; pointer-events: none; transition-delay: 0; }

.bvw-widget__preview { position: absolute; left: 0; top: 0; width: 100%; cursor: pointer; height: 100%; transition: all 0.2s; transition-delay: 0.3s; }

.bvw-widget__close { font-size: 0; position: absolute; right: 5px; top: 5px; opacity: 0; cursor: pointer; transition: transform 0.2s ease-out, opacity 0.3s; transform: scale(0.6); z-index: 5; }
.bvw-widget__close:hover { transform: scale(0.7); opacity: 1; }

.bvw-widget__preview-open { position: absolute; left: 0; top: 0; width: 100%; height: 100%; cursor: pointer; }

.bvw-widget__player { position: absolute; left: 3px; top: 3px; right: 3px; bottom: 3px; z-index: 5; pointer-events: none; opacity: 0; transition: all 0.2s; }

.bvw-widget__loader { position: absolute; left: -3px; top: 0; right: -3px; height: 5px; background: rgba(230, 230, 230, 0.3); }

.bvw-widget__loader-progress { position: absolute; background-color: #ff3d3e; height: 100%; left: 0; top: 0; pointer-events: none; transition: all 0.4s linear; }

.bvw-widget__timer { position: absolute; top: 15px; right: 15px; color: white; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); font-size: 12px; z-index: 400; width: 40px; text-align: right; opacity: 0.9; }

.bvw-widget__mute { font-size: 0; position: absolute; right: 5px; top: 79px; cursor: pointer; transition: transform 0.2s ease-out, opacity 0.3s; transform: scale(0.6); z-index: 3; }
.bvw-widget__mute:hover { transform: scale(0.7); opacity: 1; }

.bvw-widget__toggle { font-size: 0; position: absolute; right: 5px; top: 36px; cursor: pointer; transition: transform 0.2s ease-out, opacity 0.3s; transform: scale(0.6); z-index: 3; }
.bvw-widget__toggle:hover { transform: scale(0.7); opacity: 1; }

.bvw-widget__stop { font-size: 0; position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: flex; align-items: center; justify-content: center; z-index: 2; opacity: 0; cursor: pointer; transition: all 0.5s; }
.bvw-widget__stop._active { pointer-events: none; }
.bvw-widget__stop._active ~ .bvw-widget__play { pointer-events: all; display: flex; }

.bvw-widget__play { font-size: 0; position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; z-index: 2; opacity: 0; cursor: pointer; transition: all 0.5s; }

._animated .bvw-widget__stop { transform: scale(1.5); opacity: 0.7; }
._animated .bvw-widget__stop._active { opacity: 0; }
._animated .bvw-widget__stop._active ~ .bvw-widget__play { opacity: 0.7; transform: scale(1.5); }

.bvw-widget__content { position: absolute; left: 30px; right: 30px; bottom: 20px; z-index: 5; opacity: 0; pointer-events: none; transition: all 0.3s; transform: translateY(20px); }
.bvw-widget__content._active { opacity: 1; pointer-events: all; transform: translateY(0px); }

.bvw-widget__btn { margin-left: auto; margin-right: auto; max-width: 300px; z-index: 300; color: white; box-shadow: 0px 10px 50px rgba(40, 40, 40, 0.5); box-sizing: border-box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 14px; padding: 15px; cursor: pointer; -webkit-transition: -webkit-transform 0.2s ease-in-out; -webkit-transition: transform 0.2s ease-in-out; transition: transform 0.2s ease-in-out; text-align: center; border-radius: 30px; font-weight: normal; text-decoration: none; background: #131344; color: white; }
.bvw-widget__btn:hover { -webkit-transform: scale(1.05) translateY(-4px); -ms-transform: scale(1.05) translateY(-4px); transform: scale(1.05) translateY(-4px); }

.bvw-widget__video { position: absolute; height: 100%; object-fit: cover; width: 100%; left: 0; top: 0; display: block; pointer-events: none; }

.bvw_hidden { transform: translateX(-300px); pointer-events: none; }