@import url("https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100;0,300;0,400;0,700;0,800;0,900;1,700;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond&family=Fredoka+One&&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@300;400&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inconsolata:wght@200;300;400&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Mate+SC&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Questrial&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Raleway+Dots&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,500&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Iceland&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Baloo+Tammudu+2&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Emblema+One&display=swap");
@import url("https://fonts.googleapis.com/css2?family=NTR&display=swap");
@import url("https://fonts.googleapis.com/css2?family=DM+Sans&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Syne&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap");
.toolbox-internal-paragraph {
  width: 80%;
}

.summary-content .summary-paragraph p {
  line-height: 42px;
}

.proj-header-image {
  filter: grayscale(80%) blur(5px);
}

.proj-header h1 {
  font-family: "DM Sans", sans-serif;
  text-transform: none;
}
.proj-header::before {
  display: none;
}

.toolbox .toolbox-content {
  width: 80%;
}
.toolbox .toolbox-content .toolbox-internal .toolbox-internal-paragraph {
  width: 100%;
}
.toolbox .toolbox-content .toolbox-internal .toolbox-internal-paragraph p {
  line-height: 36px;
}

#solitaire-show {
  margin-top: 96px;
}
#solitaire-show .solitaire-header {
  text-align: right;
}
#solitaire-show .solitaire-header h2 {
  opacity: 0.25;
  font-family: "DM Sans", sans-serif;
  font-size: 24px;
}
#solitaire-show .solitaire-header h1 {
  font-family: "Raleway", sans-serif;
  font-weight: 600;
  font-size: 32px;
  text-transform: uppercase;
}
#solitaire-show .solitaire-row {
  display: flex;
  flex-direction: row;
  margin-top: 48px;
}
#solitaire-show .solitaire-row .solitaire-show-img {
  pointer-events: all;
  opacity: 0.25;
}
#solitaire-show .solitaire-row .solitaire-show-img img {
  transition: 0.75s;
  transition-delay: 0.75s;
  filter: grayscale(100%);
  width: 300px;
  height: auto;
}
#solitaire-show .solitaire-row .solitaire-show-img:hover img {
  transition-delay: 0s;
  filter: grayscale(60%);
}
#solitaire-show .solitaire-row .solitaire-paragraph {
  position: relative;
  margin-left: 96px;
}
#solitaire-show .solitaire-row .solitaire-paragraph p {
  opacity: 0.5;
  font-family: "Raleway", sans-serif;
  font-weight: 300;
  line-height: 32px;
}
#solitaire-show .solitaire-row .solitaire-paragraph p.upper {
  padding-left: 30%;
  text-align: right;
}
#solitaire-show .solitaire-row .solitaire-paragraph .key-task {
  pointer-events: all;
  margin-top: 48px;
}
#solitaire-show .solitaire-row .solitaire-paragraph .key-task h2 {
  position: relative;
  font-family: "Manrope", sans-serif;
  font-size: 24px;
  opacity: 0.5;
  transition: 0.5s;
  transition-timing-function: cubic-bezier(0.07, 0.75, 0.32, 0.96);
}
#solitaire-show .solitaire-row .solitaire-paragraph .key-task h2::after {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 0px;
  width: 120px;
  height: 2px;
  background-color: white;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  opacity: 0.25;
  transition: 0.5s;
  transition-timing-function: cubic-bezier(0.07, 0.75, 0.32, 0.96);
}
#solitaire-show .solitaire-row .solitaire-paragraph .key-task p {
  opacity: 0.75;
  margin-top: 24px;
  font-weight: 500;
  transition: 1s;
}
#solitaire-show .solitaire-row .solitaire-paragraph .key-task:hover h2 {
  margin-left: 6px;
}
#solitaire-show .solitaire-row .solitaire-paragraph .key-task:hover h2:after {
  left: 6px;
}
#solitaire-show .solitaire-row .solitaire-paragraph .key-task:hover p {
  opacity: 1;
}

@media (orientation: portrait) {
  .toolbox .toolbox-content {
    width: 100%;
  }
  .toolbox .toolbox-content .toolbox-internal .toolbox-internal-paragraph {
    width: 100%;
    padding-right: 20px;
  }

  .proj-header-page .proj-header img {
    width: 40vw;
  }

  .summary-image {
    display: none;
  }

  .summary-content .summary-header {
    position: relative;
  }
  .summary-content .summary-header::after {
    content: "";
    position: absolute;
    top: 0px;
    left: 48px;
    width: 100%;
    height: 100%;
    background-color: #171717;
    opacity: 1;
  }
  .summary-content .summary-paragraph p {
    line-height: 42px;
    opacity: 0.8;
  }

  #solitaire-show .solitaire-row {
    position: relative;
  }
  #solitaire-show .solitaire-row .solitaire-show-img {
    position: absolute;
    top: 0px;
    transform: translateY(-100%);
    height: 180px;
  }
  #solitaire-show .solitaire-row .solitaire-show-img img {
    width: auto;
    height: 100%;
  }
  #solitaire-show .solitaire-row .solitaire-paragraph {
    width: 100%;
    margin-left: 0px;
  }
  #solitaire-show .solitaire-row .solitaire-paragraph p {
    opacity: 0.9;
  }
  #solitaire-show .solitaire-row .solitaire-paragraph p.upper {
    opacity: 1;
    padding-left: calc(20px * 2);
  }
}

/*# sourceMappingURL=microsoft.css.map */