.project {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  outline: 0.1875rem dashed lime;
  margin: 6.375rem 0;
  padding: 1.875rem 1.25rem;
  overflow: hidden;
  flex-shrink: 0;
}
.project:first-child {
  margin-top: 0;
}
.project:last-child {
  margin-bottom: 0;
}
@media (max-width: 1300px) {
  .project {
    flex-direction: column;
  }
}

.slider-cont {
  transition: transform 0.8s, opacity 0.8s;
  opacity: 0;
}
.slider-cont .slider-caption {
  position: absolute;
  top: -3rem;
  z-index: -1;
  left: 0;
  right: 0;
  margin: 0 auto;
  background: black;
  padding: 0.7rem;
  padding-top: 0.55rem;
  padding-bottom: 1rem;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 1.3rem;
  border: 0.1875rem dashed lime;
  border-bottom: none;
}
@media (max-width: 1300px) {
  .slider-cont .slider-caption {
    border-top: none;
  }
}

.slider {
  width: 48.6688rem;
  height: 23.75rem;
  background-color: black;
  text-align: center;
  overflow: hidden;
  border: 0.5rem solid black;
  outline: 0.1875rem dashed lime;
  transition: transform 330ms;
}
.slider:hover {
  transform: scale(0.985);
}

.project-image-cont {
  position: relative;
  width: -moz-max-content;
  width: max-content;
  height: 23.75rem;
  background: transparent;
  transition: transform 700ms;
  transform: translate(0);
}

.project-image {
  height: 23.75rem;
  transition: scale 330ms, transform 0.8s, opacity 0.8s;
  border: 0.5rem solid black;
  outline: 0.1875rem dashed lime;
  opacity: 0;
}
.project-image:hover {
  scale: 0.985;
}

.project-image-slide {
  position: relative;
  width: 48.6875rem;
  height: 23.75rem;
  float: left;
}
.project-image-slide.nested-slide-image-cont {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.project-image-slide .nested-slide-image {
  height: 100%;
}

.slide-4-notes {
  width: 44.375rem;
  padding-left: 2.15625rem;
  padding-right: 2.1563rem;
}

.slide-buttons-cont {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 49.6688rem;
  gap: 1.875rem;
  z-index: 1000;
  margin-top: -1.0625rem;
}
@media (max-width: 768px) {
  .slide-buttons-cont {
    gap: 4rem;
  }
}
@media (max-width: 525px) {
  .slide-buttons-cont {
    gap: 6rem;
  }
  .slide-buttons-cont.limedrive-slide-buttons-cont {
    gap: 5rem;
  }
}

.slide-button {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  position: relative;
  width: 2.5rem;
  height: 2.5rem;
  font-size: 1.2rem;
  font-family: inherit;
  background: black;
  color: lime;
  border-radius: 50%;
  border: none;
  border: 0.125rem solid lime;
  box-shadow: 0 -0.0625rem 0.25rem rgba(0, 0, 0, 0.635);
  transition: transform 330ms ease-in-out, text-shadow 330ms ease-in-out, box-shadow 330ms ease-in-out;
  box-sizing: border-box;
  flex-shrink: 0;
}
@media (max-width: 768px) {
  .slide-button {
    scale: 1.3;
  }
}
@media (max-width: 525px) {
  .slide-button {
    scale: 1.5;
  }
}
@media (max-width: 350px) {
  .slide-button {
    scale: 1.6;
  }
}
.slide-button::before {
  content: "";
  position: absolute;
  height: 2.5rem;
  width: 2.5rem;
  border-radius: inherit;
  left: 0;
  top: 0;
  box-sizing: border-box;
}
.slide-button:hover {
  border: none;
  transform: scale(1.1);
  box-shadow: 0 0 1.25rem 0.3125rem lime;
  text-shadow: 0 0 0.3125rem lime, 0 0 0.625rem lime, 0 0 0.9375rem lime, 0 0 1.25rem lime, 0 0 1.5625rem lime, 0 0 1.875rem lime, 0 0 2.1875rem lime;
  animation: glow-text-shadow-slide-button 0.7s ease-in-out 330ms infinite alternate, glow-box-shadow-slide-button 0.7s ease-in-out 330ms infinite alternate;
}
.slide-button:hover::before {
  border: 0.1875rem dashed lime;
  animation: spin-slide-button 6s linear infinite;
}
.slide-button.matches-current-slide {
  box-shadow: 0 0 1.25rem 0.3125rem lime;
  text-shadow: 0 0 0.3125rem lime, 0 0 0.625rem lime, 0 0 0.9375rem lime, 0 0 1.25rem lime, 0 0 1.5625rem lime, 0 0 1.875rem lime, 0 0 2.1875rem lime;
  animation: glow-text-shadow-slide-button 0.7s ease-in-out 330ms infinite alternate, glow-box-shadow-slide-button 0.7s ease-in-out 330ms infinite alternate !important;
}
@keyframes spin-slide-button {
  100% {
    transform: rotateZ(360deg);
  }
}
@keyframes glow-text-slide-button {
  from {
    text-shadow: 0 0 0.3125rem lime, 0 0 0.625rem lime, 0 0 0.9375rem lime, 0 0 1.25rem lime, 0 0 1.5625rem lime, 0 0 1.875rem lime, 0 0 2.1875rem lime;
  }
  to {
    text-shadow: 0 0 0.4375rem lime, 0 0 0.875rem lime, 0 0 1.3125rem lime, 0 0 1.75rem lime, 0 0 2.1875rem lime, 0 0 2.625rem lime, 0 0 3.0625rem lime;
  }
}

.project-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 38.1875rem;
  padding: 1.25rem;
  padding-bottom: 2.6875rem;
  background: black;
  outline: 0.1875rem dashed lime;
  transition: transform 0.8s, opacity 0.8s;
  opacity: 0;
}
@media (max-width: 475px) {
  .project-info {
    width: 100% !important;
  }
}

.project-heading {
  margin: 0;
  font-size: 2.6875rem;
}

.project-stack {
  margin-top: 0.3125rem;
  margin-bottom: 0.9375rem;
  font-size: 1.3125rem;
}
.project-stack::before {
  content: ">>";
  position: absolute;
  margin-left: -1.37em;
  margin-top: -0.0625em;
  letter-spacing: -0.15em;
}
.project-stack::after {
  content: "<<";
  position: absolute;
  margin-left: 0.4em;
  margin-top: -0.0625em;
  letter-spacing: -0.15em;
}

.project-description {
  font-size: 1.25rem;
  margin: 1.4375rem 0;
  padding: 0 1.875rem;
  text-align: center;
}
@media (max-width: 1441px) {
  .project-description {
    padding: 0 0.8rem;
  }
}
.project-description.limedrive-description {
  text-align: left;
}

.project-lives__cont {
  margin-top: 1.875rem;
  font-size: 1.75rem;
  display: flex;
  gap: 1.875rem;
}

.project-live {
  padding: 0.625rem;
  border: 0.1875rem dashed lime;
  transition: text-shadow 330ms ease-in-out;
}
.project-live:hover {
  padding: 0.775rem;
  border: none;
  text-shadow: 0 0 0.3125rem lime, 0 0 0.625rem lime, 0 0 0.9375rem lime, 0 0 1.25rem lime;
  background-image: linear-gradient(90deg, lime 60%, transparent 40%), linear-gradient(90deg, lime 60%, transparent 40%), linear-gradient(0deg, lime 60%, transparent 40%), linear-gradient(0deg, lime 60%, transparent 40%);
  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
  background-size: 0.625rem 0.1875rem, 0.625rem 0.1875rem, 0.1875rem 0.625rem, 0.1875rem 0.625rem;
  background-position: left top, right bottom, left bottom, right top;
  animation: border-dance 0.3s infinite linear, glow-projects 0.7s ease-in-out 330ms infinite alternate;
}
@keyframes border-dance {
  0% {
    background-position: left top, right bottom, left bottom, right top;
  }
  100% {
    background-position: left 0.625rem top, right 0.625rem bottom, left bottom 0.625rem, right top 0.625rem;
  }
}

.project-live-left::before {
  content: ">>";
  position: absolute;
  font-size: 3.125rem;
  margin-top: -1rem;
  margin-left: -4rem;
  letter-spacing: -0.4375rem;
  transform: scaleX(0);
  transition: transform 250ms ease-in-out;
  transform-origin: 100% 50%;
}
.project-live-left:hover::before {
  transform: scaleX(1);
  transform-origin: 0% 50%;
}

.project-live-right::after {
  content: "<<";
  position: absolute;
  font-size: 3.125rem;
  margin-top: -1rem;
  margin-left: 1rem;
  letter-spacing: -0.4375rem;
  transform: scaleX(0);
  transition: transform 250ms ease-in-out;
  transform-origin: 0% 50%;
}
.project-live-right:hover::after {
  transform: scaleX(1);
  transform-origin: 100% 50%;
}

.project-left {
  background: repeating-linear-gradient(45deg, lime, lime 0.125rem, transparent 0.1875rem, transparent 5rem);
}
.project-left .project-image, .project-left .slider-cont {
  transform: translateX(-30rem);
}
.project-left .project-image.projects__fade-in, .project-left .slider-cont.projects__fade-in {
  transform: translateX(0);
  opacity: 1;
}
.project-left .project-info {
  margin-left: 1.5625rem;
  transform: translateX(30rem);
}
@media (max-width: 1300px) {
  .project-left .project-info {
    margin-left: 0;
  }
}

.project-right {
  background: repeating-linear-gradient(135deg, lime, lime 0.125rem, transparent 0.1875rem, transparent 5rem);
}
@media (max-width: 1300px) {
  .project-right {
    padding-top: 3rem;
  }
}
.project-right .project-image, .project-right .slider-cont {
  transform: translateX(30rem);
}
.project-right .project-image.projects__fade-in, .project-right .slider-cont.projects__fade-in {
  transform: translateX(0);
  opacity: 1;
}
.project-right .project-info {
  margin-right: 1.5625rem;
  transform: translateX(-30rem);
}
@media (max-width: 1300px) {
  .project-right .project-info {
    margin-right: 0;
  }
}

.project-info.projects__fade-in {
  transform: translateX(0);
  opacity: 1;
}
@media (max-width: 1300px) {
  .project-info {
    margin-top: 2.5rem;
  }
  .project-info-slide {
    margin-top: 3.125rem;
  }
}
@media (max-width: 768px) {
  .project-info-slide {
    margin-top: 3.7rem;
  }
}
@media (max-width: 635px) {
  .project-info {
    width: 42rem;
    padding-bottom: 2.9rem;
  }
  .project-info-slide {
    margin-top: 3.9rem;
  }
  .project-info .project-heading {
    font-size: 3.1rem;
  }
  .project-info .project-stack {
    font-size: 1.6rem;
  }
  .project-info .project-description {
    font-size: 1.5rem;
    margin-bottom: 1.94rem;
  }
  .project-info .project-lives__cont {
    scale: 1.15;
  }
}
@media (max-width: 475px) {
  .project-info {
    padding-bottom: 3.2rem;
  }
  .project-info .project-heading {
    font-size: 3.35rem;
  }
  .project-info .project-stack {
    font-size: 1.8rem;
  }
  .project-info .project-description {
    font-size: 1.7rem;
    margin-bottom: 2.3rem;
  }
  .project-info .project-lives__cont {
    scale: 1.3;
  }
}/*# sourceMappingURL=projects.css.map */