body, html {
    background-color: #f0f0f0;
    color: #595959;
    margin: 0;
    padding: 0;
    font-size: 100%;
    font: inherit;
}
@media  (min-width : 30rem) {
  body{
    padding: 3vw;
    font-family:'Helvetica Neue', Arial, sans-serif;
  }
}
h1, h2, h3 {
    color:#00148C;
    font-weight: normal;
    font-family:'Helvetica Neue', Arial, sans-serif;
}
h1{
  font-size: 1.875rem;
  margin-bottom: 1rem;
}
p {
    font-family:'Avenir','Helvetica','Arial',sans-serif;
    margin-bottom:10px;
}

h1 + h2{
  font-size: 2.125rem;
}

header, section{
  background-color: #ffffff;
  overflow: hidden;
  margin: 0 auto;
  width: auto;
  max-width: 50rem;
  max-width: calc(50rem + 6vw);
}

.header-logo{
  max-width: 90%;
  width: 197px;
  margin: 2vw auto;
  display: block;
}
@media  (min-width : 40rem) {
  .header-logo{
    margin: 1.5rem auto;
  }
}
.header-graphic{
  display: block;
  width: 100%;
}

section{
  padding: 3vw;
  box-sizing: border-box;
}
@media  (min-width : 50rem) {
  section{
    padding: 2rem;
  }
}

section#entry,
section#thanks,
section#closed{
  display: none;

}


@media  (min-width : 40rem) {
  section header{
    text-align: center;
  }
  section header h1{
    max-width: 28rem;
    margin-left: auto;
    margin-right: auto;
  }

  section header p{
    max-width: 32rem;
    margin-left: auto;
    margin-right: auto;
  }

  section#entry header p{
    max-width: 37rem;
    margin-left: auto;
    margin-right: auto;
  }

  #form{
    margin: 2vw auto 0;
    max-width: 30rem;
  }
}

@media  (min-width : 60rem) {
  section header h1{
    max-width: 40rem;
    margin-left: auto;
    margin-right: auto;
  }
}

section header > *:first-child{
  margin-top: 0;
}
section header > *:last-child{
  margin-bottom: 0;
}

.form-group {
  display: block;
  margin: 0 0 1rem 0;
  position: relative;
  clear: both;
}
.form-group label{
  display: block;
  font-size: .9rem;
  font-weight: normal;
  font-family:'Avenir','Helvetica','Arial',sans-serif;
}
.form-group input[type='text'],
.form-group input[type='email'],
.form-group input[type='tel']{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
  font-weight: normal;
  border: 2px solid #d8d8d8;
  color: #53565a;
  height: 50px;
  letter-spacing: -.1px;
  padding: 13.33333px;
  box-sizing: border-box;
  width: 100%;
}
.form-group input[type='checkbox']{
  width: auto;
  height: auto;
  padding: 0;
}

 .form-group--checkbox input{
   float: left;
 }
 .form-group--checkbox label{
  padding-left: 1.2rem;
 }

.btn{
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.25rem;

    background-color:#5fb84c;

    font-weight:700;
    color:#ffffff;
    border-radius: 0;
    padding: .7rem 2.5rem;
    width: 100%;
    border: 0;
}
.btn:hover,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    color:#ffffff;
    outline: none;
    outline-offset: 0;
    background-color:#5fb84c;
}
.btn + p{
  margin-top: 1rem;
}

@media  (min-width : 30rem) {
  .btn {
    width: auto;
  }
}

.alert {
    margin-top: 20px;
}
.error {
    color: red;
}

.form-group input[type='text'].error,
.form-group input[type='email'].error,
.form-group input[type='tel'].error{
  border: solid 2px red;
  margin-bottom: .5em;
}