html,
body{
  min-height: 100%;
}

body {
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

#header{
  background: rgba(0, 0, 0, .8);
  border-radius: 24px;
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  margin-top: 4rem;
  margin-bottom: 2rem;
  padding: 20px;
}

.logo-precision{
  max-width: 400px;
  margin-bottom: 4rem;
}

.content{
  background: rgba(0,0,0,.8);
  border-radius: 24px;
  color: #fff;
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  margin-top: 6rem;
  margin-bottom: 3rem;
  padding: 30px;
}

.logo-ketchum{
  position: absolute;
  bottom: 30px;
  right: 30px;
  width: 200px;
  opacity: .7;
}

.drawer-toggler{
  background-color: #666;
  border-bottom: 1px solid #333;
  border-radius: 8px;
}

.drawer-toggler .drawer-toggler-icon{
  --mdc-theme-text-disabled-on-light: #333;
}

drawer-wrapper:hover .drawer-toggler,
drawer-wrapper:hover .drawer-toggler-icon {
  --mdc-theme-text-disabled-on-light: #333;
  color: #333;
}

drawer-wrapper .drawer{
  padding: 1rem;
}

.public-form mwc-textfield{
  --mdc-text-field-outlined-idle-border-color: #fff;
  --mdc-text-field-outlined-hover-border-color: #fff90;
  --mdc-text-field-label-ink-color: #fff;
}

.format-common-tags p{
  margin-bottom: 1rem;
}

.drawer-toggler{
  background: #EEEEEE;
  color: var(--on-surface);
}

drawer-wrapper:hover > div.drawer-toggler,
.drawer-toggler[open="true"] {
  background: #8d5bc6;
  color: #fff;
}

@media (max-width: 700px) {
  .content{
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    left: unset;
    margin-top: 40px;
    position: static;
    top: unset;
    transform: unset;
  }

  .logo-ketchum{
    position: static;
    margin: 0 auto;
    margin-top: 30px;
    margin-bottom: 30px;
  }
}