:root {
  --leadershipintech-color: #ec615c;
  --leadershipintech-accented-color: #e9453f;
  --programming-color: #3670F7;
  --programming-accented-color: #195bf6;
  --react-color: #dea933;
  --react-accented-color: #d39d22;
  --csharp-color: #9b55a3;
  --csharp-accented-color: #8b4c93;
}

textarea, input[type="text"], input[type="button"], input[type="email"], input[type="password"], input[type="submit"], .btn { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; }

body { max-width: 38em; padding: 20px 60px; }
body > header { margin: 0; background: none; border: none; padding: 0 0 1rem 0; }
footer { margin-top: 2.5rem; text-align: center; }
h1 a, h2 a, h3 a { text-decoration: none; }
h1, h2, h3, h4, h5 { margin-bottom: 0.75rem; }
a:hover { text-decoration: none; }
.mb { margin-bottom: 2em; }

.success, .error {
  padding: 20px; margin: 1em 0; border-left: 5px solid var(--nc-bg-3);
  p { margin-bottom: 0; }
}
.success { background-color: #f2f9ef; border-color:#090; }
.error { background-color: #fdf7f7; border-color: #d9534f;}

.only-light { display: inline-block; }
.only-dark { display: none; }

.logo {
  a { display: flex; text-decoration: none; }
  h1, .heading { font-size: 2.25rem; font-weight: bold; display: block; margin-left: 0.5em; margin-bottom: 0.5em; padding-top: 0; line-height: 64px; }
}

.subscribers.new em { background: #fcead4; font-style: normal; }
.perex { font-size: 1.3em; line-height: 160%; margin-bottom: 1.5em; }

.testimonials { display: flex; }
.testimonials blockquote {
  min-width: 190px; box-sizing: border-box; margin-right: 1em; padding-left: 1em;
  &:before { content: '“' }
  &:after { content: '”' }
}
.testimonials:last-child { margin-right: 0; }

.subscribe-form {
  padding-top: 0.25em;
  input[type="email"] { width: 22em; display: inline-block; margin: 0; padding: 1em; font-size: 1em; }
  .email-feedback { color: #d9534f; margin: 0 auto; height: 35px; font-size: 100%; }
  input[type="submit"] { margin: 0 0 0 0.25em; display: inline-block; padding: 1em; }
}

.unsubscribe form {
  textarea, input[type="submit"] { display: block; margin-bottom: 1em; }
}

.brands {
  img { margin: 0.5rem 1rem 1rem 0; max-width: 200px; height: 32px; }
}

.newsletters.index {
  h2 { margin-bottom: 0; font-size: 1.15em; border: none; }
}

.campaign em { background: none; font-style: italic; }

.pagy { margin-top: 2em; text-align: center; }
.pagy a { margin-right: 0.5em; border: 1px solid var(--nc-bg-3); border-radius: 3px; background-color: var(--nc-bg-2); display: inline-block; padding: 0 6px; }
.pagy a.current { background-color: var(--nc-bg-1); }

.leadershipintech {
  input[type="submit"], .btn { background: var(--leadershipintech-color); border: 2px solid var(--leadershipintech-color); &:hover { background: var(--leadershipintech-accented-color); } }
  header h1, .heading { color: var(--leadershipintech-color); }
  a, a:visited, .a:active { color: var(--leadershipintech-color); }
}

.programming {
  input[type="submit"], .btn { background: var(--programming-color); border: 2px solid var(--programming-color); &:hover { background: var(--programming-accented-color); } }
  header h1, .heading { color: var(--programming-color); }
  a, a:visited, a:active { color: var(--programming-color); }
}

.react {
  input[type="submit"], .btn { background: var(--react-color); border: 2px solid var(--react-color); &:hover { background: var(--react-accented-color); } }
  header h1, .heading { color: var(--react-color); }
  a, a:visited, a:active { color: var(--react-color); }
}

.csharp {
  input[type="submit"], .btn { background: var(--csharp-color); border: 2px solid var(--csharp-color); &:hover { background: var(--csharp-accented-color); } }
  header h1, .heading { color: var(--csharp-color); }
  a, a:visited, a:active { color: var(--csharp-color); }
}

@media screen and (max-width: 720px) {
  body { padding: 20px; }
  .logo {
    a { display: block; text-align: center; }
    h1, .heading { margin-left: 0; }
  }

  .testimonials { display: block; }
  .testimonials blockquote { margin-right: 0; }

  .subscribe-form {
    input[type="email"] { width: 100%; box-sizing: border-box; display: block; }
    input[type="submit"] { width: 100%; box-sizing: border-box; display: block; margin: 1em 0; }
  }

  .brands { display: none; }
}

@media (prefers-color-scheme: dark) {
  .subscribers.new em { color: var(--nc-bg-2); }
  .success { border-color: #4caf50; background-color: #1b5e20; }
  .only-light { display: none; }
  .only-dark { display: inline-block; }
}