.profile-img {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
  filter: blur(10px);
}
.about-box {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
  filter: blur(10px);
}
.about-box-D {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
  filter: blur(10px);
}

.more-btn-D {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
}
.page1-h-D {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
}
.page1-p-D {
  transform: translateY(30%);
  transition: 1s;
  opacity: 0;
}
.about-h-D {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
}
.exp-h {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
}
.exp-h-D {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
}
.projects-h1 {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
}
.projects-h1-D {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
}
.socials-page-1 {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
}
.socials-page-1-D {
  transform: translateY(30%);
  transition: 1.5s;
  opacity: 0;
}
.profile-img-D {
  transform: translateY(30%);
  transition: 1s;
  opacity: 0;
}
.logos-D {
  transform: translateY(30%);
  transition: 1s;
  opacity: 0;
}
.show {
  opacity: 100%;
  transform: translateY(0%);
  filter: blur(0);
}

.logos {
  transform: translateY(50%);
  opacity: 0;
  transition: 1.5s;
}
.show2 {
  opacity: 100%;
  transform: translateY(0%);
  filter: blur(0);
}
.project-1 {
  transform: translateX(-100%);
  opacity: 0;
  transition: 1s;
  filter: blur(10px);
}
.project-2 {
  transform: translateX(-100%);
  opacity: 0;
  transition: 1s;
  filter: blur(10px);
}
.project-1-D {
  transform: translateX(-100%);
  opacity: 0;
  transition: 1s;
  filter: blur(10px);
}
.project-3 {
  transform: translateX(-100%);
  opacity: 0;
  transition: 1s;
  filter: blur(10px);
}
.project-3-D {
  transform: translateX(-100%);
  opacity: 0;
  transition: 1s;
  filter: blur(10px);
}
.project-2-D {
  transform: translateX(-100%);
  opacity: 0;
  transition: 1s;
  filter: blur(10px);
}
.show3 {
  opacity: 100%;
  transform: translateX(0%);
  transform: translateY(0%);
  filter: blur(0);
}

@media only screen and (max-width: 600px) {
  .profile-img {
    transform: translateY(30%);
    transition: 1.5s;
    opacity: 0;
    filter: blur(10px);
  }
  .profile-img2 {
    transform: translateY(30%);
    transition: 1.5s;
    opacity: 0;
    filter: blur(10px);
  }
  .more-btn {
    transform: translateY(30%);
    transition: 1.5s;
    opacity: 0;
  }
  .about-h {
    transform: translateY(30%);
    transition: 1.5s;
    opacity: 0;
  }
  .page1-h {
    transform: translateY(30%);
    transition: 1.5s;
    opacity: 0;
  }
  .page1-p {
    transform: translateY(30%);
    transition: 1s;
    opacity: 0;
  }
  profile-img-D {
    transform: translateY(30%);
    transition: 1s;
    opacity: 0;
  }
  .show {
    opacity: 100%;
    transform: translateY(0%);
    filter: blur(0);
  }
}
@media (prefers-reduce-motion) {
  .project-2 {
    transition: none;
  }
}

.toggle-switch {
  position: absolute;
  width: 100%;
  top: 51px;
  display: grid;
  place-items: center;
  transform: translateX(0%);
  height: 10px;
  --light: #000000;
  --dark: #fdfdfd;
  --link: rgb(27, 129, 112);
  --link-hover: rgb(24, 94, 82);

  .switch-label {
    position: absolute;
    width: 47px;
    height: 20px;
    transform: translateX(-100%);
    background-color: var(--dark);
    border-radius: 25px;
    cursor: pointer;
    border: 3px solid var(--dark);
    z-index: 1;
  }

  .checkbox {
    position: absolute;
    display: none;
  }

  .slider {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 25px;
    -webkit-transition: 0.3s;
    transition: 0.3s;
  }

  .checkbox:checked ~ .slider {
    background-color: var(--light);
  }

  .slider::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 5px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    -webkit-box-shadow: inset 19px -4px 0px 0px var(--light);
    box-shadow: inset 5px -4px 0px 0px var(--light);
    background-color: var(--dark);
    -webkit-transition: 0.3s;
    transition: 0.3s;
  }

  .checkbox:checked ~ .slider::before {
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(22px);
    background-color: var(--dark);
    -webkit-box-shadow: none;
    box-shadow: none;
  }
}

.switch-label {
  position: relative;
  width: 100%;
  height: 25px;
  background-color: var(--dark);
  border-radius: 25px;
  cursor: pointer;
  border: 3px solid var(--dark);
  z-index: 1;
}

.checkbox {
  position: absolute;
  display: none;
}

.slider {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 25px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.checkbox:checked ~ .slider {
  background-color: var(--light);
}

.slider::before {
  content: "";
  position: absolute;
  top: 0.5px;
  left: 5px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  -webkit-box-shadow: inset 19px -4px 0px 0px var(--light);
  box-shadow: inset 5px -4px 0px 0px var(--light);
  background-color: var(--dark);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.checkbox:checked ~ .slider::before {
  -webkit-transform: translateX(20px);
  -ms-transform: translateX(20px);
  transform: translateX(22px);
  background-color: var(--dark);
  -webkit-box-shadow: none;
  box-shadow: none;
}