@font-face {
    font-family: 'Ahsing';
    src: url('/fonts/Ahsing.woff2') format('woff2'),
        url('/fonts/Ahsing.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Symphony';
    src: url('/fonts/symphony-pro-regular.woff2') format('woff2'),
        url('/fonts/symphony-pro-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

* {
margin:0;
padding:0;
outline:none;
box-sizing:border-box;
}

html {
height: 100%;
overflow-x: hidden;
overflow-y: scroll;
}

html:lang(en) .hide-en { display:none; }

body {
font-family: 'Open Sans', sans-serif;
background:#333;
min-height:100%;
height: 100%;
position:relative;
}

a { text-decoration:none; }
img { border:none; }
.left { float:left; }
.right { float:right; }
.clear { clear:both; }

.container, .headerContainer {
max-width:1440px;
width:100%;
margin:0 auto;
position:relative;
padding:0 20px;
}

#contentWrapper {background:#fff;}

#pageBody {
-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
position:relative;
/*z-index:8000;*/
background:#333;
min-height:100%;
height:100%;
width:100%;
}

#pageBody.toggle {
transform:translateX(250px);
-moz-transform:translateX(250px);
-o-transform:translateX(250px);
-webkit-transform:translateX(250px);
}

.menuContainer {
max-width:1440px;
}

/***/

/* Hamburger menu */
.nav-trigger {
visibility:hidden;
position: absolute;
clip: rect(0, 0, 0, 0);
-webkit-touch-callout: none;
}
label[for="nav-trigger"] {
display:none;
position: fixed;
left:25px;
top:50px;
z-index:9999;
cursor:pointer;
}
.nav-trigger + label {
transition:opacity 0.5s, left 0.1s;
}
label[for="nav-trigger"] span {
display: block;
width: 30px;
height: 2px;
margin-bottom: 8px;
position: relative;
background-color:#fff;
/*mix-blend-mode: difference;*/
border-radius: 5px;
transform-origin: 0% 100%;
transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
            background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
            opacity 0.55s ease;
}


label[for="nav-trigger"] span:nth-last-child(3) {
transform-origin: 0% 0%;
}
label[for="nav-trigger"] span:first-child {
transform-origin: 5px 0px;
}
.nav-trigger:checked ~ label span {
opacity: 1;
transform: rotate(-45deg) translate(0px, 5px);
width: 30px;
}
.nav-trigger:checked ~ label span:nth-last-child(3) {
opacity: 1;
transform: rotate(45deg) translate(6px, 2px);
width: 30px;
}
.nav-trigger:checked ~ label span:nth-last-child(2) {
opacity: 0;
transform: rotate(0deg) scale(0.2, 0.2);
}


/* sidebar */
nav#sidebar {
visibility:hidden;
position:fixed;
width:250px;
height:100%;
top:0;
left:-250px;
transition:left 0.2s; /* cubic-bezier(0.175, 0.885, 0.32, 1.275)*/
z-index:9;
animation: slideInFromRight 1s ease-out;
background:#222;
}
.nav-trigger:checked ~ nav#sidebar {
left:0;
visibility: visible;
}

nav#sidebar ul {
margin-top:100px;
}
nav#sidebar ul:last-child {
border-top:2px solid #222;
}

nav#sidebar ul:last-child a {
background:#222;
border-bottom:1px solid #333;
}

nav#sidebar ul li {
float: none;
margin-left: 0;
}
nav#sidebar ul li a {
border-bottom:1px solid #222;
color:#eee;
font-size:15px;
line-height:55px;
padding:0 20px;
display:block;
background:#333;
}

nav#sidebar ul li a i {
font-size:20px;
width:20px;
margin-right:20px;
text-align:center;
top: 2px;
position: relative;
color:#666;
}


/* Header */

header {
display:block;
height:100px;
position:relative;
/*z-index:9990;*/
width:100%;
background:#111;
padding: 0 20px;
box-sizing:border-box;
}

.headerContainer {
position:relative;
height:100%;
}

header #headerLogo {
display:block;
background:url(/img/logo-header-white.svg) no-repeat center;
width:130px;
height:90px;
position:absolute;
top:15px;
left:0;
background-size:contain;
box-sizing: border-box;
}

nav {
position:absolute;
bottom:30px;
right:0;
}

nav ul {
list-style:none;
}

nav ul li {
float:left;
margin-left:20px;
}

nav ul li a {
font-size:14px;
line-height:14px;
text-transform:uppercase;
font-weight:300;
color:#fff;
}


/* Content */

section {
padding:60px 0;
}

section.silver {
background:#f5f5f5;
}


section h3 {
font-size:24px;
line-height:30px;
margin: 0 0 60px;
font-weight:300;
}

section h4 {
font-size:26px;
line-height:26px;
margin: 0 0 20px;
font-weight:300;
}


article img  {
display:block;
max-width:100%;
}

article a  {
color:#cc442f;

}

article img.right  {
max-width:40%;
margin-left:50px;
margin-bottom:50px;
box-shadow:2px 2px 8px 0 #ccc;
padding:8px;
border-radius:2px;
}

article img.left  {
max-width:40%;
margin-right:50px;
margin-bottom:50px;
box-shadow:2px 2px 8px 0 #ccc;
padding:8px;
border-radius:2px;
}

article p, section ul  {
font-size:16px;
line-height:28px;
margin:0 0 40px;
color:#222;
font-weight:300;
text-align:justify;
display:block;
}

article p.third {
width:33.33333%;
float:left;
padding:0 50px 0 0;
}

article p.third .fa {
margin:0 5px 0 0;
width:18px;
text-align:center;
color:#222;
}

article p.third .fa.fa-mobile {
font-size:24px;
position:relative;
top:2px;
}

article p i {
color:#888;
}

article p.large {
font-size:30px;
line-height:50px;
margin:0 0 60px;
color:#222;
font-weight:300;
}

article p.half {
width:50%;}

section ul {
}



article table {
font-size:18px;
line-height:18px;
margin:0 0 30px;
color:#222;
font-weight:300;
width:100%;
border-collapse:collapse;
}

article table th, article table td{
padding:20px;
width:30%;
text-align:left;
}

article table th {
font-weight:600;
background:#f5f5f5;
}

article table td {
border-bottom:1px solid #ddd;
}

article table td.price {
color:#cc442f;
}

article p#weekDisplay {
margin-bottom:0;
}
#weekNote {
display:none;
margin:15px 0;
padding:10px 15px;
background:#f5f3f1;
border-left:4px solid #853535;
color:#555;
font-style:italic;
font-weight:600;
}

.menuWrapper {
min-height:80vh;
background-image:url(/img/background-menu.jpg);
box-sizing:border-box;
padding:100px 20px;
display:flex;
align-items:center;
align-content:stretch;
justify-content:center;
box-shadow:inset 0 0 200px 100px #000;
gap:80px;
flex-direction:column;
}


.menuContainer {
padding:80px;
border-radius:6px;
background:#fff;
box-shadow:0 0 20px 0 #222;
max-width:80%;
}

.menuContainer h2 {
font-family:"Ahsing";
font-size:50px;
line-height:50px;
font-weight:400;
color:#222;
margin:0 0 20px;
text-align:center;
}

.menuListWrapper  {
margin:60px 0 0;
display:flex;
flex-wrap: wrap;
gap:4%;
}

.menuListItem {
flex-basis:48%;
max-width:48%;
}

.menuListItem:not(.extra) {
border-radius: 8px;
padding: 1rem 1.5rem;
margin-bottom: 1.5rem;
background:rgba(237,234,224,0.2);
}

.menuListItem.highlight {
background:rgba(237,234,224,0.5);
}


.menuGroupTitle {
font-weight: 600;
font-size:16px;
}
.mainCourse {
position: relative;
}

.menuListItem ul li:hover {
background-color: rgba(0,0,0,0.02);
}

.mainCourse p {
padding-left:40px;
}
.mainCourse p.span {
font-weight: 500;
}

.mainCourse.meat::before,
.mainCourse.fish::before,
.mainCourse.vegi::before {
content: "";
position: absolute;
left: 5px;
top: 50%;
transform: translateY(-50%);
width: 22px;
height: 22px;
background-repeat: no-repeat;
background-size: contain;
opacity: 0.9;
}

.mainCourse.meat::before {
background-image: url("/img/icon-meat.svg");
}
.mainCourse.fish::before {
background-image: url("/img/icon-fish.svg");
}
.mainCourse.vegi::before {
background-image: url("/img/icon-vegi.svg");
}


.menuListItem h3 {
margin:0 0 10px;
color:#853535;
font-size:16px;
font-weight:600;
}

.menuListItem ul {
list-style-type:none;
}

.menuListItem ul li  {
display:flex;
align-items:center;
justify-content:space-between;
border-bottom:2px dotted rgba(0,0,0,0.2);
padding:10px 0;
gap:20px;
}

.menuListItem ul li:last-child  {
border-bottom:none;
}

.menuListItem ul li p {
margin:0;
text-align:left;
}
.menuListItem ul li p sup {
line-height:12px;
}

.menuListItem ul li span {
font-weight:600;
color:#853535;
flex-shrink:0;
}

.menuContainer>p {
text-align:center;
}


/*menu newsletter */
.newsletterWrapper {
background:#853535;
padding:80px;
display:flex;
align-items:center;
align-content:center;
align-items: center;
justify-content: center;
gap:80px;
}

.newsletterWrapper h3 {
font-weight:300;
font-size:30px;
line-height:40px;
color:#fff;
margin:0;
text-align:right;
padding:20px 80px 20px 0;
border-right:2px dotted rgba(255,255,255,0.2);
box-sizing:border-box;
}

.newsletterConditions {
display:flex;
gap:10px;
}

.newsletterConditions label {
color:#fff;
margin:0;
}

.newsletterWrapper input[type=email] {
background:rgba(255,255,255,0.2);
color:#fff;
line-height:50px;
border-radius:6px;
font-size:16px;
font-weight:300;
padding:0 20px;
width:100%;
border:none;
margin:0 0 20px;
}
.newsletterWrapper input[type=email]::placeholder {
color:#ccc;
}

.newsletterWrapper input[type=submit] {
background:rgba(0,0,0,0.4);
color:#fff;
line-height:50px;
border-radius:6px;
font-weight:300;
font-size:16px;
padding:0 40px;
border:none;
cursor: pointer;
}

/* winelist */

.wineListWrapper {
background:#222;
}


.menuContainer.wineList {
background:none;
padding:0 20px;
border-radius:0;
box-shadow:none;
margin:0 auto;
}

.menuContainer.wineList h2 {
color:#fff;
}

.menuContainer.wineList>p {
color: rgba(255,255,255,0.4);
}

.wineOrigin {
text-align:left;
}

.wineCategory {
padding:10px 0;
}

.wineCategory h3 {
font-size: 20px;
color: rgba(255,255,255,0.4);font-weight:900;
background:#111;
border-radius:10px;
line-height:50px;
padding:0 20px;
margin:0 0 20px;
}

.wineCategory ul {
list-style: none;
margin: 0;
padding: 0;
}

.wineCategory li {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 0;
border-bottom: 2px dotted rgba(255,255,255,0.2);
}

.wineCategory li:last-child {
border-bottom: none;
}

.wineInfo {
flex: 1;
}

.wineName {
font-weight: 600;
margin: 0;
color: #fff;
}

.wineOrigin {
font-size: 0.9rem;
color: rgba(255,255,255,0.4);
margin:0;
}

.winePrice {
text-align: right;
font-size: 0.9rem;
color: #fff;
display: flex;
min-width:120px;
justify-content:space-between;
}

.winePrice span {
white-space: nowrap;
}

.winePrice.label {
font-weight:700;
}


/* offer */

section.about {
background:#111;
padding:80px ;
display:flex;
}

.aboutImageWrapper {
width:600px;
display:flex;
justify-content:flex-start;
box-sizing:border-box;
flex-shrink:1;
}

.aboutImageWrapper img {
border-radius:6px;
display:block;
width:100%;
}

.aboutWrapperContainer {
flex-basis:50%;
max-width:50%;
box-sizing:border-box;
padding-right:80px;
}

.aboutWrapperContainer p {
color:#fff;
text-align:right;
}

.aboutWrapperContainer h3 {
font-family:"Ahsing";
font-size:50px;
line-height:50px;
font-weight:400;
color:rgba(255,255,255,0.4);
margin:0 0 40px;
text-align:right;
padding:0 0 40px;
border-bottom:2px dotted rgba(255,255,255,0.2);
}
.aboutWrapperContainer h3 span {
font-family:"Symphony";
display:block;
/*color: #853535;
font-size:28px;*/
}
.aboutWrapperContainer h3 img {
width:300px;
height:auto;
display:inline-block;
}

/* gallery */
.galleryWrapper {
background:#f5f5f5;
}

.galleryContainer {
padding:80px;
}

.galleryContainer h2 {
font-family:"Ahsing";
font-size:50px;
line-height:50px;
font-weight:400;
color:#222;
margin:0 0 20px;
text-align:center;
}

.galleryContainer>p {
text-align:center;
}

.gallery {
display: flex;
gap: 15px;
flex-wrap: wrap;
justify-content: center;
}

.gallery img {
width: 23%;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
transition: transform 0.3s, box-shadow 0.3s;
}

.gallery img:hover {
transform: scale(1.05);
box-shadow: 0 8px 16px rgba(0,0,0,0.6);
}

/* dogodki */
.events {
background:#f5f5f5;
}

.eventsContainer {
margin:0 auto;
max-width:80%;
}

.eventsContainer h2 {
font-family:"Ahsing";
font-size:50px;
line-height:50px;
font-weight:400;
color:#222;
margin:0 0 60px;
text-align:center;
}

.eventsContainer img {
max-width:100%;
margin:0 auto;
}

.eventsList {
display:flex;
gap:2%;
flex-wrap:wrap;
}

.eventsItem {
flex-basis:32%;
min-width:32%;
border-radius:10px;
margin:0 0 20px;
padding:40px;
background:#fff;
}

.eventsItem h3 {
color:#cc442f;
margin:0 0 25px;
text-align:left;
font-weight:600;
}


.eventsItem p {
color:#888;
text-align:justify;
display:block;
margin:0;
}

.eventsItem p b {
color:#888;
text-align:center;
background:#f5f5f5;
line-height:40px;
border-radius:6px;
margin:0 0 25px;
text-align:center;
display:block;
}

.eventsItem a {
color:#fff;
text-align:center;
background:#cc442f;
line-height:40px;
border-radius:6px;
display:inline-block;
margin:60px 0 0;
padding: 0 20px;
}


/* predpasniki */

section.aprons {
padding:0 ;
display:flex;
background:#d1c5b9;
justify-content: space-between;
}

.apronsImageWrapper {
display:flex;
justify-content:flex-start;
box-sizing:border-box;
flex-shrink:1;
width:600px;
}

.apronsImageWrapper img {
display:block;
width:100%;
}

.apronsWrapperContainer {
flex-basis:50%;
max-width:50%;
box-sizing:border-box;
padding:80px;
}

.apronsWrapperContainer p {
color:#222;
text-align:right;
}

.apronsWrapperContainer p a {
display:inline-block;
line-height:50px;
border-radius:10px;
background:#310e04;
color:rgba(255,255,255,0.8);
padding:0 20px;
font-weight:900;
margin:20px 0 0;
}

.apronsWrapperContainer h3 {
font-family:"Ahsing";
font-size:50px;
line-height:50px;
font-weight:400;
color:rgba(255,255,255,0.8);
margin:0 0 40px;
text-align:right;
padding:0 0 40px;
border-bottom:2px dotted rgba(255,255,255,0.6);
}

/* contact */

section.contact {
background:#1C2517;
display:flex;
padding:80px ;
}

.contactWrapper {
padding-right:80px;
flex-basis:50%;
max-width:50%;
box-sizing:border-box;
}

.contactWrapper h3 {
font-family:"Ahsing";
font-size:50px;
line-height:50px;
font-weight:400;
color:rgba(255,255,255,0.4);
margin:0 0 40px;
text-align:right;
padding:0 0 40px;
border-bottom:2px dotted rgba(255,255,255,0.2);
letter-spacing:1px;
}

.contactWrapper p,
.contactWrapper p a {
color:#fff;
text-align:right;
}

.contactWrapper p b {
color:rgba(255,255,255,0.4);
font-weight:600;
}

.contact iframe {
display:block;
border-radius:6px;
width:600px;
aspect-ratio:1;

}

/* footer */

footer {
background:#111;
padding:40px;
font-size:14px;
line-height:24px;
font-weight:300;
color:#fff;
text-align:center;
position:relative;
}

footer a {
color:#fff;
text-decoration:underline;
}

a.netit {
position:absolute;
right:30px;
top:40px;
display:block;
width:76px;
height:24px;
background:url(/img/netit.png) no-repeat;
}

a.netit:hover {
background-position:0 -29px; 
}



/* Smartphones (portrait and landscape) ----------- */
@media only screen and (max-width : 1500px) {
    .menuContainer {
    padding:40px;
    }

}
@media only screen and (max-width : 1260px) {
.menuListItem {
flex-basis: 100%;
max-width: 100%;
}

}

@media only screen
and (min-width : 320px)
and (max-width : 1024px) {

    header nav {
    display:none;
    }

    label[for="nav-trigger"] {
    display:block;
    }

    header #headerLogo {
    left: auto;
    right: 20px;
    }

    .menuWrapper {
    padding: 40px 20px;
    display: flex;
    box-shadow: inset 0 0 60px 40px #000;
    }
    .menuContainer {
    max-width: 90%;
    padding:20px;
    }

    .menuContainer h2 {
    font-size: 34px;
    line-height:34px;
    }


    .menuListWrapper {
    margin:0;
    }

    .menuListItem:not(.extra) {
    padding: 20px;
    }

    .menuListItem h3 {
    font-size: 14px;
    }

    .menuGroupTitle {
    font-size: 14px;
    }

    article p, section ul {
    font-size: 14px;
    line-height: 20px;
    margin: 0 0 20px;
    }

    .newsletterWrapper {
    padding: 20px;
    flex-wrap:wrap;
    gap: 20px;
    }

    .newsletterWrapper h3 {
    padding: 0 0 20px;
    border-right:none;
    border-bottom: 2px dotted rgba(255,255,255,0.2);
    }

    section.about {
    padding: 20px;
    flex-wrap: wrap;
    }

    .aboutWrapperContainer {
    flex-basis: 100%;
    max-width: 100%;
    padding-right: 0;
    }

    .aboutWrapperContainer h3 img {
    width:100px;
    }

    .galleryWrapper {
    padding: 0;
    }

    .galleryContainer {
    padding: 20px;
    }

    .gallery img {
    width: 100%;
    }

    .eventsContainer {
    padding:20px;
    max-width: 100%;
    }

    .eventsItem {
    flex-basis: 100%;
    min-width: 100%;
    }

    section.aprons {
    flex-wrap: wrap;
    }

    .apronsWrapperContainer {
    flex-basis: 100%;
    max-width: 100%;
    padding: 20px;
    }

    section.contact {
    padding: 20px;
    flex-wrap: wrap;
    }

    .contactWrapper {
    padding-right: 0;
    flex-basis: 100%;
    max-width: 100%;
    }

    a.netit {
    position: relative;
    right: auto;
    top: auto;
    margin: 20px auto 0;
    }
}

@media only screen
/*and (min-device-width : 375px) 
and (max-device-width : 667px)*/
and (min-height : 300px) and (max-width : 1020px) and (min-device-height : 300px) {

    .container, .headerContainer {
    width:100%;
    padding:30px;
    }




}