
/* TODO: move into general library */
.shake {
  animation: shake 150ms 2 linear;
  -moz-animation: shake 150ms 2 linear;
  -webkit-animation: shake 150ms 2 linear;
  -o-animation: shake 150ms 2 linear;
}

@keyframes shake {
  0% {
    transform: translate(7px, 0);
  }
  50% {
    transform: translate(-7px, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}

@-moz-keyframes shake {
  0% {
    -moz-transform: translate(7px, 0);
  }
  50% {
    -moz-transform: translate(-7px, 0);
  }
  100% {
    -moz-transform: translate(0, 0);
  }
}

@-webkit-keyframes shake {
  0% {
    -webkit-transform: translate(7px, 0);
  }
  50% {
    -webkit-transform: translate(-7px, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}

@-ms-keyframes shake {
  0% {
    -ms-transform: translate(7px, 0);
  }
  50% {
    -ms-transform: translate(-7px, 0);
  }
  100% {
    -ms-transform: translate(0, 0);
  }
}

@-o-keyframes shake {
  0% {
    -o-transform: translate(7px, 0);
  }
  50% {
    -o-transform: translate(-7px, 0);
  }
  100% {
    -o-transform: translate(0, 0);
  }
}


/* TODO: replace with bootstrap internal */
.modal {
  --bs-modal-zindex:1055;
  --bs-modal-width:600px;
  --bs-modal-padding:1rem;
  --bs-modal-margin:0.5rem;
  --bs-modal-color: ;
  --bs-modal-bg:#fff;
  --bs-modal-border-color:var(--bs-border-color-translucent);
  --bs-modal-border-width:0;
  --bs-modal-border-radius:0.3rem;
  --bs-modal-box-shadow:0 0.05rem 0.2rem rgba(0,0,0,.05);
  --bs-modal-inner-border-radius:0.3rem;
  --bs-modal-header-padding-x:1rem;
  --bs-modal-header-padding-y:1rem;
  --bs-modal-header-padding:1rem 1rem;
  --bs-modal-header-border-color:var(--bs-border-color);
  --bs-modal-header-border-width:1px;
  --bs-modal-title-line-height:1.5;
  --bs-modal-footer-gap:0.5rem;
  --bs-modal-footer-bg: ;
  --bs-modal-footer-border-color:var(--bs-border-color);
  --bs-modal-footer-border-width:1px;
  display:none;
  height:100%;
  left:0;
  outline:0;
  overflow-x:hidden;
  overflow-y:auto;
  position:fixed;
  top:0;
  width:100%;
  z-index:var(--bs-modal-zindex)
 }
 .modal-dialog {
  margin:var(--bs-modal-margin);
  pointer-events:none;
  position:relative;
  width:auto
 }
 .modal.fade .modal-dialog {
  transform:translateY(-50px);
  transition:transform .25s ease-out
 }
 @media(prefers-reduced-motion:reduce) {
  .modal.fade .modal-dialog {
   transition:none
  }
 }
 .modal.show .modal-dialog {
  transform:none
 }
 .modal.modal-static .modal-dialog {
  transform:scale(1.02)
 }
 .modal-dialog-scrollable {
  height:calc(100% - var(--bs-modal-margin)*2)
 }
 .modal-dialog-scrollable .modal-content {
  max-height:100%;
  overflow:hidden
 }
 .modal-dialog-scrollable .modal-body {
  overflow-y:auto
 }
 .modal-dialog-centered {
  align-items:center;
  display:flex;
  min-height:calc(100% - var(--bs-modal-margin)*2)
 }
 .modal-content {
  background-clip:padding-box;
  background-color:var(--bs-modal-bg);
  border:var(--bs-modal-border-width) solid var(--bs-modal-border-color);
  border-radius:var(--bs-modal-border-radius);
  color:var(--bs-modal-color);
  display:flex;
  flex-direction:column;
  outline:0;
  pointer-events:auto;
  position:relative;
  width:100%
 }
 .modal-backdrop {
  --bs-backdrop-zindex:1050;
  --bs-backdrop-bg:#000;
  --bs-backdrop-opacity:0.5;
  background-color:var(--bs-backdrop-bg);
  height:100vh;
  left:0;
  position:fixed;
  top:0;
  width:100vw;
  z-index:var(--bs-backdrop-zindex)
 }
 .modal-backdrop.fade {
  opacity:0
 }
 .modal-backdrop.show {
  opacity:var(--bs-backdrop-opacity)
 }
 .modal-header {
  align-items:center;
  border-bottom:var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color);
  border-top-left-radius:var(--bs-modal-inner-border-radius);
  border-top-right-radius:var(--bs-modal-inner-border-radius);
  display:flex;
  flex-shrink:0;
  justify-content:space-between;
  padding:var(--bs-modal-header-padding)
 }
 .modal-header .btn-close {
  margin:calc(var(--bs-modal-header-padding-y)*-.5) calc(var(--bs-modal-header-padding-x)*-.5) calc(var(--bs-modal-header-padding-y)*-.5) auto;
  padding:calc(var(--bs-modal-header-padding-y)*.5) calc(var(--bs-modal-header-padding-x)*.5)
 }
 .modal-title {
  line-height:var(--bs-modal-title-line-height);
  margin-bottom:0
 }
 .modal-body {
  flex:1 1 auto;
  padding:var(--bs-modal-padding);
  position:relative
 }
 .modal-footer {
  align-items:center;
  background-color:var(--bs-modal-footer-bg);
  border-bottom-left-radius:var(--bs-modal-inner-border-radius);
  border-bottom-right-radius:var(--bs-modal-inner-border-radius);
  border-top:var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color);
  display:flex;
  flex-shrink:0;
  flex-wrap:wrap;
  justify-content:flex-end;
  padding:calc(var(--bs-modal-padding) - var(--bs-modal-footer-gap)*.5)
 }
 .modal-footer>* {
  margin:calc(var(--bs-modal-footer-gap)*.5)
 }
 @media(min-width:576px) {
  .modal {
   --bs-modal-margin:1.75rem;
   --bs-modal-box-shadow:0 0.1rem 0.2rem rgba(0,0,0,.05)
  }
  .modal-dialog {
   margin-left:auto;
   margin-right:auto;
   max-width:var(--bs-modal-width)
  }
  .modal-sm {
   --bs-modal-width:400px
  }
 }
 @media(min-width:992px) {
  .modal-lg,
  .modal-xl {
   --bs-modal-width:900px
  }
 }
 @media(min-width:1200px) {
  .modal-xl {
   --bs-modal-width:1140px
  }
 }
 .modal-fullscreen {
  height:100%;
  margin:0;
  max-width:none;
  width:100vw
 }
 .modal-fullscreen .modal-content {
  border:0;
  border-radius:0;
  height:100%
 }
 .modal-fullscreen .modal-footer,
 .modal-fullscreen .modal-header {
  border-radius:0
 }
 .modal-fullscreen .modal-body {
  overflow-y:auto
 }
 @media(max-width:575.98px) {
  .modal-fullscreen-sm-down {
   height:100%;
   margin:0;
   max-width:none;
   width:100vw
  }
  .modal-fullscreen-sm-down .modal-content {
   border:0;
   border-radius:0;
   height:100%
  }
  .modal-fullscreen-sm-down .modal-footer,
  .modal-fullscreen-sm-down .modal-header {
   border-radius:0
  }
  .modal-fullscreen-sm-down .modal-body {
   overflow-y:auto
  }
 }
 @media(max-width:767.98px) {
  .modal-fullscreen-md-down {
   height:100%;
   margin:0;
   max-width:none;
   width:100vw
  }
  .modal-fullscreen-md-down .modal-content {
   border:0;
   border-radius:0;
   height:100%
  }
  .modal-fullscreen-md-down .modal-footer,
  .modal-fullscreen-md-down .modal-header {
   border-radius:0
  }
  .modal-fullscreen-md-down .modal-body {
   overflow-y:auto
  }
 }
 @media(max-width:991.98px) {
  .modal-fullscreen-lg-down {
   height:100%;
   margin:0;
   max-width:none;
   width:100vw
  }
  .modal-fullscreen-lg-down .modal-content {
   border:0;
   border-radius:0;
   height:100%
  }
  .modal-fullscreen-lg-down .modal-footer,
  .modal-fullscreen-lg-down .modal-header {
   border-radius:0
  }
  .modal-fullscreen-lg-down .modal-body {
   overflow-y:auto
  }
 }
 @media(max-width:1199.98px) {
  .modal-fullscreen-xl-down {
   height:100%;
   margin:0;
   max-width:none;
   width:100vw
  }
  .modal-fullscreen-xl-down .modal-content {
   border:0;
   border-radius:0;
   height:100%
  }
  .modal-fullscreen-xl-down .modal-footer,
  .modal-fullscreen-xl-down .modal-header {
   border-radius:0
  }
  .modal-fullscreen-xl-down .modal-body {
   overflow-y:auto
  }
 }
 @media(max-width:1439.98px) {
  .modal-fullscreen-xxl-down {
   height:100%;
   margin:0;
   max-width:none;
   width:100vw
  }
  .modal-fullscreen-xxl-down .modal-content {
   border:0;
   border-radius:0;
   height:100%
  }
  .modal-fullscreen-xxl-down .modal-footer,
  .modal-fullscreen-xxl-down .modal-header {
   border-radius:0
  }
  .modal-fullscreen-xxl-down .modal-body {
   overflow-y:auto
  }
 }