.node--type-page .homepage-cdc-bottom-list .field--name-field-text {
  max-width: 1220px;
  margin: 0 auto;
  padding: 0 20px;
  color: rgba(50,57,67,1);
  margin-bottom: 20px;
}

.node--type-page .homepage-cdc-bottom-list a {
  color: rgba(120, 114, 124, 1);
  transition: color .3s ease-in-out;
}

.node--type-page .homepage-cdc-bottom-list a:hover {
  text-decoration: none;
  color: rgba(88, 207, 144, 1);
}

.container__switcher {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.container__switcher span.switcher {
  position: relative;
  width: max-content;
  height: 68px;
  border-radius: 15px;
  margin: 40px  auto;
}

.container__switcher span.switcher label {
  position: absolute;
  top: 0;
  bottom: -3px;
  border-radius: 10px;
  z-index: 9;
}

.container__switcher span.switcher.switcher-1 input {
  transition: .25s -.1s
}


.container__switcher span.switcher.switcher-1 input:checked+label {
  left: 9px;
  top: 5px;
  right: 200px;
  height: 56px;
  transition: left .5s,right .4s .2s;
  box-shadow: 0 4px 10px rgba(0,0,0,.1);
  font-size: 18px;
  font-family: 'Oxygen', Arial, Helvetica, 'Nimbus Sans L',
  letter-spacing: -0.27px;
  color: #1E1C3B;
  background: #fff 0% 0% no-repeat padding-box;
  opacity: 1;
  font-weight: 500;
}

@media (max-width: 300px) {
  .container__switcher span.switcher.switcher-1 input:checked+label {
    right:100px
  }
}

.container__switcher span.switcher.switcher-1 input:checked:before {
  color: #000;
  transition: color .5s;
  font-size: 18px;
  font-family: 'Oxygen', Arial, Helvetica, 'Nimbus Sans L',
  letter-spacing: -0.27px;
  font-weight: 500;
  z-index: 99;
}

.container__switcher span.switcher.switcher-1 input:checked:after {
  color: #fff;
  transition: color .5s .2s;
  font-size: 18px;
  font-family: 'Oxygen', Arial, Helvetica, 'Nimbus Sans L',
  letter-spacing: -0.27px;
  font-weight: 500;
  z-index: 99;
}

.container__switcher span.switcher.switcher-1 input:not(:checked):before {
  color: #fff;
  transition: color .5s;
  font-size: 18px;
  font-family: 'Oxygen', Arial, Helvetica, 'Nimbus Sans L',
  letter-spacing: -0.27px;
  font-weight: 500;
  z-index: 99;
}

.container__switcher span.switcher.switcher-1 input:not(:checked):after {
  color: #000;
  transition: color .5s .2s;
  font-size: 17px;
  font-family: 'Oxygen', Arial, Helvetica, 'Nimbus Sans L',
  letter-spacing: -0.27px;
  font-weight: 500;
  z-index: 99;
}

.container__switcher span.switcher.switcher-1 input:not(:checked)+label {
  left: 193px;
  top: 5px;
  height: 56px;
  right: 8px;
  background: #fff 0% 0% no-repeat padding-box;
  transition: left .4s .2s,right .5s,background .35s -.1s;
  box-shadow: 0 4px 10px rgba(0,0,0,.1)
}

.togglebutton {
  padding-top: 28px;
}

.togglebutton {
  height: 68px;
  margin-bottom: 44px;
  margin-top: 25px;
}

.container__switcher {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.container__switcher span.switcher {
  position: relative;
  width: max-content;
  height: 68px;
  border-radius: 15px;
  margin: 40px  auto;
}

.toggleSwitchBackground {
  position: absolute;
  z-index: -10;
  background: #3b3a49;
  top: 0;
  LEFT: 0;
  bottom: 0;
  right: 0;
  border-radius: 15px;
}

.container__switcher span.switcher input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  width: 380px;
  height: 68px;
  border-radius: 15px;
  outline: 0;
  letter-spacing: -0.27px;
  cursor: pointer;
  border: 1px solid rgba( 18 , 18 , 18, 0.1);
  display: flex;
  background-color: rgba(88, 207, 144, 1);
  opacity: 1;
  margin: 0 auto;
  font-weight: 500;
}

@media (max-width: 600px) {
  .container__switcher span.switcher input {
    width:100%
  }
}




.container__switcher span.switcher input:after,.container__switcher span.switcher input:before {
  z-index: 2;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  /*color: #fff*/
}

.container__switcher span.switcher input:before {
  content: "A la maison";
  font-family: 'Oxygen', Arial, Helvetica, 'Nimbus Sans L',
  letter-spacing: -0.27px;
  color: #1E1C3B;
  opacity: 1;
  width: auto;
  height: auto;
  left: 50px;
  top: 50%;
  padding: 8px;
  padding-left: 21px;
  font-weight: 500;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.container__switcher span.switcher input:after {
  content: "Entreprises et collectivités";
  right: 20px;
  font-family: 'Oxygen', Arial, Helvetica, 'Nimbus Sans L',
  letter-spacing: -0.27px;
  color: #1E1C3B;
  opacity: 1;
  font-weight: 500;
}
