section.newsletter { margin-bottom: 50px; }
section.newsletter p { font-family: Yanone Kaffeesatz, Helvetica, Arial, sans-serif; font-size: 24px; line-height: 28px; }
section.newsletter .banner {
  position: relative;
  display: flex;
  width: 100%;
  height: 470px;
  color: #FFF;
  /*padding: 200px 50px 50px 80px;*/
  padding: 0 50px 0 85px;
  background: #22B0CC url('/ressources/newsletter/background-newsletter.jpg') center no-repeat;
  background-size: cover;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
}
/*section.newsletter .banner:before {
  content: '';
  position: absolute;
  top: -50%;
  left: 53%;
  width: 100%;
  height: 200%;
  background-color: #f3b001;
  transform: rotateZ(17deg);
  z-index: 1;
}*/
section.newsletter .banner img {
  position: absolute;
  top: 90px;
  right: 35%;
  z-index: 2;
}

section.newsletter .banner .title { position: relative; width: 40%; align-self: flex-end; margin-bottom: 50px; z-index: 2; }
section.newsletter .banner .title:before {
  content: "";
  position: absolute;
  top: -5px;
  left: -35px;
  width: 17px;
  height: 90px;
  background-color: #f3b001;
}
section.newsletter .banner .title h2 {
  color: #FFF;
}
section.newsletter .banner .title h2,
section.newsletter .banner .title h3 {
  font-size: 40px;
}
section.newsletter .banner .hook { margin: 20px 0 0 0; }

@media screen and (min-width: 992px) {
  section.newsletter .banner .hook { max-width: 230px; }
}

section.newsletter .banner .about { position: relative; width: 32%; text-align: left; z-index: 2; }

section.newsletter .banner h2 { font-size: 30px; line-height: 36px; margin-bottom: 10px; }
section.newsletter .banner h3 { font-size: 40px; line-height: 44px; margin-bottom: 20px; }

section.newsletter .banner .about .main-title {
  font-family: 'Poppins', sans-serif;
  /*font-size: 40px;
  line-height: 44px;*/
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
}
section.newsletter .banner .about .main-title .count,
section.newsletter .banner .about .main-title .type {
  display: block;
}
section.newsletter .banner .about .main-title .count { font-size: 130px; line-height: 120px; color: #437d9a; font-weight: 500; font-style: italic; }
section.newsletter .banner .about .main-title .type { font-size: 38px; line-height: 40px; }
section.newsletter .banner .about .main-title .more { font-size: 32px; line-height: 32px; font-weight: 500; }
section.newsletter .banner .about .main-title .win { font-size: 47px; line-height: 52px; }

section.newsletter .banner .sponsorship-link-container { margin: 20px 0 0 0; }
section.newsletter .banner .sponsorship { display: inline-block; color: #FFF; padding: 3px 10px; background-color: #f3b001; }


/* Sponsorship banner */
section.newsletter-sponsorship .banner {
  width: auto;
  padding-left: 60px;
  margin-left: -15px;
  margin-right: -15px;
  background-image: url('/ressources/newsletter/background-sponsorship.jpg');
}
/*section.newsletter-sponsorship .banner .about .main-title {
  font-size: 48px;
  line-height: 54px;
}
section.newsletter-sponsorship .banner .about .main-title .count { font-size: 160px; line-height: 130px; }
section.newsletter-sponsorship .banner .about .main-title .type { font-size: 48px; line-height: 54px; }
section.newsletter-sponsorship .banner .about .main-title .more { font-size: 30px; line-height: 36px; }
section.newsletter-sponsorship .banner .about .main-title .win { font-size: 57px; line-height: 62px; }*/

@media screen and (min-width: 992px) {
  section.newsletter-sponsorship .banner .hook { max-width: 325px; }
}

/* Sponsorship form */
.form-error-list {
  display: none;
  padding: 10px;
  margin: 0 0 20px 0;
  background: #FFF;
  border-left: 4px solid #dc3232;
  -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
  box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
}

.newsletter-sponsorship .columns { overflow: hidden; }
.newsletter-sponsorship .col-left { float: left; width: 48%; margin: 0 1%; }
.newsletter-sponsorship .col-right { float: right; width: 48%; margin: 0 1%; }
.newsletter-sponsorship .field { margin-bottom: 10px; overflow: hidden; }
.newsletter-sponsorship .field input[type="text"] { float: right; width: 300px; }
.newsletter-sponsorship .send { text-align: center; }

.newsletter-sponsorship .validation { display: none; text-align: center; font-size: 20px; line-height: 26px; }
.newsletter-sponsorship .validation img { width: 62px; }


/*@media screen and (min-width: 1024px) {
  .creactiveContactForm .lists { width: 48%; margin-left: 52%; }
}

.creactiveContactForm .lists label { font-size: 14px; line-height: 18px; }
.creactiveContactForm input[type="submit"] { float: right; color: #212529; padding: 10px 30px; background: #FFF; border: none; }*/

.creactiveContactForm .success { font-size: 18px; text-align: center; }
.creactiveContactForm .success img { display: inline-block; height: 40px; margin: 20px 10px; }


@media screen and (max-width: 991px) {
  section.newsletter .banner { display: block; height: auto; padding: 50px; background-image: url('/ressources/newsletter/background-newsletter-768.jpg'); }
  section.newsletter .banner:before { content: none; }
  section.newsletter .banner img { display: none; }
  section.newsletter .banner .title,
  section.newsletter .banner .about {
    width: 100%; text-align: center;
  }
  section.newsletter .banner .title { margin-bottom: 50px; }
  section.newsletter .banner .title:before { content: none; }
  section.newsletter .banner .about .main-title .count { color: #FFF; }
  section.newsletter .banner .about .sponsorship { background-color: #f3b001; }


  section.newsletter-sponsorship .banner { background-image: url('/ressources/newsletter/background-sponsorship-768.jpg'); }
}
