video-container {
  position:relative;
  display:block;
  padding-bottom:56.25%;
  width:100%;
 }
 
 video-container iframe, video-container canvas {
   position:absolute;
   height:100% !important;
   width:100% !important;
 }
 
 
 /* Sidebar ================================================================== */

 a#system-info {
  align-content: center;
  background-color: transparent !important;
}

 .system-menu { margin-top: 20px; }
 .system-menu ul { margin-bottom: 20px; }
 .system-menu ul:last-child { margin-bottom: 0; }
 .system-menu ul a { font-size: 13px; }
 .site-name {
   display: block;
   padding: 14px 0;
   margin-left:-5px;
   color: #d7d9db;
 }
 
 .system-menu ul a:before {
   width: 16px;
   max-height: 16px;
   margin-right: 10px;
   justify-content: center;
   font-size: 16px;
   opacity: 0.5;
 }
 
 #global-sidebar > a, #global-sidebar *:not(.has-subnav) > a { transition:initial; }
 
 #edition-logo { border-color:rgba(255,255,255, 0.8) !important; }
 #edition-logo .edition-name { color:rgba(255,255,255, 0.8) !important; }
 #edition-logo > div.edition-trial { background-color:rgba(255,255,255, 0.8) !important }
 #edition-logo > div.edition-trial:before { border-color:transparent rgba(255,255,255, 0.8) transparent transparent !important }
 #version { color:#d7d9db; }
 
 /* Themed =================================================================== */
 
 @supports(--css: variables) {
 
   /* Login ------------------------------------------------------------------ */
 
   body.login {
     background:linear-gradient(to top, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url('/assets/images/default-featured.jpg') center center / cover no-repeat;
   }
 
   /* #login-form { background-image:url('/assets/images/logo.svg') !important} */
 
   body.login form#login-form {
     color:transparent;
     display:block;
     white-space: nowrap;
     background-image:url('/assets/images/full-logo.svg');
     background-size: contain;
     background-size: 294px 75px !important;
     background-repeat:no-repeat;
     background-position: top center;
   }
 
   body.login form#login-form h1 { margin-bottom:55px; pointer-events:none; color:transparent; }
 
   /* Redactor --------------------------------------------------------------- */
 
   .input .redactor-styles h1, .redactor-dropdown-item-h1 span { font-size:38px !important; line-height:30px !important; color:var(--primary) !important; }
   .input .redactor-styles h2, .redactor-dropdown-item-h2 span { font-size:32px !important; line-height:35px !important; color:var(--primary) !important; }
   .input .redactor-styles h3, .redactor-dropdown-item-h3 span { font-size:22px !important; line-height:26px !important; color:var(--secondary, var(--primary)) !important;  }
   .input .redactor-styles h4, .redactor-dropdown-item-h4 span { font-size:18px !important; line-height:22px !important; color:var(--secondary, var(--primary)) !important; }
 
   /* Super Tables ----------------------------------------------------------- */
 
   .superTableMatrix.matrixblock {
     padding:14px;
   }
 
   /* Parimary Themes -------------------------------------------------------- */

   #system-info, #global-sidebar { background: var(--primary, #333E4D); }
   #system-info #system-name h2:after { background-image:linear-gradient(to right, rgba(41, 51, 61, 0), var(--primary, #333E4D)); }
   #global-sidebar #nav li a .badge { color: var(--primary, #333E4D); }
   #app-info #edition #edition-logo > .edition-trial { color: var(--primary, #333E4D);  }
 
   /* Secondary Themes ------------------------------------------------------- */
 
   .readable blockquote.note:not(.tip):not(.warning) {
     border-color: var(--secondary, #da5a47);
     color: var(--secondary, #da5a47);
   }
 
   .readable blockquote.note:not(.tip):not(.warning):before {
     content: 'alert';
     color: var(--secondary, #da5a47);
   }
 
   .required:after { color: var(--secondary, #da5a47); }
 
   .icon.delete:not(.disabled):hover:before { color: var(--secondary, #da5a47); }
 
   .btn.submit {
     background-image:none;
     background-color:var(--secondary, #da5a47);
   }
 
   .btn.submit:not(.disabled):not(.inactive).active, .btn.submit:not(.disabled):not(.inactive):hover, .btn.submit:not(.disabled):not(.inactive).hover {
     background:linear-gradient(to top, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)) var(--secondary, #da5a47);
   }
 
   .chars-left.negative-chars-left { color: var(--secondary, #da5a47); }
 
   .btn:active, .btn.active {  background-color:var(--secondary, #da5a47) }
 
   #global-sidebar > a.active, #global-sidebar > a:active { background:linear-gradient(to top, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.50)) var(--secondary, #da5a47);  }
 
   #global-sidebar #nav li:not(.has-subnav) > a.sel {
     border-color: var(--secondary, #da5a47);
     background:var(--secondary, #da5a47)
   }
 
   #global-sidebar > a:hover, #global-sidebar *:not(.has-subnav) > a:hover { background-color:var(--secondary, #da5a47) }
 
   #main-container #alerts { background: var(--secondary, #da5a47); }
 
   #install-modal #dots > div.sel { background-color: var(--secondary, #da5a47); border-color: var(--secondary, #da5a47); }
 
   /* Success ---------------------------------------------------------------- */
 
   .success { color: var(--secondary, #00b007) !important; }
 
   .lightswitch .label.on, .lightswitch:not(.dragging).on .label.off { background: var(--secondary, #00b007); }