/*

  Stripped down CSS Reset, limited to the most common elements.
  Based on the HTML5 Reset Wordpress Theme :: https://github.com/murtaugh/HTML5-Reset-Wordpress-Theme

  If you need to add some specific elements (pre, bloquotes/q, input/textarea/select/label,tables,etc.), please visit: https://github.com/murtaugh/HTML5-Reset-WordPress-Theme/blob/master/reset.css

-------------------------------------------------------------------------------*/
/* Let's default this puppy out
-------------------------------------------------------------------------------*/
h1,
h2,
h3,
p,
ol,
ul,
label,
form,
fieldset {
  margin: 0;
  padding: 0;
  font-size: inherit;
}

main,
footer,
header,
section,
li {
  display: block;
}

/* Handle box-sizing while better addressing child elements:
   http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

/* force a vertical scrollbar to prevent a jumpy page */
html {
  overflow-y: scroll;
}

/* Prevent Webkit and Windows Mobile platforms from changing default font sizes */
html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

/* Make sure all styling variations display equally everywhere
-------------------------------------------------------------------------------*/
ol, ul {
  list-style: none;
}

strong {
  font-weight: bold;
}

/* Make sure sup and sub don't mess with your line-heights http://gist.github.com/413930 */
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Default interactive elements on your page
-------------------------------------------------------------------------------*/
a,
input[type=submit] {
  cursor: pointer;
  color: inherit;
}

a {
  text-decoration: none;
}

input[type=submit] {
  overflow: visible;
  border: 0;
  font: inherit;
  -webkit-font-smoothing: inherit;
  letter-spacing: inherit;
  background: none;
  cursor: pointer;
  -webkit-appearance: button; /* 2 */
}

::-moz-focus-inner {
  padding: 0;
  border: 0;
  border-style: none;
}

input[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/* Forms never were that easy to style
-------------------------------------------------------------------------------*/
fieldset {
  border: 0;
  padding: 0.01em 0 0 0;
  margin: 0;
  min-width: 0;
}

body:not(:-moz-handler-blocked) fieldset {
  display: table-cell;
}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
input, select {
  margin: 0;
  vertical-align: middle;
  font: inherit;
}

.ie6 input {
  vertical-align: text-bottom;
}

input[type=text], input[type=url] {
  border: none;
}

/* Images ? Responsive ?
-------------------------------------------------------------------------------*/
img {
  max-width: 100%;
  height: auto;
  border: 0;
}

/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic;
}

/* let's clear some floats
-------------------------------------------------------------------------------*/
.clearfix:before, footer:before, .columns:before, .clearfix:after, footer:after, .columns:after {
  content: " ";
  display: block;
  height: 0;
  overflow: hidden;
}

.clearfix:after, footer:after, .columns:after {
  clear: both;
}

.clearfix, footer, .columns {
  zoom: 1;
}

/* quicksand-300 - latin-ext_latin */
@font-face {
  font-family: "Quicksand";
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/quicksand/quicksand-v6-latin-ext_latin-300.eot"); /* IE9 Compat Modes */
  src: url("../fonts/quicksand/quicksand-v6-latin-ext_latin-300.eot?#iefix") format("embedded-opentype"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-300.woff2") format("woff2"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-300.woff") format("woff"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-300.ttf") format("truetype"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-300.svg#Quicksand") format("svg"); /* Legacy iOS */
}
/* quicksand-regular - latin-ext_latin */
@font-face {
  font-family: "Quicksand";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/quicksand/quicksand-v6-latin-ext_latin-regular.eot"); /* IE9 Compat Modes */
  src: url("../fonts/quicksand/quicksand-v6-latin-ext_latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-regular.woff2") format("woff2"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-regular.woff") format("woff"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-regular.ttf") format("truetype"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-regular.svg#Quicksand") format("svg"); /* Legacy iOS */
}
/* quicksand-700 - latin-ext_latin */
@font-face {
  font-family: "Quicksand";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/quicksand/quicksand-v6-latin-ext_latin-700.eot"); /* IE9 Compat Modes */
  src: url("../fonts/quicksand/quicksand-v6-latin-ext_latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-700.woff2") format("woff2"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-700.woff") format("woff"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-700.ttf") format("truetype"), url("../fonts/quicksand/quicksand-v6-latin-ext_latin-700.svg#Quicksand") format("svg"); /* Legacy iOS */
}
html, body {
  margin: 0;
  padding: 0;
  font-family: "Quicksand", sans-serif;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.025em;
  color: #32374b;
}

.wrapper {
  margin: auto;
  padding: 0 1rem;
}
@media (min-width: 991px) {
  .wrapper {
    max-width: 860px;
    padding: 0;
  }
}
@media (min-width: 1199px) {
  .wrapper {
    max-width: 1100px;
  }
}

@media (min-width: 991px) {
  .columns > * {
    float: left;
  }
  .columns .left-col {
    width: 40%;
  }
  .columns .right-col {
    width: 60%;
  }
}

.site-content {
  background: #ebf0f5;
  padding: 4rem 0 2rem;
}
.site-content .cnil-mentions {
  font-size: 0.8rem;
  font-weight: 400;
  margin-top: 4rem;
}

.dropdown {
  position: relative;
}
.dropdown > span.selected-option {
  background: #fff;
  color: #32374b;
  display: block;
  padding: 1rem 2rem;
  cursor: pointer;
}
.dropdown > span.selected-option:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 1rem;
  margin-top: -7px;
  height: 14px;
  width: 14px;
  background-image: url(../images/arrow.svg);
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}
.dropdown > span.selected-option.default-option {
  padding: 1rem;
  color: #b1b6cb;
}
.dropdown > span.selected-option.default-option:after {
  right: 1rem;
}
.dropdown .dropdown-inner {
  display: none;
  overflow: hidden;
  margin-top: 2px;
  padding: 0.5rem 0;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.2);
  z-index: 10;
}
.dropdown .dropdown-inner > li {
  display: block;
  padding: 0.5rem 1rem;
  cursor: pointer;
}
.dropdown .dropdown-inner > li:hover {
  background: #00d18b;
  color: #fff;
}
.dropdown.opened > span.selected-option:after,
.dropdown.opened > span.selected-option:before {
  transform: rotate(180deg);
}
.dropdown.opened .dropdown-inner {
  display: block;
}

.site-header {
  text-align: center;
  padding: 4rem 0;
  font-weight: 700;
  letter-spacing: 0.15em;
}
.site-header .top-icon {
  width: 40%;
  max-width: 7rem;
  margin: 0 auto;
  margin-bottom: 1rem;
}
.site-header .top-icon:before {
  content: "";
  display: block;
  padding-top: 100%;
  height: 0;
  background: url(../images/top-icon.svg);
  background-size: 100% 100%;
  background-position: 50% 50%;
}
.site-header h1 {
  color: #00d18b;
  font-size: 1.5rem;
}
@media (min-width: 991px) {
  .site-header h1 {
    font-size: 2.2rem;
  }
}
.site-header p {
  font-size: 1rem;
}
@media (min-width: 991px) {
  .site-header p {
    font-size: 1.5rem;
  }
}

.thanks-container {
  position: relative;
  text-align: center;
}
.thanks-container .intro-text {
  width: 80%;
  margin: 0 auto;
}
@media (min-width: 991px) {
  .thanks-container .intro-text {
    width: 100%;
    padding-left: 14.6em;
    min-height: 13.8em;
    padding-top: 3rem;
    margin: 0;
  }
  .thanks-container .intro-illustration {
    width: 13em;
    text-align: right;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.intro-text {
  width: 90%;
  margin-bottom: 2rem;
}
.intro-text p {
  margin-bottom: 1rem;
}
.intro-text p.important-text {
  font-size: 1.4rem;
  color: #00d18b;
  text-transform: uppercase;
}
.intro-text p.important-text a {
  text-decoration: underline;
}

.intro-text p a,
.intro-illustration {
  max-width: 90%;
}

.intro-illustration {
  display: none;
  border-radius: 50%;
  margin-bottom: 1rem;
}
@media (min-width: 991px) {
  .intro-illustration {
    display: inline-block;
  }
}

.signalspam-link {
  display: block;
  background: #fff;
  margin-top: 2rem;
  border-radius: 1rem;
  padding: 0 1rem;
  width: 10rem;
}
.signalspam-link img {
  display: block;
  width: 100%;
  height: auto;
}

.form-container fieldset {
  margin-bottom: 2rem;
}
.form-container label {
  display: inline-block;
  margin: 0 auto 1rem;
}
.form-container input[type=text],
.form-container textarea {
  width: 100%;
  background-color: #fff;
  color: #32374b;
  font-size: 1rem;
  font-weight: 700;
  padding: 1rem;
  border: none;
  font-family: "Quicksand", sans-serif;
  resize: vertical;
}
.form-container input[type=text]::-moz-placeholder, .form-container textarea::-moz-placeholder {
  color: #b1b6cb;
  opacity: 1;
}
.form-container input[type=text]::placeholder,
.form-container textarea::placeholder {
  color: #b1b6cb;
  opacity: 1;
}
.form-container input[type=submit] {
  font-weight: 700;
  text-transform: uppercase;
  background: #32374b;
  border-radius: 2rem;
  padding: 1rem;
  margin: 0 auto;
  color: #00d18b;
  white-space: normal;
  transition: all 100ms ease-in-out;
}
.form-container input[type=submit]:hover {
  background: #00d18b;
  color: #fff;
}
.form-container input[type=submit].disabled-input {
  background: #dce7ef;
  cursor: not-allowed;
}
@media (min-width: 991px) {
  .form-container input[type=submit] {
    margin: 0 10%;
    width: 80%;
  }
}

.alert-danger {
  font-size: 0.75rem;
  margin-top: 0.25rem;
  color: #ce3434;
}

.alert-redirection {
  text-align: left;
  background: #32374b;
  margin-top: 2px;
  padding: 1rem;
  border-radius: 2rem;
  color: #fff;
}
.alert-redirection.alert-template {
  display: none;
}
.alert-redirection p {
  font-weight: 400;
  font-style: italic;
}
.alert-redirection a {
  color: #00d18b;
}
.alert-redirection a:hover {
  text-decoration: underline;
}

footer {
  background: #32374b;
  color: #fff;
  padding: 4rem 0;
  position: relative;
  overflow: hidden;
}

.footer-logo {
  display: block;
  width: 20rem;
  margin-bottom: 1rem;
}
.footer-logo img {
  max-width: 100%;
  height: auto;
}

.footer-about h2 {
  text-transform: uppercase;
}

.footer-about > p {
  font-size: 0.8rem;
  font-weight: 400;
  margin-top: 2em;
  margin-bottom: 2em;
}

.footer-about address p {
  font-style: normal;
  text-transform: uppercase;
  color: #00d18b;
}

@media (min-width: 991px) {
  .footer-logo {
    width: 25%;
    float: left;
  }
  .footer-about {
    width: 67%;
    float: right;
  }
  .footer-about address p {
    float: right;
  }
}