/* misc, general */
.lightbox_centralElement { background: #fff; box-shadow: 0 0 12px #aaa; padding: 2.2em; }
#lightboxdialog { width: 500px; max-width: 100%; }
.lightbox_centralElement h4 { margin: 0 0 1em 0; color: #88bbaa; }
#lightboxdialog h4.error { color: #DA4949; }
#lightboxdialog > *:not(h4) + p:first-of-type, #lightboxdialog > p:first-child { font-size: 1.4em; margin-top: 0; }
.lightbox_centralElement .close:hover { text-decoration: none; }
#lightboxdialog p:empty { display: none; }
#lightboxdialog .code { font-family: "Courier new"; color: #d00; font-size: .95em; }
#lightboxdialog .lbd-stern { font-weight: bold; color: #d55; }
.lb-header { margin-top: .8em; border-bottom: solid 1px #d5d5d5; padding-bottom: .5em; }

/* vertically-centered CE's */
.vertCentre { top: 50% !important; transform: translateY(-50%); }

/* ---
| LB LOADING
--- */

#lb-loading { padding: 1.4em; background: white; width: 380px; border-radius: 6px; box-shadow: none; transition: .35s; transform: translateY(-50%); top: 50% !important; margin-top: -4em; text-align: center; display: none; overflow: hidden; position: fixed !important; }
#lb-loading.lightbox_centralElement { margin: 0; }
#lb-loading p { margin: 0; }

/* message */
#lb-loading p + p { margin-top: .5em; transition: opacity .5s; }
#lb-loading:not(.with-msg) p + p { display: none; }

/* progresss bar */
#lb-loading .bar { background: #d2d2d2; border-radius: .5em; height: 1em; position: relative; overflow: hidden; margin-top: 1em; transition: opacity .5s; }
#lb-loading:not(.with-progress-bar) .bar { display: none; }
#lb-loading .bar div { background: #88b95C; position: absolute; left: 0; top: 0; height: 100%; transition: width .5s; }

/* barberpole variant */
#lb-loading.bar-type-infinite .bar div {
  right: 0;
  bottom: 0;
  transition: opacity 0.3s ease;
  background-size: 30px 30px;
  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent);
  animation: barberpole 0.5s linear infinite;
}

@keyframes barberpole {
  from { background-position: 0 0; }
  to { background-position: 60px 30px; }
}

/* succeeded/failed */
#lb-loading .succeeded, #lb-loading .failed { font-size: 4em; color: #88b95C; transition: left .4s; position: absolute; left: -20%; top: 4%; display: block; }
#lb-loading.succeeded .succeeded, #lb-loading.failed .failed { left: 45%; }
#lb-loading .failed { color: #D96D7A; }
#lb-loading.succeeded > *:not(.succeeded), #lb-loading.failed > *:not(.failed) { opacity: 0; }