/*
 * This file is part of the AP project.
 * @version 5.1.0
 * @author Jan Koša <jackinello@gmail.com>
 * @copyright (c) 2022 Jan Koša. All rights reserved.
 */

/*
 * --------------------------------------------------------------------------------
 * --- Variables ------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
:root {
}

/*
 * --------------------------------------------------------------------------------
 * --- HTTP 404 -------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-http-404 {
    background-color: #ffffff;
}

.p-http-404 h1 {
    text-align: center;
}

.p-http-404__text {
    margin: 0 0 2.0em 0;
    text-align: center;
    color: #333333;
}

.p-http-404__image {
    width: 140px;
    height: auto;
    margin: 20px auto 10px auto;
}

/*
 * --------------------------------------------------------------------------------
 * --- Home -----------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-home {
}

/*
 * Home tiles 1
 */
.p-home-tiles-1 {
    margin: 0 0 2.0em 0;
}

.p-home-tiles-1__link {
    font-size: 1.20em;
    font-weight: bold;
    line-height: 1.35em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100px;
    margin: 0 0 10px 0;
    padding: 0 50px 0 20px;
    border-radius: var(--tile-border-radius);
    background-image: url("../images/icon-arrow-dark.svg");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%;
    background-size: 24px auto;
}

.p-home-tiles-1__link,
.p-home-tiles-1__link:active,
.p-home-tiles-1__link:link,
.p-home-tiles-1__link:visited {
    text-decoration: none;
    color: var(--color-red);
    border: 2px solid var(--color-red);
    background-color: #ffffff;
}

.p-home-tiles-1__link span {
    font-size: 0.70em;
    font-weight: normal;
    color: #000000;
}

.p-home-tiles-1__link:hover {
    text-decoration: none;
    color: #ffffff;
    background-color: var(--color-red);
    background-image: url("../images/icon-arrow-light.svg");
}

.p-home-tiles-1__link:hover span {
    color: #ffffff;
}

.p-home-tiles-1__link:last-child {
    margin: 0;
}

@media screen and (min-width: 660px) {
    .p-home-tiles-1 {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 20px;
    }

    .p-home-tiles-1__link {
        width: calc(33.33% - 5px);
        height: 140px;
    }

    .p-home-tiles-1__link:last-child {
        margin: 0 0 10px 0;
    }
}

/*
 * Home tiles 2
 */
.p-home-tiles-2 {
    margin: 0 0 2.0em 0;
}

.p-home-tiles-2__image {
    width: 100%;
    height: auto;
    margin: 0 0 12px 0;
    padding: 5px;
    border: 5px solid #eeeeee;
    border-radius: 30px;
}

.p-home-tiles-2__tiles {
    width: 100%;
}

.p-home-tiles-2__link,
.p-home-tiles-2__text {
    font-size: 1.20em;
    font-weight: bold;
    line-height: 1.35em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 70px;
    margin: 0 0 10px 0;
    padding: 0 50px 0 20px;
    border-radius: var(--tile-border-radius);
    background-image: url("../images/icon-arrow-light.svg");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%;
    background-size: 24px auto;
}

.p-home-tiles-2__text {
    color: #ffffff;
    background-color: #555555;
}

.p-home-tiles-2__link,
.p-home-tiles-2__link:active,
.p-home-tiles-2__link:link,
.p-home-tiles-2__link:visited {
    text-decoration: none;
    color: #ffffff;
    background-color: var(--color-red);
}

.p-home-tiles-2__link:hover {
    text-decoration: none;
    background-image: url("../images/icon-arrow-light.svg");
}

.p-home-tiles-2__link span {
    font-size: 0.70em;
    font-weight: normal;
}

.p-home-tiles-2__link:hover span {
    text-decoration: none !important;
}

.p-home-tiles-2__link:last-child {
    margin: 0;
}

@media screen and (min-width: 700px) {
    .p-home-tiles-2 {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 20px;
    }

    .p-home-tiles-2__image {
        width: calc(60% - 20px);
        max-height: 300px;
        margin: 0;
        object-fit: cover;
    }

    .p-home-tiles-2__tiles {
        width: 40%;
    }
}

@media screen and (min-width: 800px) {
    .p-home-tiles-2__link,
    .p-home-tiles-2__text {
        height: 80px;
    }
}

/*
 * Home tiles 3
 */
.p-home-tiles-3 {
    margin: 0 0 2.0em 0;
}

.p-home-tiles-3__link--facebook {
    background-image: url("../images/icon-facebook.svg");
}

.p-home-tiles-3__link--facebook:hover {
    background-image: url("../images/icon-facebook-focus.svg");
}

.p-home-tiles-3__link--voyage {
    background-image: url("../images/icon-voyage.svg");
}

.p-home-tiles-3__link--voyage:hover {
    background-image: url("../images/icon-voyage-focus.svg");
}

.p-home-tiles-3__link--contact {
    background-image: url("../images/icon-pin.svg");
}

.p-home-tiles-3__link--contact:hover {
    background-image: url("../images/icon-pin-focus.svg");
}

.p-home-tiles-3__link--restaurant {
    background-image: url("../images/icon-restaurant.svg");
}

.p-home-tiles-3__link--restaurant:hover {
    background-image: url("../images/icon-restaurant-focus.svg");
}

.p-home-tiles-3__link {
    font-size: 1.20em;
    font-weight: bold;
    line-height: 1.35em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 120px;
    margin: 0 0 10px 0;
    padding: 0 20px 0 70px;
    border: 2px solid var(--color-red);
    border-radius: var(--tile-border-radius);
    background-repeat: no-repeat;
    background-position: 20px 50%;
    background-size: 30px auto;
}

.p-home-tiles-3__link,
.p-home-tiles-3__link:active,
.p-home-tiles-3__link:link,
.p-home-tiles-3__link:visited {
    text-decoration: none;
    color: var(--color-red);
}

.p-home-tiles-3__link span {
    font-size: 0.70em;
    font-weight: normal;
    color: #000000;
}

.p-home-tiles-3__link:hover,
.p-home-tiles-3__link:hover span {
    text-decoration: none;
    color: #ffffff;
    background-color: var(--color-red);
}

@media screen and (min-width: 600px) {
    .p-home-tiles-3 {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .p-home-tiles-3__link {
        width: calc(50% - 5px);
        margin: 0;
    }
}

@media screen and (min-width: 1070px) {
    .p-home-tiles-3 {
        gap: 9px;
    }

    .p-home-tiles-3__link {
        width: calc(25% - 7px);
    }
}

/*
 * Home strip
 */
.p-home-strip {
    margin: 0 0 2.0em 0;
}

.p-home-strip-column-1 {
    margin: 0 0 2.0em 0;
    padding: 10px 0 15px 20px;
    border-left: 2px solid var(--color-red);
}

.p-home-strip-restaurant {
}

.p-home-strip-restaurant__headline-1 {
    margin: 0;
}

.p-home-strip-restaurant__headline-2 {
    font-size: 1.5em;
    color: var(--color-red);
    margin: 0 0 0.75em 0;
}

.p-home-strip-restaurant__wrapper {
    width: 100%;
}

@media screen and (min-width: 1000px) {
    .p-home-strip-restaurant__wrapper {
        display: flex;
        gap: 20px;
    }

    .p-home-strip-restaurant__food-menu,
    .p-home-strip-restaurant__drink-menu {
        margin: 0;
    }
}

.p-home-strip-column-2 {
    margin: 0 0 2.0em 0;
    padding: 10px 0 10px 20px;
    border-left: 2px solid var(--color-red);
}

.p-home-strip-calendar {
}

.p-home-strip-calendar__headline-1 {
    margin: 0;
}

.p-home-strip-calendar__headline-2 {
    font-size: 1.5em;
    color: var(--color-red);
    margin: 0 0 0.75em 0;
}

@media screen and (min-width: 800px) {
    .p-home-strip {
        display: flex;
        align-items: stretch;
        flex-wrap: nowrap;
    }

    .p-home-strip-column-1 {
        width: 50%;
        margin: 0;
        padding-right: 20px;
    }

    .p-home-strip-column-2 {
        width: 50%;
        margin: 0;
    }
}

.p-home-strip-opening-hour {
    padding: 20px;
    background-color: var(--color-red);
    color: #ffffff;
    border-radius: var(--tile-border-radius);
}

.p-home-strip-opening-hour__headline-2 {
    font-size: 1.5em;
    color: #ffffff;
    margin: 0 0 0.5em 0;
}

.p-home-strip-opening-hour__content {
    color: #ffffff;
    margin: 0;
}

/*
 * Home operator
 */
.p-home-operator {
    width: 100%;
    margin: 0 0 2.0em 0;
    padding: 20px;
    border-radius: var(--tile-border-radius);
    background-color: #eeeeee;
}

.p-home-operator__content {
    margin: 0 0 1.5em 0;
    text-align: center;
}

.p-home-operator__content p {
    margin: 0;
}

.p-home-operator__image {
    width: 250px;
    height: auto;
    margin: 0 auto 0 auto;
}

@media screen and (min-width: 700px) {
    .p-home-operator {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 40px;
    }

    .p-home-operator__content {
        margin: 0;
        text-align: left;
    }

    .p-home-operator__image {
        width: 25%;
        min-width: 200px;
        max-width: 260px;
        margin: 0;
    }
}

/*
 * Home sponsor
 */
.p-home-sponsor {
    margin: 0 0 1.5em 0;
}

.p-home-sponsor__headline {
    margin: 0 0 1.0em 0;
    text-align: center;
}

.p-home-sponsor__images {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: center;
    width: 100%;
}

.p-home-sponsor__images img {
    width: auto;
    height: 80px;
    margin: 0 30px;
}

/*
 * --------------------------------------------------------------------------------
 * --- About ship -----------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-about-ship {
}

.p-about-ship__image {
    width: 100%;
    height: auto;
    margin: 0 0 2.0em 0;
    border-radius: var(--image-border-radius);
}

.p-about-ship__image--drawing {
    border: 1px solid #dddddd;
}

.p-about-ship-table {
    width: 100%;
    margin: 0 0 1.5em 0;
}

.p-about-ship-table__row {
}

.p-about-ship-table__row:nth-child(odd) {
    background-color: #dddddd;
}

.p-about-ship-table__row:nth-child(even) {
    background-color: #ffffff;
}

.p-about-ship-table__row--head th {
    text-align: left;
    color: #ffffff;
    background-color: var(--color-red);
}

.p-about-ship-table__cell1 {
    width: 50%;
    padding: 5px 10px;
}

@media screen and (min-width: 900px) {
    .p-about-ship-table__cell1 {
        width: 30%
    }
}

.p-about-ship-table__cell2 {
    padding: 5px 10px;
}

/*
 * --------------------------------------------------------------------------------
 * --- Timetable ------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-timetable--summer {
    margin: 0 0 2.0em 0;
    border-bottom: 1px solid #eeeeee;
}

.p-timetable--summer .p-timetable__headline {
    color: var(--color-red);
}

.p-timetable--summer .p-timetable__note {
    display: inline-block;
    margin: 0;
    padding: 6px 10px;
    color: #ffffff;
    background-color: var(--color-red);
}

@media screen and (min-width: 740px) {
    .p-timetable--summer .p-timetable__note {
        margin: 1.5em 0 0 0;
    }
}

.p-timetable--winter {
    margin: 0 0 2.0em 0;
}

.p-timetable--winter .p-timetable__headline {
    color: #238dda;
}

.p-timetable__list {
    margin: 0 0 1.5em 0;
    list-style: none;
}

.p-timetable__item {
    line-height: 1.75em;
    margin: 0 0 0 0;
    padding: 0 0 0 23px;
    background-image: url(../images/icon-square-red.svg);
    background-repeat: no-repeat;
    background-position: left 9px;
    background-size: 8px;
}

.p-timetable__table {
    width: 100%;
    margin: 0;
    border-spacing: 0;
    border-collapse: collapse;
    border: none;
    border-top: 1px solid #eeeeee;
}

.p-timetable__thead th {
    font-weight: normal;
    padding: 6px 10px;
}

.p-timetable__tbody td {
    padding: 6px 10px;
}

.p-timetable--summer .p-timetable__row--highlight {
    background-color: var(--color-red);
}

.p-timetable__row--highlight td {
    color: #ffffff;
}

.p-timetable__row--odd {
    background-color: #eeeeee;
}

.p-timetable__row--odd {
}

.p-timetable__cell--day {
    font-weight: bold;
    text-align: left;
}

.p-timetable__cell--direction {
    font-weight: bold;
    text-align: left;
}

.p-timetable__cell--departure {
    text-align: center;
}

.p-timetable__cell--stopover {
    text-align: center;
}

.p-timetable__cell--arrival {
    text-align: center;
}

.p-timetable__cell--price {
    text-align: right;
}

.p-timetable__cell--note {
    text-align: left;
}

@media screen and (max-width: 740px) {
    .p-timetable__table,
    .p-timetable__table thead,
    .p-timetable__table tbody,
    .p-timetable__table th,
    .p-timetable__table td,
    .p-timetable__table tr {
        display: block;
        border: none;
    }

    .p-timetable__table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .p-timetable__table tr {
        margin-bottom: 1.5em;
        border: 2px solid #eeeeee;
        background-color: transparent !important;
    }

    .p-timetable--summer .p-timetable__row--highlight {
        border: 2px solid var(--color-red);
    }

    .p-timetable__table td {
        position: relative;
        padding: 6px 10px 6px 50%;
        color: #000000;
        border: none;
    }

    .p-timetable__table td:nth-child(odd) {
        background-color: #eeeeee;
    }

    .p-timetable__table td:before {
        font-weight: bold;
        position: absolute;
        left: 10px;
        content: attr(data-label) ':';
    }

    .p-timetable__cell--day,
    .p-timetable__cell--direction,
    .p-timetable__cell--departure,
    .p-timetable__cell--stopover,
    .p-timetable__cell--arrival,
    .p-timetable__cell--price {
        font-weight: normal;
        text-align: left;
    }
}

/*
 * --------------------------------------------------------------------------------
 * --- Articles -------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-articles {
}

/*
 * --------------------------------------------------------------------------------
 * --- Article --------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-article {
}

/*
 * --------------------------------------------------------------------------------
 * --- Voyages --------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-voyages {
}

/*
 * --------------------------------------------------------------------------------
 * --- Voyage ---------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-voyage {
}

/*
 * --------------------------------------------------------------------------------
 * --- Restaurant -----------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-restaurant {
}

.p-restaurant-menu {
    margin: 0 0 1.5em 0;
}

.p-restaurant__image {
    width: 100%;
    height: auto;
    margin: 0 0 2.0em 0;
    border-radius: var(--image-border-radius);
}

.p-restaurant__opening-hour {
    padding: 20px;
    background-color: var(--color-red);
    color: #ffffff;
    border-radius: var(--tile-border-radius);
}

.p-restaurant-menu-headline__wrapper {
    display: flex;
    align-items: center;
    margin: 0 0 1.0em 0;
    padding: 1.0em 0 0 0;
    border-top: 2px solid var(--color-red);
}

.p-restaurant-menu-headline__icon {
    display: block;
    margin: 0 12px 0 0;
    width: 60px;
    height: auto;
}

.p-restaurant-menu-headline__title {
    font-size: 1.5em;
    color: var(--color-red);
    margin: 0;
}

/*
 * --------------------------------------------------------------------------------
 * --- Galleries ------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-galleries {
}

/*
 * --------------------------------------------------------------------------------
 * --- Gallery --------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-gallery {
}

/*
 * --------------------------------------------------------------------------------
 * --- Operator -------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-operator {
}

.p-operator-annotation {
    width: 100%;
    margin: 0 0 2.0em 0;
    padding: 20px;
    border-radius: var(--tile-border-radius);
    background-color: #eeeeee;
}

.p-operator-annotation__content {
    margin: 0 0 1.5em 0;
}

.p-operator-annotation__content p {
    margin: 0;
}

.p-operator-annotation__image {
    width: 250px;
    height: auto;
    margin: 0 auto 0 auto;
}

@media screen and (min-width: 700px) {
    .p-operator-annotation {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 40px;
    }

    .p-operator-annotation__content {
        margin: 0;
    }

    .p-operator-annotation__image {
        width: 25%;
        min-width: 200px;
        max-width: 260px;
        margin: 0;
    }
}

.p-operator-information li > span,
.p-operator-information p > span {
    font-weight: bold;
    padding: 0 10px 0 0;
}

/*
 * --------------------------------------------------------------------------------
 * --- Contact --------------------------------------------------------------------
 * --------------------------------------------------------------------------------
 */
.p-contact-grid-1 {
    display: block;
    margin: 0 0 2.0em 0;
}

.p-contact-grid-1__cell {
    width: 100%;
    margin: 0 0 1.0em 0;
    padding: 10px 10px 10px 10px;
    border: 2px solid var(--color-red);
    border-radius: var(--tile-border-radius);
}

.p-contact-grid-1__cell p {
    margin: 0;
    padding-left: 65px;
    background-repeat: no-repeat;
    background-position: 0 50%;
    background-size: auto 50px;
}

.p-contact-grid-1__cell--1 {
    background-image: url("../images/icon-phone.svg");
}

.p-contact-grid-1__cell--2 {
    background-image: url("../images/icon-phone.svg");
}

.p-contact-grid-1__cell--3 {
    background-image: url("../images/icon-email.svg");
}

.p-contact-grid-1__cell--4 {
    background-image: url("../images/icon-facebook.svg");
}

.p-contact-grid-1__cell span {
    font-size: 1.30em;
    color: var(--color-red);
}

.p-contact-grid-1__cell a,
.p-contact-grid-1__cell a:active,
.p-contact-grid-1__cell a:link,
.p-contact-grid-1__cell a:visited {
    color: var(--color-red);
}

@media screen and (min-width: 600px) {
    .p-contact-grid-1 {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }

    .p-contact-grid-1__cell {
        width: calc(50% - 6px);
        margin: 0;
    }
}

@media screen and (min-width: 1150px) {
    .p-contact-grid-1__cell {
        width: calc(25% - 9px);
    }
}

.p-contact-map {
    width: 100%;
    height: 260px;
    max-height: 260px;
    padding: 0;
}

@media screen and (min-width: 600px) {
    .p-contact-map {
        height: 300px;
        max-height: 300px;
    }
}

@media screen and (min-width: 900px) {
    .p-contact-map {
        height: 450px;
        max-height: 450px;
    }
}
