.vs_figure {
  margin-left: 0;
  margin-right: 0;
}

.vs_figure figcaption {
  font-size: 15px;
  font-style: italic;
  margin-top: 5px;
}

img {
  border: none;
}

@font-face {
  font-family: 'Circular Std Medium';
  font-style: normal;
  font-weight: normal;
  src: local("Circular Std Medium"), url("fonts/CircularStd-Medium.woff") format("woff");
}

@font-face {
  font-family: 'Circular Std Black';
  font-style: normal;
  font-weight: normal;
  src: local("Circular Std Black"), url("fonts/CircularStd-Black.woff") format("woff");
}

#vs_conteneur {
  background-color: #ffffff;
  color: #000000;
  max-width: 700px;
  margin: auto;
  padding: 10px 0 0 0;
  font-family: 'Circular Std Medium', arial, helevtica, sans-serif;
  position: relative;
  overflow: hidden;
}

#vs_conteneur_trip_pop_trip_insta {
  position: relative;
  width: 200%;
  transition: left 0.5s ease;
}

.vs_mode {
  position: relative;
  width: 50%;
  float: left;
}

.vs_map_conteneur {
  position: relative;
  width: 100%;
  top: -34px;
}

.vs_map {
  width: 100%;
}

.vs_titre {
  margin-left: 3%;
  width: 31% !important;
  position: relative;
  z-index: 1;
}

.vs_texte_switch {
  position: absolute;
  bottom: 1%;
  left: 0%;
  width: 100%;
}

.vs_fleches_conteneur {
  margin-left: 7%;
}

.vs_rond {
  display: inline-block;
  border-radius: 100px;
  width: 84px;
  height: 84px;
  line-height: 84px;
  text-align: center;
  color: #feff00;
  font-family: 'Circular Std Black', arial, helevtica, sans-serif;
  font-size: 50px;
  margin-right: 5px;
}

.vs_fleche_gauche, .vs_fleche_droite {
  cursor: pointer;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

.vs_fleche_gauche {
  background-image: url(img/fleche_gauche_jaune.svg);
}

.vs_fleche_droite {
  background-image: url(img/fleche_droite_jaune.svg);
}

.vs_descriptions {
  width: 100%;
  margin: 0;
  padding: 0;
}

.vs_item {
  padding: 0 7%;
}

.vs_item p {
  font-size: 18px;
  margin: 15px 0;
  padding: 0;
  line-height: normal;
}

h2.vs_titre_description {
  font-family: 'Circular Std Black';
  font-size: 25px;
  margin: 30px 0 20px 0;
  padding: 0;
  line-height: normal;
}

.vs_point {
  position: absolute;
  background-color: #feff00;
  width: 18px;
  height: 18px;
  border-radius: 9px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.vs_point:hover {
  background-color: #ffffff;
}

.vs_conteneur_cursor {
  position: absolute;
  width: 30%;
  margin-left: 0.7%;
  margin-top: -25.2%;
  transition: top 0.2s, left 0.2s;
  pointer-events: none;
  z-index: 2;
}

.vs_cursor_image {
  background: #feff00;
  width: 166px;
  height: 166px;
  border-radius: 83px;
  position: absolute;
  right: 0px;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  transition: right 0.2s, margin 0.2s;
}

.vs_cursor {
  width: 36% !important;
  position: absolute;
  left: 0px;
  top: 140px;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
}

.vs_picto_pop, .vs_picto_insta {
  position: absolute;
  width: 100%;
  opacity: 0;
  transition: opacity 0.2s;
}

#vs_picto_pop1, #vs_picto_insta1 {
  opacity: 1;
}

.vs_conteneur_cursor.vs_tourne .vs_cursor {
  -webkit-transform: rotate(90deg) translateX(63%) translateY(30%);
      -ms-transform: rotate(90deg) translateX(63%) translateY(30%);
          transform: rotate(90deg) translateX(63%) translateY(30%);
}

.vs_conteneur_cursor.vs_tourne .vs_cursor_image {
  margin-top: 111%;
  right: 17%;
}

#vs_bouton_switch {
  width: 170px;
  height: 170px;
  background-color: #006837;
  border-radius: 90px;
  border: 6px #ffffff solid;
  position: absolute;
  top: 500px;
  left: 70%;
  cursor: pointer;
  transition: background 0.2s, -webkit-transform 0.2s;
  transition: background 0.2s, transform 0.2s;
  transition: background 0.2s, transform 0.2s, -webkit-transform 0.2s;
}

.vs_bouton_switch1, .vs_bouton_switch2 {
  position: absolute;
  width: 100%;
}

.vs_bouton_switch1 {
  -webkit-animation: vs_tourne 4s infinite linear normal;
          animation: vs_tourne 4s infinite linear normal;
}

@-webkit-keyframes vs_tourne {
  0% {
    -webkit-transform: rotate(1turn);
            transform: rotate(1turn);
  }
  100% {
    -webkit-transform: rotate(0turn);
            transform: rotate(0turn);
  }
}

@keyframes vs_tourne {
  0% {
    -webkit-transform: rotate(1turn);
            transform: rotate(1turn);
  }
  100% {
    -webkit-transform: rotate(0turn);
            transform: rotate(0turn);
  }
}

#vs_mode_trip_pop .vs_texte_switch, #vs_mode_trip_pop .vs_titre_description {
  color: #006837;
}

#vs_mode_trip_pop .vs_rond {
  background-color: #006837;
  color: #feff00;
}

#vs_mode_trip_insta .vs_texte_switch, #vs_mode_trip_insta .vs_titre_description {
  color: #f411a2;
}

#vs_mode_trip_insta .vs_rond {
  background-color: #f411a2;
  color: #ffffff;
}

#vs_mode_trip_insta .vs_item a {
  color: #000000;
  text-decoration: none;
}

#vs_mode_trip_insta .vs_item a:hover {
  text-decoration: underline;
}

#vs_mode_trip_insta .vs_point {
  background-color: #ffffff;
}

#vs_mode_trip_insta .vs_point:hover {
  background-color: #feff00;
}

#vs_mode_trip_insta .vs_fleche_gauche {
  background-image: url(img/fleche_gauche_blanche.svg);
}

#vs_mode_trip_insta .vs_fleche_droite {
  background-image: url(img/fleche_droite_blanche.svg);
}

.vs_trip_pop #vs_bouton_switch {
  background-color: #006837;
}

.vs_trip_pop #vs_conteneur_trip_pop_trip_insta {
  left: 0%;
}

.vs_trip_insta #vs_bouton_switch {
  background-color: #f411a2;
}

.vs_trip_insta #vs_conteneur_trip_pop_trip_insta {
  left: -100%;
}

@media screen and (max-width: 700px) {
  .vs_map_conteneur {
    top: -5vw;
  }
  .vs_rond {
    width: 12vw;
    height: 12vw;
    line-height: 12vw;
    font-size: 8vw;
  }
  .vs_point {
    width: 2.57vw;
    height: 2.57vw;
  }
  #vs_bouton_switch {
    width: 22.3vw;
    height: 22.3vw;
    top: calc(69vw - 40px);
    border: 1vw #ffffff solid;
  }
  .vs_cursor_image {
    width: calc(24vw - 16px);
    height: calc(24vw - 16px);
  }
  .vs_cursor {
    top: calc(20vw - 12px);
  }
}

@media screen and (max-width: 760px) {
  .vs_conteneur_mobile #vs_bouton_switch {
    top: 69vw;
  }
  .vs_conteneur_mobile .vs_cursor_image {
    width: 23.7vw;
    height: 23.7vw;
  }
  .vs_conteneur_mobile .vs_cursor {
    top: 19.5vw;
  }
}