@charset "utf-8";

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


/*TYPOGRAPHY*/
h2 {
    font-family: 'Lexend';
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: 57px; 
}

h3 {
    font-family: 'Lexend';
    font-size: 34px;
    font-style: normal;
    font-weight: 700;
    line-height: 43px;
}

h4 {
    font-family: 'Lexend';
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 33px;
}

h5 {
    font-family: 'Lexend';
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

h6 {
    font-family: 'Lexend';
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

p { /*textak*/
    font-family: 'Roboto';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; 
}


/*ACTIONS*/
.wrapper-actions {
    max-width: 1220px;
    margin: 150px auto 0;
}

.container-actions {
    width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.block-action {
    width: 292px;
    height: 472px;
    border: 1px solid #BBB;
}

.block-action .card-img-container {
    display: flex;
    justify-content: center;
    height: 292px;
    align-items: center;
    overflow: hidden;
}

.block-action .card-img-container img {
    height: 292px;
}

.block-action .card-body {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 19px 20px 13px;
    background: #fff;
    text-align: center;
    border-top: solid 1px #bbb;
}

.block-action .card-body .specific {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.block-action .card-body .specific h6 {
    color: #D77900; 
    background:#FAF0E2;
    border-radius: 100px;
    padding: 4px 8px;
    margin: 0;
}

.block-action .card-body .specific p {
    color: #6C6C6C;
    margin: 0;
}

.block-action .card-body h5 {
    color: #D77900; 
    margin: 0;
}

.wrapper-actions h3 {
    color: #D77900; 
    margin: 80px 0 20px;
    text-align: center;
}

@media (max-width: 1219px) {
    .wrapper-actions {
        width: 100%;
    }  

    .container-actions {
        justify-content: center;
    }
}


/*BLOCK-ACTION HOVER*/
.block-action .card-img-container {
    position: relative; 
    overflow: hidden; 
}

.block-action:hover img {
    transform: scale(1.2);
    transition: transform 0.5s ease; 
}

.block-action:hover h6 {
    background-color: #F1D2AA;
    transition: background-color 0.5s ease;
}

.block-action:hover .card-body {
    background: #FAF0E2;
    transition: background-color 0.5s ease;
}

.block-action:hover h5 {
    text-decoration: underline;
    transition: text-decoration 0.5s ease;
}


/*CALENDAR*/
.calendar {
    width: 292px;
    height: 472px; 
    border: 1px solid #f1d2aa; 
    user-select: none;
    position: absolute;
}

.border-none {
    border: none;
}

@media (max-width: 1219px) {
    .calendar {
       position: static;
       margin: 0 auto 16px;
    }  

    .respons-none {
        display: none;
    }
}

.calendar_days, 
.calendar_weekdays, 
.calendar_header {
    position: relative;
    overflow: hidden; 
}

.calendar_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    text-align: center; 
    padding: 12px; 
    background: #FAF0E2;
}

.calendar h3 {
    font-size:30px;
    line-height: 1;
    color: #212529;
    margin: 0.25rem;
    width: 90%;
}

.calendar-content {
    padding: 30px 16px 7px;
    background: #fff;
}

.calendar_weekdays {
    display: flex;
    justify-content: space-between;
}

.calendar_weekdays div {
    font-family: 'Lexend';
    font-size: 20px;
    font-weight: 700;
    color: #D77900;
    width: 14.28571%;
    text-align: center;
}

.calendar_days {
    display: flex;
    flex-wrap: wrap;
}

.calendar_days div {
    position: relative;
    font-size: 16px;
    font-family: 'Lexend';
    color: #bbb;
    overflow: hidden;
    text-align: center;
    width: 14.28571%;
    border: 1px solid transparent;
    padding: 12px 0;
    z-index: 10;
}

.calendar_days div.actionOn {
    color: #000;
    font-weight: 700;
    cursor: pointer;
}

.calendar_days div.actionOn:after {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    width: 32px;
    height: 32px;
    border-radius: 50%;
    margin: 0 auto;
    border: 1px solid #D77900;
    cursor: pointer;
}

.calendar_days div.actionSelected {
    color: #fff;
}

.calendar_days div.actionSelected:after {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    width: 32px;
    height: 32px;
    border-radius: 50%;
    margin: 0 auto;
    border: 1px solid #D77900;
    background-color: #D77900;
    z-index: -1;
}

button.switch-month {
    background-color: transparent;
    padding: 0;
    outline: none;
    border: none;
    width: 15%;
}

.calendar_days div.today {
    border: 3px solid #FAF0E2;
}


/*ACTION-DETAIL*/
#action-detail .top-image {
    display: flex;
    justify-content: center;
}

#action-detail .top-image img {
    max-height: 480px;
    max-width: 480px;
}

#action-detail section {
    width: 807px;
    margin: 0 auto;
}

#action-detail .action-name {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 20px;
    margin-top: 40px;
}

#action-detail .action-name .specific {
    display: flex;
    justify-content: flex-start;
    justify-content: center;
    gap: 10px;
}

#action-detail .action-name .specific h6 {
    color: #D77900;
    background: var(--ARENA-1, #FAF0E2);
    border-radius: 100px;
    width: -moz-fit-content;
    width: fit-content;
    padding: 4px 8px;
    line-height: 1.6;
}

#action-detail .action-name .specific p {
    color: #6C6C6C;
}

#action-detail .action-name h2 {
    color: var(--ARENA-ORANGE-MAIN, #D77900);
}

#action-detail .action-name h3 {
    color: var(--ED-2, #6C6C6C);
}

#action-detail .dalsi-akce {
    font-family: "Lexend";
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    color: var(--ARENA-1, #FAF0E2);
    background: var(--ARENA-ORANGE-MAIN, #D77900);
    display: flex;
    align-items: center;
    gap: 10px;
    width: -moz-fit-content;
    width: fit-content;
    border: none;
    padding: 10px 20px;
    margin-top: 20px;
}

#action-detail .container-info {
    background: var(--ARENA-1, #FAF0E2);
    margin: 100px auto;
    padding: 75px;
}

#action-detail .container-info .info {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

#action-detail .container-info .info h3 {
    color: var(--ARENA-ORANGE-MAIN, #D77900);
}

#action-detail .container-info .info h4 {
    color: var(--ARENA-ORANGE-MAIN, #D77900);
}

#action-detail .container-info .info h4 span {
    color: var(--TEXTAK-BLACK, #212529);
}

#action-detail .description {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

#action-detail .description h3 {
    color: var(--ARENA-ORANGE-MAIN, #D77900);
}

#action-detail .card {
    display: flex;
    gap: 20px;
    margin: 150px auto;
}

#action-detail .card .image {
    width: 293px;
}

#action-detail .card .text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
}

#action-detail .card .text h4 {
    color: var(--ARENA-ORANGE-MAIN, #D77900);
}

#action-detail .card .text button {
    font-family: "Lexend";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    color: var(--ARENA-ORANGE-MAIN, #D77900);
    background-color: #fff;
    text-transform: uppercase;
    border: 1px solid var(--ARENA-ORANGE-MAIN, #D77900);
    width: -moz-fit-content;
    width: fit-content;
    padding: 10px 20px;
}
  
@media (max-width: 1220px) {
    #action-detail .top-image img {
      width: 100%;
    }
}

@media (max-width: 900px) {
    #action-detail section {
      width: 100%;
      padding: 0 20px;
}

#action-detail .action-name h2 {
      font-size: clamp(2rem, 1.2857rem + 3.0476vw, 3rem);
      line-height: 1.2;
}

#action-detail .action-name h3 {
      font-size: clamp(1.625rem, 1.2679rem + 1.5238vw, 2.125rem);
}

#action-detail .container-info {
      padding: 20px 0;
    }
}

@media (max-width: 700px) {
    #action-detail .card {
      flex-direction: column;
      margin: 100px auto;
}

#action-detail .card .image {
      width: 100%;
}

#action-detail .card-reverse {
      flex-direction: column-reverse;
}

#action-detail .container-info {
      margin: 100px auto;
}
    
#action-detail .container-info .info h4 span {
      display: block;
    }
}

@media (max-width: 375px) {
    #action-detail .card .image img {
      width: 100%;
    }
}


/* PRICES-TABLE.LATTE - FADE-EFFECT */
.table-wrapper {
    position: relative; 
}

.table-scroll {
    overflow-x: auto;
}

.table-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 150px;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
    pointer-events: none;
    display: none;
}

.table-wrapper.overflowing::after {
    display: block;
}

.table-wrapper table {
    min-width: 100%;
}


/* _LAYOUT-HEADER.LATTE - Oprava menu - i v main.css */
header .ticket #button-info-ticket.closed {
    background-image: url("/img/clock-white-opacity.png"), url("/img/arrow-down-white-opacity.svg"); 
}

header .ticket #button-info-ticket.open {
    background-image: url("/img/clock-white-opacity.png"), url("/img/arrow-up-white-opacity.svg"); 
}


/* GALLERY-PHOTO - webkamera*/ 
.container-new {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-right: auto;
    margin-left: auto; 
    max-width: 1320px;
}

.camera {
    padding-top: 150px;
}

.camera h2 {
    text-align: center;
    margin-bottom: 55px;
}

.camera .web-images {
    display: flex;
    justify-content: center;
    gap: 24px;
}

.camera .web-images .box {
    display: flex;
    flex-direction: column;
    pointer-events: none;
}

.camera .image-background-mpsl_25 {
    background: url(/_files/kamery/mpsl_25.jpg) no-repeat;
}

.camera .image-background-mpsl_50 {
    background: url(/_files/kamery/mpsl_50.jpg) no-repeat;
}

.camera .image-background-kluvod1 {
    background: url(/_files/kamery/kluvod1.jpg) no-repeat;
}

.camera .image-background-kluluz1 {
    background: url(/_files/kamery/kluluz1.jpg) no-repeat;
}

.camera .image-background-mpsl_25,
.camera .image-background-mpsl_50,
.camera .image-background-kluvod1,
.camera .image-background-kluluz1 {
    background-size: contain;
    width: 522px;
    height: 295px;
}

.camera .web-images .box h4 {
    text-align: center;
    margin: 24px 0 8px;
}


/* SECTION-SERVICES */
.p-t-0 {
    padding-top: 0;
}



/* PORTAL-GROUNDS.P - google-maps */
.map-wrapper {
    position: relative;
    height: 500px;
    overflow: hidden;
}

.map-wrapper iframe {
    position: absolute;
    top: -90px;
    height: 680px;
}



@media (max-width: 1399.98px) {
    .container-new {
        max-width: 1140px;
    }
}

@media (max-width: 1199.98px) {
    .container-new {
        max-width: 960px;
    }

    .camera .image-background-mpsl_25,
    .camera .image-background-mpsl_50,
    .camera .image-background-kluvod1,
    .camera .image-background-kluluz1 {
        width: 432px;
        height: 244px;
    }
}

@media (max-width: 991.98px) {
    .container-new {
        max-width: 720px;
    }

    .camera .image-background-mpsl_25,
    .camera .image-background-mpsl_50,
    .camera .image-background-kluvod1,
    .camera .image-background-kluluz1 {
        width: 312px;
        height: 176px;
    }
}

@media (max-width: 767.98px) {
    .container-new {
        max-width: 540px;
    }

    .camera .web-images {
        flex-wrap: wrap;
        gap: 16px;
    }
}

@media (max-width: 575.98px) {
    .container-new {
        max-width: 100%;
    }
}

@media (max-width: 350px) {
    .camera .image-background-mpsl_25,
    .camera .image-background-mpsl_50,
    .camera .image-background-kluvod1,
    .camera .image-background-kluluz1 {
        width: clamp(14.125rem, 0.6875rem + 86vw, 19.5rem);
    }
}




/* Rivec fest */
.partners {
    margin-top: 70px;
    margin-bottom: 150px;
    /*width: 1140px;*/
}

.partners h2 {
    text-align: center;
    margin-bottom: 48px;
}

.partners .logos {
    display: flex;
    justify-content: center; 
    flex-wrap: wrap;
    gap: 0 40px;
}

.partners .logos .item {
    width: 136px;
    height: auto;
}

.partners .logos.bigger .item {
    width: 170px;
    height: auto;
}

.partners .logos img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    display: block;
}

.partners .margin-b-100 {
    margin-bottom: 100px;
}

.section-distance + .partners {
  margin-top: 0;  
}

@media (max-width: 1140px) {
    .partners {
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .partners .logos.bigger .item {
        width: 136px;
        height: auto;
    }
}




/*_LAYOUT_FOOTER */
.rivec-footer {
    display: flex;
    justify-content: center;
    gap: 5%;
    box-shadow: 0px -10px 30px #0000001A;
    padding: 50px;
}

.rivec-footer .logo-sekce {
    height: 29px;
    max-width: 140px;
    margin-bottom: 16px;
}

.rivec-footer .logo-sekce img {
    height: 100%;
    width: auto;
    object-fit: cover;
    display: block;
}

.rivec-footer .button-footer {
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-weight: 700;
    text-decoration: none;
    color: #0071CE;
}

.rivec-footer .button-footer::after {
    content: "";
    display: inline-block;
    background-image: url("/img/icons/arrow-right.svg");
    background-repeat: no-repeat;
    object-fit: cover;
    width: 16px;
    height: 16px;
    margin-left: 5px;
    transition: 0.3s all ease;
}

.rivec-footer .button-footer:hover::after {
    transform: translate(2px, 0px);
}

.rivec-footer .button-footer .icon,
.rivec-footer .button-footer::after {
    filter: invert(27%) sepia(95%) saturate(1417%) hue-rotate(186deg) brightness(100%) contrast(106%);
}

.rivec-footer .socials {
    display: flex;
    gap: 8px;
    margin: 20px 0 25px;
    filter: invert(27%) sepia(95%) saturate(1417%) hue-rotate(186deg) brightness(100%) contrast(106%);
}

.rivec-footer  .socials a {
    height: 30px;
    width: 30px;
}

.rivec-footer .grey-line {
    height: 130px;
    width: 2px;
    background-color: #E2E2E2;
    margin: auto 0;
}

.rivec-footer h6 {
    font-family: 'Roboto', sans-serif;
    color: #000;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.rivec-footer p {
    color: #555555;
    margin-bottom: 16px;
}

.rivec-footer p span {
    font-weight: 700;
}

.rivec-footer p.margin-b-8 {
    margin: 0 0 8px;
}

.rivec-footer p a {
    color: #000;
    text-decoration: none;
}

.rivec-footer p a:hover {
   text-decoration: underline;
}

.sponsors {
    padding: 25px 32px;
    box-shadow: 0px -10px 30px #0000000D; 
}

.sponsors .logos {
    display: flex;
    justify-content: space-between;
}

.sponsors .logos .box {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    gap: 35px;
}

.sponsors .logos .box .logo-starez {
    height: 24px;
    width: auto;
}

.partners .logos img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    display: block;
}


@media (max-width: 1199.98px) {
    .rivec-footer {
        flex-wrap: wrap;
        justify-content: space-around;
        gap: 40px 10%;
        padding: 50px 32px;
    }

    .rivec-footer .address {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        width: 100%;
    }

     .grey-line {
        display: none;
    }

    .rivec-footer .details {
        text-align: center;
        width: 350px;
    }

    .rivec-footer .kontakt {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        width: 100%;
    }

    .sponsors {
        padding: 30px 32px;
    }

    .sponsors .logos {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 40px;
    }
}


/*RIVEC - INDEX-BOXES */
.sc-37 .service-banner .bland::before {
    background-image: none;
}

.sc-37 .service-banner .bland::before {
    background: linear-gradient(to top, rgba(95, 95, 95, 0.81) 0%, rgba(0, 0, 0, 0) 40%);
}
.sc-37 .service-banner .bland:hover::before {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%)
}
