/* fonts */
/* colors */
/* functions */
/* typography */
h2 {
  margin-bottom: 2.5rem; }

p {
  font-size: 1.25rem;
  line-height: 1.8; }

.bold {
  font-weight: 500;
  margin-bottom: 0.5rem; }

.link__projects {
  text-decoration: underline #0C0C0C;
  color: #0C0C0C;
  transition: color 250ms ease-in;
  transition: underline 250ms ease-in; }

.link__projects:hover {
  text-decoration: underline black;
  color: black;
  transition: color 250ms ease-in;
  transition: underline 250ms ease-in; }

.gap-block {
  margin: 0 0 4rem 0; }

.gap-list {
  margin: 0 0 2.25rem 0; }

.highlight_car-insurance {
  background-color: #F2DAB8; }

.highlight_swisscom-tv {
  background-color: #F1D4D0; }

/* go back */
.go-back {
  margin: 4rem 0 0 5vw; }

/* project details */
.project-details {
  height: auto;
  width: 80vw;
  min-width: 740px;
  max-width: 1152px;
  margin: 0 auto 22rem; }
  .project-details .project-details_img {
    position: absolute;
    z-index: -1;
    height: 70vh;
    max-height: 680px;
    min-height: 520px;
    max-width: 680px;
    left: calc(50% + 2.5rem);
    margin-top: -4rem;
    background-repeat: no-repeat;
    background-position: top left;
    background-size: cover;
    background-color: #F2F2F2; }
  .project-details #img__car-insurance {
    background-image: url(../images/project-details_car-insurance.jpg); }
  .project-details #img__aila {
    background-image: url(../images/project-details_aila.jpg); }
  .project-details #img__chatbot {
    background-image: url(../images/project-details_chatbot.jpg); }
  .project-details #img__amati {
    background-image: url(../images/project-details_amati.jpg); }
  .project-details #img__reka {
    background-image: url(../images/project-details_reka.jpg); }
  .project-details #img__swisscom-tv {
    background-image: url(../images/project-details_swisscom-tv.jpg); }
  .project-details h1 {
    width: auto;
    max-width: 90%;
    font-family: "Abril Fatface", serif;
    font-weight: 400;
    font-size: 3.25rem;
    line-height: 1.4;
    margin: 8rem 0 2.25rem 0; }
  .project-details p,
  .project-details .project-details_img {
    width: calc(50% - 2.5rem); }
  .project-details .project-details__description {
    margin: 0 0 4.5rem 0; }
  .project-details .bold {
    margin: 0 0 0.25rem 0; }

/* project-content */
.project-content {
  height: auto;
  width: 740px;
  margin: 0 auto 16rem; }
  .project-content .img {
    width: 740px;
    margin: 0 auto;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; }
  .project-content #project-problem__img {
    height: 249px;
    background-image: url(../images/project-problem_car-insurance.jpg); }
  .project-content #project-strategy__img {
    height: 210px;
    background-image: url(../images/project-strategy_car-insurance.jpg); }
  .project-content #project-problem__img-swisscom-tv {
    height: 278px;
    background-image: url(../images/project-problem_swisscom-tv.jpg); }

/* project process */
.project-process {
  height: auto;
  width: 100vw;
  margin: 0 auto 16rem;
  padding: 9rem 0 9rem 0;
  background-color: #F2F2F2; }
  .project-process div:first-child {
    width: 740px;
    margin: 0 auto; }
  .project-process div:last-child {
    width: 80vw;
    min-width: 740px;
    max-width: 1152px;
    margin: 6.5rem auto 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; }
  .project-process #project-process__car-insurance {
    height: calc(80vw * 477/1001);
    background-image: url(../images/project-process_car-insurance.jpg); }
  .project-process #project-process__swisscom-tv {
    height: calc(80vw * 201/1001);
    background-image: url(../images/project-process_swisscom-tv.jpg); }

/* project solution wireframe + visual design */
.project-solution__wireframe,
.project-solution__visual-design,
.project-solution__animation {
  margin-bottom: 1rem; }

/* big images */
.project__big-img {
  width: 80vw;
  min-width: 740px;
  max-width: 1152px;
  margin: 0 auto 16rem;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover; }

#project-solution__wireframe-car-insurance {
  height: calc(80vw * 406/1001);
  background-image: url(../images/project-wireframe_car-insurance.jpg); }

#project-solution__visual-design-car-insurance {
  height: calc(80vw * 1353/1001);
  background-image: url(../images/project-visual-design_car-insurance.jpg); }

/* video */
video {
  width: 80vw;
  min-width: 740px;
  max-width: 1152px;
  margin: 0 auto 16rem;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.08);
  display: block; }

/* contact */
.contact {
  margin-top: 16rem; }

/* footer go back */
.project-footer {
  margin-top: 16rem;
  margin-bottom: 6rem; }

/* 404 */
.simple-content__go-back {
  position: absolute; }

.simple-content {
  height: 100vh;
  max-height: 100vh;
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden; }
  .simple-content h1 {
    text-align: center;
    font-family: "Abril Fatface", serif;
    font-weight: 400;
    font-size: 3.25rem;
    line-height: 1.4; }

/* portrait mode */
@media (orientation: portrait) {
  /* project details */
  .project-details #img__car-insurance {
    background-image: url(../images/project-details-portrait_car-insurance.jpg); }
  .project-details #img__aila {
    background-image: url(../images/project-details-portrait_aila.jpg); }
  .project-details #img__chatbot {
    background-image: url(../images/project-details-portrait_chatbot.jpg); }
  .project-details #img__amati {
    background-image: url(../images/project-details-portrait_amati.jpg); }
  .project-details #img__reka {
    background-image: url(../images/project-details-portrait_reka.jpg); }
  .project-details #img__swisscom-tv {
    background-image: url(../images/project-details-portrait_swisscom-tv.jpg); } }
/* mind. 1440 */
@media only screen and (min-width: 1440px) {
  /* images width 80vw, max-width 1152px */
  .project-process #project-process__car-insurance {
    height: calc(1152px*477/1001); }
  .project-process #project-process__swisscom-tv {
    height: calc(1152px*201/1001); }

  #project-solution__wireframe-car-insurance {
    height: calc(1152px*406/1001); }

  #project-solution__visual-design-car-insurance {
    height: calc(1152px*1353/1001); } }
/* 1024 */
@media only screen and (max-width: 1023px) {
  /* go back */
  .go-back {
    margin: 4rem 0 0 10vw; }

  /* project details */
  .project-details {
    width: 70vw;
    min-width: 0;
    margin: 0 auto 11.5rem; }
    .project-details .project-details_img {
      position: relative;
      z-index: 1;
      height: 70vw;
      max-height: 1023px;
      min-height: 256px;
      width: 70vw;
      max-width: 1023px;
      left: auto;
      margin-top: 8rem;
      background-position: center center; }
    .project-details #img__car-insurance {
      background-image: url(../images/project-details-1023_car-insurance.jpg); }
    .project-details #img__aila {
      background-image: url(../images/project-details-1023_aila.jpg); }
    .project-details #img__chatbot {
      background-image: url(../images/project-details-1023_chatbot.jpg); }
    .project-details #img__amati {
      background-image: url(../images/project-details-1023_amati.jpg); }
    .project-details #img__reka {
      background-image: url(../images/project-details-1023_reka.jpg); }
    .project-details #img__swisscom-tv {
      background-image: url(../images/project-details-1023_swisscom-tv.jpg); }
    .project-details h1 {
      max-width: 70vw;
      font-size: 2.625rem;
      line-height: 1.4;
      margin: 6.5rem 0 2.25rem 0; }
    .project-details p,
    .project-details .project-details_img {
      width: 100%; }
    .project-details .project-details__description {
      margin: 0 0 4rem 0; }

  /* project-content */
  .project-content {
    width: 70vw;
    margin: 0 auto 11.5rem; }
    .project-content .img {
      width: 70vw; }
    .project-content #project-problem__img {
      height: calc(70vw * 249 / 740); }
    .project-content #project-strategy__img {
      height: calc(70vw * 210 / 740); }
    .project-content #project-problem__img-swisscom-tv {
      height: calc(70vw * 278 / 740); }

  /* project process */
  .project-process {
    margin: 0 auto 11.5rem;
    padding: 7.5rem 0 7.5rem 0; }
    .project-process div:first-child {
      width: 70vw; }
    .project-process div:last-child {
      width: 70vw;
      min-width: 0;
      max-width: 1023px;
      margin: 5rem auto 0; }
    .project-process #project-process__car-insurance {
      height: calc(70vw * 477 / 1001); }
    .project-process #project-process__swisscom-tv {
      height: calc(70vw * 724 / 1001);
      background-image: url(../images/project-process-1023_swisscom-tv.jpg); }

  /* project solution wireframe + visual design */
  .project-solution__wireframe,
  .project-solution__visual-design,
  .project-solution__animation {
    margin-bottom: 1rem; }

  /* big images + video */
  .project__big-img,
  video {
    width: 70vw;
    min-width: 0;
    max-width: 1023px;
    margin: 0 auto 11.5rem; }

  #project-solution__wireframe-car-insurance {
    height: calc(70vw * 406 / 1001); }

  #project-solution__visual-design-car-insurance {
    height: calc(70vw * 1353 / 1001); }

  /* contact */
  .contact {
    margin-top: 11.5rem; }

  /* footer go back */
  .project-footer {
    margin-top: 11.5rem;
    margin-bottom: 5.5rem; }

  /* 404 */
  .simple-content h1 {
    font-size: 2.625rem;
    line-height: 1.4; } }
/* 480 */
@media only screen and (max-width: 480px) {
  /* typography */
  h2 {
    line-height: 1.8;
    font-size: 1.375rem;
    margin-bottom: 1.5rem; }

  p {
    font-size: 1.125rem; }

  .gap-block {
    margin: 0 0 2.5rem 0; }

  .gap-list {
    margin: 0 0 2rem 0; }

  /* go back */
  .go-back {
    margin: 2rem 0 0 2rem; }

  /* project details */
  .project-details {
    width: 100vw;
    min-width: 0;
    margin: 0 auto 6.5rem;
    padding: 0 2rem 0 2rem; }
    .project-details .project-details_img {
      height: calc(100vw - 4rem);
      width: 100%;
      margin-top: 5.5rem; }
    .project-details #img__car-insurance {
      background-image: url(../images/project-details-480_car-insurance.jpg); }
    .project-details h1 {
      max-width: 100%;
      font-size: 1.75rem;
      line-height: 1.6;
      margin: 4.5rem 0 2rem 0;
      padding: 0; }
    .project-details .project-details__description {
      margin: 0 0 3rem 0; }

  /* project-content */
  .project-content {
    width: 100vw;
    margin: 0 auto 6.5rem;
    padding: 0 2rem 0 2rem; }
    .project-content .img {
      width: 100%; }
    .project-content #project-problem__img {
      height: calc((100vw - 4rem) * 783 / 778);
      background-image: url(../images/project-problem-480_car-insurance.jpg); }
    .project-content #project-strategy__img {
      height: calc((100vw - 4rem) * 413 / 778);
      background-image: url(../images/project-strategy-480_car-insurance.jpg); }
    .project-content #project-problem__img-swisscom-tv {
      height: calc((100vw - 4rem) * 470 / 778);
      background-image: url(../images/project-problem-480_swisscom-tv.jpg); }

  /* project process */
  .project-process {
    margin: 0 auto 6.5rem;
    padding: 5rem 0 5rem 0; }
    .project-process div:first-child {
      width: 100vw;
      padding: 0 2rem 0 2rem; }
    .project-process div:last-child {
      width: calc(100vw - 4rem);
      margin: 2.5rem auto 0; }
    .project-process #project-process__car-insurance {
      height: calc((100vw - 4rem) * 1710 / 778);
      background-image: url(../images/project-process-480_car-insurance.jpg); }
    .project-process #project-process__swisscom-tv {
      height: calc((100vw - 4rem) * 724 / 1001); }

  /* project solution wireframe + visual design */
  .project-solution__wireframe,
  .project-solution__visual-design,
  .project-solution__animation {
    margin-bottom: 1rem; }

  /* big images + video */
  .project__big-img,
  video {
    width: 90vw;
    margin: 0 auto 6.5rem; }

  #project-solution__wireframe-car-insurance {
    height: calc(90vw * 1175 / 778);
    background-image: url(../images/project-wireframe-480_car-insurance.jpg); }

  #project-solution__visual-design-car-insurance {
    height: calc(90vw * 1270 / 778);
    background-image: url(../images/project-visual-design-480_car-insurance.jpg); }

  /* contact */
  .contact {
    margin-top: 6.5rem; }

  /* footer go back */
  .project-footer {
    margin-top: 7rem;
    margin-bottom: 4rem; }

  /* 404 */
  .simple-content h1 {
    font-size: 1.75rem;
    line-height: 1.6; } }

/*# sourceMappingURL=style-content.css.map */