@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500,700&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Montserrat+Subrayada:400,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap&subset=latin-ext');

html,
body { width: 100%; height: 100%; }
body { font-family: 'Montserrat', sans-serif; font-size: 16px; color: #000; }

.layout-region--node-main .layout-region__content { max-width: 100%; }

/*START: HEADER*/

header { height: 100px; display: flex; padding: 0 50px; justify-content: center; position: fixed;
         top: 0; left: 0; width: 100%; z-index: 10; background-color: #fff; transition: .3s; box-shadow: 0 0 10px 0 rgba(0,0,0,0.75); }

header.scroll { height: 50px; transition: .3s; }

#block-markawitryny img { height: 77px; transition: .3s; }
.scroll #block-markawitryny img { height: 45px; transition: .3s; }

#nav-icon { width: 35px; height: 27px; position: relative; cursor: pointer; display: none; margin-top: 5px;
    -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; }
#nav-icon span { display: block; position: absolute; height: 5px; width: 100%; background: #000; opacity: 1; left: 0;
    -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
#nav-icon span:nth-child(1) { top: 0; }
#nav-icon span:nth-child(2),
#nav-icon span:nth-child(3) { top: 10px; }
#nav-icon span:nth-child(4) { top: 20px; }
#nav-icon.open span:nth-child(1) { top: 18px; width: 0; left: 50%; }
#nav-icon.open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
#nav-icon.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
#nav-icon.open span:nth-child(4) { top: 18px; width: 0; left: 50%; }

#block-menu { align-self: center; }
#block-menu ul { padding: 0; margin: 0; }
#block-menu li { display: inline-block; position: relative; }
#block-menu a { transition: .3s; font-family: 'Montserrat Subrayada', sans-serif; font-size: 17px; font-weight: 700; color: #000; display: block; text-transform: uppercase; padding: 0 40px; }
#block-menu a:hover,
#block-menu a.is-active { color: #666; transition: .3s; }
#block-menu img { height: 67px; transition: .3s; }
.scroll #block-menu img { height: 40px; width: auto; transition: .3s; }

#block-phone { position: absolute; right: 30px; top: 35px; transition: .3s; }
.scroll #block-phone { top: 10px; transition: .3s; }
#block-phone .phone { font-size: 18px; color: #0098BA; font-weight: 700; }

#block-logo { display: none; }

@media (max-width: 1150px) {
    #block-menu a { padding: 0 20px; }
}

@media (max-width: 992px) {
    header { padding: 0 30px; justify-content: initial; }

    #block-logo { display: block; align-self: center; }
    #block-logo img { height: 67px; transition: .3s; }
    .scroll #block-logo img { height: 40px; width: auto; transition: .3s; }

    #block-phone { right: initial; left: 50%; transform: translateX(-50%); }

    #block-menu { position: absolute; top: 34px; right: 30px; transition: .3s; }
    .scroll #block-menu { top: 8px; transition: .3s; }

    #nav-icon { display: block; }
    #block-menu ul { display: none; background-color: #fff; position: fixed; transition: top .3s; left: 0; top: 100px; width: 100vw; box-shadow: 0 6px 5px 0 rgba(0,0,0,.5); }
    #block-menu li { display: block; }
    #block-menu li:nth-child(3) { display: none; }
    #block-menu li:last-child { border: none; }
    #block-menu a { border: none; padding: 10px 30px; transition: .3s; }
    #block-menu a.is-active,
    #block-menu a:hover { color: #0098BA; transition: .3s; }

    .scroll #block-menu ul { top: 50px; transition: top .3s; }
    .scroll #block-menu li ul { transition: none; }
}

@media (max-width: 430px) {
    header { padding: 0 20px; }
}

@media (max-width: 400px) {
    #block-phone { left: 40%; transform: initial; }
}

@media (max-width: 380px) {
    #block-menu { position: absolute; right: 20px; }
}

@media (max-width: 330px) {
    #block-phone { top: 13px; left: 43%; }
    #block-phone .phone { font-size: 14px; }
}

/*END:HEADER*/

/*START:FOOTER*/

#block-contact { display: flex; justify-content: space-between; background-color: #D5D3D1; padding: 50px 100px 100px; flex-wrap: wrap; }
#block-contact div { padding: 0 20px; }
#block-contact a { transition: .3s; }
#block-contact a:hover { transition: .3s; color: #0098BA; }

#block-mapa { height: 450px; overflow: hidden; }

@media (max-width: 1045px) {
    #block-contact div { flex: 0 0 50%; margin-bottom: 20px; }
}

@media (max-width: 900px) {
    #block-contact { padding: 50px 50px 100px; }
}

@media (max-width: 712px) {
    #block-contact { padding: 80px 50px 50px; }
    #block-contact div { flex: 0 0 100%; margin-bottom: 30px; text-align: center; }
}

@media (max-width: 400px) {
    #block-contact { padding: 80px 20px 50px; }
}

/*END:FOOTER*/

section { margin-top: 100px; }
footer section { margin-top: 0; }
.section .half { width: 50%; overflow: hidden; }
.section .label { text-align: center; text-transform: uppercase; font-size: 36px; font-weight: 700; line-height: 44px; margin-bottom: 50px; font-family: 'Montserrat Subrayada', sans-serif; }
.section .text { width: 400px; margin: 0 auto; text-align: center; font-family: 'Open Sans', sans-serif; }
.section .background { padding: 100px 0; }
.section .button { margin: 50px auto 0; font-family: Georgia, sans-serif; transition: .3s; font-style: italic; text-decoration-line: underline; border: 1px solid #000; }
/*.section .button:hover { opacity: .5; transition: .3s; }*/

/*START FRONT */

.popup-overlay { width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 1000; background-color: rgba(0, 0, 0, .6); }
.popup-overlay .popup { position: absolute; top: 50%; left: 50%; width: 800px; text-align: center; color: black; transform: translate(-50%, -50%); }
.popup-overlay img { width: 100%; height: auto; }
.popup-overlay .butt { cursor: pointer; color: white; transition: .3s; font-weight: 700; font-size: 50px; position: absolute; top: 20px; right: 40px; z-index: 1001; }
.popup-overlay .butt:hover { color: #fff; transition: .3s; }

.slider .slide img { width: 100%; height: auto; filter: brightness(.7); }
.slider .slide { position: relative; }
.slider .text { font-family: 'Montserrat', sans-serif; position: absolute; top: calc(50vh - 36px); left: 50%; transform: translate(-50%, -50%); font-size: 48px; letter-spacing: 8px; color: #fff; font-weight: 700; text-transform: uppercase; width: 100%; }

.boxes { display: flex; }
.boxes .background { background: #0098BA; }
.boxes .label { padding: 0 26px; }
.boxes .box.image { background: no-repeat center /cover; }

.menu { margin: 0 0 150px; }
.menu .label { margin: 100px 0 80px; }
.menu .filters { cursor: pointer; font-size: 14px; font-weight: 700; text-align: center; text-transform: uppercase; margin-bottom: 100px; }
.menu .filter { margin: 0 25px; transition: color .3s, text .3s; }
.menu .filter.active,
.menu .filter:hover { color: #0098BA; text-decoration-line: underline; transition: color .3s, text .3s; }
.menu .dishes { width: 700px; margin: 0 auto; display: none; }
.menu .dishes.active { display: block; }
.menu .dish { display: flex; margin: 30px 0; justify-content: space-between; }
.menu .dish .name p { margin: 0; }
.menu .dish .pl { font-weight: 500; }
.menu .dish .name .en { font-size: 12px; margin-top: -3px; }
.menu .dish .price { text-align: right; min-width: 110px; margin-left: 15px; }
.menu [data-filter='dzis-polecamy'] .name { color: #0098BA; }

.events .background { background: #F3F2F1; }
.events .label { background: #F3F2F1; margin-bottom: 50px; }
.events .button { color: #0098BA; border-color: #0098BA; max-width: 220px; }
.events .parallax-image { background: no-repeat center /cover fixed; width: 100%; height: 500px; }
.events .text { width: 700px; }

.voucher { display: flex; color: #0098BA; }
.voucher .background { background: #D8C8AF; }
.voucher .label { text-align: left; margin-bottom: 30px; }
.voucher .text { text-align: left; width: 100%; padding: 0 50px; }
.voucher .button { border: none; padding: 0; margin: 20px 0 0 -2em; }
.voucher .box.image { background: no-repeat center /cover; }

.quotation { padding: 100px 0; color: #0098BA; }
.quotation .text { font-size: 54px; width: 700px; font-style: italic; font-weight: 700; font-family: Georgia, sans-serif; }
.quotation .button { font-size: 16px; border: none; font-weight: 400; }

.gallery-fb { display: flex; flex-wrap: wrap; padding: 0 10px 10px 10px; }
.gallery-fb .distance { flex: 0 0 25%; padding: 10px; }
.gallery-fb .distance div { overflow: hidden; }
.gallery-fb .distance img { width: 100%; height: auto; transition: .3s; }
.gallery-fb .distance:hover img { transform: scale(1.1); transition: .3s; }

@media (max-width: 1350px) {
    .slider .text { top: 50%; }
}

@media (max-width: 960px) {
    .menu .filters { width: 100%; padding: 0 20px; }
    .menu .filter { margin: 0 10px; white-space: nowrap; }
}

@media (max-width: 850px) {
    .boxes,
    .voucher { flex-wrap: wrap; }
    .section .half { width: 100%; flex: 0 0 100%; }

    .boxes .box.image,
    .voucher .box.image{ background-attachment: fixed; height: 400px; /*background-size: 200vh;*/ }

    .section .text { width: 100%; padding: 0 30px; }
    .voucher .label,
    .voucher .text { text-align: center; }
    .voucher .button { margin: 20px auto; max-width: 200px; }

    .popup-overlay .popup { width: calc(100% - 50px); }
}

@media (max-width: 800px) {
    .menu .filter { margin: 0 10px 20px; display: inline-block; }
}

@media (max-width: 740px) {
    .quotation .text { width: 100%; padding: 0 20px; }
    .events .text { width: 100%; padding: 0 20px; }
    .menu .dishes { width: 100%; padding: 0 20px; }
}

@media (max-width: 650px) {
    header { height: 50px; }
    section { margin-top: 50px; }

    #block-logo img { height: 40px; }
    #block-menu { top: 8px; }
    #block-phone { top: 10px; }
    #block-menu ul { top: 50px; }

    .gallery-fb { justify-content: center; }
    .gallery-fb .distance { flex: 0 0 33.33%; }

    .slider .text { letter-spacing: 3px; font-size: 36px; padding: 0 10px; }

}

@media (max-width: 450px) {
    .gallery-fb .distance { flex: 0 0 50%; }
    .quotation .text { font-size: 48px; }
}

@media (max-width: 400px) {
    .menu .dish .pl { font-size: 14px; }

    .quotation .text { font-size: 38px; }
    .slider .text { letter-spacing: 0; /*font-size: 24px;*/ }
}

/*END FRONT */

/*START MENU PAGE*/

.menu-page h1 { font-family: 'Montserrat Subrayada', sans-serif; font-size: 36px; font-weight: 700; text-align: center; text-transform: uppercase; padding-top: 30px; }
.menu-page .dishes { width: 980px; margin: 0 auto; }
.menu-page .dish { display: flex; margin: 30px 0; justify-content: space-between; }
.menu-page .dish .name p { margin: 0; }
.menu-page .dish .pl { font-weight: 500; }
.menu-page .dishes.today .name { color: #0098BA; }
.menu-page .dish .name .en { font-size: 12px; margin-top: -3px; }
.menu-page .dish .price { text-align: right; min-width: 110px; margin-left: 15px; }
.menu-page .label { font-size: 24px; }

@media (max-width: 1020px) {
    .menu-page .dishes { width: 100%; padding: 0 20px; }
}

@media (max-width: 400px) {
    .menu-page .dish .pl { font-size: 14px; }
}

/*END MENU PAGE*/

/*START ABOUT*/

.about .boxes .background { background: #E5E5E5; }
.about .header { background-color: #000; }
.about .header img { width: 100%; height: auto; }
.about .parallax-image { background: #000 no-repeat center /cover fixed; width: 100%; height: 500px; opacity: .7; }
.about .gallery-fb { margin-top: 10px; }
.chief { display: flex; }
.chief img { width: 100%; }
.chief .box.image { background: no-repeat center /cover; }
.chief .name { font-size: 36px; font-family: 'Georgia', sans-serif; font-weight: 700; font-style: italic; color: #0098BA; margin: 50px 0; }
.products { display: flex; }
.products .box.image { background: no-repeat center /cover; }

@media (max-width: 850px) {
    .products,
    .chief { flex-wrap: wrap; }

    .chief .image { order: 2; }
    .about .voucher .image { order: 2; }

    .chief .box.image,
    .products .box.image { background-attachment: fixed; height: 400px; /*background-size: 200vh;*/ }

    .parallax-image.iOS,
    .box.image.iOS { background-attachment: initial; /*background-size: contain;*/ }

}

/*END ABOUT*/

/*START CONTACT*/

.contact .header { background: #000; }
.contact .parallax-image { background: no-repeat center /cover fixed; width: 100%; height: 500px; opacity: .7; }
.contact .contact-info .text { width: 700px; text-align: left; margin: 50px auto; }
.contact .contact-info h3 { font-family: "Montserrat Subrayada", sans-serif; font-size: 36px; }

@media (max-width: 750px) {
    .contact .contact-info .text { width: 100%; padding: 0 20px; }
}

/*END CONTACT*/

#block-strzalka { position:fixed; bottom:5px; left:calc(50% - 28px); z-index: 100; }
#block-strzalka img {
    -webkit-animation: bounce 2s infinite;
    -o-animation: bounce 2s infinite;
    animation: bounce 2s infinite;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* -- keyframes -- */
.bounce {
    -webkit-animation: bounce 2s infinite;
    -o-animation: bounce 2s infinite;
    animation: bounce 2s infinite;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
}
@-moz-keyframes bounce {
    0%,
    100% {
        -moz-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -moz-transform: translateY(-30px);
        transform: translateY(-30px);
    }
}
@-webkit-keyframes bounce {
    0%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }
}
@keyframes bounce {
    0%,
    100% {
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -moz-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }
}

.button { min-width: 150px; max-width: 220px; display: block; margin: 1em; padding: 1em 2em; border: none;
    background: none; color: inherit; vertical-align: middle; position: relative; z-index: 1; -webkit-backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; }
.button:focus { outline: none; }
.button > span { vertical-align: middle; }

.button--winona { overflow: hidden; padding: 0; -webkit-transition: border-color 0.3s, background-color 0.3s;
    transition: border-color 0.3s, background-color 0.3s; -webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
    transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); }
.button--winona::after { content: attr(data-text); text-decoration-line: underline; position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0;
    /*color: #3f51b5;*/ -webkit-transform: translate3d(0, 25%, 0); transform: translate3d(0, 25%, 0); }
.button--winona > span { display: block; }
.button--winona::after,
.button--winona > span { padding: 1em 2em; -webkit-transition: -webkit-transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s;
    -webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1); }
/*.button--winona:hover { border-color: #3f51b5; background-color: rgba(63, 81, 181, 0.1); }*/
.button--winona:hover::after { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.button--winona:hover > span { opacity: 0; -webkit-transform: translate3d(0, -25%, 0); transform: translate3d(0, -25%, 0); }

/*COOKIES*/

.disclaimer__text { font-size: 32px; margin-bottom: 50px; }

.cookie-page { width: 980px; margin: 0 auto; }
.cookie-page .cookies-docs { margin: 25px auto; }

/*COOKIES*/