#shipView {
  hr {
    margin-top: 1.6rem;
    margin-bottom: 1.6rem;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
  }

  .mainInfo {
    .title {
      color: #3f84c5;
      font-family: Roboto;
      font-size: 32px;
      font-weight: 700;
      letter-spacing: 0.64px;
      line-height: 45px;
      padding-top: 52px;
    }

    .relations {
      margin-top: 30px;

      .ship {
        margin-bottom: 25px;

        a {
          color: #333333;
        }
      }
    }

    .rightPanel {
      .metadata {
        .metadata__events {
          & > .metadata__event {
            & > .dl-horizontal.metadata__event-dl {
              margin-bottom: 14px;
            }
          }
        }
      }
    }
  }

  .journeyData {
    padding-bottom: 150px;
    margin-top: 40px;
    margin-bottom: 30px;

    .event.journey {
      margin-top: 70px;

      .headerRow {
        font-family: Roboto;
        font-weight: 400;

        .name {
          color: #fcfcfc;
          font-size: 32px;
          line-height: 44px;
          padding-bottom: 78px;
        }

        .openPanel {
          .openPanelButton {
            position: absolute;
            bottom: -13px;
            background-position: left center;
            background-size: 16px 16px;
            padding-left: 26px;
            background-repeat: no-repeat;
            cursor: pointer;
            font-size: 16px;

            &.openAction {
              background-image: url("https://commons.digitalebibliothek.gbv.de/prizepapers/images/ship/openPanelIcon.svg");
            }

            &.closeAction {
              background-image: url("https://commons.digitalebibliothek.gbv.de/prizepapers/images/ship/closePanelIcon.svg");
            }
          }
        }
      }

      .journeyDataPanel {
        padding-top: 44px;
        display: none;

        .journeyType {
          color: white;
          font-size: 20px;
          line-height: 20px;
          margin-bottom: 40px;
        }

        .relations {
          div {
            padding-bottom: 22px;
          }
        }

        .lading {
          margin-top: 70px;

          .ladingHeader {
            height: 39px;
            color: #fcfcfc;
            font-family: Roboto;
            font-size: 16px;
            font-weight: 700;
            line-height: 35px;
            background-image: url("https://commons.digitalebibliothek.gbv.de/prizepapers/images/ship/lading.svg");
            background-position: left center;
            background-size: 35px 39px;
            padding-left: 64px;
            padding-top: 8px;
          }

          .thing {
            margin-top: 20px;

            .product {
              margin-top: 20px;
              margin-bottom: 10px;
              color: #fcfcfc;
              font-family: Roboto;
              font-size: 16px;
              font-weight: 700;
              line-height: 35px;
              display: list-item;
              margin-left: 1.3em;
              list-style-type: square;
              margin-left: 1px;

              .document_as_source {
                margin-left: 40px;

                .title {
                  font-weight: 300;
                }
              }
            }
          }

          .people_on_board {
            display: flex;
            justify-content: space-between;
            padding-bottom: 50px;

            .crew,
            .passengers,
            .passengers_enslaved,
            .prisoners {
              height: 36px;
              background-image: url("https://commons.digitalebibliothek.gbv.de/prizepapers/images/ship/passenger_crew.svg");
              background-size: 36px 36px;
              background-position: left bottom;
              padding-left: 40px;
              color: #fcfcfc;
              font-family: Roboto;
              font-size: 16px;
              font-weight: 700;
              line-height: 16px;
              padding-top: 22px;

              .count {
                color: #212121;
                font-family: Roboto;
                font-size: 16px;
                font-weight: 400;
                line-height: 35px;
                margin-left: -33px;
                margin-top: 13px;
              }
            }
          }

          .actors {
            margin-top: 30px;

            .metadata__event {
              .dl-horizontal.metadata__event-dl {
                dd {}

                dt {
                  width: 40%;
                }
              }
            }
          }

          .ladingDocuments {
            .document {
              display: flex;
              align-items: flex-end;

              a {
                width: 100%;
                height: 100%;
                color: white;
                display: block;
              }

              .image {
                width: 40px;
                height: 60px;
                border-radius: 2px;
              }

              .title {
                a {
                  max-width: 200px;
                  overflow: hidden;
                  text-overflow: ellipsis;
                  white-space: nowrap;
                  margin-left: 10px;
                  background-image: url("https://commons.digitalebibliothek.gbv.de/prizepapers/images/entityRelations/gotoIcon_white.svg");
                  padding-right: 25px;
                  background-position: right center;
                  background-size: 20px 18px;
                }
              }
            }
          }
        }
      }
    }
  }
}
@media all and (max-width:1024px) {
  #shipView {
    hr {}

    .mainInfo {
      .title {
        font-size: 22px;
      }

      .relations {
        .ship {
          a {}
        }
      }

      .leftPanel {
        display: none;
      }

      .rightPanel {
        .metadata {
          .metadata__events {
            & > .metadata__event {
              & > .dl-horizontal.metadata__event-dl {}
            }
          }
        }
      }
    }

    .journeyData {
      .event.journey {
        margin-top: 40px;

        .headerRow {
          .name {
            font-size: 22px;
            line-height: 40px;
            padding-bottom: 24px;
          }

          .openPanel {
            margin-top: 34px;

            .openPanelButton {
              &.openAction {}

              &.closeAction {}
            }
          }
        }

        .journeyDataPanel {
          .journeyType {}

          .relations {
            div {}
          }

          .lading {
            .ladingHeader {}

            .thing {
              .product {
                .document_as_source {
                  .title {}
                }
              }
            }

            .people_on_board {
              .crew,
              .passengers,
              .passengers_enslaved,
              .prisoners {
                .count {}
              }
            }

            .actors {
              .metadata__event {
                .dl-horizontal.metadata__event-dl {
                  dd {}

                  dt {}
                }
              }
            }

            .ladingDocuments {
              .document {
                a {}

                .image {}

                .title {
                  a {}
                }
              }
            }
          }
        }
      }
    }
  }
}