

.orta_tab {
  background: #26236F;
  width: 100%;
  height: 5rem;
  box-shadow: 0 0 6px rgba(0,0,0,.4);
	border-radius: 100px;
}
.orta_tab:after {
    content: '';
    width: 25%;
    height: 4.2rem;
    background: #ffffff;
    position: absolute;
    transition: .5s;
    border-radius: 100px;
    margin-top: 7px;
}


section {



}
.otel-fiyat {
  position: absolute;
top: 0.5rem;
    bottom: 0.5rem;
 /* transition: .7s; */
  transform: scale(0);
/* transform-origin: center right;
  transition-delay: .1s;
  */
}
.otel-icerik {
  position: absolute;

  top: 0.5rem;
    bottom: 0.5rem;
 /* transition: .7s; */
  transform: scale(0);
/* transform-origin: center right;
  transition-delay: .1s;
  */
}
.otel-icerik:before {
  color: rgba(0,0,0,.2);
  font-size: 4rem;
  font-weight: 100;
  position: absolute;
  bottom: 1rem;
  right: 1rem;
}

label {
  width: 25%;
  float: left;
  color: #f1f2f6;
  text-align: center;
  cursor: pointer;
  transition: .5s;
  z-index: 2;

}
label h4 {
  
	font-weight:bold;
	font-size:14px;
	line-height:20px;
	margin-top:20px;
}
label:hover {color: #ffffff;}
label:before {
  display: block;
  font-size: 3rem;
  line-height: 5rem;
  z-index: 2;
}

#profile0:checked ~ .orta_tab [for='profile0'],
#profile1:checked ~ .orta_tab [for='profile1'],
#profile2:checked ~ .orta_tab [for='profile2'],
#profile3:checked ~ .orta_tab [for='profile3']
 {
  color: #26236F;
  font-weight: 600;
  position: relative;
}
#profile1:checked ~ .orta_tab [for='profile1'] {}
#profile0:checked ~ .orta_tab [for='profile0'] {}

#profile0:checked ~ .orta_tab:after {
  left: 1%;
}
#profile1:checked ~ .orta_tab:after {
  left:25%;
  border-top: 0 none;
}
#profile2:checked ~ .orta_tab:after {
  left: 50%;
}
#profile3:checked ~ .orta_tab:after {
  left: 75%;
}


#profile0:checked ~ .profile0,
#profile1:checked ~ .profile1,
#profile2:checked ~ .profile2,
#profile3:checked ~ .profile3{
  display: block;
  transform: scale(1);
 /* transition-delay: .5s; */
  position: relative;
}
