.carousel-wrapper {
  height: 400px;
  position: relative;
  width: 400px;
  margin: 0 auto;
}

.carousel-wrapper2 {
  height: 300px;
  position: relative;
  width: 600px;
  margin: 0 20%;
}

.carousel-item {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 25px 50px;
  opacity: 0;
  transition: all 0.5s ease-in-out;
}

#solOk {
  /* display: block; */
  margin-top: 90%;
  margin-left: -40%;
}
#sagOk {
  /* display: block; */

  /* margin-left: -30%; */
  margin-left: 115%;
  margin-top: -19%;
}

#solOk2 {
  /* display: block; */
  margin-top: 10%;
  margin-left: -20%;
}
#sagOk2 {
  /* display: block; */

  /* margin-left: -30%; */
  margin-left: 110%;
  margin-top: -9%;
}

.light {
  color: white;
}

@media (max-width: 480px) {
  .carousel-wrapper {
    height: 200px;
    position: relative;
    width: 200px;
    margin: 0 auto;
  }

  .arrow,
  .light .arrow {
    background-size: 10px;
    background-position: 10px 50%;
  }

  #sagOk {
    margin-left: 120%;
    margin-top: -55%;
  }
  #solOk {
    /* display: block; */
    margin-top: 90%;
    margin-left: -100%;
  }
}

/*Select every element*/
[id^="item"] {
  display: none;
}

.item-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/slide_FigLif_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.item-2 {
  /* background-size: cover; */

  background: url("../img/slide_FigLif_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
/* .item-3 {
  background: url("../img/slide_FigLif_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
} */

*:target ~ .item-1 {
  opacity: 0;
}

#item-1:target ~ .item-1 {
  opacity: 1;
}

#item-2:target ~ .item-2,
#item-3:target ~ .item-3 {
  z-index: 3;
  opacity: 1;
}

/* fig */

[id^="fig"] {
  display: none;
}
.fig-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/fig_slide_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 20%;
}
.fig-2 {
  /* background-size: cover; */

  background: url("../img/fig_slide_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 20%;
}
.fig-3 {
  background: url("../img/fig_slide_3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 20%;
}

*:target ~ .fig-1 {
  opacity: 0;
}

#fig-1:target ~ .fig-1 {
  opacity: 1;
}

#fig-2:target ~ .fig-2,
#fig-3:target ~ .fig-3 {
  z-index: 3;
  opacity: 1;
}
/* fig son */

/* DAL */

[id^="dal"] {
  display: none;
}
.dal-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/dal_slide_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.dal-2 {
  /* background-size: cover; */

  background: url("../img/dal_slide_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.dal-3 {
  background: url("../img/dal_slide_3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

*:target ~ .dal-1 {
  opacity: 0;
}

#dal-1:target ~ .dal-1 {
  opacity: 1;
}

#dal-2:target ~ .dal-2,
#dal-3:target ~ .dal-3 {
  z-index: 3;
  opacity: 1;
}
/* DAL   son */

/* OBRUK */

[id^="obruk"] {
  display: none;
}
.obruk-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/obruk_slide_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.obruk-2 {
  /* background-size: cover; */

  background: url("../img/obruk_slide_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  /* width: 300px; */
}
.obruk-3 {
  background: url("../img/obruk_slide_3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  /* width: 250px; */
}

*:target ~ .obruk-1 {
  opacity: 0;
}

#obruk-1:target ~ .obruk-1 {
  opacity: 1;
}

#obruk-2:target ~ .obruk-2,
#obruk-3:target ~ .obruk-3 {
  z-index: 3;
  opacity: 1;
}
/* OBRUK   son */

/* TOGETHER  */

[id^="together"] {
  display: none;
}
.together-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/together_slide_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  /* width: 500px; */
}
.together-2 {
  /* background-size: cover; */

  background: url("../img/together_slide_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.together-3 {
  background: url("../img/together_slide_3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.together-4 {
  background: url("../img/together_slide_4.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

*:target ~ .together-1 {
  opacity: 0;
}

#together-1:target ~ .together-1 {
  opacity: 1;
}

#together-2:target ~ .together-2,
#together-3:target ~ .together-3,
#together-4:target ~ .together-4 {
  z-index: 4;
  opacity: 1;
}
/* TOGETHER   son */

/* OCCURRENCE */

[id^="occur"] {
  display: none;
}
.occur-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/occurrence_slide_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  /* width: 400px;  */
}
.occur-2 {
  /* background-size: cover; */

  background: url("../img/occurrence_slide_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.occur-3 {
  background: url("../img/occurrence_slide_3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

*:target ~ .occur-1 {
  opacity: 0;
}

#occur-1:target ~ .occur-1 {
  opacity: 1;
}

#occur-2:target ~ .occur-2,
#occur-3:target ~ .occur-3 {
  z-index: 3;
  opacity: 1;
}
/* OCCURRENCE   son */

/* ATLAS */

[id^="atlas"] {
  display: none;
}
.atlas-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/atlas_slide_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.atlas-2 {
  /* background-size: cover; */

  background: url("../img/atlas_slide_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.atlas-3 {
  background: url("../img/atlas_slide_3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

*:target ~ .atlas-1 {
  opacity: 0;
}

#atlas-1:target ~ .atlas-1 {
  opacity: 1;
}

#atlas-2:target ~ .atlas-2,
#atlas-3:target ~ .atlas-3 {
  z-index: 3;
  opacity: 1;
}
/* ATLAS   son */

/* BULUT */

[id^="bulut"] {
  display: none;
}
.bulut-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/bulut_slide_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.bulut-2 {
  /* background-size: cover; */

  background: url("../img/bulut_slide_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.bulut-3 {
  background: url("../img/bulut_slide_3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

*:target ~ .bulut-1 {
  opacity: 0;
}

#bulut-1:target ~ .bulut-1 {
  opacity: 1;
}

#bulut-2:target ~ .bulut-2,
#bulut-3:target ~ .bulut-3 {
  z-index: 3;
  opacity: 1;
}
/* BULUT   son */

/* STREAM */

[id^="stream"] {
  display: none;
}
.stream-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/stream_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.stream-2 {
  /* background-size: cover; */

  background: url("../img/stream_2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.stream-3 {
  background: url("../img/stream_3.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

*:target ~ .stream-1 {
  opacity: 0;
}

#stream-1:target ~ .stream-1 {
  opacity: 1;
}

#stream-2:target ~ .stream-2,
#stream-3:target ~ .stream-3 {
  z-index: 3;
  opacity: 1;
}
/* STREAM   son */

/* ONES ***********  */

[id^="ones"] {
  display: none;
}
.ones-1 {
  z-index: 2;
  opacity: 1;
  background: url("../img/ayna_slide_1.jpg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.ones-2 {
  /* background-size: cover; */

  background: url("../img/ayna_slide_2.jpg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.ones-3 {
  background: url("../img/ayna_slide_3.jpg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  /* width: 500px;
  height: 450px; */
}

.ones-4 {
  background: url("../img/ayna_slide_4.jpg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.ones-5 {
  background: url("../img/ayna_slide_5.jpg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

*:target ~ .ones-1 {
  opacity: 0;
}

#ones-1:target ~ .ones-1 {
  opacity: 1;
}

#ones-2:target ~ .ones-2,
#ones-3:target ~ .ones-3,
#ones-4:target ~ .ones-4,
#ones-5:target ~ .ones-5 {
  z-index: 5;
  opacity: 1;
}
/* ONES ***************************   son */
