* {
box-sizing: border-box;
}
body {
font-family: "prestige-elite-std", monospace;
font-weight: 700;
font-style: normal;
font-size: 18px;
color: #ff4500;
background-color: #ff4500;
}
.sr-only{
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
a {
color: inherit;
text-decoration: none;
}
h1 {
margin-top: 0;
text-transform: uppercase;
font-size: clamp(27px, 4vw, 55px);
font-weight: 400;
line-height: 1;
}
h2 {
margin: 0;
font-size: clamp(14px, 2vw, 16px);
font-size: clamp(14px, 2vw, 25px);
text-transform: uppercase;
font-weight: 700;
letter-spacing: 0.08em;
line-height: 1.2;
margin-bottom: 0.2rem;
}
h3 {
margin: 0;
font-size: clamp(14px, 2vw, 25px);
text-transform: uppercase;
font-weight: 700;
letter-spacing: 0.08em;
line-height: 1.2;
margin-bottom: 1rem;
}
hr {
border: none;
height: 1px;
color: #000;
background-color: #000;
margin: 2rem 0;
}
.italic {
font-style: italic;
}
.img-fluid {
height: 100%;
width: auto;
}
.bold {
font-weight: 700 !important;
}
.big {
font-size: clamp(19px, 2vw, 35px) !important;
line-height: 1.1;
} ul#primary-menu-main {
display: grid;
grid-template-columns: repeat(2, auto);
grid-template-rows: repeat(2, auto);
grid-auto-flow: column;
list-style: none;
column-gap: 6rem;
margin: 0;
padding: 0;
}
ul#primary-menu-main li {
position: relative;
}
ul#primary-menu-main a,
a.link {
position: relative;
}
ul#primary-menu-main a:before,
a.link:before {
content: "";
position: absolute;
width: 2rem;
margin-left: -3rem;
background-color: #ff4500;
height: 1px;
margin-top: 10px;
transition: width 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}
ul#primary-menu-main a:hover,
ul#primary-menu-main li.current-menu-item a,
a.link:hover {
font-style: italic;
}
ul#primary-menu-main a:hover:before,
ul#primary-menu-main li.current-menu-item a:before,
a.link:hover:before {
width: calc(100% + 3.5rem);
}
a.link {
margin-left: 3rem;
display: inline-block;
margin-top: 0.7rem;
}
a.link.no-top {
margin-top: 0;
}
a.link:before {
background-color: #000;
}
.dinner a.link:before {
background-color: #ff4500;
} .header {
display: flex;
justify-content: space-between;
}
.header .logo img,
#mobile-opening-hours .logo {
position: fixed;
min-width: 110px;
width: 6%;
height: auto; }
.main-container {
min-height: calc(100 * var(--vh));
padding: 30px;
display: flex;
flex-flow: column;
background-image: url(//www.cucina-itameshi.at/wp/wp-content/themes/bf_dogenhof/images/Mochi_CucinaItameshi_Desktop.jpg);
background-size: cover;
background-repeat: no-repeat;
}
.main-container .content {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
}
.main-container .content p {
font-size: clamp(17px, 4vw, 55px);
padding: 0 15%;
text-align: center;
font-weight: 400;
font-style: normal;
}
.main-container .content-footer {
display: flex;
gap: 3rem;
font-size: 20px;
letter-spacing: 0.02em;
}
.page-template-page-home .main-background-images {
position: absolute;
top: 0;
left: 0;
z-index: -1;
width: 100%;
height: calc(100 * var(--vh));
overflow: hidden;
opacity: 0.5;
}
.page-template-page-home .main-background-images .item img {
object-fit: cover;
object-position: center;
height: calc(100 * var(--vh));
}
body.home {
background-color: #000;
} body.home .main-container,
body.home .main-container-mobile {
background-image: none;
} .page-template-page-top6 .content p,
.page-template-page-lunchdinner .content p {
font-size: 35px;
text-align: left;
padding: 0;
}
.page-template-page-top6 ul#primary-menu-main a,
.page-template-page-lunchdinner ul#primary-menu-main a {
color: #000;
}
.page-template-page-top6 ul#primary-menu-main a:before,
.page-template-page-kontakt ul#primary-menu-main a:before,
.page-template-page-impressum ul#primary-menu-main a:before,
.page-template-page-lunchdinner ul#primary-menu-main a:before,
.page-template-page-hours ul#primary-menu-main a:before {
background-color: #000;
}
.page-template-page-top6 .main-container,
.page-template-page-lunchdinner .main-container {
background-image: none;
background-color: #ff4500;
color: #000;
border-bottom: 1px solid #000;
}
.page-template-page-lunchdinner .main-container {
min-height: calc(85 * var(--vh));
}
.page-template-page-lunchdinner .main-container.dinner {
background-color: #000;
color: #ff4500;
border-bottom: 1px solid #ff4500;
background-image: none;
}
.page-template-page-top6 .main-container .content,
.page-template-page-lunchdinner .main-container .content {
display: grid;
grid-template-columns: 1.2fr 2fr;
grid-template-rows: min-content;
width: 100%;
padding: 0 11% 0 10%;
grid-column-gap: 14%;
justify-content: unset;
place-content: center;
}
.page-template-page-lunchdinner .main-container.dinner .content {
display: grid;
grid-template-columns: 2fr 1.2fr;
}
.page-template-page-lunchdinner
.main-container.dinner
.content
> div:nth-child(1) {
order: 2;
}
.page-template-page-lunchdinner
.main-container.dinner
.content
> div:nth-child(2) {
order: 1;
}
.page-template-page-top6 .main-container .content > div:first-child,
.page-template-page-lunchdinner .main-container .content > div:first-child {
width: 100%;
min-width: 100%;  }
.page-template-page-lunchdinner .text-container,
.page-template-page-top6 .text-container {
height: 100%;
display: flex;
flex-flow: column;
justify-content: space-between;
}
.page-template-page-top6 .text-container {
justify-content: center;
}
.page-template-page-top6 .text-container .inner-container,
.page-template-page-lunchdinner .text-container .inner-container {
border-top: 1px solid #000;
display: grid;
grid-template-columns: 1fr 1.2fr;
font-size: clamp(16px, 1vw, 20px);
}
.page-template-page-lunchdinner .dinner .text-container .inner-container {
border-top: 1px solid #ff4500;
}
.page-template-page-lunchdinner .dinner .inner-container > div:first-child {
border-right: 1px solid #ff4500;
}
.page-template-page-top6 .text-container .inner-container {
border-top: 1px solid #000;
display: grid;
grid-template-columns: 1fr;
font-size: clamp(16px, 1vw, 20px);
}
.page-template-page-top6 .inner-container > div,
.page-template-page-lunchdinner .inner-container > div {
margin-top: 2rem;
padding: 0 15%;
}
.page-template-page-top6 .inner-container > div:first-child {
padding-left: 0;
}
.page-template-page-lunchdinner .inner-container > div:first-child {
border-right: 1px solid #000;
padding-left: 0;
}
.page-template-page-top6 .inner-container > div:nth-child(2),
.page-template-page-lunchdinner .inner-container > div:nth-child(2) {
padding-right: 0;
} .page-template-page-kontakt h1 {
margin-bottom: 0.2em;
font-size: clamp(32px, 4vw, 55px);
}
.page-template-page-kontakt .main-container p {
font-size: clamp(20px, 4vw, 30px);
font-weight: 600;
}
.page-template-page-kontakt .main-container {
background-image: none;
background-color: #ff4500;
color: #000;
border-bottom: 1px solid #000;
}
.page-template-page-kontakt .main-container .content {
flex-flow: column;
}
@media (max-width: 768px) {
.page-template-page-kontakt .main-container p {
padding: 0;
}
} .page-template-page-impressum h1 { font-size: clamp(32px, 4vw, 55px);
}
.page-template-page-impressum .main-container .content p {
font-size: clamp(16px, 1vw, 20px);
line-height: 1.2;
font-weight: 600;
text-align: left;
}
.page-template-page-impressum .main-container {
background-image: none;
background-color: #ff4500;
color: #000;
border-bottom: 1px solid #000;
}
.page-template-page-impressum .main-container .content {
flex-flow: column;
margin-top: 5rem;
}
@media (max-width: 768px) {
.page-template-page-impressum .main-container p {
padding: 0;
}
.page-template-page-impressum .main-container .content {
margin-top: 0rem;
}
} .owl-nav {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
height: 100%;
position: absolute;
padding: 0;
top: 0;
left: 0;
}
.owl-carousel .owl-nav span {
display: none;
}
.owl-carousel .owl-nav button.owl-next {
content: "";
background-image: url(//www.cucina-itameshi.at/wp/wp-content/themes/bf_dogenhof/images/arrow_right.svg);
background-repeat: no-repeat;
height: 50px;
width: 25px;
position: absolute;
right: -50px;
z-index: 10;
}
.owl-carousel .owl-nav button.owl-prev {
content: "";
background-image: url(//www.cucina-itameshi.at/wp/wp-content/themes/bf_dogenhof/images/arrow_left.svg);
background-repeat: no-repeat;
height: 50px;
width: 25px;
position: absolute;
left: -50px;
z-index: 10;
}
.owl-carousel .owl-dots {
margin-top: -30px !important;
z-index: 1;
position: relative;
}
.owl-theme .owl-dots .owl-dot span {
outline: 1px solid #000;
background: transparent;
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
outline: 1px solid #000;
background: #ff4500;
}
@media (max-width: 768px) {
.owl-theme .owl-dots .owl-dot span {
height: 5px;
width: 5px;
}
} .main-container-mobile,
#header-mobile,
#menu-mobile,
#mobile-opening-hours {
display: none;
} .page-template-page-hours .main-container {
background: none;
color: #000;
border-bottom: 1px solid #000;
}
.page-template-page-hours .main-container .content .grid-container {
display: grid;
grid-template-columns: 1fr 1fr;
padding: 0 15%;
font-size: clamp(18px, 2vw, 30px);
}
.page-template-page-hours
.main-container
.content
.grid-container
> div:nth-child(1) {
border-right: 1px solid #000;
padding-right: 10%;
}
.page-template-page-hours
.main-container
.content
.grid-container
> div:nth-child(2) {
padding-left: 10%;
}
.page-template-page-hours .main-container a.link {
font-size: 20px;
}
@media (max-width: 768px) {
} .hours-active #mobile-opening-hours {
display: flex;
flex-flow: column;
position: fixed;
top: 0;
left: 0;
padding: 30px;
min-height: calc(100 * var(--vh));
background-color: #ff4500;
width: 100%;
color: #000;
}
.hours-active #mobile-opening-hours .inner {
flex: 1;
display: flex;
flex-flow: column;
text-align: center;
justify-content: center;
justify-content: center;
padding-bottom: 95px;
font-size: clamp(18px, 2vw, 30px);
}
.hours-active #mobile-opening-hours .line {
height: 1px;
background-color: black;
width: 40px;
margin: 2rem auto;
}
#mobile-opening-hours .head {
display: flex;
justify-content: space-between;
} @media (max-width: 1280px) {
.page-template-page-top6 .main-container .content,
.page-template-page-lunchdinner .main-container .content {
grid-template-columns: 1fr 1.8fr;
padding: 0 5% 0 10%;
}
}
@media (max-width: 768px) {
#header-mobile {
display: block;
position: absolute;
top: 15px;
right: 15px;
width: 30px;
height: auto;
}
.menu-active #menu-mobile {
padding: 15px;
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
min-height: calc(100 * var(--vh));
z-index: 10;
background-image: url(//www.cucina-itameshi.at/wp/wp-content/themes/bf_dogenhof/images/home_mobile_menu_bg.jpg);
background-repeat: no-repeat;
background-size: cover;
}
#menu-mobile .head,
#mobile-opening-hours .head {
display: flex;
justify-content: space-between;
}
#menu-mobile .logo,
#mobile-opening-hours .logo {
width: 80px;
height: auto;
min-width: unset;
}
.hours-active #mobile-opening-hours {
padding: 15px;
}
ul#primary-menu-mobile {
margin: 0;
padding: 0;
list-style: none;
margin-top: 50px;
}
ul#primary-menu-mobile a {
line-height: 2.5;
font-size: 26px;
letter-spacing: 0.05em;
font-weight: 700;
}
ul#primary-menu-mobile a:before,
ul#primary-menu-mobile li:last-child a:after {
content: "";
position: absolute;
left: 15px;
height: 1px;
background-color: #ff4500;
width: 30px;
}
ul#primary-menu-mobile li:last-child a:after {
margin-top: 4rem;
}
.page-template-page-home .main-container {
display: none;
}
.main-container-mobile {
min-height: calc(100 * var(--vh));
display: flex;
flex-flow: column;
justify-content: space-between;
background-image: url(//www.cucina-itameshi.at/wp/wp-content/themes/bf_dogenhof/images/home_mobile_bg.jpg);
background-repeat: no-repeat;
background-size: cover;
padding: 15px;
}
.main-container-mobile .top p {
margin-top: 0;
width: 85%;
font-size: 17px;
}
.main-container-mobile .top {
border-bottom: 1px solid #ff4500;
}
.main-container-mobile .inner {
text-align: center;
}
.main-container-mobile .inner img {
width: 40%;
height: auto;
}
.main-container-mobile .bottom {
display: grid;
grid-template-columns: 1fr 1fr;
margin-bottom: 3.5rem;
}
.main-container-mobile .bottom > a {
border: 1px solid #ff4500;
text-align: center;
padding: 0.8rem 0;
}
.main-container-mobile .bottom > a:first-child {
border-left: 0;
border-right: 0;
}
.main-container-mobile .bottom > a:nth-child(2) {
border-right: 0;
} h1 {
text-align: center;
font-weight: 700;
margin: 1rem 0 2rem;
}
.page-template-page-top6 .content p,
.page-template-page-lunchdinner .content p {
text-align: center;
line-height: 1.2;
}
.page-template-page-top6 a.link,
.page-template-page-lunchdinner a.link,
.page-template-page-hours .main-container a.link { font-size: inherit;
}
.page-template-page-top6 .main-container .content,
.page-template-page-lunchdinner .main-container .content,
.page-template-page-lunchdinner .main-container.dinner .content {
grid-template-columns: 1fr;
grid-template-rows: unset;
padding: 0;
row-gap: 2rem;
margin-top: 80px;
margin-bottom: 80px;
place-content: unset;
}
.page-template-page-top6 .header .logo img,
.page-template-page-kontakt .header .logo img,
.page-template-page-impressum .header .logo img,
.page-template-page-lunchdinner .header .logo img,
.page-template-page-hours .header .logo img {
width: 80px;
height: auto;
z-index: 10;
left: 15px;
top: 15px;
min-width: unset;
}
.page-template-page-top6 .main-container .content > div:first-child,
.page-template-page-lunchdinner .main-container .content > div:first-child {
margin-top: 1rem;
padding: 0 10%;
}
.page-template-page-top6 .main-container,
.page-template-page-lunchdinner .main-container {
padding: 15px 40px;
}
.page-template-page-top6 .header .menu,
.page-template-page-kontakt .header .menu,
.page-template-page-impressum .header .menu,
.page-template-page-lunchdinner .header .menu,
.page-template-page-hours .header .menu {
display: none;
}
.page-template-page-top6 g#Group_92 .line,
.page-template-page-kontakt g#Group_92 .line,
.page-template-page-impressum g#Group_92 .line,
.page-template-page-lunchdinner g#Group_92 .line,
.page-template-page-hours g#Group_92 .line {
stroke: #000;
}
.menu-active.page-template-page-top6 .main-container .logo img,
.menu-active.page-template-page-kontakt .main-container .logo img,
.menu-active.page-template-page-impressum .main-container .logo img,
.menu-active.page-template-page-lunchdinner .main-container .logo img {
display: none;
}
.owl-carousel .owl-nav button.owl-next {
height: 30px;
width: 15px;
right: -35px;
z-index: 10;
}
.owl-carousel .owl-nav button.owl-prev {
height: 30px;
width: 15px;
left: -35px;
z-index: 10;
}
.page-template-page-top6 .text-container .inner-container,
.page-template-page-lunchdinner .text-container .inner-container {
grid-template-columns: 1fr;
margin-top: 1rem;
}
.page-template-page-top6 .inner-container > div {
padding: 2rem 0;
margin-top: 0;
text-align: center;
border-bottom: 1px solid #000;
}
.page-template-page-top6 .inner-container > div:first-child,
.page-template-page-lunchdinner .inner-container > div:first-child,
.page-template-page-lunchdinner .dinner .inner-container > div:first-child {
border-right: 0;
}
.page-template-page-lunchdinner
.main-container.dinner
.content
> div:nth-child(1) {
order: 1;
}
.page-template-page-top6 .inner-container > div:nth-child(2),
.page-template-page-lunchdinner .inner-container > div:nth-child(2) {
padding-right: 0;
}
.page-template-page-lunchdinner .inner-container > div {
border-bottom: 1px solid #ff4500;
padding-bottom: 2rem;
text-align: center;
}
.page-template-page-lunchdinner .inner-container > div {
border-bottom: 1px solid #000;
padding-right: 0;
padding-left: 0;
}
.page-template-page-lunchdinner .dinner .inner-container > div {
border-bottom: 1px solid #ff4500;
} .page-template-page-hours .main-container .content .grid-container {
grid-template-columns: 1fr;
padding: 0;
margin-top: 80px;
text-align: center;
}
.page-template-page-hours
.main-container
.content
.grid-container
> div:nth-child(1) {
padding-right: 0;
border-right: 0;
}
.page-template-page-hours
.main-container
.content
.grid-container
> div:nth-child(2) {
padding-left: 0;
margin-top: 2rem;
padding-top: 2rem;
border-top: 1px solid #000;
}
} #popup {
position: fixed;
z-index: 50;
min-height: calc(100 * var(--vh));
width: 100%;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.5);
display: none;
align-items: center;
justify-content: center;
}
#popup .inner {
position: relative;
width: 300px;
height: auto;
min-height: 300px;
background-color: #ff4500;
color: #000;
padding: 30px;
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
text-align: center;
}
.close_popup {
position: absolute;
right: 8px;
top: 10px;
}
.popup-active.home #popup {
display: flex;
}
body.home.popup-active {
overflow: hidden;
}
#popup .inner .heading {
font-size: 1.5rem;
text-transform: uppercase;
margin: 1rem 0;
}
#popup .inner .popup_grafik {
width: 100%;
height: auto;
margin: 1rem 0;
max-height: 160px;
width: auto;
}
#popup .inner.grafik_only .popup_grafik {
margin: 0;
}
#popup .inner.grafik_only {
padding: 0;
width: 350px;
}
#popup .inner.grafik_only .popup_grafik {
width: 100%;
height: auto;
max-height: unset;
}
#popup .inner.grafik_only a.link {
margin: 1rem 0;
} #footer-grid-2021 {
background-color: #ff4500;
padding-top: 3rem;
padding-bottom: 5rem;
}
#footer-grid-2021 .top {
display: grid;
grid-template-columns: repeat(6, minmax(100px, 158px));
border-bottom: 1px solid #000;
margin: 0 100px;
justify-content: space-between;
padding-bottom: 3rem;
text-align: center;
}
#footer-grid-2021 .bottom {
display: grid;
grid-template-columns: 0.6fr 1fr 1fr 1fr 0.6fr;
margin: 30px 100px 0px;
}
#footer-grid-2021 p {
text-transform: uppercase;
text-align: center;
font-size: 1rem;
margin: 0.5rem 0 0 0;
white-space: nowrap;
color: #000;
}
#footer-grid-2021 .bottom a {
text-transform: uppercase;
display: block;
line-height: 1.8rem;
font-size: 1rem;
letter-spacing: 0.1rem;
color: #000;
}
#footer-grid-2021 .bottom > div {
border-right: 1px solid #000;
width: 100%;
}
#footer-grid-2021 .bottom div:nth-child(2) {
display: flex;
justify-content: center;
align-items: center;
}
#footer-grid-2021 .bottom div:nth-child(3) {
display: flex;
justify-content: center;
text-align: center;
}
#footer-grid-2021 .bottom div:nth-child(4) {
display: flex;
justify-content: center;
align-items: center;
text-align: right;
}
#footer-grid-2021 .bottom > div:last-of-type {
border-right: 0px solid #000;
text-align: right;
display: flex;
justify-content: flex-end;
}
#footer-grid-2021 .bottom div,
#footer-grid-2021 .bottom .sub {
display: table;
}
#footer-grid-2021 .bottom li {
list-style: none;
}
ul.footer-menu {
margin: 0;
padding: 0;
list-style-type: none;
}
@media (max-width: 991px) {
#footer-grid-2021 p {
font-size: 0.7rem;
}
#footer-grid-2021 .top {
margin: 0 50px;
}
#footer-grid-2021 .bottom {
margin: 30px 50px 0;
}
#footer-grid-2021 .bottom a {
font-size: 0.7rem;
}
}
@media (max-width: 810px) {
#footer-grid-2021 .top {
grid-template-columns: minmax(150px, 200px);
grid-gap: 4rem;
justify-content: center;
}
#footer-grid-2021 p {
font-size: 1rem;
}
#footer-grid-2021 .bottom {
grid-template-columns: 1fr;
grid-gap: 2rem;
}
#footer-grid-2021 .bottom div,
#footer-grid-2021 .bottom .sub {
display: block;
text-align: center;
justify-content: center !important;
}
#footer-grid-2021 .bottom div {
border-right: 0px;
border-left: 0px;
border-bottom: 1px solid #000;
padding-bottom: 1rem;
}
#footer-grid-2021 .bottom div:last-of-type,
#footer-grid-2021 .bottom .sub {
border-bottom: 0px;
}
#footer-grid-2021 .bottom a {
font-size: 1rem;
}
} .ft-widget-side:not(.ft-vouchers-active),
.ft-widget-b2:not(.ft-vouchers-active) { }
@media (max-width: 768px) {
.ft-widget-side:not(.ft-vouchers-active),
.ft-widget-b2:not(.ft-vouchers-active) {
bottom: 0px;
right: 0px;
}
}