:host {
  width: 100%; display: block; --border-radius: 0px; --border-color: #d1d1d1; --border-color-focus: #5b9dd9; --box-shadow-focus: rgba(30, 140, 190, 0.8); --z-index: 100
}
container {
  width: 100%; display: block !important; border: var(--border-color) 1px solid; border-radius: var(--border-radius); overflow: hidden; position: relative; z-index: var(--z-index); transition: border-color .3s ease, box-shadow .3s ease
}
container div.main {
  width: 100%
}
container div.main iframe.iframe {
  display: block; width: 100%
}
container div.mask {
  width: 100%; height: 100%; background: #dddddd; opacity: .3; position: absolute; top: 0px; left: 0px; z-index: -100
}
container.disabled div.mask {
  z-index: 10000
}
container.on {
  border-color: var(--border-color-focus); box-shadow: 0px 0px 2px var(--box-shadow-focus)
}
container.fullscreen {
  position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 100000 !important
}