ACS Hybrid Text Bar Source

Link to article: ACS Hybrid Text Bar Source.

Module Styles

• 
  :root {
      --five-color: 196,2,51;
      --four-color: 255,109,0;
      --three-color: 255,211,0;
      --two-color: 0,135,189;
      --one-color: 0,159,107;
  }
  
  .acs-hybrid-text-bar, 
  .acs-hybrid-text-bar * {
      -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
              box-sizing: border-box;
      word-break: none;
  }
  
  .acs-hybrid-text-bar {
      --wght: 800;
      display: -ms-grid;
      display: grid;
          grid-template-areas:
          "item item clear"
          "contain disrupt disrupt"
          "contain risk risk";
      -ms-grid-rows: 1fr 0.125rem 1fr 0.125rem 1fr;
      grid-template-rows: 1fr 1fr 1fr;
      -ms-grid-columns: 53% 0.125rem 1fr 0.125rem 1fr;
      grid-template-columns: 53% 1fr 1fr;
      width: 100%;
      height: 7.5rem;
      background-color: rgb(0,0,0,0);
      position: relative;
      text-transform: capitalize;
      overflow: hidden;
      font-weight: 800;
  }
  
  .acs-hybrid-text-bar strong {
      --wght: 400;
      font-weight: 400;
  }
  
  .acs-hybrid-text-bar.acs-yes {
    -ms-grid-columns: 53% 0.125rem 1fr 0.125rem 1fr;
    grid-template-columns: 53% 1fr 1fr;
  }
  
  .acs-hybrid-text-bar > a {
      display: block;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      color: rgba(0,0,0,0);
  }
  
  .acs-hybrid-text-bar > div {
      padding: 0.25rem;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
         -moz-box-align: center;
          -ms-flex-align: center;
              align-items: center;
  }
  
  .acs-hybrid-text-bar > div strong {
      margin-right: 0.25rem;
  }
  
  .acs-hybrid-text-bar > div {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-content: center;
          -ms-flex-line-pack: center;
              align-content: center;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
         -moz-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
  }
  
  .acs-hybrid-text-bar > div {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-content: center;
          -ms-flex-line-pack: center;
              align-content: center;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
         -moz-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
  }
  
  .acs-hybrid-version .acs-icon {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
         -moz-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
         -moz-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      margin-left: 0.25rem;
  }
  
  .acs-hybrid-version > .acs-disrupt .acs-icon,
  .acs-hybrid-version > .acs-risk .acs-icon {
      height: 1.5rem;
      width: 1.5rem;
      min-height: 1.5rem;
      min-width: 1.5rem;
  }
  
  .acs-text-version .acs-icon {
      display: none;
  }
  
  .acs-hybrid-version .acs-icon img {
      -webkit-border-radius: 50%;
         -moz-border-radius: 50%;
              border-radius: 50%;
      border: 0.125rem solid rgb(var(--black-monochrome,12,12,12));
  }
  
  .acs-hybrid-version .acs-contain-container .acs-icon {
      height: 3.5rem;
      width: 3.5rem;
  }
  
  .acs-hybrid-text-bar .acs-contain-container .acs-text {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
      -webkit-box-align: center;
      -webkit-align-items: center;
         -moz-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      line-height: 1;
  }
  
  .acs-hybrid-text-bar.acs-yes.acs-text-version {
      -ms-grid-columns: 53% 0.125rem 1fr 0.125rem 1fr;
      grid-template-columns: 53% 1fr 1fr;
    }
  
  .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -webkit-flex-direction: row;
         -moz-box-orient: horizontal;
         -moz-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
         -moz-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
      -webkit-box-align: start;
      -webkit-align-items: flex-start;
         -moz-box-align: start;
          -ms-flex-align: start;
              align-items: flex-start;
      font-size: 1rem;
  }
  
  .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container > div {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -webkit-flex-direction: row;
         -moz-box-orient: horizontal;
         -moz-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      width: 100%;
  }
  
  .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      width: 100%;
  }
  
  .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span:first-of-type {
      font-size: 0.9em;
  }
  
  .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span:last-of-type {
      font-size: 1.15em;
      padding-bottom: 0;
  }
  
  .acs-hybrid-version.acs-yes .acs-contain-container .acs-icon {
    height: 2rem;
    width: 2rem;
    min-height: 2rem;
    min-width: 2rem;
    position: relative;
  }
  
  .acs-hybrid-text-bar.acs-yes .acs-contain-container .acs-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    padding-left: 0.25rem;
    line-height: 1;
    -webkit-flex-shrink: 2;
        -ms-flex-negative: 2;
            flex-shrink: 2;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
       -moz-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    font-size: 1rem;
  }
  
  .acs-hybrid-text-bar.acs-yes .acs-contain-container .acs-text span:first-of-type {
    font-size: 0.75em;
  }
  
  .acs-hybrid-text-bar.acs-yes .acs-contain-container .acs-text span:last-of-type {
    font-size: 1.15em;
    padding-bottom: 0.25em;
  }
  
  .acs-hybrid-text-bar > .acs-item {
      -webkit-box-align: end;
      -webkit-align-items: flex-end;
         -moz-box-align: end;
          -ms-flex-align: end;
              align-items: flex-end;
      padding: 0 0 0.15rem 0;
      border-bottom: 0.125rem solid;
  }
  
  .acs-hybrid-text-bar > .acs-clear {
      -webkit-box-align: end;
      -webkit-align-items: flex-end;
         -moz-box-align: end;
          -ms-flex-align: end;
              align-items: flex-end;
      padding: 0.15rem;
  }
  
  .acs-hybrid-text-bar > .acs-item {
      -ms-grid-row: 1;
      -ms-grid-column: 1;
      -ms-grid-column-span: 3;
      grid-area: item;
      font-size: 1.75em;
  }
  
  .acs-hybrid-text-bar > .acs-item span {
      padding-left: 0.75rem;
  }
  
  .acs-hybrid-text-bar > .acs-clear {
      -ms-grid-row: 1;
      -ms-grid-column: 5;
      grid-area: clear;
      font-size: 1.25em;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -webkit-flex-direction: row;
         -moz-box-orient: horizontal;
         -moz-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
      font-size: 1rem;
      line-height: 1;
      border-left: 0.125rem solid;
      border-bottom: 0.125rem solid;
  }
  
  .acs-hybrid-text-bar > .acs-clear * {
      width: 100%;
  }
  
  .acs-hybrid-text-bar > .acs-clear > .clearance-level-text {
      color:rgba(0,0,0,0);
      position: relative;
  }
  
  .acs-hybrid-text-bar > .acs-clear > .clearance-level-text::before {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      color: rgba(12,12,12,1);
      color: rgba(var(--black-monochrome, 12, 12, 12),1);
  }
  
  .acs-hybrid-version.acs-clear-1 > .acs-clear {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
      padding-left: 0.5em;
  }
  
  .acs-hybrid-text-bar.acs-clear-1 > .acs-clear > .clearance-level-text::before {
      content: "Unrestricted"
  }
  
  .acs-hybrid-version.acs-clear-2 > .acs-clear {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
      padding-left: 0.5em;
  }
  
  .acs-hybrid-text-bar.acs-clear-2 > .acs-clear > .clearance-level-text::before {
      content: "Restricted"
  }
  
  .acs-hybrid-version.acs-clear-3 > .acs-clear {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
      padding-left: 0.5em;
  }
  
  .acs-hybrid-text-bar.acs-clear-3 > .acs-clear > .clearance-level-text::before {
      content: "Confidential"
  }
  
  .acs-hybrid-version.acs-clear-4 > .acs-clear {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
      padding-left: 0.5em;
  }
  
  .acs-hybrid-text-bar.acs-clear-4 > .acs-clear > .clearance-level-text::before {
      content: "Secret"
  }
  
  .acs-hybrid-version.acs-clear-5 > .acs-clear {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
      padding-left: 0.5em;
  }
  
  .acs-hybrid-text-bar.acs-clear-5 > .acs-clear > .clearance-level-text::before {
      content: "Top Secret"
  }
  
  .acs-hybrid-version.acs-clear-6 > .acs-clear {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(12, 12, 12);
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(12, 12, 12);
              box-shadow: inset 0.25rem 0 0 0 rgb(12, 12, 12);
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
      padding-left: 0.5em;
  }
  
  .acs-hybrid-text-bar.acs-clear-6 > .acs-clear > .clearance-level-text::before {
      content: "Cosmic Top Secret"
  }
  
  .acs-hybrid-text-bar .acs-contain-container {
      -ms-grid-row: 3;
      -ms-grid-row-span: 3;
      -ms-grid-column: 1;
      grid-area: contain;
      font-size: 1.25em;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -webkit-flex-direction: column;
         -moz-box-orient: vertical;
         -moz-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-align: start;
      -webkit-align-items: flex-start;
         -moz-box-align: start;
          -ms-flex-align: start;
              align-items: flex-start;
      padding: 0;
      margin: 0;
      position: relative;
      border-right: 0.125rem solid;
  }
  
  .acs-hybrid-text-bar.acs-yes .acs-contain-container {
      font-size: 0.8rem;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -webkit-flex-direction: row;
         -moz-box-orient: horizontal;
         -moz-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-align: center;
      -webkit-align-items: center;
         -moz-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
         -moz-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
  }
  
  .acs-hybrid-text-bar.acs-yes .acs-contain-container > div {
      max-width: 50%;
      width: 50%;
      height: 100%;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -webkit-flex-direction: row;
         -moz-box-orient: horizontal;
         -moz-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
  }
  
  .acs-hybrid-text-bar .acs-contain {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-content: center;
          -ms-flex-line-pack: center;
              align-content: center;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
         -moz-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
      padding: 0.25rem 0.25rem 0.25rem 0.75em;
      height: 100%;
  }
  
  .acs-hybrid-text-bar .acs-secondary {
      display: none;
      -webkit-align-content: center;
          -ms-flex-line-pack: center;
              align-content: center;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
         -moz-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
      padding: 0.25rem 0.25rem 0.25rem 0.75em;
  }
  
  .acs-hybrid-text-bar.acs-yes .acs-secondary {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
  }
  
  .acs-hybrid-text-bar.acs-neutralized,
  .acs-hybrid-text-bar.acs-pending,
  .acs-hybrid-text-bar.acs-explained {
      height: 6.5rem;
          grid-template-areas:        
          "item item clear" 
          "contain contain contain";
      -ms-grid-rows: 1fr 0.125rem 2.5rem;
      grid-template-rows: 1fr 2.5rem;
      -ms-grid-columns: 53% 0.125rem 1fr 0.125rem 1fr;
      grid-template-columns: 53% 1fr 1fr;
  }
  
  .acs-hybrid-text-bar.acs-neutralized .acs-icon,
  .acs-hybrid-text-bar.acs-pending .acs-icon,
  .acs-hybrid-text-bar.acs-explained .acs-icon,
  .acs-hybrid-text-bar.acs-neutralized .acs-icon img,
  .acs-hybrid-text-bar.acs-pending .acs-icon img,
  .acs-hybrid-text-bar.acs-explained .acs-icon img {
      height: 100%;
  }
  
  .acs-hybrid-text-bar.acs-neutralized .acs-disrupt,
  .acs-hybrid-text-bar.acs-pending .acs-disrupt,
  .acs-hybrid-text-bar.acs-explained .acs-disrupt,
  .acs-hybrid-text-bar.acs-neutralized .acs-risk,
  .acs-hybrid-text-bar.acs-pending .acs-risk,
  .acs-hybrid-text-bar.acs-explained .acs-risk {
      display: none;
  }
  
  .acs-hybrid-version.acs-yes .acs-secondary,
  .acs-hybrid-version.acs-neutralized .acs-contain,
  .acs-hybrid-version.acs-esoteric .acs-contain {
      -webkit-box-shadow: inset 0.5rem 0 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
         -moz-box-shadow: inset 0.5rem 0 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
              box-shadow: inset 0.5rem 0 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
  }
  
  .acs-hybrid-version.acs-yes .acs-secondary img,
  .acs-hybrid-version.acs-neutralized .acs-contain img,
  .acs-hybrid-version.acs-esoteric .acs-contain img {
      background-color: rgb(252, 252, 252);
      background-color: rgb(var(--white-monochrome, 252, 252, 252));
      border: 0.125rem solid rgb(252, 252, 252);
      border: 0.125rem solid rgb(var(--white-monochrome, 252, 252, 252));
      -webkit-filter: invert(1);
              filter: invert(1);
  }
  
  .acs-hybrid-version.acs-pending .acs-contain {
      -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--white-monochrome, 12, 12, 12));
         -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--white-monochrome, 12, 12, 12));
              box-shadow: inset 0.5rem 0 0 0 rgb(var(--white-monochrome, 12, 12, 12));
      background-color: rgb(var(--black-monochrome, 12, 12, 12));
      color: rgb(var(--white-monochrome, 252, 252, 252));
  }
  
  .acs-hybrid-version.acs-pending  .acs-contain img {
      background-color: rgb(252, 252, 252);
      background-color: rgb(var(--white-monochrome, 252, 252, 252));
  }
  
  .acs-hybrid-version.acs-explained  .acs-contain {
      -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
         -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
              box-shadow: inset 0.5rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
  }
  
  .acs-hybrid-version.acs-explained  .acs-contain img {
      background-color: rgb(252, 252, 252);
      background-color: rgb(var(--white-monochrome, 252, 252, 252));
  }
  
  .acs-hybrid-version.acs-safe  .acs-contain {
      -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--one-color));
         -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--one-color));
              box-shadow: inset 0.5rem 0 0 0 rgb(var(--one-color));
  }
  
  .acs-hybrid-version.acs-safe  .acs-contain img {
      background-color: rgb(var(--one-color));
  }
  
  .acs-hybrid-version.acs-euclid  .acs-contain {
      -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--three-color));
         -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--three-color));
              box-shadow: inset 0.5rem 0 0 0 rgb(var(--three-color));
  }
  
  .acs-hybrid-version.acs-euclid  .acs-contain img {
      background-color: rgb(var(--three-color));
  }
  
  .acs-hybrid-version.acs-keter  .acs-contain {
      -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--five-color));
         -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--five-color));
              box-shadow: inset 0.5rem 0 0 0 rgb(var(--five-color));
  }
  
  .acs-hybrid-version.acs-keter  .acs-contain img {
      background-color: rgb(var(--five-color));
  }
  
  .acs-hybrid-text-bar > .acs-disrupt {
      -ms-grid-row: 3;
      -ms-grid-column: 3;
      -ms-grid-column-span: 3;
      grid-area: disrupt;
      padding-left: 0.75em;
  }
  
  .acs-hybrid-text-bar > .acs-disrupt .disruption-class-number {
      color: rgba(0,0,0,0);
      position: relative;
  }
  
  .acs-hybrid-text-bar > .acs-disrupt .disruption-class-number::before {
      color: rgba(12, 12, 12, 1);
      color: rgba(var(--black-monochrome, 12, 12, 12),1);
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
  }
  
  .acs-hybrid-version.acs-dark > .acs-disrupt img {
      background-color: rgb(var(--one-color));
  }
  
  .acs-hybrid-version.acs-dark > .acs-disrupt {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
  }
  
  .acs-hybrid-text-bar.acs-dark > .acs-disrupt .disruption-class-number::before {
      content: "1"
  }
  
  .acs-hybrid-version.acs-vlam > .acs-disrupt img {
      background-color: rgb(var(--two-color));
  }
  
  .acs-hybrid-version.acs-vlam > .acs-disrupt {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
  }
  
  .acs-hybrid-text-bar.acs-vlam > .acs-disrupt .disruption-class-number::before {
      content: "2"
  }
  
  .acs-hybrid-version.acs-keneq > .acs-disrupt img {
      background-color: rgb(var(--three-color));
  }
  
  .acs-hybrid-version.acs-keneq > .acs-disrupt {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
  }
  
  .acs-hybrid-text-bar.acs-keneq > .acs-disrupt .disruption-class-number::before {
      content: "3"
  }
  
  .acs-hybrid-version.acs-ekhi > .acs-disrupt img {
      background-color: rgb(var(--four-color));
  }
  
  .acs-hybrid-version.acs-ekhi > .acs-disrupt {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
  }
  
  .acs-hybrid-text-bar.acs-ekhi > .acs-disrupt .disruption-class-number::before {
      content: "4"
  }
  
  .acs-hybrid-version.acs-amida > .acs-disrupt img {
      background-color: rgb(var(--five-color));
  }
  
  .acs-hybrid-version.acs-amida > .acs-disrupt {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
  }
  
  .acs-hybrid-text-bar.acs-amida > .acs-disrupt .disruption-class-number::before {
      content: "5"
  }
  
  .acs-hybrid-text-bar > .acs-risk {
      -ms-grid-row: 5;
      -ms-grid-column: 3;
      -ms-grid-column-span: 3;
      grid-area: risk;
      padding-left: 0.75em;
  }
  
  .acs-hybrid-text-bar > .acs-risk .risk-class-number {
      color: rgba(0,0,0,0);
      position: relative;
  }
  
  .acs-hybrid-text-bar > .acs-risk .risk-class-number::before {
      color: rgba(12, 12, 12, 1);
      color: rgba(var(--black-monochrome, 12, 12, 12),1);
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
  }
  
  .acs-hybrid-version.acs-notice > .acs-risk {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
  }
  
  .acs-hybrid-version.acs-notice > .acs-risk img {
      background-color: rgb(var(--one-color));
  }
  
  .acs-hybrid-text-bar.acs-notice > .acs-risk .risk-class-number::before {
      content: "1";
  }
  
  .acs-hybrid-version.acs-caution > .acs-risk {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
  }
  
  .acs-hybrid-version.acs-caution > .acs-risk img {
      background-color: rgb(var(--two-color));
  }
  
  .acs-hybrid-text-bar.acs-caution > .acs-risk .risk-class-number::before {
      content: "2";
  }
  
  .acs-hybrid-version.acs-warning > .acs-risk {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
  }
  
  .acs-hybrid-version.acs-warning > .acs-risk img {
      background-color: rgb(var(--three-color));
  }
  
  .acs-hybrid-text-bar.acs-warning > .acs-risk .risk-class-number::before {
      content: "3";
  }
  
  .acs-hybrid-version.acs-danger > .acs-risk {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
  }
  
  .acs-hybrid-version.acs-danger > .acs-risk img {
      background-color: rgb(var(--four-color));
  }
  
  .acs-hybrid-text-bar.acs-danger > .acs-risk .risk-class-number::before {
      content: "4";
  }
  
  .acs-hybrid-version.acs-critical > .acs-risk {
      -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
         -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
              box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
  }
  
  .acs-hybrid-version.acs-critical > .acs-risk img {
      background-color: rgb(var(--five-color));
  }
  
  .acs-hybrid-text-bar.acs-critical > .acs-risk .risk-class-number::before {
      content: "5";
  }
  
  @media (max-width: 1000px ) {
  
      .acs-hybrid-text-bar {
              grid-template-areas:
              "item item item item item item clear clear clear clear clear clear"
              "contain contain contain contain contain contain contain contain contain contain contain contain"
              "disrupt disrupt disrupt disrupt disrupt disrupt risk risk risk risk risk risk";
          -ms-grid-rows: 2rem 0 2rem 0 1.5rem;
          grid-template-rows: 2rem 2rem 1.5rem;
          -ms-grid-columns: -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12);
          -ms-grid-columns: -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12);
          -ms-grid-columns: calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12);
          grid-template-columns: repeat(12, -webkit-calc(100% / 12));
          grid-template-columns: repeat(12, -moz-calc(100% / 12));
          grid-template-columns: repeat(12, calc(100% / 12));
          height: 6.75rem;
          max-height: 50vh;
          line-height: 1.1;
          grid-gap: 0;
          background-color: rgba(0,0,0,0)
      }
  
      .acs-hybrid-text-bar > div {
          background-color: rgba(255, 255, 255,0);
      }
  
      .acs-hybrid-text-bar,
      .acs-hybrid-text-bar.acs-yes,
      .acs-hybrid-text-bar.acs-yes.acs-text-version {
          -ms-grid-rows: 2.25rem 0 2.5rem 0 2rem;
          grid-template-rows: 2.25rem 2.5rem 2rem;
          -ms-grid-columns: -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12);
          -ms-grid-columns: -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12);
          -ms-grid-columns: calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12);
          grid-template-columns: repeat(12, -webkit-calc(100% / 12));
          grid-template-columns: repeat(12, -moz-calc(100% / 12));
          grid-template-columns: repeat(12, calc(100% / 12));
      }
  
      .acs-hybrid-text-bar > *:nth-child(1), .acs-hybrid-text-bar.acs-yes > *:nth-child(1), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(1) {
          -ms-grid-row: 1;
          -ms-grid-column: 1;
      }
  
      .acs-hybrid-text-bar > *:nth-child(2), .acs-hybrid-text-bar.acs-yes > *:nth-child(2), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(2) {
          -ms-grid-row: 1;
          -ms-grid-column: 3;
      }
  
      .acs-hybrid-text-bar > *:nth-child(3), .acs-hybrid-text-bar.acs-yes > *:nth-child(3), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(3) {
          -ms-grid-row: 1;
          -ms-grid-column: 5;
      }
  
      .acs-hybrid-text-bar > *:nth-child(4), .acs-hybrid-text-bar.acs-yes > *:nth-child(4), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(4) {
          -ms-grid-row: 1;
          -ms-grid-column: 7;
      }
  
      .acs-hybrid-text-bar > *:nth-child(5), .acs-hybrid-text-bar.acs-yes > *:nth-child(5), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(5) {
          -ms-grid-row: 1;
          -ms-grid-column: 9;
      }
  
      .acs-hybrid-text-bar > *:nth-child(6), .acs-hybrid-text-bar.acs-yes > *:nth-child(6), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(6) {
          -ms-grid-row: 1;
          -ms-grid-column: 11;
      }
  
      .acs-hybrid-text-bar > *:nth-child(7), .acs-hybrid-text-bar.acs-yes > *:nth-child(7), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(7) {
          -ms-grid-row: 1;
          -ms-grid-column: 13;
      }
  
      .acs-hybrid-text-bar > *:nth-child(8), .acs-hybrid-text-bar.acs-yes > *:nth-child(8), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(8) {
          -ms-grid-row: 1;
          -ms-grid-column: 15;
      }
  
      .acs-hybrid-text-bar > *:nth-child(9), .acs-hybrid-text-bar.acs-yes > *:nth-child(9), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(9) {
          -ms-grid-row: 1;
          -ms-grid-column: 17;
      }
  
      .acs-hybrid-text-bar > *:nth-child(10), .acs-hybrid-text-bar.acs-yes > *:nth-child(10), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(10) {
          -ms-grid-row: 1;
          -ms-grid-column: 19;
      }
  
      .acs-hybrid-text-bar > *:nth-child(11), .acs-hybrid-text-bar.acs-yes > *:nth-child(11), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(11) {
          -ms-grid-row: 1;
          -ms-grid-column: 21;
      }
  
      .acs-hybrid-text-bar > *:nth-child(12), .acs-hybrid-text-bar.acs-yes > *:nth-child(12), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(12) {
          -ms-grid-row: 1;
          -ms-grid-column: 23;
      }
  
      .acs-hybrid-text-bar > *:nth-child(13), .acs-hybrid-text-bar.acs-yes > *:nth-child(13), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(13) {
          -ms-grid-row: 3;
          -ms-grid-column: 1;
      }
  
      .acs-hybrid-text-bar > *:nth-child(14), .acs-hybrid-text-bar.acs-yes > *:nth-child(14), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(14) {
          -ms-grid-row: 3;
          -ms-grid-column: 3;
      }
  
      .acs-hybrid-text-bar > *:nth-child(15), .acs-hybrid-text-bar.acs-yes > *:nth-child(15), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(15) {
          -ms-grid-row: 3;
          -ms-grid-column: 5;
      }
  
      .acs-hybrid-text-bar > *:nth-child(16), .acs-hybrid-text-bar.acs-yes > *:nth-child(16), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(16) {
          -ms-grid-row: 3;
          -ms-grid-column: 7;
      }
  
      .acs-hybrid-text-bar > *:nth-child(17), .acs-hybrid-text-bar.acs-yes > *:nth-child(17), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(17) {
          -ms-grid-row: 3;
          -ms-grid-column: 9;
      }
  
      .acs-hybrid-text-bar > *:nth-child(18), .acs-hybrid-text-bar.acs-yes > *:nth-child(18), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(18) {
          -ms-grid-row: 3;
          -ms-grid-column: 11;
      }
  
      .acs-hybrid-text-bar > *:nth-child(19), .acs-hybrid-text-bar.acs-yes > *:nth-child(19), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(19) {
          -ms-grid-row: 3;
          -ms-grid-column: 13;
      }
  
      .acs-hybrid-text-bar > *:nth-child(20), .acs-hybrid-text-bar.acs-yes > *:nth-child(20), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(20) {
          -ms-grid-row: 3;
          -ms-grid-column: 15;
      }
  
      .acs-hybrid-text-bar > *:nth-child(21), .acs-hybrid-text-bar.acs-yes > *:nth-child(21), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(21) {
          -ms-grid-row: 3;
          -ms-grid-column: 17;
      }
  
      .acs-hybrid-text-bar > *:nth-child(22), .acs-hybrid-text-bar.acs-yes > *:nth-child(22), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(22) {
          -ms-grid-row: 3;
          -ms-grid-column: 19;
      }
  
      .acs-hybrid-text-bar > *:nth-child(23), .acs-hybrid-text-bar.acs-yes > *:nth-child(23), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(23) {
          -ms-grid-row: 3;
          -ms-grid-column: 21;
      }
  
      .acs-hybrid-text-bar > *:nth-child(24), .acs-hybrid-text-bar.acs-yes > *:nth-child(24), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(24) {
          -ms-grid-row: 3;
          -ms-grid-column: 23;
      }
  
      .acs-hybrid-text-bar > *:nth-child(25), .acs-hybrid-text-bar.acs-yes > *:nth-child(25), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(25) {
          -ms-grid-row: 5;
          -ms-grid-column: 1;
      }
  
      .acs-hybrid-text-bar > *:nth-child(26), .acs-hybrid-text-bar.acs-yes > *:nth-child(26), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(26) {
          -ms-grid-row: 5;
          -ms-grid-column: 3;
      }
  
      .acs-hybrid-text-bar > *:nth-child(27), .acs-hybrid-text-bar.acs-yes > *:nth-child(27), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(27) {
          -ms-grid-row: 5;
          -ms-grid-column: 5;
      }
  
      .acs-hybrid-text-bar > *:nth-child(28), .acs-hybrid-text-bar.acs-yes > *:nth-child(28), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(28) {
          -ms-grid-row: 5;
          -ms-grid-column: 7;
      }
  
      .acs-hybrid-text-bar > *:nth-child(29), .acs-hybrid-text-bar.acs-yes > *:nth-child(29), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(29) {
          -ms-grid-row: 5;
          -ms-grid-column: 9;
      }
  
      .acs-hybrid-text-bar > *:nth-child(30), .acs-hybrid-text-bar.acs-yes > *:nth-child(30), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(30) {
          -ms-grid-row: 5;
          -ms-grid-column: 11;
      }
  
      .acs-hybrid-text-bar > *:nth-child(31), .acs-hybrid-text-bar.acs-yes > *:nth-child(31), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(31) {
          -ms-grid-row: 5;
          -ms-grid-column: 13;
      }
  
      .acs-hybrid-text-bar > *:nth-child(32), .acs-hybrid-text-bar.acs-yes > *:nth-child(32), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(32) {
          -ms-grid-row: 5;
          -ms-grid-column: 15;
      }
  
      .acs-hybrid-text-bar > *:nth-child(33), .acs-hybrid-text-bar.acs-yes > *:nth-child(33), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(33) {
          -ms-grid-row: 5;
          -ms-grid-column: 17;
      }
  
      .acs-hybrid-text-bar > *:nth-child(34), .acs-hybrid-text-bar.acs-yes > *:nth-child(34), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(34) {
          -ms-grid-row: 5;
          -ms-grid-column: 19;
      }
  
      .acs-hybrid-text-bar > *:nth-child(35), .acs-hybrid-text-bar.acs-yes > *:nth-child(35), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(35) {
          -ms-grid-row: 5;
          -ms-grid-column: 21;
      }
  
      .acs-hybrid-text-bar > *:nth-child(36), .acs-hybrid-text-bar.acs-yes > *:nth-child(36), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(36) {
          -ms-grid-row: 5;
          -ms-grid-column: 23;
      }
  
      .acs-hybrid-text-bar .acs-item {
          padding-left: 0.4rem !important;
          font-size: 1.15rem;
          border: 0 !important;
      }
  
      .acs-hybrid-text-bar .acs-item,
      .acs-hybrid-text-bar .acs-item * {
          -webkit-box-align: center;
          -webkit-align-items: center;
             -moz-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          -webkit-box-pack: start;
          -webkit-justify-content: flex-start;
             -moz-box-pack: start;
              -ms-flex-pack: start;
                  justify-content: flex-start;
      }
  
      .acs-hybrid-text-bar .acs-contain {
          width: 100%
      }
  
      .acs-hybrid-text-bar.acs-yes .acs-contain {
          border-right: 0 solid rgba(0,0,0,0);
      }
  
      .acs-hybrid-text-bar.acs-yes .acs-secondary {
          padding-right: 0.125rem;
      }
  
      .acs-hybrid-text-bar.acs-explained,
      .acs-hybrid-text-bar.acs-neutralized,
      .acs-hybrid-text-bar.acs-pending {
              grid-template-areas:
              "item item clear"
              "contain contain contain";
          -ms-grid-rows: 2rem 0 2.5rem;
          grid-template-rows: 2rem 2.5rem;
          height: 4.75rem;
          max-height: 50vh;
      }
  
      .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon,
      .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon img {
          height: 110% !important;
      }
  
      .acs-hybrid-text-bar > .acs-clear strong,
      .acs-hybrid-text-bar > .acs-disrupt strong,
      .acs-hybrid-text-bar > .acs-risk strong {
          font-size: 0.55rem; 
          display: -webkit-box; 
          display: -webkit-flex; 
          display: -moz-box; 
          display: -ms-flexbox; 
          display: flex;
      }
  
      .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container {
          font-size: 0.8rem;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: normal;
          -webkit-flex-direction: row;
             -moz-box-orient: horizontal;
             -moz-box-direction: normal;
              -ms-flex-direction: row;
                  flex-direction: row;
          -webkit-box-align: center;
          -webkit-align-items: center;
             -moz-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          -webkit-box-pack: center;
          -webkit-justify-content: center;
             -moz-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center;
      }
  
      .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span:first-of-type {
        font-size: 0.75em;
      }
  
      .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span:last-of-type {
        font-size: 1.15em;
        padding-bottom: 0.15em;
      }
  
      .acs-hybrid-text-bar .acs-contain {
          padding-left: 0.4rem;
      }
  
      .acs-hybrid-text-bar.acs-yes .acs-contain-container > div {
          height: 100%;
          width: 100%;
          -webkit-flex-shrink: 2;
              -ms-flex-negative: 2;
                  flex-shrink: 2;
                  -webkit-box-orient: vertical;
                  -webkit-box-direction: normal;
                  -webkit-flex-direction: column;
                     -moz-box-orient: vertical;
                     -moz-box-direction: normal;
                      -ms-flex-direction: column;
                          flex-direction: column;
          position: relative;
                  -webkit-align-content: flex-start;
                      -ms-flex-line-pack: start;
                          align-content: flex-start;
      }
  
      .acs-hybrid-version.acs-yes .acs-contain-container .acs-text,
      .acs-hybrid-version.acs-yes .acs-contain-container .acs-icon {
          position: absolute;     
          top: 0;
          width: -webkit-calc(100% - 2rem);
          width: -moz-calc(100% - 2rem);
          width: calc(100% - 2rem);
          height: 100%;
          -webkit-box-pack: end;
          -webkit-justify-content: end;
             -moz-box-pack: end;
              -ms-flex-pack: end;
                  justify-content: end;
      }
  
      .acs-hybrid-text-bar > .acs-item span {
          padding-left: 0 !important;
      }
  
      .acs-hybrid-version.acs-yes .acs-contain-container .acs-text,
      .acs-hybrid-text-bar.acs-yes .acs-contain-container .acs-text {
          padding-left: 0;
      }
  
      .acs-hybrid-text-bar > .acs-disrupt {
          padding-left: 0.600em;
      }
  
      .acs-hybrid-text-bar > .acs-risk {
          padding-left: 0.25rem;
      }
  
      .acs-hybrid-text-bar.acs-text-version .acs-contain-container {
          -webkit-box-shadow: inset 0 -0.125rem 0 0, inset 0 0.125rem 0 0;
             -moz-box-shadow: inset 0 -0.125rem 0 0, inset 0 0.125rem 0 0;
                  box-shadow: inset 0 -0.125rem 0 0, inset 0 0.125rem 0 0;
      }
  
      .acs-hybrid-version.acs-yes .acs-contain-container .acs-icon,
      .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon {
          right: 0.15rem;
          height: 100%;
          width: initial;
          min-height: initial;
          min-width: initial;
          position: absolute;
          bottom: -0.25rem;
      }
  
      .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon img {
          max-height: 1.75rem;
          max-width: 1.75rem;
          margin-bottom: 0.25rem;
      }
  
      .acs-hybrid-version.acs-yes .acs-contain-container .acs-icon img,
      .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon img {
          width: 1.75rem;
          height: 1.75rem;
      }
  
      .acs-hybrid-version > .acs-disrupt .acs-icon, 
      .acs-hybrid-version > .acs-risk .acs-icon {
          height: 1.25rem;
          width: 1.25rem;
          min-height: 1.25rem;
          min-width: 1.25rem;
          position: absolute;
          right: 0.25rem;
      }
  
      .acs-hybrid-version.acs-clear-1 > .acs-clear {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
          padding-left: 0.25em;
          padding-bottom: 0.25em;
      }
  
      .acs-hybrid-version.acs-clear-2 > .acs-clear {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
          padding-left: 0.25em;
          padding-bottom: 0.25em;
      }
  
      .acs-hybrid-version.acs-clear-3 > .acs-clear {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
          padding-left: 0.25em;
          padding-bottom: 0.25em;
      }
  
      .acs-hybrid-version.acs-clear-4 > .acs-clear {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
          padding-left: 0.25em;
          padding-bottom: 0.25em;
      }
  
      .acs-hybrid-version.acs-clear-5 > .acs-clear {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
          padding-left: 0.25em;
          padding-bottom: 0.25em;
      }
  
      .acs-hybrid-version.acs-clear-6 > .acs-clear {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(12, 12, 12);
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(12, 12, 12);
                  box-shadow: inset 0 -0.25rem 0 0 rgb(12, 12, 12);
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
          padding-left: 0.25em;
          padding-bottom: 0.25em;
      }
  
      .acs-hybrid-version > .acs-contain,
      .acs-hybrid-version > .acs-risk,
      .acs-hybrid-version > .acs-disrupt {
          position: relative;
          margin-bottom: 0em;
      }
      .acs-hybrid-version.acs-yes .acs-secondary,
      .acs-hybrid-version.acs-neutralized .acs-contain,
      .acs-hybrid-version.acs-esoteric .acs-contain {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
                  box-shadow: inset 0 -0.25rem 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
      }
  
      .acs-hybrid-version.acs-pending .acs-contain {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--white-monochrome, 12, 12, 12));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--white-monochrome, 12, 12, 12));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--white-monochrome, 12, 12, 12));
      }
  
      .acs-hybrid-version.acs-explained  .acs-contain {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
      }
  
      .acs-hybrid-version.acs-safe  .acs-contain {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
      }
  
      .acs-hybrid-version.acs-euclid  .acs-contain {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
      }
  
      .acs-hybrid-version.acs-keter  .acs-contain {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
      }
  
      .acs-hybrid-version.acs-dark > .acs-disrupt {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
      }
  
      .acs-hybrid-version.acs-vlam > .acs-disrupt {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
      }
  
      .acs-hybrid-version.acs-keneq > .acs-disrupt {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
      }
  
      .acs-hybrid-version.acs-ekhi > .acs-disrupt {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
      }
  
      .acs-hybrid-version.acs-amida > .acs-disrupt {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
      }
  
      .acs-hybrid-version.acs-notice > .acs-risk {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
      }
  
      .acs-hybrid-version.acs-caution > .acs-risk {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
          position: relative;
      }
  
      .acs-hybrid-version.acs-warning > .acs-risk {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
      }
  
      .acs-hybrid-version.acs-danger > .acs-risk {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
      }
  
      .acs-hybrid-version.acs-critical > .acs-risk {
          -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
             -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
                  box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
      }
  
      .acs-hybrid-text-bar > .acs-item {
          -ms-grid-row: 1;
          -ms-grid-column: 1;
          -ms-grid-column-span: 11
      }
  
      .acs-hybrid-text-bar.acs-explained > .acs-item, .acs-hybrid-text-bar.acs-neutralized > .acs-item, .acs-hybrid-text-bar.acs-pending > .acs-item {
          -ms-grid-row: 1;
          -ms-grid-column: 1;
          -ms-grid-column-span: 3;
      }
  
      .acs-hybrid-text-bar > .acs-clear {
          -ms-grid-row: 1;
          -ms-grid-column: 13;
          -ms-grid-column-span: 11;
      border: 0 !important;
      }
  
      .acs-hybrid-text-bar.acs-explained > .acs-clear, .acs-hybrid-text-bar.acs-neutralized > .acs-clear, .acs-hybrid-text-bar.acs-pending > .acs-clear {
          -ms-grid-row: 1;
          -ms-grid-column: 5;
          -ms-grid-column-span: 1;
      }
  
      .acs-hybrid-text-bar .acs-contain-container {
          -ms-grid-row: 3;
          -ms-grid-row-span: 1;
          -ms-grid-column: 1;
          -ms-grid-column-span: 23;
          border: 0rem solid rgba(0, 0, 0, 0);
      }
  
      .acs-hybrid-text-bar.acs-explained > .acs-contain-container, .acs-hybrid-text-bar.acs-neutralized > .acs-contain-container, .acs-hybrid-text-bar.acs-pending > .acs-contain-container {
          -ms-grid-row: 3;
          -ms-grid-row-span: 1;
          -ms-grid-column: 1;
          -ms-grid-column-span: 5;
      }
  
      .acs-hybrid-text-bar > .acs-disrupt {
          -ms-grid-row: 5;
          -ms-grid-column: 1;
          -ms-grid-column-span: 11
      }
  
      .acs-hybrid-text-bar > .acs-risk {
          -ms-grid-row: 5;
          -ms-grid-column: 13;
          -ms-grid-column-span: 11
      }
  
  }

• @import url("https://nu-scptheme.github.io/Black-Highlighter/stable/styles/normalize.min.css");
  @import url("https://nu-scptheme.github.io/Black-Highlighter/stable/styles/black-highlighter.min.css");
  
  h1 {
      color: rgb(var(--swatch-primary));
  }

Inline Styles

• (none)

Includes

• (none)

CSS Classes

• acs-hybrid-text-bar

• acs-{$include-secondary}

• acs-{$version}-version

• acs-clear-{$clearance-level}

• acs-{$containment-class}

• acs-{$secondary-class}

• acs-{$disruption-class}

• acs-{$risk-class}

• acs-item

• acs-clear

• clearance-level-text

• acs-contain-container

• acs-contain

• acs-text

• acs-icon

• acs-secondary

• acs-text

• acs-icon

• acs-disrupt

• acs-text

• disruption-class-number

• acs-icon

• acs-risk

• acs-text

• risk-class-number

• acs-icon

Page Source

[[iftags -component-backend]]
[[module css]]

:root {
    --five-color: 196,2,51;
    --four-color: 255,109,0;
    --three-color: 255,211,0;
    --two-color: 0,135,189;
    --one-color: 0,159,107;
}

.acs-hybrid-text-bar, 
.acs-hybrid-text-bar * {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    word-break: none;
}

.acs-hybrid-text-bar {
    --wght: 800;
    display: -ms-grid;
    display: grid;
        grid-template-areas:
        "item item clear"
        "contain disrupt disrupt"
        "contain risk risk";
    -ms-grid-rows: 1fr 0.125rem 1fr 0.125rem 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    -ms-grid-columns: 53% 0.125rem 1fr 0.125rem 1fr;
    grid-template-columns: 53% 1fr 1fr;
    width: 100%;
    height: 7.5rem;
    background-color: rgb(0,0,0,0);
    position: relative;
    text-transform: capitalize;
    overflow: hidden;
    font-weight: 800;
}

.acs-hybrid-text-bar strong {
    --wght: 400;
    font-weight: 400;
}

.acs-hybrid-text-bar.acs-yes {
  -ms-grid-columns: 53% 0.125rem 1fr 0.125rem 1fr;
  grid-template-columns: 53% 1fr 1fr;
}

.acs-hybrid-text-bar > a {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color: rgba(0,0,0,0);
}

.acs-hybrid-text-bar > div {
    padding: 0.25rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.acs-hybrid-text-bar > div strong {
    margin-right: 0.25rem;
}

.acs-hybrid-text-bar > div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-content: center;
        -ms-flex-line-pack: center;
            align-content: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}

.acs-hybrid-text-bar > div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-content: center;
        -ms-flex-line-pack: center;
            align-content: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}

.acs-hybrid-version .acs-icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-left: 0.25rem;
}

.acs-hybrid-version > .acs-disrupt .acs-icon,
.acs-hybrid-version > .acs-risk .acs-icon {
    height: 1.5rem;
    width: 1.5rem;
    min-height: 1.5rem;
    min-width: 1.5rem;
}

.acs-text-version .acs-icon {
    display: none;
}

.acs-hybrid-version .acs-icon img {
    -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
            border-radius: 50%;
    border: 0.125rem solid rgb(var(--black-monochrome,12,12,12));
}

.acs-hybrid-version .acs-contain-container .acs-icon {
    height: 3.5rem;
    width: 3.5rem;
}

.acs-hybrid-text-bar .acs-contain-container .acs-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    line-height: 1;
}

.acs-hybrid-text-bar.acs-yes.acs-text-version {
    -ms-grid-columns: 53% 0.125rem 1fr 0.125rem 1fr;
    grid-template-columns: 53% 1fr 1fr;
  }

.acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
       -moz-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    font-size: 1rem;
}

.acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container > div {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    width: 100%;
}

.acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
}

.acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span:first-of-type {
    font-size: 0.9em;
}

.acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span:last-of-type {
    font-size: 1.15em;
    padding-bottom: 0;
}

.acs-hybrid-version.acs-yes .acs-contain-container .acs-icon {
  height: 2rem;
  width: 2rem;
  min-height: 2rem;
  min-width: 2rem;
  position: relative;
}

.acs-hybrid-text-bar.acs-yes .acs-contain-container .acs-text {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  padding-left: 0.25rem;
  line-height: 1;
  -webkit-flex-shrink: 2;
      -ms-flex-negative: 2;
          flex-shrink: 2;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
     -moz-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  font-size: 1rem;
}

.acs-hybrid-text-bar.acs-yes .acs-contain-container .acs-text span:first-of-type {
  font-size: 0.75em;
}

.acs-hybrid-text-bar.acs-yes .acs-contain-container .acs-text span:last-of-type {
  font-size: 1.15em;
  padding-bottom: 0.25em;
}

.acs-hybrid-text-bar > .acs-item {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    padding: 0 0 0.15rem 0;
    border-bottom: 0.125rem solid;
}

.acs-hybrid-text-bar > .acs-clear {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
       -moz-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    padding: 0.15rem;
}

.acs-hybrid-text-bar > .acs-item {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
    grid-area: item;
    font-size: 1.75em;
}

.acs-hybrid-text-bar > .acs-item span {
    padding-left: 0.75rem;
}

.acs-hybrid-text-bar > .acs-clear {
    -ms-grid-row: 1;
    -ms-grid-column: 5;
    grid-area: clear;
    font-size: 1.25em;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    font-size: 1rem;
    line-height: 1;
    border-left: 0.125rem solid;
    border-bottom: 0.125rem solid;
}

.acs-hybrid-text-bar > .acs-clear * {
    width: 100%;
}

.acs-hybrid-text-bar > .acs-clear > .clearance-level-text {
    color:rgba(0,0,0,0);
    position: relative;
}

.acs-hybrid-text-bar > .acs-clear > .clearance-level-text::before {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    color: rgba(12,12,12,1);
    color: rgba(var(--black-monochrome, 12, 12, 12),1);
}

.acs-hybrid-version.acs-clear-1 > .acs-clear {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
    padding-left: 0.5em;
}

.acs-hybrid-text-bar.acs-clear-1 > .acs-clear > .clearance-level-text::before {
    content: "Unrestricted"
}

.acs-hybrid-version.acs-clear-2 > .acs-clear {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
    padding-left: 0.5em;
}

.acs-hybrid-text-bar.acs-clear-2 > .acs-clear > .clearance-level-text::before {
    content: "Restricted"
}

.acs-hybrid-version.acs-clear-3 > .acs-clear {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
    padding-left: 0.5em;
}

.acs-hybrid-text-bar.acs-clear-3 > .acs-clear > .clearance-level-text::before {
    content: "Confidential"
}

.acs-hybrid-version.acs-clear-4 > .acs-clear {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
    padding-left: 0.5em;
}

.acs-hybrid-text-bar.acs-clear-4 > .acs-clear > .clearance-level-text::before {
    content: "Secret"
}

.acs-hybrid-version.acs-clear-5 > .acs-clear {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
    padding-left: 0.5em;
}

.acs-hybrid-text-bar.acs-clear-5 > .acs-clear > .clearance-level-text::before {
    content: "Top Secret"
}

.acs-hybrid-version.acs-clear-6 > .acs-clear {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(12, 12, 12);
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(12, 12, 12);
            box-shadow: inset 0.25rem 0 0 0 rgb(12, 12, 12);
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
    padding-left: 0.5em;
}

.acs-hybrid-text-bar.acs-clear-6 > .acs-clear > .clearance-level-text::before {
    content: "Cosmic Top Secret"
}

.acs-hybrid-text-bar .acs-contain-container {
    -ms-grid-row: 3;
    -ms-grid-row-span: 3;
    -ms-grid-column: 1;
    grid-area: contain;
    font-size: 1.25em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
       -moz-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding: 0;
    margin: 0;
    position: relative;
    border-right: 0.125rem solid;
}

.acs-hybrid-text-bar.acs-yes .acs-contain-container {
    font-size: 0.8rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.acs-hybrid-text-bar.acs-yes .acs-contain-container > div {
    max-width: 50%;
    width: 50%;
    height: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
}

.acs-hybrid-text-bar .acs-contain {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-content: center;
        -ms-flex-line-pack: center;
            align-content: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    padding: 0.25rem 0.25rem 0.25rem 0.75em;
    height: 100%;
}

.acs-hybrid-text-bar .acs-secondary {
    display: none;
    -webkit-align-content: center;
        -ms-flex-line-pack: center;
            align-content: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
       -moz-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    padding: 0.25rem 0.25rem 0.25rem 0.75em;
}

.acs-hybrid-text-bar.acs-yes .acs-secondary {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.acs-hybrid-text-bar.acs-neutralized,
.acs-hybrid-text-bar.acs-pending,
.acs-hybrid-text-bar.acs-explained {
    height: 6.5rem;
        grid-template-areas:        
        "item item clear" 
        "contain contain contain";
    -ms-grid-rows: 1fr 0.125rem 2.5rem;
    grid-template-rows: 1fr 2.5rem;
    -ms-grid-columns: 53% 0.125rem 1fr 0.125rem 1fr;
    grid-template-columns: 53% 1fr 1fr;
}

.acs-hybrid-text-bar.acs-neutralized .acs-icon,
.acs-hybrid-text-bar.acs-pending .acs-icon,
.acs-hybrid-text-bar.acs-explained .acs-icon,
.acs-hybrid-text-bar.acs-neutralized .acs-icon img,
.acs-hybrid-text-bar.acs-pending .acs-icon img,
.acs-hybrid-text-bar.acs-explained .acs-icon img {
    height: 100%;
}

.acs-hybrid-text-bar.acs-neutralized .acs-disrupt,
.acs-hybrid-text-bar.acs-pending .acs-disrupt,
.acs-hybrid-text-bar.acs-explained .acs-disrupt,
.acs-hybrid-text-bar.acs-neutralized .acs-risk,
.acs-hybrid-text-bar.acs-pending .acs-risk,
.acs-hybrid-text-bar.acs-explained .acs-risk {
    display: none;
}

.acs-hybrid-version.acs-yes .acs-secondary,
.acs-hybrid-version.acs-neutralized .acs-contain,
.acs-hybrid-version.acs-esoteric .acs-contain {
    -webkit-box-shadow: inset 0.5rem 0 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
       -moz-box-shadow: inset 0.5rem 0 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
            box-shadow: inset 0.5rem 0 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
}

.acs-hybrid-version.acs-yes .acs-secondary img,
.acs-hybrid-version.acs-neutralized .acs-contain img,
.acs-hybrid-version.acs-esoteric .acs-contain img {
    background-color: rgb(252, 252, 252);
    background-color: rgb(var(--white-monochrome, 252, 252, 252));
    border: 0.125rem solid rgb(252, 252, 252);
    border: 0.125rem solid rgb(var(--white-monochrome, 252, 252, 252));
    -webkit-filter: invert(1);
            filter: invert(1);
}

.acs-hybrid-version.acs-pending .acs-contain {
    -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--white-monochrome, 12, 12, 12));
       -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--white-monochrome, 12, 12, 12));
            box-shadow: inset 0.5rem 0 0 0 rgb(var(--white-monochrome, 12, 12, 12));
    background-color: rgb(var(--black-monochrome, 12, 12, 12));
    color: rgb(var(--white-monochrome, 252, 252, 252));
}

.acs-hybrid-version.acs-pending  .acs-contain img {
    background-color: rgb(252, 252, 252);
    background-color: rgb(var(--white-monochrome, 252, 252, 252));
}

.acs-hybrid-version.acs-explained  .acs-contain {
    -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
       -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
            box-shadow: inset 0.5rem 0 0 0 rgb(var(--black-monochrome, 12, 12, 12));
}

.acs-hybrid-version.acs-explained  .acs-contain img {
    background-color: rgb(252, 252, 252);
    background-color: rgb(var(--white-monochrome, 252, 252, 252));
}

.acs-hybrid-version.acs-safe  .acs-contain {
    -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--one-color));
       -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--one-color));
            box-shadow: inset 0.5rem 0 0 0 rgb(var(--one-color));
}

.acs-hybrid-version.acs-safe  .acs-contain img {
    background-color: rgb(var(--one-color));
}

.acs-hybrid-version.acs-euclid  .acs-contain {
    -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--three-color));
       -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--three-color));
            box-shadow: inset 0.5rem 0 0 0 rgb(var(--three-color));
}

.acs-hybrid-version.acs-euclid  .acs-contain img {
    background-color: rgb(var(--three-color));
}

.acs-hybrid-version.acs-keter  .acs-contain {
    -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--five-color));
       -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--five-color));
            box-shadow: inset 0.5rem 0 0 0 rgb(var(--five-color));
}

.acs-hybrid-version.acs-keter  .acs-contain img {
    background-color: rgb(var(--five-color));
}

.acs-hybrid-text-bar > .acs-disrupt {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
    -ms-grid-column-span: 3;
    grid-area: disrupt;
    padding-left: 0.75em;
}

.acs-hybrid-text-bar > .acs-disrupt .disruption-class-number {
    color: rgba(0,0,0,0);
    position: relative;
}

.acs-hybrid-text-bar > .acs-disrupt .disruption-class-number::before {
    color: rgba(12, 12, 12, 1);
    color: rgba(var(--black-monochrome, 12, 12, 12),1);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.acs-hybrid-version.acs-dark > .acs-disrupt img {
    background-color: rgb(var(--one-color));
}

.acs-hybrid-version.acs-dark > .acs-disrupt {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
}

.acs-hybrid-text-bar.acs-dark > .acs-disrupt .disruption-class-number::before {
    content: "1"
}

.acs-hybrid-version.acs-vlam > .acs-disrupt img {
    background-color: rgb(var(--two-color));
}

.acs-hybrid-version.acs-vlam > .acs-disrupt {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
}

.acs-hybrid-text-bar.acs-vlam > .acs-disrupt .disruption-class-number::before {
    content: "2"
}

.acs-hybrid-version.acs-keneq > .acs-disrupt img {
    background-color: rgb(var(--three-color));
}

.acs-hybrid-version.acs-keneq > .acs-disrupt {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
}

.acs-hybrid-text-bar.acs-keneq > .acs-disrupt .disruption-class-number::before {
    content: "3"
}

.acs-hybrid-version.acs-ekhi > .acs-disrupt img {
    background-color: rgb(var(--four-color));
}

.acs-hybrid-version.acs-ekhi > .acs-disrupt {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
}

.acs-hybrid-text-bar.acs-ekhi > .acs-disrupt .disruption-class-number::before {
    content: "4"
}

.acs-hybrid-version.acs-amida > .acs-disrupt img {
    background-color: rgb(var(--five-color));
}

.acs-hybrid-version.acs-amida > .acs-disrupt {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
}

.acs-hybrid-text-bar.acs-amida > .acs-disrupt .disruption-class-number::before {
    content: "5"
}

.acs-hybrid-text-bar > .acs-risk {
    -ms-grid-row: 5;
    -ms-grid-column: 3;
    -ms-grid-column-span: 3;
    grid-area: risk;
    padding-left: 0.75em;
}

.acs-hybrid-text-bar > .acs-risk .risk-class-number {
    color: rgba(0,0,0,0);
    position: relative;
}

.acs-hybrid-text-bar > .acs-risk .risk-class-number::before {
    color: rgba(12, 12, 12, 1);
    color: rgba(var(--black-monochrome, 12, 12, 12),1);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.acs-hybrid-version.acs-notice > .acs-risk {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--one-color));
}

.acs-hybrid-version.acs-notice > .acs-risk img {
    background-color: rgb(var(--one-color));
}

.acs-hybrid-text-bar.acs-notice > .acs-risk .risk-class-number::before {
    content: "1";
}

.acs-hybrid-version.acs-caution > .acs-risk {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--two-color));
}

.acs-hybrid-version.acs-caution > .acs-risk img {
    background-color: rgb(var(--two-color));
}

.acs-hybrid-text-bar.acs-caution > .acs-risk .risk-class-number::before {
    content: "2";
}

.acs-hybrid-version.acs-warning > .acs-risk {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--three-color));
}

.acs-hybrid-version.acs-warning > .acs-risk img {
    background-color: rgb(var(--three-color));
}

.acs-hybrid-text-bar.acs-warning > .acs-risk .risk-class-number::before {
    content: "3";
}

.acs-hybrid-version.acs-danger > .acs-risk {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--four-color));
}

.acs-hybrid-version.acs-danger > .acs-risk img {
    background-color: rgb(var(--four-color));
}

.acs-hybrid-text-bar.acs-danger > .acs-risk .risk-class-number::before {
    content: "4";
}

.acs-hybrid-version.acs-critical > .acs-risk {
    -webkit-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
       -moz-box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
            box-shadow: inset 0.25rem 0 0 0 rgb(var(--five-color));
}

.acs-hybrid-version.acs-critical > .acs-risk img {
    background-color: rgb(var(--five-color));
}

.acs-hybrid-text-bar.acs-critical > .acs-risk .risk-class-number::before {
    content: "5";
}

@media (max-width: 1000px ) {

    .acs-hybrid-text-bar {
            grid-template-areas:
            "item item item item item item clear clear clear clear clear clear"
            "contain contain contain contain contain contain contain contain contain contain contain contain"
            "disrupt disrupt disrupt disrupt disrupt disrupt risk risk risk risk risk risk";
        -ms-grid-rows: 2rem 0 2rem 0 1.5rem;
        grid-template-rows: 2rem 2rem 1.5rem;
        -ms-grid-columns: -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12);
        -ms-grid-columns: -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12);
        -ms-grid-columns: calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12);
        grid-template-columns: repeat(12, -webkit-calc(100% / 12));
        grid-template-columns: repeat(12, -moz-calc(100% / 12));
        grid-template-columns: repeat(12, calc(100% / 12));
        height: 6.75rem;
        max-height: 50vh;
        line-height: 1.1;
        grid-gap: 0;
        background-color: rgba(0,0,0,0)
    }

    .acs-hybrid-text-bar > div {
        background-color: rgba(255, 255, 255,0);
    }

    .acs-hybrid-text-bar,
    .acs-hybrid-text-bar.acs-yes,
    .acs-hybrid-text-bar.acs-yes.acs-text-version {
        -ms-grid-rows: 2.25rem 0 2.5rem 0 2rem;
        grid-template-rows: 2.25rem 2.5rem 2rem;
        -ms-grid-columns: -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12) 0 -webkit-calc(100% / 12);
        -ms-grid-columns: -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12) 0 -moz-calc(100% / 12);
        -ms-grid-columns: calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12) 0 calc(100% / 12);
        grid-template-columns: repeat(12, -webkit-calc(100% / 12));
        grid-template-columns: repeat(12, -moz-calc(100% / 12));
        grid-template-columns: repeat(12, calc(100% / 12));
    }

    .acs-hybrid-text-bar > *:nth-child(1), .acs-hybrid-text-bar.acs-yes > *:nth-child(1), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }

    .acs-hybrid-text-bar > *:nth-child(2), .acs-hybrid-text-bar.acs-yes > *:nth-child(2), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }

    .acs-hybrid-text-bar > *:nth-child(3), .acs-hybrid-text-bar.acs-yes > *:nth-child(3), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 5;
    }

    .acs-hybrid-text-bar > *:nth-child(4), .acs-hybrid-text-bar.acs-yes > *:nth-child(4), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(4) {
        -ms-grid-row: 1;
        -ms-grid-column: 7;
    }

    .acs-hybrid-text-bar > *:nth-child(5), .acs-hybrid-text-bar.acs-yes > *:nth-child(5), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(5) {
        -ms-grid-row: 1;
        -ms-grid-column: 9;
    }

    .acs-hybrid-text-bar > *:nth-child(6), .acs-hybrid-text-bar.acs-yes > *:nth-child(6), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(6) {
        -ms-grid-row: 1;
        -ms-grid-column: 11;
    }

    .acs-hybrid-text-bar > *:nth-child(7), .acs-hybrid-text-bar.acs-yes > *:nth-child(7), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(7) {
        -ms-grid-row: 1;
        -ms-grid-column: 13;
    }

    .acs-hybrid-text-bar > *:nth-child(8), .acs-hybrid-text-bar.acs-yes > *:nth-child(8), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(8) {
        -ms-grid-row: 1;
        -ms-grid-column: 15;
    }

    .acs-hybrid-text-bar > *:nth-child(9), .acs-hybrid-text-bar.acs-yes > *:nth-child(9), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(9) {
        -ms-grid-row: 1;
        -ms-grid-column: 17;
    }

    .acs-hybrid-text-bar > *:nth-child(10), .acs-hybrid-text-bar.acs-yes > *:nth-child(10), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(10) {
        -ms-grid-row: 1;
        -ms-grid-column: 19;
    }

    .acs-hybrid-text-bar > *:nth-child(11), .acs-hybrid-text-bar.acs-yes > *:nth-child(11), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(11) {
        -ms-grid-row: 1;
        -ms-grid-column: 21;
    }

    .acs-hybrid-text-bar > *:nth-child(12), .acs-hybrid-text-bar.acs-yes > *:nth-child(12), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(12) {
        -ms-grid-row: 1;
        -ms-grid-column: 23;
    }

    .acs-hybrid-text-bar > *:nth-child(13), .acs-hybrid-text-bar.acs-yes > *:nth-child(13), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(13) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }

    .acs-hybrid-text-bar > *:nth-child(14), .acs-hybrid-text-bar.acs-yes > *:nth-child(14), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(14) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }

    .acs-hybrid-text-bar > *:nth-child(15), .acs-hybrid-text-bar.acs-yes > *:nth-child(15), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(15) {
        -ms-grid-row: 3;
        -ms-grid-column: 5;
    }

    .acs-hybrid-text-bar > *:nth-child(16), .acs-hybrid-text-bar.acs-yes > *:nth-child(16), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(16) {
        -ms-grid-row: 3;
        -ms-grid-column: 7;
    }

    .acs-hybrid-text-bar > *:nth-child(17), .acs-hybrid-text-bar.acs-yes > *:nth-child(17), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(17) {
        -ms-grid-row: 3;
        -ms-grid-column: 9;
    }

    .acs-hybrid-text-bar > *:nth-child(18), .acs-hybrid-text-bar.acs-yes > *:nth-child(18), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(18) {
        -ms-grid-row: 3;
        -ms-grid-column: 11;
    }

    .acs-hybrid-text-bar > *:nth-child(19), .acs-hybrid-text-bar.acs-yes > *:nth-child(19), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(19) {
        -ms-grid-row: 3;
        -ms-grid-column: 13;
    }

    .acs-hybrid-text-bar > *:nth-child(20), .acs-hybrid-text-bar.acs-yes > *:nth-child(20), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(20) {
        -ms-grid-row: 3;
        -ms-grid-column: 15;
    }

    .acs-hybrid-text-bar > *:nth-child(21), .acs-hybrid-text-bar.acs-yes > *:nth-child(21), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(21) {
        -ms-grid-row: 3;
        -ms-grid-column: 17;
    }

    .acs-hybrid-text-bar > *:nth-child(22), .acs-hybrid-text-bar.acs-yes > *:nth-child(22), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(22) {
        -ms-grid-row: 3;
        -ms-grid-column: 19;
    }

    .acs-hybrid-text-bar > *:nth-child(23), .acs-hybrid-text-bar.acs-yes > *:nth-child(23), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(23) {
        -ms-grid-row: 3;
        -ms-grid-column: 21;
    }

    .acs-hybrid-text-bar > *:nth-child(24), .acs-hybrid-text-bar.acs-yes > *:nth-child(24), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(24) {
        -ms-grid-row: 3;
        -ms-grid-column: 23;
    }

    .acs-hybrid-text-bar > *:nth-child(25), .acs-hybrid-text-bar.acs-yes > *:nth-child(25), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(25) {
        -ms-grid-row: 5;
        -ms-grid-column: 1;
    }

    .acs-hybrid-text-bar > *:nth-child(26), .acs-hybrid-text-bar.acs-yes > *:nth-child(26), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(26) {
        -ms-grid-row: 5;
        -ms-grid-column: 3;
    }

    .acs-hybrid-text-bar > *:nth-child(27), .acs-hybrid-text-bar.acs-yes > *:nth-child(27), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(27) {
        -ms-grid-row: 5;
        -ms-grid-column: 5;
    }

    .acs-hybrid-text-bar > *:nth-child(28), .acs-hybrid-text-bar.acs-yes > *:nth-child(28), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(28) {
        -ms-grid-row: 5;
        -ms-grid-column: 7;
    }

    .acs-hybrid-text-bar > *:nth-child(29), .acs-hybrid-text-bar.acs-yes > *:nth-child(29), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(29) {
        -ms-grid-row: 5;
        -ms-grid-column: 9;
    }

    .acs-hybrid-text-bar > *:nth-child(30), .acs-hybrid-text-bar.acs-yes > *:nth-child(30), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(30) {
        -ms-grid-row: 5;
        -ms-grid-column: 11;
    }

    .acs-hybrid-text-bar > *:nth-child(31), .acs-hybrid-text-bar.acs-yes > *:nth-child(31), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(31) {
        -ms-grid-row: 5;
        -ms-grid-column: 13;
    }

    .acs-hybrid-text-bar > *:nth-child(32), .acs-hybrid-text-bar.acs-yes > *:nth-child(32), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(32) {
        -ms-grid-row: 5;
        -ms-grid-column: 15;
    }

    .acs-hybrid-text-bar > *:nth-child(33), .acs-hybrid-text-bar.acs-yes > *:nth-child(33), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(33) {
        -ms-grid-row: 5;
        -ms-grid-column: 17;
    }

    .acs-hybrid-text-bar > *:nth-child(34), .acs-hybrid-text-bar.acs-yes > *:nth-child(34), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(34) {
        -ms-grid-row: 5;
        -ms-grid-column: 19;
    }

    .acs-hybrid-text-bar > *:nth-child(35), .acs-hybrid-text-bar.acs-yes > *:nth-child(35), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(35) {
        -ms-grid-row: 5;
        -ms-grid-column: 21;
    }

    .acs-hybrid-text-bar > *:nth-child(36), .acs-hybrid-text-bar.acs-yes > *:nth-child(36), .acs-hybrid-text-bar.acs-yes.acs-text-version > *:nth-child(36) {
        -ms-grid-row: 5;
        -ms-grid-column: 23;
    }

    .acs-hybrid-text-bar .acs-item {
        padding-left: 0.4rem !important;
        font-size: 1.15rem;
        border: 0 !important;
    }

    .acs-hybrid-text-bar .acs-item,
    .acs-hybrid-text-bar .acs-item * {
        -webkit-box-align: center;
        -webkit-align-items: center;
           -moz-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
           -moz-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
    }

    .acs-hybrid-text-bar .acs-contain {
        width: 100%
    }

    .acs-hybrid-text-bar.acs-yes .acs-contain {
        border-right: 0 solid rgba(0,0,0,0);
    }

    .acs-hybrid-text-bar.acs-yes .acs-secondary {
        padding-right: 0.125rem;
    }

    .acs-hybrid-text-bar.acs-explained,
    .acs-hybrid-text-bar.acs-neutralized,
    .acs-hybrid-text-bar.acs-pending {
            grid-template-areas:
            "item item clear"
            "contain contain contain";
        -ms-grid-rows: 2rem 0 2.5rem;
        grid-template-rows: 2rem 2.5rem;
        height: 4.75rem;
        max-height: 50vh;
    }

    .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon,
    .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon img {
        height: 110% !important;
    }

    .acs-hybrid-text-bar > .acs-clear strong,
    .acs-hybrid-text-bar > .acs-disrupt strong,
    .acs-hybrid-text-bar > .acs-risk strong {
        font-size: 0.55rem; 
        display: -webkit-box; 
        display: -webkit-flex; 
        display: -moz-box; 
        display: -ms-flexbox; 
        display: flex;
    }

    .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container {
        font-size: 0.8rem;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
           -moz-box-orient: horizontal;
           -moz-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-box-align: center;
        -webkit-align-items: center;
           -moz-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
           -moz-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }

    .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span:first-of-type {
      font-size: 0.75em;
    }

    .acs-hybrid-text-bar.acs-yes.acs-text-version .acs-contain-container .acs-text span:last-of-type {
      font-size: 1.15em;
      padding-bottom: 0.15em;
    }

    .acs-hybrid-text-bar .acs-contain {
        padding-left: 0.4rem;
    }

    .acs-hybrid-text-bar.acs-yes .acs-contain-container > div {
        height: 100%;
        width: 100%;
        -webkit-flex-shrink: 2;
            -ms-flex-negative: 2;
                flex-shrink: 2;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                   -moz-box-orient: vertical;
                   -moz-box-direction: normal;
                    -ms-flex-direction: column;
                        flex-direction: column;
        position: relative;
                -webkit-align-content: flex-start;
                    -ms-flex-line-pack: start;
                        align-content: flex-start;
    }

    .acs-hybrid-version.acs-yes .acs-contain-container .acs-text,
    .acs-hybrid-version.acs-yes .acs-contain-container .acs-icon {
        position: absolute;     
        top: 0;
        width: -webkit-calc(100% - 2rem);
        width: -moz-calc(100% - 2rem);
        width: calc(100% - 2rem);
        height: 100%;
        -webkit-box-pack: end;
        -webkit-justify-content: end;
           -moz-box-pack: end;
            -ms-flex-pack: end;
                justify-content: end;
    }

    .acs-hybrid-text-bar > .acs-item span {
        padding-left: 0 !important;
    }

    .acs-hybrid-version.acs-yes .acs-contain-container .acs-text,
    .acs-hybrid-text-bar.acs-yes .acs-contain-container .acs-text {
        padding-left: 0;
    }

    .acs-hybrid-text-bar > .acs-disrupt {
        padding-left: 0.600em;
    }

    .acs-hybrid-text-bar > .acs-risk {
        padding-left: 0.25rem;
    }

    .acs-hybrid-text-bar.acs-text-version .acs-contain-container {
        -webkit-box-shadow: inset 0 -0.125rem 0 0, inset 0 0.125rem 0 0;
           -moz-box-shadow: inset 0 -0.125rem 0 0, inset 0 0.125rem 0 0;
                box-shadow: inset 0 -0.125rem 0 0, inset 0 0.125rem 0 0;
    }

    .acs-hybrid-version.acs-yes .acs-contain-container .acs-icon,
    .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon {
        right: 0.15rem;
        height: 100%;
        width: initial;
        min-height: initial;
        min-width: initial;
        position: absolute;
        bottom: -0.25rem;
    }

    .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon img {
        max-height: 1.75rem;
        max-width: 1.75rem;
        margin-bottom: 0.25rem;
    }

    .acs-hybrid-version.acs-yes .acs-contain-container .acs-icon img,
    .acs-hybrid-text-bar:not(.acs-yes) .acs-contain-container .acs-icon img {
        width: 1.75rem;
        height: 1.75rem;
    }

    .acs-hybrid-version > .acs-disrupt .acs-icon, 
    .acs-hybrid-version > .acs-risk .acs-icon {
        height: 1.25rem;
        width: 1.25rem;
        min-height: 1.25rem;
        min-width: 1.25rem;
        position: absolute;
        right: 0.25rem;
    }

    .acs-hybrid-version.acs-clear-1 > .acs-clear {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
        padding-left: 0.25em;
        padding-bottom: 0.25em;
    }

    .acs-hybrid-version.acs-clear-2 > .acs-clear {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
        padding-left: 0.25em;
        padding-bottom: 0.25em;
    }

    .acs-hybrid-version.acs-clear-3 > .acs-clear {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
        padding-left: 0.25em;
        padding-bottom: 0.25em;
    }

    .acs-hybrid-version.acs-clear-4 > .acs-clear {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
        padding-left: 0.25em;
        padding-bottom: 0.25em;
    }

    .acs-hybrid-version.acs-clear-5 > .acs-clear {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
        padding-left: 0.25em;
        padding-bottom: 0.25em;
    }

    .acs-hybrid-version.acs-clear-6 > .acs-clear {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(12, 12, 12);
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(12, 12, 12);
                box-shadow: inset 0 -0.25rem 0 0 rgb(12, 12, 12);
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
        padding-left: 0.25em;
        padding-bottom: 0.25em;
    }

    .acs-hybrid-version > .acs-contain,
    .acs-hybrid-version > .acs-risk,
    .acs-hybrid-version > .acs-disrupt {
        position: relative;
        margin-bottom: 0em;
    }
    .acs-hybrid-version.acs-yes .acs-secondary,
    .acs-hybrid-version.acs-neutralized .acs-contain,
    .acs-hybrid-version.acs-esoteric .acs-contain {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
                box-shadow: inset 0 -0.25rem 0 0 rgba(var(--gray-monochrome, 66, 66, 72),0.15);
    }

    .acs-hybrid-version.acs-pending .acs-contain {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--white-monochrome, 12, 12, 12));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--white-monochrome, 12, 12, 12));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--white-monochrome, 12, 12, 12));
    }

    .acs-hybrid-version.acs-explained  .acs-contain {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--black-monochrome, 12, 12, 12));
    }

    .acs-hybrid-version.acs-safe  .acs-contain {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
    }

    .acs-hybrid-version.acs-euclid  .acs-contain {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
    }

    .acs-hybrid-version.acs-keter  .acs-contain {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
    }

    .acs-hybrid-version.acs-dark > .acs-disrupt {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
    }

    .acs-hybrid-version.acs-vlam > .acs-disrupt {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
    }

    .acs-hybrid-version.acs-keneq > .acs-disrupt {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
    }

    .acs-hybrid-version.acs-ekhi > .acs-disrupt {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
    }

    .acs-hybrid-version.acs-amida > .acs-disrupt {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
    }

    .acs-hybrid-version.acs-notice > .acs-risk {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--one-color));
    }

    .acs-hybrid-version.acs-caution > .acs-risk {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--two-color));
        position: relative;
    }

    .acs-hybrid-version.acs-warning > .acs-risk {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--three-color));
    }

    .acs-hybrid-version.acs-danger > .acs-risk {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--four-color));
    }

    .acs-hybrid-version.acs-critical > .acs-risk {
        -webkit-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
           -moz-box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
                box-shadow: inset 0 -0.25rem 0 0 rgb(var(--five-color));
    }

    .acs-hybrid-text-bar > .acs-item {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
        -ms-grid-column-span: 11
    }

    .acs-hybrid-text-bar.acs-explained > .acs-item, .acs-hybrid-text-bar.acs-neutralized > .acs-item, .acs-hybrid-text-bar.acs-pending > .acs-item {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
        -ms-grid-column-span: 3;
    }

    .acs-hybrid-text-bar > .acs-clear {
        -ms-grid-row: 1;
        -ms-grid-column: 13;
        -ms-grid-column-span: 11;
    border: 0 !important;
    }

    .acs-hybrid-text-bar.acs-explained > .acs-clear, .acs-hybrid-text-bar.acs-neutralized > .acs-clear, .acs-hybrid-text-bar.acs-pending > .acs-clear {
        -ms-grid-row: 1;
        -ms-grid-column: 5;
        -ms-grid-column-span: 1;
    }

    .acs-hybrid-text-bar .acs-contain-container {
        -ms-grid-row: 3;
        -ms-grid-row-span: 1;
        -ms-grid-column: 1;
        -ms-grid-column-span: 23;
        border: 0rem solid rgba(0, 0, 0, 0);
    }

    .acs-hybrid-text-bar.acs-explained > .acs-contain-container, .acs-hybrid-text-bar.acs-neutralized > .acs-contain-container, .acs-hybrid-text-bar.acs-pending > .acs-contain-container {
        -ms-grid-row: 3;
        -ms-grid-row-span: 1;
        -ms-grid-column: 1;
        -ms-grid-column-span: 5;
    }

    .acs-hybrid-text-bar > .acs-disrupt {
        -ms-grid-row: 5;
        -ms-grid-column: 1;
        -ms-grid-column-span: 11
    }

    .acs-hybrid-text-bar > .acs-risk {
        -ms-grid-row: 5;
        -ms-grid-column: 13;
        -ms-grid-column-span: 11
    }

}
[[/module]]

[[div_ class="acs-hybrid-text-bar acs-{$include-secondary} acs-{$version}-version acs-clear-{$clearance-level} acs-{$containment-class} acs-{$secondary-class} acs-{$disruption-class} acs-{$risk-class}"]]
[http://scp-wiki.wikidot.com/anomaly-classification-system-guide Link To Guide]
[[div_ class="acs-item"]]
[[span]]**Item#:**{$item-number}[[/span]]
[[/div]]
[[div_ class="acs-clear"]]
**Clearance Level {$clearance-level}:** [[span class="clearance-level-text"]]Clearance[[/span]]
[[/div]]
[[div_ class="acs-contain-container"]]
[[div_ class="acs-contain"]]
[[div_ class="acs-text"]]
[[span]]**Containment Class:**[[/span]] [[span]]{$containment-class}[[/span]]
[[/div]]
[[div_ class="acs-icon"]]
[[image http://scp-wiki.wdfiles.com/local--files/component%3Aanomaly-class-bar/{$containment-class}-icon.svg]]
[[/div]]
[[/div]]
[[div_ class="acs-secondary"]]
[[div_ class="acs-text"]]
[[span]]**Secondary Class:**[[/span]] [[span]]{$secondary-class}[[/span]]
[[/div]]
[[div_ class="acs-icon"]]
[[image {$secondary-icon}]]
[[/div]]
[[/div]]
[[/div]]
[[div_ class="acs-disrupt"]]
[[div_ class="acs-text"]]
**Disruption Class:** [[span class="disruption-class-number"]]#[[/span]]/{$disruption-class}
[[/div]]
[[div_ class="acs-icon"]]
[[image http://scp-wiki.wdfiles.com/local--files/component%3Aanomaly-class-bar/{$disruption-class}-icon.svg]]
[[/div]]
[[/div]]
[[div_ class="acs-risk"]]
[[div_ class="acs-text"]]
**Risk Class:** [[span class="risk-class-number"]]#[[/span]]/{$risk-class}
[[/div]]
[[div_ class="acs-icon"]]
[[image http://scp-wiki.wdfiles.com/local--files/component%3Aanomaly-class-bar/{$risk-class}-icon.svg]]
[[/div]]
[[/div]]
[[/div]]
[[/iftags]]
[[iftags +component-backend]]
[[module css]]
@import url("https://nu-scptheme.github.io/Black-Highlighter/stable/styles/normalize.min.css");
@import url("https://nu-scptheme.github.io/Black-Highlighter/stable/styles/black-highlighter.min.css");

h1 {
    color: rgb(var(--swatch-primary));
}
[[/module]]
[[=]]
+ Check Page Source for Code
[[/=]]
[[/iftags]]