/* ------ Step ------ */
.block-cosm-user-create-account-step-block,
.counter-step {
  counter-reset: step;
}
.block-cosm-user-create-account-step-block ul,
.counter-step ul {
  display: flex;
  width: 100%;
  margin: 100px 0 0;
}
.block-cosm-user-create-account-step-block ul li,
.counter-step ul li {
  flex: 1;
  position: relative;
  padding: 0 10px;
  margin: 0;
  text-align: center;
  counter-increment: question;
  line-height: 1em;
}
.block-cosm-user-create-account-step-block ul li:before,
.counter-step ul li:before {
  z-index: 1;
  position: absolute;
  width: 40px;
  height: 40px;
  left: 50%;
  top: -60px;
  font: 400 15px/40px 'Montserrat', sans-serif;
  color: #181818;
  content: counter(question);
  background: #FFF;
  border-radius: 50%;
  text-align: center;
  transform: translate(0, 50%);
  border: 1px solid #d26a45;
  transform: translate(-50%, 0);
}
.block-cosm-user-create-account-step-block ul li:after,
.counter-step ul li:after {
  position: absolute;
  width: 100%;
  height: 4px;
  content: "";
  background: #faedca;
  left: 0;
  top: -40px;
}
.block-cosm-user-create-account-step-block ul li.active:before,
.counter-step ul li.active:before {
  background: #c1dbb3;
  border: 1px solid #c1dbb3;
}
.block-cosm-user-create-account-step-block ul li.active:after,
.counter-step ul li.active:after {
  background: #c1dbb3;
}
.block-cosm-user-create-account-step-block ul li.current:before,
.counter-step ul li.current:before {
  background: #d26a45;
}
.block-cosm-user-create-account-step-block ul li.current:after,
.counter-step ul li.current:after {
  background: #faedca;
}
.counter-step ul li:before {
  transform: translate(-40px, -5px);
}
#cosm-session-inscription-registration-form .counter-step li {
  width: 33.33%;
}
.mode_of_use {
  padding: 15px;
  background: #faedca;
}
.mode_of_use legend {
  float: left;
}
.mode_of_use legend span {
  color: #FFFFFF !important;
  font-weight: 700;
}
.mode_of_use .fieldset-wrapper {
  clear: both;
}
.mode_of_use .fieldset-wrapper span {
  color: #181818 !important;
}
.mode_of_use .fieldset-wrapper p:last-child {
  margin: 0;
}
.block-cosm-profile-register-step-n-block,
.block-cosm-user-create-account-step-1-block {
  width: 75%;
  margin: 5% auto;
  padding: 3.5% 5%;
  background: #fff6f3;
  border-top: 10px solid #c1dbb3;
}
.block-cosm-profile-register-step-n-block h1,
.block-cosm-user-create-account-step-1-block h1 {
  display: none;
}
form[id^="cosm-profile-cosm-profile-register-step-"] > fieldset {
  position: relative;
  overflow: hidden;
  margin: 25px 0;
  list-style-type: none;
  /*   counter-increment: question;
    &:before { position: absolute; left: 0; width: 20px; height: 20px; font: 700 0.75em/20px @fontbase; color: #FFF; content: counter(question); background: @camel; .radius (50%); text-align: center }*/
}
form[id^="cosm-profile-cosm-profile-register-step-"] > fieldset > legend {
  display: block;
  float: left;
  width: 100%;
  margin: 0 0 7px;
  font: 600 1em/1.4em 'Montserrat', sans-serif;
}
form[id^="cosm-profile-cosm-profile-register-step-"] > fieldset .form-type-radio,
form[id^="cosm-profile-cosm-profile-register-step-"] > fieldset .form-type-checkbox {
  display: inline-block;
  margin: 0 40px 10px 0;
  color: #3f3f3f;
}
form[id^="cosm-profile-cosm-profile-register-step-"] .form-actions {
  margin-top: 25px;
}
form[id^="cosm-profile-cosm-profile-register-step-"] table#periods {
  width: 100%;
  border-collapse: collapse;
}
form[id^="cosm-profile-cosm-profile-register-step-"] table#periods th,
form[id^="cosm-profile-cosm-profile-register-step-"] table#periods tr,
form[id^="cosm-profile-cosm-profile-register-step-"] table#periods td {
  padding: 8px 5px;
  font: 400 0.95em/1.1em 'Montserrat', sans-serif;
  border: 1px solid #c7cfd6;
}
form[id^="cosm-profile-cosm-profile-register-step-"] table#periods td {
  width: 15%;
}
form[id^="cosm-profile-cosm-profile-register-step-"] table#periods a {
  display: block;
  font-size: .85em;
}
form[id^="cosm-profile-cosm-profile-register-step-"] table#periods .form-type-checkbox,
form[id^="cosm-profile-cosm-profile-register-step-"] table#periods input[type="checkbox"] {
  display: block;
  margin: 0 auto;
}
/* ------ Step 1 ------ */
#user-register-step-1-form .form-item,
#user-register-step-1-form #edit-field-u-date-birth-wrapper {
  float: left;
  width: 50%;
  padding: 0 20px;
}
#user-register-step-1-form .form-item .form-item,
#user-register-step-1-form #edit-field-u-date-birth-wrapper .form-item {
  float: none;
  width: 100%;
  padding: 0;
}
#user-register-step-1-form .form-item.form-item-field-u-address-0-value,
#user-register-step-1-form #edit-field-u-date-birth-wrapper.form-item-field-u-address-0-value,
#user-register-step-1-form .form-item.form-type-email,
#user-register-step-1-form #edit-field-u-date-birth-wrapper.form-type-email,
#user-register-step-1-form .form-item#edit-pass,
#user-register-step-1-form #edit-field-u-date-birth-wrapper#edit-pass {
  width: 100%;
}
#user-register-step-1-form .form-actions {
  clear: both;
  padding: 0 20px;
}
/* ------ Mieux vous connaître ------ */
#cosm-profile-cosm-profile-better-know-you-form input#edit-field-cosm-prof-weight-0-value,
#cosm-profile-cosm-profile-better-know-you-form input#edit-field-cosm-prof-size-0-value {
  width: auto;
}
/* ------ Coordonnées ------ */
#edit-field-u-iban-0-value .fieldset-wrapper {
  display: flex;
  flex-wrap: wrap;
}
#edit-field-u-iban-0-value .fieldset-wrapper > div {
  width: 60px;
  margin: 0 5px 5px 0;
}
/* ------ Step 5 ------ */
#cosm-profile-cosm-profile-register-step-5-form #edit-field-cosm-prof-voluntary-type {
  display: flex;
  flex-wrap: wrap;
}
#cosm-profile-cosm-profile-register-step-5-form #edit-field-cosm-prof-voluntary-type .js-form-item {
  display: block;
  margin: 0 0 30px;
  justify-content: center;
}
#cosm-profile-cosm-profile-register-step-5-form #edit-field-cosm-prof-voluntary-type .js-form-item:before {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
}
#cosm-profile-cosm-profile-register-step-5-form #edit-field-cosm-prof-voluntary-type .js-form-item:first-child:before {
  content: url(/themes/custom/cosmepar/img/testeur-centre.jpg);
}
.block-cosm-user-create-account-step-1-block h2,
.block-cosm-profile-register-step-n-block h2 {
  margin: 0 0 30px;
  font: 600 2em/1.2em 'Cormorant Garamond', serif;
  text-transform: uppercase;
}
.block-cosm-user-create-account-step-1-block h2 span,
.block-cosm-profile-register-step-n-block h2 span {
  font: 700 0.9em/1.2em 'Montserrat', sans-serif;
}
.block-cosm-user-create-account-step-1-block h2 span:after,
.block-cosm-profile-register-step-n-block h2 span:after {
  content: ":";
  padding: 0 20px 0 7px;
}
#user-register-step-1-form,
#user-form {
  /* label, #edit-field-u-date-birth-wrapper h4 { display: block; font: 600 0.9em/1.4em @fontbase; text-transform: uppercase }*/
  /* label, .label, legend { display: block; margin-bottom: 5px; font: 600 .9em/1.4em @fontbase; text-transform: uppercase }*/
}
#user-register-step-1-form .form-item,
#user-form .form-item,
#user-register-step-1-form #edit-field-u-date-birth-wrapper,
#user-form #edit-field-u-date-birth-wrapper {
  margin: 0 0 30px;
}
#user-register-step-1-form label,
#user-form label,
#user-register-step-1-form #edit-field-u-date-birth-wrapper h4,
#user-form #edit-field-u-date-birth-wrapper h4 {
  font-weight: 600;
}
#user-register-step-1-form input#edit-submit,
#user-form input#edit-submit {
  width: auto;
}
#user-register-step-1-form .form-type-checkbox,
#user-form .form-type-checkbox,
#user-register-step-1-form .form-type-radio,
#user-form .form-type-radio {
  margin-bottom: 0;
}
#user-register-step-1-form .form-type-checkbox label,
#user-form .form-type-checkbox label,
#user-register-step-1-form .form-type-radio label,
#user-form .form-type-radio label {
  display: inline;
  font-weight: 400;
  text-transform: none;
}
.horizontal-tabs-panes .details-wrapper {
  padding: 25px 5% 0;
}
@media only screen and (max-width: 1280px) {
  .block-cosm-profile-register-step-n-block,
  .block-cosm-user-create-account-step-1-block {
    width: 100%;
  }
}