polite-email-popup/generate/css/main.css

A polite email popup

body {
  margin-bottom: 6rem;
}

.hide {
  display: none;
}

.config {
  margin-bottom: 4rem;
}

h1 {
  margin-top: 4rem;
  margin-bottom: 4rem;
}

input[type="text"] {
  display: block;
  width: 100%;
  margin-bottom: 1rem;
}

input[type="radio"], input[type="radio"] + label, input[type="checkbox"], input[type="checkbox"] + label {
  cursor: pointer;
}

details {
  margin: 2rem 0;
}

details summary {
  font-size: 21px;
  font-weight: bold;
  cursor: pointer;
  color: #ffe066;
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

label {
  margin-top: 1.5rem;
  margin-bottom: .75rem;
  font-size: 18px;
  font-weight: bold;
}

.light {
  opacity: .5;
}

.label-note {
  color: #7d8389;
  font-weight: normal;
}

code {
  color: #dbdbdb;
}

.note {
  padding: 8px 12px 9px;
  background-color: rgba(255,255,255,.08);
  color: #ebebeb;
}

.note-heading {
  color: #ffe066;
  font-weight: bold;
}

.copy-code-button {
  background-color: #5f3dc4;
}

.copy-code-button:hover {
  background-color: #7048e8;
}

.mailchimp-config__hidden-form {
  display: none;
}

.mailchimp-config__code, .output-config__code {
  width: 100%;
  min-height: 22em;
}

.output-config__code {
  margin-bottom: 1rem;
}

.generate-code-button {
  font-size: 21px;
  font-weight: bold;
  padding: 1rem 1.5rem;
  background-color: #2f9e44;
}

.generate-code-button:hover {
  background-color: #257735;
}