body {
  justify-content: center;
  align-items: center;
  display: flex;
  height: 100vh;
}


 

#demo {
  max-width: 40ch;
  padding: 48px;
}
.pad {
  padding: 32px;
}
.heading {
  padding-left: 1.5rem;
  padding-top: 12px;
  padding-bottom: 12px;
  border-bottom: solid 1px #ddd;
  font-weight: 600;
}

#new-icons{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
#new-icons div {
  width:8rem;
  cursor: pointer;
  padding:1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  border:1px solid grey;

}

#new-icons div > small{
  width:100%;
  word-wrap: break-word;
}

@font-face {
  font-family: "colfax-regular";
  src: url("https://assets.aquera.io/font/Colfax-Regular.otf")
    format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "colfax-medium";
  src: url("https://assets.aquera.io/font/Colfax-Medium.otf")
    format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 500;
}


.stack {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.stack--hor {
  display: flex;
  flex-direction: row;
  gap: 12px;
}

.hstack {
  display: flex;
  flex-direction: row;
  align-items: center;
  align-self: stretch;
}

.vstack {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-self: stretch;
}

nile-drawer {
  display: flex;
  flex-direction: column;
}

[slot='footer'] {
  padding-top: 0;
}

.container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.nds-help {
  font-size: 12px;
}

.frame-left-lg {
  padding-left: 4rem;
}

.body {
  display: flex;
}


nile-input:not(:defined),
nile-button:not(:defined),
nile-icon:not(:defined),
nile-icon-button:not(:defined),
nile-tree:not(:defined),
nile-table:not(:defined),
nile-sidebar-menu:not(:defined),
nile-filter-chip:not(:defined),
nile-radio-group:not(:defined),
nile-popover:not(:defined),
nile-option:not(:defined),
nile-sidebar-wrapper:not(:defined),
nile-card:not(:defined),
nile-table-body:not(:defined),
nile-list-item:not(:defined),
nile-tab-group:not(:defined),
nile-vertical-stepper-item:not(:defined),
nile-tab:not(:defined),
nile-content-editor:not(:defined),
nile-tab-panel:not(:defined),
nile-drawer:not(:defined),
nile-error-notification:not(:defined),
nile-menu-item:not(:defined),
nile-divider:not(:defined),
nile-date-picker:not(:defined),
nile-footer:not(:defined),
nile-chip:not(:defined),
nile-slide-toggle:not(:defined),
nile-progress-bar:not(:defined),
nile-auto-complete:not(:defined),
nile-tree-item:not(:defined),
nile-form-help-text:not(:defined),
nile-sidebar-menu-items:not(:defined),
nile-section-message:not(:defined),
nile-table-row:not(:defined),
nile-badge:not(:defined),
nile-file-upload:not(:defined),
nile-textarea:not(:defined),
nile-checkbox:not(:defined),
nile-page-header:not(:defined),
nile-file-preview:not(:defined),
nile-tooltip:not(:defined),
nile-inline-edit:not(:defined),
nile-circular-progressbar:not(:defined),
nile-breadcrumb:not(:defined),
nile-sidebar:not(:defined),
nile-table-header-item:not(:defined),
nile-popup:not(:defined),
nile-link:not(:defined),
nile-button-toggle-group:not(:defined),
nile-stepper-item:not(:defined),
nile-select:not(:defined),
nile-button-filter:not(:defined),
nile-empty-state:not(:defined),
nile-tag:not(:defined),
nile-table-cell-item:not(:defined),
nile-radio:not(:defined),
nile-breadcrumb-item:not(:defined),
nile-list:not(:defined),
nile-menu:not(:defined),
nile-title:not(:defined),
nile-heading:not(:defined),
nile-code-editor:not(:defined),
nile-toast:not(:defined),
nile-toolbar:not(:defined),
nile-calendar:not(:defined),
nile-accordion:not(:defined),
nile-form-error-message:not(:defined),
nile-avatar:not(:defined),
nile-switcher:not(:defined),
nile-spinner:not(:defined),
nile-form-group:not(:defined),
nile-hero:not(:defined),
nile-dialog:not(:defined),
nile-split-panel:not(:defined),
nile-error-message:not(:defined),
nile-hero-header:not(:defined),
nile-dropdown:not(:defined),
nile-format-date:not(:defined),
nile-loader:not(:defined),
nile-button-toggle:not(:defined),
nile-stepper:not(:defined) {
  opacity: 0;
}