.site2 {
  font-family: var(--site-font);
  background-color: var(--background-color);
}

.site2>.drawer {
  margin: 0;
  padding: 0;
  color: var(--site-drawer-color);
  background-color: var(--site-drawer-bgcolor);
  transition: width .5s ease-in-out;
}

.site2>header {
  font-size: var(--site-header-font-size, 1.4rem);
  font-weight: 500;
  color: var(--site-header-color);
  background-color: var(--site-header-bgcolor);
  display: flex;
  align-items: center;
}

.site2>header>.site-logo>.site-title {
  font-size: var(--site-header-font-size, 1rem);
  font-weight: 500;
}

.site2>header input {
  max-height: 2.6rem;
}

.site2>footer {
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--site-footer-color);
  background-color: var(--site-footer-bgcolor);
  align-items: flex-start;
}

.site2>nav .tab {
  color: rgba(100,100,100,.6);
}

.site2>nav .tab.selected {
  color: var(--accent-color);
  border-bottom: 0;

}

.snackbar {
  background-color: rgba(0,0,0,.87);
  color: rgba(255,255,255,.87);
  font-size: 1.4rem;
}

.snackbar .button {
  color: var(--accent-color);
}

.preview {
  z-index: 101;
  margin: 1rem;
  max-height: calc(100% - 2rem);
  overflow: auto;
  position: relative;
}

.preview>header {
  position: absolute;
  top: 0px;
  width: 100%;
  background-color: rgba(100,100,100,.5);
  color: white;
}