.scanner-container {
  position: relative;
  display: flex;
  justify-content: center;

}
.scanner-container video{
  object-fit: cover !important;
  width: 672;
  height: 350px;
}
.scanner-container section { 
  display: flex;
  justify-content:center;
  width: 500px;
}
#qr-scanner-description{
  text-align: center;
}
#focus-box{
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 220px;
  height: 220px; 
}
#focus-box:before, 
#focus-box:after, 
#focus-box>:last-child:before, 
#focus-box>:last-child:after {
    position: absolute;
    width: 60px; 
    height: 50px;
    border-color: white; 
    border-style: solid;
    content: ' ';
}

#focus-box:before {
    top: 10px;
    left: 10px;
    border-width: 3px 0 0 3px
}

#focus-box:after {
    top: 10px;
    right: 10px;
    border-width: 3px 3px 0 0
}

#focus-box>:last-child:before {
    bottom: 10px;
    right: 10px;     
    border-width: 0 3px 3px 0
}

#focus-box>:last-child:after {
    bottom: 10px;
    left: 10px;
    border-width: 0 0 3px 3px
}
#scan-description{
  color:  var(--main-placeholder-color);
  margin-top: 15px; 
  text-align: center;
}