/* Theme Name: Ricard Camarena Restaurant Author: Francisco Mónaco Author URI: http://franciscomonaco.com/ Description: Tailor made theme developed specially for Ricard Camarena's website. Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /*------------------------------------------ Reset */ * { box-sizing: border-box; outline: none; outline: none; } p, a, h1, h2, h3, h4, h5, h6, ul, ol, li, body, div, section, nav, input, textarea { margin: 0; padding: 0; font-weight: normal; } video, svg, img { vertical-align: middle; width: 100%; height: auto; display: block; } input[type="text"], input[type="submit"], textarea, select { -webkit-appearance: none; -moz-appearance: none; appearance: none; } /*------------------------------------------ Transitions */ .simple-transition, .image img:nth-child(2) { transition-property: all; transition-duration: 0.4s; } .fancy-transition, .displace, .faqs .faq.active .question .icon svg, .press-page .tabs .tabs-wrapper .module .item-pdf .background, .press-page .tabs .tabs-wrapper .module .item-photo, .press-page .tabs .accordion .collapsable-head { transition-property: all; transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1); transition-duration: 0.6s; } /*------------------------------------------------------------------------------------ Titles */ .title-style { font-size: 22px; line-height: 1.4; } .title-style.small-size { font-size: 19px; } .title-style.medium-size { font-size: 28px; } .title-style.main-size { font-size: 38px; } .title-style.giant-size { font-size: 38px; } /*------------------------------------------------------------------------------------ Links */ .link-style { text-decoration: none; } /*------------------------------------------------------------------------------------ Buttons */ .button-style, .blog-wrapper .pagination .links a { padding: 15px 30px; text-decoration: none; display: inline-block; border-radius: 4px; } .button-style.small-size { padding: 10px 16px; font-size: 12px; } /*------------------------------------------------------------------------------------ Text */ .upper { text-transform: uppercase; } .lower { text-transform: lowercase; } .text-center { text-align: center; } .text-left { text-align: left; } .text-right { text-align: right; } /*------------------------------------------------------------------------------------ Border */ .border { border-width: 1px; border-style: solid; } .border-2 { border-width: 2px; border-style: solid; } .border-3 { border-width: 3px; border-style: solid; } .border-top { border-top-width: 1px; border-top-style: solid; } .border-top-2 { border-top-width: 2px; border-top-style: solid; } .border-top-3 { border-top-width: 3px; border-top-style: solid; } .border-bottom { border-bottom-width: 1px; border-bottom-style: solid; } .border-bottom-2 { border-bottom-width: 2px; border-bottom-style: solid; } .border-bottom-3 { border-bottom-width: 3px; border-bottom-style: solid; } .border-left { border-left-width: 1px; border-left-style: solid; } .border-left-2 { border-left-width: 2px; border-left-style: solid; } .border-left-3 { border-left-width: 3px; border-left-style: solid; } .border-right { border-right-width: 1px; border-right-style: solid; } .border-right-2 { border-right-width: 2px; border-right-style: solid; } .border-right-3 { border-right-width: 3px; border-right-style: solid; } /*------------------------------------------------------------------------------------ Editor content */ .editor-content { font-size: 16px; line-height: 1.6; } .editor-content div, .editor-content p { font-size: 16px; line-height: 1.6; margin-bottom: 12px; } .editor-content div:last-child, .editor-content p:last-child { margin-bottom: 0; } .editor-content a:hover { opacity: 0.6; } .editor-content ul { padding-left: 30px; margin-bottom: 12px; } .editor-content ol { padding-left: 30px; margin-bottom: 12px; } .editor-content h1, .editor-content h2, .editor-content h3, .editor-content h4, .editor-content h5, .editor-content h6 { margin: 24px 0 12px; } .editor-content h1:first-child, .editor-content h2:first-child, .editor-content h3:first-child, .editor-content h4:first-child, .editor-content h5:first-child, .editor-content h6:first-child { margin-top: 0; } table { border-style: solid; border-spacing: 0; width: 100%; margin: 0 0 1.41575em; border-collapse: separate; } table tr { border-style: solid; } table td, table th { padding: 1em 1.41575em; text-align: left; vertical-align: top; border-style: solid; } table td p:last-child, table th p:last-child { margin-bottom: 0; } table thead th { padding: 1.41575em; vertical-align: middle; } table tbody h2 { font-size: 1em; letter-spacing: normal; font-weight: normal; } table tbody h2 a { font-weight: normal; } /*------------------------------------------------------------------------------------ Forms */ /* Work form */ .work-form-wrapper { } .work-form-wrapper .module-separator { border-bottom-width: 1px; border-bottom-style: solid; margin: 30px 0; } .work-form-wrapper br { display: none; } .work-form-wrapper textarea, .work-form-wrapper input { width: 100%; height: auto; line-height: 1; padding: 11px 14px 10px; margin-bottom: 8px; font-size: 14px; background-color: transparent; border-style: solid; border-radius: 4px; border-width: 1px; } .work-form-wrapper select { margin-left: 6px; -webkit-appearance: initial; padding: 0 10px; } .work-form-wrapper textarea { margin-bottom: 10px; height: 140px; line-height: 1.5; } .work-form-wrapper input[type="submit"] { width: auto; padding: 14px 30px 15px; } .work-form-wrapper .repeater-wrapper .wpcf7-repeater-item { padding: 50px 10px 10px; border-radius: 4px; margin-bottom: 10px; background-color: rgba(var(--color-value-3), 0.15); } .work-form-wrapper .repeater-wrapper .wpcf7-repeater-item:first-child { padding-top: 10px; } .work-form-wrapper .repeater-wrapper .wpcf7-repeater-item .wpcf7-repeater-actions { text-align: right; } .work-form-wrapper .repeater-wrapper .wpcf7-repeater-item:first-child .wpcf7-repeater-actions { display: none; } .work-form-wrapper .repeater-wrapper .wpcf7-repeater-actions .wpcf7-repeater-remove { box-shadow: none; border: none; margin: 10px 10px 0 0; } .work-form-wrapper .repeater-wrapper .wpcf7-repeater-actions .wpcf7-repeater-add { text-shadow: none; width: 100%; text-align: center; height: auto; line-height: 40px; border: none; box-shadow: none; } .work-form-wrapper .wpcf7-acceptance input[type="checkbox"] { height: 16px; vertical-align: bottom; } .wpcf7 form .wpcf7-response-output { margin: 16px 12px; padding: 20px; border-radius: 4px; max-width: 400px; font-size: 12px; border: none; } .wpcf7-not-valid-tip { margin: -6px 0 14px; font-size: 12px; } /*------------------------------------------------------------------------------------ General classes */ body { } body.home main { overflow-x: hidden; } .cover-image { background-size: cover; background-position: center; } section { position: relative; } svg { overflow: visible; } .image { position: relative; } .image img:nth-child(1) { filter: grayscale(100%); mix-blend-mode: multiply; object-fit: cover; height: 100% } .image img:nth-child(2) { position: absolute; top: 0; left: 0; width: 100%; object-fit: cover; height: 100%; opacity: 0; } .image img:nth-child(2):hover { opacity: 1; } /*------------------------------------------------------------------------------------ Interface */ .page-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; } .main-nav { position: fixed; top: 0; left: 0; width: 100%; z-index: 99; } .main-nav .background { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -1; } .main-nav .clock-wrapper .inner { width: auto; } .main-nav .clock-wrapper .inner .time { height: 20px; } .main-nav .clock-wrapper .inner .time .clock { height: 20px; font-size: 14px; } .main-nav .clock-wrapper .inner .time .separator { height: 32px; transform: rotate(23.5deg) translate3d(1px, -5px, 0); transform-origin: center; border-left-style: solid; border-left-width: 1px; margin: 0 14px; } .main-nav .clock-wrapper .inner .time .date { height: 20px; font-size: 14px; } .main-nav .clock-wrapper .inner .city { font-size: 8px; margin-top: 4px; } .main-nav .language-selector .item { font-size: 14px; text-decoration: none; } .main-nav .language-selector .item.separator { padding: 0 2px; } .main-nav .menu-button { width: 24px; height: 32px; position: relative; } .main-nav .menu-button .line { width: 24px; border-bottom-style: solid; border-bottom-width: 1px; position: absolute; left: 0; } .main-nav .menu-button .line-1 { top: 40%; } .main-nav .menu-button .line-2 { top: 60%; } .menu-is-open .main-nav .menu-button .line-1 { top: 50%; transform: rotate(45deg); } .menu-is-open .main-nav .menu-button .line-2 { top: 50%; transform: rotate(-45deg); } .bottom-nav { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 100; } .bottom-nav .background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; } .bottom-nav .logo { height: 28px; } .bottom-nav .logo svg { height: 100%; width: auto; } .bottom-nav .button { font-size: 14px; padding: 5px 14px; } .mobile-menu { position: fixed; top: 75px; left: 0; width: 100%; height: calc(100vh - 70px - 75px); z-index: 99; transform: translateY(calc(100vh - 70px - 75px)); } .menu-is-open .mobile-menu { transform: translateY(0); } .mobile-menu .inner { width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between; } .mobile-menu .links { padding-top: 60px; } .mobile-menu .links .item { margin-bottom: 4px; } .mobile-menu .links .item .link { text-decoration: none; } .mobile-menu .social { margin-bottom: 140px; } .mobile-menu .social .item { margin-bottom: 4px; } .mobile-menu .social .item .link { text-decoration: none; } .booking-menu { position: fixed; top: 75px; left: 0; width: 100%; height: calc(100vh - 70px - 75px); z-index: 99; transform: translateY(calc(100vh - 70px - 75px)); } .booking-is-open .booking-menu { transform: translateY(0); } .booking-menu .pop-booking { height: 100%; } .booking-menu .pop-booking .row-inner { height: 100%; overflow-y: scroll; display: flex; flex-direction: column; } .booking-menu .pop-booking .options .item .info .name { font-size: 16px; } .booking-menu .pop-booking .options .item .info .description { font-size: 12px; } .booking-menu .pop-booking .controls { height: 100%; } .booking-menu .pop-booking .controls .iframe { flex: 1; display: flex; justify-content: center; height: 800px } .gifting-menu { position: fixed; top: 75px; left: 0; width: 100%; height: calc(100vh - 70px - 75px); z-index: 99; transform: translateY(calc(100vh - 70px - 75px)); } .gifting-is-open .gifting-menu { transform: translateY(0); } .gifting-menu .pop-gifting { height: 100%; } .gifting-menu .pop-gifting .row-inner { height: 100%; overflow-y: scroll; display: flex; flex-direction: column; } .gifting-menu .pop-gifting .shop { height: 100%; } .gifting-menu .pop-gifting .shop .iframe { flex: 1; display: flex; justify-content: center; height: 800px } .pop-menu .closer-holder { position: absolute; top: 0; right: 0; } .pop-menu .closer-holder .closer { width: 32px; height: 32px; position: relative; border-radius: 100px; } .pop-menu .closer-holder .closer .line { width: 14px; border-bottom-style: solid; border-bottom-width: 1px; position: absolute; left: 9px; top: 50%; } .pop-menu .closer-holder .closer .line-1 { top: 50%; transform: rotate(45deg); } .pop-menu .closer-holder .closer .line-2 { top: 50%; transform: rotate(-45deg); } .time-menu { position: fixed; bottom: 70px; left: 0; width: 100%; opacity: 0; pointer-events: none; transform: translateY(100px); z-index: 99; } .time-menu-is-open .time-menu { opacity: 1; transform: translateY(0); } .time-menu-closer { position: fixed; top: 0; left: 0; height: 100%; width: 100%; pointer-events: none; z-index: 98; } .time-menu-is-open .time-menu-closer { pointer-events: all; } .time-menu .content { position: relative; } .time-menu .content .background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .time-menu .content .info { position: relative; padding-top: 100px; } .time-menu-is-open .time-menu .controls { pointer-events: all; } .time-menu .controls .range input { -webkit-appearance: none; width: 100%; background: none; } .time-menu .controls .range input:focus { outline: none; } .time-menu .controls .range input::-webkit-slider-runnable-track { width: 100%; height: 4px; border-radius: 100px; box-shadow: none; } .time-menu .controls .range input::-webkit-slider-thumb { box-shadow: none; height: 18px; width: 18px; border-radius: 100px; -webkit-appearance: none; margin-top: -7px; border-width: 1px; border-style: solid; } .time-menu .controls .range .scale { width: 100%; padding: 4px 9px; display: flex; justify-content: space-between; } .time-menu .controls .range .scale .tack { display: flex; flex-direction: column; align-items: center; width: 1px; } .time-menu .controls .range .scale .tack .line { width: 1px; height: 6px; } .time-menu .controls .range .scale .tack .value { font-size: 8px; text-transform: lowercase; } .time-menu .controls .range .scale .tack .value { font-size: 8px; text-transform: lowercase; } .time-menu .controls .calendar-range .scale .tack:nth-child(1) { margin-right: calc(8.49315068% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(2) { margin-right: calc(8.21917808% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(3) { margin-right: calc(7.67123288% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(4) { margin-right: calc(8.21917808% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(5) { margin-right: calc(8.49315068% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(6) { margin-right: calc(8.21917808% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(7) { margin-right: calc(8.21917808% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(8) { margin-right: calc(8.49315068% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(9) { margin-right: calc(8.21917808% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(10) { margin-right: calc(8.49315068% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(11) { margin-right: calc(8.21917808% - 1px); } .time-menu .controls .calendar-range .scale .tack:nth-child(12) { margin-right: calc(8.49315068% - 1px); } .time-menu .controls .button-wrapper { pointer-events: none; opacity: 0; } .time-menu.custom-time .controls .button-wrapper { pointer-events: all; opacity: 1; } .time-menu .controls .button-wrapper .resume { font-size: 14px; padding: 5px 14px; } .loader { position: fixed; width: 100%; height: 100%; top: 0; left: 0; display: flex; justify-content: flex-end; align-items: flex-end; opacity: 0; } body.first-time-visit .loader { opacity: 1; } .loader .line-animation { width: 40%; } /* Handling appearing elements */ body.first-time-visit .main-nav { transform: translateY(-75px); } body.first-time-visit .bottom-nav { transform: translateY(70px); } body.first-time-visit .mobile-menu { opacity: 0; pointer-events: none; } body.first-time-visit .pop-menu { opacity: 0; pointer-events: none; } body.first-time-visit .about-button { opacity: 0; pointer-events: none; } body.first-time-visit main { opacity: 0; pointer-events: none; transition-duration: 1s; } body.first-time-visit footer { opacity: 0; pointer-events: none; transition-duration: 1s; } body.first-time-visit .appear-on-2 { opacity: 0; pointer-events: none; transition-duration: 1s; } body.first-time-visit.reveal-elements-1 .main-nav { transform: translateY(0); } body.first-time-visit.reveal-elements-1 .bottom-nav { transform: translateY(0); } body.first-time-visit.reveal-elements-2 .mobile-menu { opacity: 1; pointer-events: all; } body.first-time-visit.reveal-elements-2 .pop-menu { opacity: 1; pointer-events: all; } body.first-time-visit.reveal-elements-2 .about-button { opacity: 1; pointer-events: all; } body.first-time-visit.reveal-main main { opacity: 1; pointer-events: all; } body.first-time-visit.reveal-main footer { opacity: 1; pointer-events: all; } body.first-time-visit.reveal-main-2 .appear-on-2 { opacity: 1; pointer-events: all; } /*------------------------------------------------------------------------------------ Footer */ footer { padding-bottom: 70px; } .footer-contact .title { margin-bottom: 6px; } .footer-contact a { text-decoration: none; } .rc-mf .rc-mf-mobile .item { font-size: 16px; line-height: 1.4; } .rc-mf .rc-mf-mobile .item a { text-decoration: none; } .rc-mf .rc-mf-mobile .restaurant .name { font-size: 12px; margin-bottom: 6px; } .rc-mf .rc-mf-mobile .restaurant .links { padding-top: 4px; } .rc-mf .rc-mf-mobile .restaurant .links .item { margin-bottom: 4px; } .rc-mf .rc-mf-mobile .restaurant .links .item .link { display: flex; justify-content: space-between; align-items: center; width: 100%; } .rc-mf .rc-mf-mobile .restaurant .links .item .icon { width: 8px; display: block; padding-top: 4px; } .rc-mf .rc-mf-mobile .row-3 { display: flex; } .rc-mf .rc-mf-mobile .row-3 .rc-col { width: 50%; } /*------------------------------------------------------------------------------------ Pages */ /* Home */ .home-landing .graphic { position: absolute; top: 0; left: 24px; width: 60%; } .home-landing .page-title { position: relative; pointer-events: none; } .home-landing .page-title .title h1 { pointer-events: all; } .home-landing .awards { pointer-events: none; } .home-landing .awards .item { display: flex; margin-bottom: 10px; align-items: flex-start; pointer-events: all; } .home-landing .awards .item .icon { width: 120px; display: block; } .home-landing .awards .item .icon svg { height: 18px; width: auto; } .home-landing .awards .item .text { width: calc(100% - 120px); font-size: 15px; display: block; text-decoration: none; line-height: 1.4; transform: translateY(-2px); } .home-landing .slider .item .image { margin-bottom: 10px; height: 70vw; } .home-landing .slider .item .image img:nth-child(1) { opacity: 0.7; } .home-landing .slider .item .caption .text { font-size: 16px; } .home-menus .graphic { position: absolute; top: 0; left: 0; z-index: -1; } .home-menus .menus .menu .image { margin-bottom: 14px; height: 60vw; } .home-menus .menus .menu .image img:nth-child(1) { opacity: 0.7; } .faqs .faq .question .icon { padding-top: 5px; } .faqs .faq .question .icon svg { max-width: 16px; } .faqs .faq .answer { max-height: 0; overflow: hidden; } .faqs .faq.active .question .icon svg { transform: rotate(180deg); } .faqs .faq.active .answer { max-height: 220px; overflow-y: scroll; } .home-about { margin-top: 60px; } .home-about .about-cta .cta { position: relative; } .home-about .about-cta .cta .graphic { position: absolute; width: 50%; right: -50px; top: -100px; } .home-about .about-cta .cta .image-wrapper { position: relative; } .home-about .about-cta .cta .image img:nth-child(1) { opacity: 0.5; } .home-about .about-cta .cta .title { position: absolute; top: 0; left: 0; display: flex; width: 100%; height: 100%; justify-content: space-between; align-items: center; pointer-events: none; } .home-restaurants { margin-top: 60px; } .home-restaurants .restaurants { margin-top: -60px; } .home-restaurants .restaurants .restaurant .image img:nth-child(1) { opacity: 0.7; } .home-restaurants .restaurants .restaurant .info { display: flex; } .home-restaurants .restaurants .restaurant .info .contact { width: 70%; padding-right: 10px; } .home-restaurants .restaurants .restaurant .info .links { width: 30%; padding-left: 10px; } .home-restaurants .restaurants .restaurant .info .line-item { font-size: 14px; text-decoration: none; display: block; line-height: 1.5; } .home-shop .shop-module.bonuses { position: relative; } .home-shop .shop-module.bonuses .graphic { position: absolute; top: 0; left: 0; width: 100%; } .home-shop .shop-module .loop { position: relative; } .home-shop .shop-module .item .image { display: block; margin-bottom: 8px; } .home-shop .shop-module .item .thumb { display: block; margin-bottom: 8px; } .home-shop .shop-module .item.bonus .thumb { display: flex; flex-direction: column; justify-content: space-between; text-decoration: none; height: 45vw; } .home-shop .shop-module .item.bonus .thumb .logo { width: 170px; } .home-shop .shop-module .item.bonus .thumb .label { text-decoration: none; font-size: 14px; } .home-shop .shop-module .item.product .image { height: 120vw; } .home-shop .shop-module .item.product .image img:nth-child(1) { opacity: 0.7; } .home-shop .shop-module .item .info .name { font-size: 14px; margin-bottom: 4px; } .home-shop .shop-module .item .info .option { font-size: 14px; } .home-shop .shop-module .item .info .link { text-decoration: none; } .home-blog .news-feed { position: relative; } .home-blog .news-feed .graphic { position: absolute; width: 60%; right: -50px; top: -100px; pointer-events: none; } .home-blog .news-feed .post .image { display: block; margin-bottom: 8px; } .home-blog .news-feed .post .image img:nth-child(1) { opacity: 0.7; height: 60vw; } .home-blog .news-feed .post .info .name { font-size: 14px; margin-bottom: 4px; line-height: 1.5; display: -webkit-box; height: 42px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .home-blog .news-feed .post .info .read { font-size: 14px; } .home-blog .news-feed .post .info .link { text-decoration: none; } /* About */ .about-landing .about .row-inner .image img:nth-child(1) { opacity: 0.7; } .about-timeline { position: relative; } .about-timeline .line-graphic { position: absolute; top: 0; right: 0; width: 100vw; z-index: -1; } .about-timeline .event .year { margin-bottom: 6px; } .about-timeline .event .year { margin-bottom: 6px; } .about-timeline .event .title { margin-bottom: 8px; } /* Booking */ .booking-page .booking .row-inner { display: flex; flex-direction: column; } .booking-page .booking .options .item .info .name { font-size: 16px; } .booking-page .booking .options .item .info .description { font-size: 12px; } .booking-page .booking .controls .iframe { flex: 1; display: flex; justify-content: center; height: 800px; } /* Gifting */ .gifting-page .gifting .row-inner { display: flex; flex-direction: column; } .gifting-page .gifting .shop .iframe { flex: 1; display: flex; justify-content: center; } /* Faqs */ .faqs-page .graphic { position: absolute; top: 0; left: 24px; width: 80%; } /* Blog */ .blog-wrapper .blog-feed .loop .post .image { margin-bottom: 8px; } .blog-wrapper .blog-feed .loop .post .info .name { font-size: 14px; margin-bottom: 4px; line-height: 1.5; display: -webkit-box; height: 42px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .blog-wrapper .blog-feed .loop .post .info .read { font-size: 14px; } .blog-wrapper .blog-feed .loop .post .info .link { text-decoration: none; } .blog-wrapper .pagination .links { display: flex; justify-content: flex-end; } .blog-wrapper .pagination .links a { width: calc(50% - var(--half-padding)); text-align: center; } .blog-wrapper .pagination .links a:last-child { margin-left: var(--padding); } /* Single */ .post-wrapper .editor-content .wp-block-image:first-child { display: none; } .post-wrapper .share .stick { position: sticky; top: 160px; } .post-wrapper .share .title { margin-bottom: 8px; } .post-wrapper .share .item { margin-bottom: 4px; } .post-wrapper .share .item .link { text-decoration: none; } /* Press Area */ .user-register-page .user-registration { padding: 0; border: none; } .user-register-page .user-registration .ur-form-row .ur-form-grid { padding: 0; } .user-register-page .ur-frontend-form .ur-button-container { padding-right: 0; margin-top: 30px; } .user-register-page .ur-frontend-form .ur-button-container button { margin-right: 0; } .ur-frontend-form .ur-form-row .ur-form-grid .__PrivateStripeElement, .ur-frontend-form .ur-form-row .ur-form-grid input[type=date], .ur-frontend-form .ur-form-row .ur-form-grid input[type=email], .ur-frontend-form .ur-form-row .ur-form-grid input[type=number], .ur-frontend-form .ur-form-row .ur-form-grid input[type=password], .ur-frontend-form .ur-form-row .ur-form-grid input[type=phone], .ur-frontend-form .ur-form-row .ur-form-grid input[type=text], .ur-frontend-form .ur-form-row .ur-form-grid input[type=timepicker], .ur-frontend-form .ur-form-row .ur-form-grid input[type=url], .ur-frontend-form .ur-form-row .ur-form-grid select, .ur-frontend-form .ur-form-row .ur-form-grid textarea { height: 50px; padding: 0 20px; border: none; border-radius: 6px; width: 100%; } .press-page .page-title .title { display: flex; justify-content: space-between; align-items: center; } .press-page .press-login { margin: 0 auto; max-width: 400px !important; } .press-page .press-login form .login-username label, .press-page .press-login form .login-password label { display: none; } .press-page .press-login form input[type="text"], .press-page .press-login form input[type="password"] { height: 50px; padding: 0 20px; border: none; border-radius: 6px; width: 100%; } .press-page .press-login form input[type="submit"] { height: 40px; padding: 0 20px; border: none; border-radius: 6px; } .press-page .tabs .ghost-link { padding-top: calc(var(--interface-height) + 50px); margin-top: calc((var(--interface-height) + 50px) * -1); } .press-page .tabs .tab-selector-wrapper { position: sticky; top: var(--interface-height); z-index: 100; } .press-page .tabs .selector { display: flex; gap: 10px; flex-wrap: wrap; } .press-page .tabs .selector .tab-selector { padding: 8px 12px; border-radius: 1000px; text-transform: uppercase; display: block; text-decoration: none; } .press-page .tabs .selector .tab-selector p { font-size: 10px; text-transform: uppercase; text-decoration: none; } .press-page .tabs .selector .tab-selector.active { opacity: 0.7; pointer-events: none; } .press-page .tabs .selector .tab-selector.active:hover { opacity: 0.7; } .press-page .tabs .selector .tab-selector:hover { opacity: 0.5; } .press-page .tabs .tabs-wrapper .tab { display: none; } .press-page .tabs .tabs-wrapper .tab.active { display: block; } .press-page .tabs .tabs-wrapper .module { margin-bottom: var(--doble-padding); } .press-page .tabs .tabs-wrapper .module .item { position: relative; } .press-page .tabs .tabs-wrapper .module-grid { display: flex; flex-wrap: wrap; } .press-page .tabs .tabs-wrapper .module-grid .item { width: 33.33333333%; text-align: center; margin-bottom: var(--padding); } .press-page .tabs .tabs-wrapper .module .item .link { position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .press-page .tabs .tabs-wrapper .module .title { width: 100%; padding-bottom: 12px; margin-bottom: 20px; border-bottom-width: 1px; border-bottom-style: solid; } .press-page .tabs .tabs-wrapper .module .item-pdf .background { position: absolute; top: 0; left: 0; bottom: 0; right: 0; opacity: 0; border-radius: 20px; transition-duration: 0.2s; } .press-page .tabs .tabs-wrapper .module .item-pdf:hover .background { opacity: 0.2; } .press-page .tabs .tabs-wrapper .module .item-pdf .name { font-size: 12px; margin-top: 6px; } .press-page .tabs .tabs-wrapper .module .item-pdf .text { font-size: 12px; margin-top: 4px; } .press-page .tabs .tabs-wrapper .module .item-pdf .date { font-size: 12px; margin-top: 4px; } .press-page .tabs .tabs-wrapper .module-photo { column-gap: var(--padding); } .press-page .tabs .tabs-wrapper .module .item-photo { width: calc(33.33333333% - (var(--padding) * 0.66666666)); height: 120px; border-radius: 10px; overflow: hidden; transition-duration: 0.2s; } .press-page .tabs .tabs-wrapper .module .item-photo:hover { opacity: 0.7; } .press-page .tabs .tabs-wrapper .module .item-photo .image { object-fit: cover; width: 100%; height: 100%; } .press-page .tabs .accordion .ghost-link { padding-top: calc(var(--interface-height) + 100px); margin-top: calc((var(--interface-height) + 100px) * -1); } .press-page .tabs .accordion .collapsable { object-fit: cover; width: 100%; height: 100%; margin-bottom: var(--half-padding); } .press-page .tabs .accordion .collapsable-head { display: flex; justify-content: space-between; align-items: center; transition-duration: 0.2s; text-decoration: none; } .press-page .tabs .accordion .collapsable-head:hover { opacity: 0.6; } .press-page .tabs .accordion .collapsable-head .icon { width: 14px; padding-top: 2px; } .press-page .tabs .accordion .collapsable-content { display: none; } .press-page .tabs .accordion .collapsable.active .collapsable-head .icon { transform: rotate(180deg); } .press-page .tabs .accordion .collapsable.active .collapsable-content { display: block; } /*------------------------------------------------------------------------------------ Popup Message */ .popup-message-supreme { position: fixed; left: 0; bottom: 70px; pointer-events: none; z-index: 1000; transition: all 0.4s linear; } .popup-message-supreme.close { opacity: 0; } .popup-message-supreme .wrapper { border-radius: 8px; width: 240px; pointer-events: all; display: flex; flex-direction: column; gap: 14px; position: relative; } .popup-message-supreme.close .wrapper { pointer-events: none; } .popup-message-supreme .wrapper .title { margin-bottom: 8px; } .popup-message-supreme .wrapper .button { border-radius: 4px; padding: 8px 12px 10px; text-decoration: none; display: inline-block; font-size: 14px; } .popup-message-supreme .wrapper .closer { border-radius: 100px; width: 30px; height: 30px; position: absolute; top: -8px; right: -8px; } .popup-message-supreme .wrapper .closer .line { position: absolute; width: 14px; height: 2px; left: 6px; top: 12px; } .popup-message-supreme .wrapper .closer .line-1 { transform: rotate(45deg); } .popup-message-supreme .wrapper .closer .line-2 { transform: rotate(-45deg); } @media(min-width: 900px){ /* -------------------------------------------- */ /*------------------------------------------------------------------------------------ Titles */ .title-style { font-size: 24px; } .title-style.small-size { font-size: 20px; } .title-style.medium-size { font-size: 38px; } .title-style.main-size { font-size: 58px; } .title-style.giant-size { font-size: 80px; } /*------------------------------------------------------------------------------------ Buttons */ .button-style, .blog-wrapper .pagination .links a { padding: 17px 34px; } .button-style.small-size { padding: 12px 20px; font-size: 14px; } /*------------------------------------------------------------------------------------ Editor content */ .editor-content { font-size: 16px; } .editor-content div, .editor-content p { font-size: 16px; margin-bottom: 14px; } .editor-content a:hover { opacity: 0.6; } .editor-content ul { padding-left: 34px; margin-top: 8px; margin-bottom: 16px; } .editor-content ol { padding-left: 34px; margin-top: 8px; margin-bottom: 16px; } .editor-content h1, .editor-content h2, .editor-content h3, .editor-content h4, .editor-content h5, .editor-content h6 { margin: 30px 0 16px; } /*------------------------------------------------------------------------------------ Interface */ .main-nav .clock-wrapper .inner .time { height: 24px; } .main-nav .clock-wrapper .inner .time .clock { height: 24px; font-size: 17px; } .main-nav .clock-wrapper .inner .time .separator { height: 36px; transform: rotate(23.5deg) translateY(-5px); } .main-nav .clock-wrapper .inner .time .date { height: 24px; font-size: 17px; } .main-nav .clock-wrapper .inner .city { font-size: 10px; margin-top: 4px; } .main-nav .language-selector .item { font-size: 15px; } .main-nav .language-selector .item.separator { padding: 0 3px; } .main-nav .menu-button { width: 28px; height: 36px; } .main-nav .menu-button .line { width: 28px; } .time-menu .content .info .description { display: flex; justify-content: space-between; } .time-menu .content .info .description .textbox { width: 35%; } .time-menu .content .info .controls { display: flex; justify-content: space-between; align-items: flex-start; } .time-menu .content .info .controls .range { width: 35%; } .bottom-nav .logo { height: 44px; } .bottom-nav .button { font-size: 15px; padding: 9px 20px 10px; } .about-button { position: fixed; right: 0; top: 0; height: 100%; } .about-button .link-wrapper { height: 100%; width: 24px; display: flex; justify-content: center; align-items: center; } .about-button .link-wrapper .link { text-decoration: none; transform: rotate(90deg); transform-origin: center; white-space: nowrap; } /*------------------------------------------------------------------------------------ Footer */ footer { padding-bottom: 70px; } footer .flexer { display: flex; align-items: center; gap: 30px; padding: 0 30px; justify-content: center; } footer .flexer > * { width: 50%; } footer .flexer .sustainability { max-width: 300px; } .footer-contact .row-1 .col { width: 33.3333%; width: calc(100%/3); } .rc-mf .rc-mf-laptop .separator { margin: 24px 0; } .rc-mf .rc-mf-laptop .rc-row { display: flex; flex-wrap: wrap; } .rc-mf .rc-mf-laptop .rc-row .rc-col { width: calc(100% / 6); padding-right: 24px; } .rc-mf .rc-mf-laptop .rc-row .rc-col:last-child { padding-right: 0; } .rc-mf .rc-mf-laptop .item { font-size: 14px; line-height: 1.4; } .rc-mf .rc-mf-laptop .item a { text-decoration: none; } .rc-mf .rc-mf-laptop .restaurant .name { font-size: 12px; margin-bottom: 6px; } .rc-mf .rc-mf-laptop .restaurant .links { padding-top: 4px; } .rc-mf .rc-mf-laptop .restaurant .links .item { margin-bottom: 4px; } .rc-mf .rc-mf-laptop .restaurant .links .item .link { display: flex; justify-content: space-between; align-items: center; width: 100%; } .rc-mf .rc-mf-laptop .restaurant .links .item .icon { width: 8px; display: block; padding-top: 4px; } .rc-mf .rc-mf-laptop .row-1 .rc-col .name { min-height: 46px; } .rc-mf .rc-mf-laptop .row-1 .rc-col .address { min-height: 100px; } .rc-mf .rc-mf-laptop .row-1 .rc-col .web-wrapper { min-height: 22px; } .rc-mf .rc-mf-laptop .row-1 .rc-col .phone-wrapper { min-height: 40px; } .rc-mf .rc-mf-laptop .row-1 .rc-col-1 { width: calc((100% / 6) * 2); } .rc-mf .rc-mf-laptop .row-1 .rc-col-1 .signature { padding: 20% 30% 0 0; } .rc-mf .rc-mf-laptop .row-1 .rc-col-1 .signature img { max-width: 240px; } /*------------------------------------------------------------------------------------ Pages */ /* Home */ .home-landing .page-title { z-index: 1; } .home-landing .graphic { left: 100px; width: 30%; } .home-landing .awards { margin-top: 60px; } .home-landing .awards .item { margin-bottom: 10px; } .home-landing .awards .item .icon { width: 94px; } .home-landing .awards .item .icon svg { height: 20px; } .home-landing .awards .item .text { font-size: 16px; } .home-landing .slider { margin-top: -440px; pointer-events: none; } .home-landing .slider .plates-slider { padding-left: calc(50vw + var(--half-padding)); } .home-landing .slider .item { pointer-events: all; } .home-landing .slider .item .image { height: 50vh; } .home-landing .slider .item .caption .text { font-size: 16px; } .home-landing .kitchen .row-inner { flex-direction: row-reverse; } .home-menus .graphic { position: absolute; width: 100%; z-index: -1; } .home-menus .section-title { position: relative; } .home-menus .menus { margin-top: -100px; } .home-menus .menus .row-inner { display: flex; } .home-menus .menus .menu { flex: 1; padding-right: var(--padding); } .home-menus .menus .menu .image { height: 30vh; } .home-menus .menus .menu .description { font-size: 13px; } .home-menus .menus .work-hours { width: 25%; display: flex; flex-direction: column; justify-content: center; } .home-menus .menus .work-hours .lines p { font-size: 13px; } .home-faqs { margin:0 auto 120px; } .faqs .col { width: 50%; } .faqs .col-1 { padding-right: var(--half-padding); } .faqs .col-2 { padding-left: var(--half-padding); } .faqs .faq { padding: 30px 0; } .faqs .faq .answer .wrapper { padding-top: 10px; } .home-about { margin-top: 60px; } .home-about .about-cta .cta .graphic { width: 40%; right: -50px; top: -100px; } .home-about .controls { margin-top: -60px; position: relative; } .home-about .controls .button { padding: 22px 70px; } .home-restaurants { margin-top: 60px; } .home-restaurants .graph { margin-top: -90px; } .home-restaurants .restaurants { margin-top: -110px; } .home-restaurants .restaurants .loop { display: flex; } .home-restaurants .restaurants .restaurant { width: 25%; } .home-restaurants .restaurants .restaurant .image { height: 160px; } .home-restaurants .restaurants .restaurant .info .contact { padding-right: 10px; } .home-restaurants .restaurants .restaurant .info .links { padding-left: 10px; } .home-restaurants .restaurants .restaurant .info .line-item { font-size: 12px; } .home-shop .section-title .title { text-align: right; } .home-shop .shop-module.bonuses .graphic { width: 70%; } .home-shop .shop-module .loop { display: flex; flex-wrap: wrap; } .home-shop .shop-module .loop .item { width: 33.3333%; width: calc(100%/3); margin-bottom: 0; } .home-shop .shop-module .item.bonus .thumb { height: 200px; } .home-shop .shop-module .item.bonus .thumb .logo { width: 170px; } .home-shop .shop-module .item.bonus .thumb .label { font-size: 15px; } .home-shop .shop-module .item.product .image { height: 400px; } .home-shop .shop-module .item .info .name { font-size: 12px; margin-bottom: 4px; } .home-shop .shop-module .item .info .option { font-size: 12px; } .home-blog .news-feed .graphic { width: 40%; right: -120px; top: -100px; } .home-blog .news-feed .loop { display: flex; } .home-blog .news-feed .post { width: 33.3333%; width: calc(100%/3); margin-bottom: 0; } .home-blog .news-feed .post .image img:nth-child(1) { opacity: 0.7; height: 240px; } .home-blog .news-feed .post .info .name { font-size: 12px; margin-bottom: 4px; line-height: 1.5; display: -webkit-box; height: 36px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .home-blog .news-feed .post .info .read { font-size: 12px; } /* About */ .about-landing .about .row-inner { flex-direction: row-reverse; } .about-landing .about .row-inner .col { width: 50%; } .about-landing .about .row-inner .col-2 .image { height: 80vh; } .about-landing .about .description p { font-size: 26px; } .about-timeline .section-title { position: absolute; width: 100%; top: 60px; } .about-timeline .timeline { margin-top: -40px; } .about-timeline .event { width: 25%; } .about-timeline .event .description p { font-size: 14px; } .about-timeline .static-1 { position: absolute; top: 500px; left: 0; } .about-timeline .static-1 .row-inner { flex-wrap: wrap; } .about-timeline .static-1 .left { width: 50%; flex-direction: column; justify-content: flex-start; } .about-timeline .static-1 .left .image { height: 540px; margin-bottom: 120px; } .about-timeline .static-1 .left .graphic { width: 100%; } .about-timeline .static-1 .right { display: flex; width: 50%; flex-direction: column; align-items: flex-end; padding-top: 700px; } .about-timeline .static-1 .right .icon { width: 120px; padding-left: 0; margin-bottom: 40px; } .about-timeline .static-1 .right .title { width: 100%; text-align: right; } .about-timeline .static-2 { position: absolute; left: 0; } .about-timeline .static-2 .row-inner { flex-wrap: wrap; } .about-timeline .static-2 .row-inner .left { width: 50%; } .about-timeline .static-2 .row-inner .left .graphic { position: relative; z-index: -1; } .about-timeline .static-2 .row-inner .right { width: 50%; padding-top: 200px; } .about-timeline .static-2 .row-inner .right .image { margin-bottom: 80px; } /* Faqs */ .faqs-page .page-title .title { padding-bottom: 0; } .faqs-page .graphic { top: -80px; left: 24px; width: 60%; z-index: -1; } /* Blog */ .blog-wrapper .bar-graphic { position: relative; z-index: -1; } .blog-wrapper .blog-feed { margin-top: -80px; } .blog-wrapper .blog-feed .loop { display: flex; flex-wrap: wrap; } .blog-wrapper .blog-feed .loop .post { width: 33.3333%; width: calc(100%/3); margin-bottom: 0; } .blog-wrapper .blog-feed .loop .post .image { margin-bottom: 8px; height: 240px; } .blog-wrapper .blog-feed .loop .post .info .name { font-size: 12px; margin-bottom: 4px; line-height: 1.5; display: -webkit-box; height: 36px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .blog-wrapper .blog-feed .loop .post .info .read { font-size: 12px; } .blog-wrapper .pagination .links a { width: 200px; } /* Single */ .post-wrapper .page-title { margin-bottom: 60px; } .post-wrapper .page-title .row-inner { flex-direction: row-reverse; } .post-wrapper .page-title .row-inner .col { width: 50%; } .post-wrapper .page-title .row-inner .col-1 { padding-top: 0; padding-bottom: 0; display: flex; align-items: flex-end; } .post-wrapper .content .row-inner .col { width: 50%; } .post-wrapper .share .title { margin-bottom: 8px; } .post-wrapper .share .item { margin-bottom: 4px; } .post-wrapper .share .item .link { text-decoration: none; } /* Page */ .page-wrapper .page-title .row-inner .col-1 { max-width: 800px; margin: 0 auto; } .page-wrapper .content .row-inner .col { max-width: 800px; margin: 0 auto; } /* Press Area */ .user-register-page .user-registration .ur-form-row { column-gap: var(--padding) } .user-register-page .user-registration .ur-form-row .ur-form-grid { flex: 1; } .press-page .tabs .selector { column-gap: 16px; } .press-page .tabs .selector .tab-selector { padding: 12px 18px; } .press-page .tabs .selector .tab-selector p { font-size: 12px; } .press-page .tabs .tabs-wrapper .module-grid .item { width: calc(100% / 6); } .press-page .tabs .tabs-wrapper .module .title { padding-bottom: 14px; margin-bottom: 24px; } .press-page .tabs .tabs-wrapper .module .item-pdf .name { font-size: 14px; margin-top: 10px; } .press-page .tabs .tabs-wrapper .module .item-photo { width: calc(100% / 6 - (var(--padding) * 0.83333333)); height: 140px; } /*------------------------------------------------------------------------------------ Popup Message */ .popup-message-supreme { bottom: 0; } .popup-message-supreme .wrapper { width: 300px; gap: 24px; padding: 24px; } .popup-message-supreme .wrapper .title { margin-bottom: 8px; } } @media(min-width: 1200px){ /* -------------------------------------------- */ /*------------------------------------------------------------------------------------ Titles */ .title-style { font-size: 26px; } .title-style.small-size { font-size: 22px; } .title-style.medium-size { font-size: 44px; } .title-style.main-size { font-size: 66px; } .title-style.giant-size { font-size: 90px; } /*------------------------------------------------------------------------------------ Buttons */ .button-style, .blog-wrapper .pagination .links a { padding: 18px 40px; } /*------------------------------------------------------------------------------------ Interface */ .main-nav .logo-wrapper { width: 20%; } .main-nav .logo-wrapper .logo { display: block; height: 40px; } .main-nav .logo-wrapper .logo svg { height: 100%; width: auto; } .main-nav .links-wrapper { width: 20%; } .main-nav .links-wrapper .links .item { font-size: 15px; text-decoration: none; margin-left: 20px; } .main-nav .links-wrapper .links .item:first-child { margin-left: 0; } .main-nav .clock-wrapper { width: 20%; text-align: center; } .main-nav .clock-wrapper .inner { display: inline-block; } .main-nav .clock-wrapper .inner .time { height: 26px; } .main-nav .clock-wrapper .inner .time .clock { height: 26px; font-size: 19px; } .main-nav .clock-wrapper .inner .time .separator { height: 38px; transform: rotate(23.5deg) translateY(-6px); } .main-nav .clock-wrapper .inner .time .date { height: 26px; font-size: 19px; } .main-nav .clock-wrapper .inner .city { font-size: 11px; letter-spacing: 1px; } .main-nav .lang-wrapper { width: 20%; } .main-nav .language-selector .item { font-size: 15px; } .main-nav .language-selector .item.separator { padding: 0 4px; } .main-nav .actions-wrapper { width: 20%; } .main-nav .actions-wrapper .button-wrapper { margin-left: 10px; } .main-nav .actions-wrapper .button-wrapper:first-child { margin-left: 0; } .main-nav .actions-wrapper .button-wrapper .button { font-size: 16px; padding: 12px 24px 12px; line-height: 1; } .popup-closer { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 199; opacity: 0; pointer-events: none; } .booking-is-open .popup-closer { opacity: 0.4; pointer-events: all; } .gifting-is-open .popup-closer { opacity: 0.4; pointer-events: all; } .booking-menu { top: auto; bottom: 0; height: calc(100vh - 200px); transform: translateY(100vh); z-index: 200; } .booking-menu .pop-booking .row-inner { display: flex; flex-direction: row; } .booking-menu .pop-booking .row-inner .col-1 { width: calc(100% - (300px + var(--padding))); } .booking-menu .pop-booking .row-inner .col-2 { width: calc(300px + var(--padding)) } .booking-menu .pop-booking .image { height: 26vh; } .booking-menu .pop-booking .options .item .info .name { font-size: 26px; } .booking-menu .pop-booking .options .item .info .description { font-size: 16px; } .booking-menu .pop-booking .controls .iframe { height: 770px } .gifting-menu { top: auto; bottom: 0; height: calc(100vh - 200px); transform: translateY(100vh); z-index: 200; } .gifting-menu .pop-gifting .row-inner { display: flex; flex-direction: row; } .gifting-menu .pop-gifting .row-inner .col-1 { width: 50%; } .gifting-menu .pop-gifting .row-inner .col-2 { width: 50%; } .gifting-menu .pop-gifting .image { height: 50vh; } .gifting-menu .pop-gifting .shop { height: 100%; } .gifting-menu .pop-gifting .shop .iframe { flex: 1; display: flex; justify-content: center; height: 770px } .pop-menu .closer-holder { position: absolute; top: 0; right: 0; } .pop-menu .closer-holder .closer { width: 32px; height: 32px; position: relative; border-radius: 100px; } .pop-menu .closer-holder .closer .line { width: 14px; border-bottom-style: solid; border-bottom-width: 1px; position: absolute; left: 9px; top: 50%; } .pop-menu .closer-holder .closer .line-1 { top: 50%; transform: rotate(45deg); } .pop-menu .closer-holder .closer .line-2 { top: 50%; transform: rotate(-45deg); } .time-menu { bottom: 0; transform: translateY(100px); } .time-menu .content .info .description .textbox { padding-bottom: 30px; } .time-menu .controls .button-wrapper .resume { font-size: 16px; padding: 12px 36px; border-radius: 100px; } .about-button { z-index: 90; } /* Handling appearing elements */ body.first-time-visit .main-nav { transform: translateY(-166px); } /*------------------------------------------------------------------------------------ Footer */ .footer-contact .row-1 .col { margin-bottom: 0; } .footer-contact .separator { margin-bottom: 0; padding-top: 0; } .footer-contact a { line-height: 1.6; } .rc-mf .rc-mf-laptop { padding-top: 0; } .rc-mf .rc-mf-laptop .rc-row .rc-col { padding-right: 30px; } /*------------------------------------------------------------------------------------ Pages */ /* Home */ .home-landing .graphic { left: 120px; width: 24%; } .home-landing .awards { margin-top: -60px; } .home-landing .slider { margin-top: -480px; } .home-landing .kitchen .row-inner { flex-direction: row-reverse; margin-top: 20px; } .home-landing .kitchen .text p { font-size: 22px; } .home-landing .kitchen .col-2 { transform: translateY(-120px); } .home-menus .menus { margin-top: -120px; } .home-menus .menus .menu { padding-right: 40px; } .home-menus .menus .work-hours .button-wrapper { margin-top: 20px; } .home-menus .menus .work-hours .button-wrapper a { padding: 18px 80px; } .home-about { margin-top: 60px; } .home-about .about-cta .cta .graphic { width: 35%; right: -60px; top: -110px; } .home-about .controls { margin-top: -96px; position: relative; } .home-about .controls .button { padding: 26px 90px; } .home-restaurants { margin-top: 60px; } .home-restaurants .graph { margin-top: -90px; } .home-restaurants .restaurants { margin-top: -110px; } .home-restaurants .restaurants .loop { display: flex; } .home-restaurants .restaurants .restaurant { width: 25%; padding: 20px; margin-bottom: 20px; } .home-restaurants .restaurants .restaurant:nth-child(4n+1) { padding-left: var(--half-padding); } .home-restaurants .restaurants .restaurant:nth-child(4n) { padding-right: var(--half-padding); } .home-restaurants .restaurants .restaurant .image { height: 220px; } .home-restaurants .restaurants .restaurant .title { padding: 20px 0; } .home-restaurants .restaurants .restaurant .info { padding-top: 20px; } .home-restaurants .restaurants .restaurant .info .contact { padding-right: 10px; } .home-restaurants .restaurants .restaurant .info .links { padding-left: 10px; } .home-restaurants .restaurants .restaurant .info .line-item { font-size: 12px; } .home-shop .section-title .title { text-align: right; } .home-shop .shop-module.bonuses .graphic { width: 70%; } .home-shop .shop-module .loop { display: flex; } .home-shop .shop-module .loop .item { width: 33.3333%; width: calc(100%/3); margin-bottom: 0; padding: 20px; } .home-shop .shop-module .loop .item:nth-child(3n+1) { padding-left: var(--half-padding); } .home-shop .shop-module .loop .item:nth-child(3n) { padding-right: var(--half-padding); } .home-shop .shop-module .item.bonus .thumb { height: 220px; padding: 40px; margin-bottom: 14px; } .home-shop .shop-module .item.bonus .thumb .logo { width: 170px; } .home-shop .shop-module .item.bonus .thumb .label { font-size: 15px; } .home-shop .shop-module .item.product .image { height: 460px; margin-bottom: 14px; } .home-shop .shop-module .item .info .name { font-size: 14px; margin-bottom: 6px; } .home-shop .shop-module .item .info .option { font-size: 14px; } .home-blog .news-feed .graphic { width: 40%; right: -120px; top: -100px; } .home-blog .news-feed .loop { display: flex; } .home-blog .news-feed .post { width: 33.3333%; width: calc(100%/3); margin-bottom: 0; padding: 20px; } .home-blog .news-feed .post:nth-child(3n+1) { padding-left: var(--half-padding); } .home-blog .news-feed .post:nth-child(3n) { padding-right: var(--half-padding); } .home-blog .news-feed .post .image { margin-bottom: 14px; } .home-blog .news-feed .post .image img:nth-child(1) { opacity: 0.7; height: 280px; margin-bottom: 14px; } .home-blog .news-feed .post .info .name { font-size: 14px; margin-bottom: 14px; line-height: 1.5; display: -webkit-box; height: 42px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .home-blog .news-feed .post .info .read { font-size: 14px; } /* About */ .about-landing .about .row-inner { flex-direction: row-reverse; } .about-landing .about .row-inner .col { width: 50%; } .about-landing .about .row-inner .col-2 .image { height: 80vh; } .about-landing .about .description p { font-size: 26px; } .about-timeline .section-title { position: absolute; width: 100%; top: 60px; } .about-timeline .timeline { margin-top: -40px; } .about-timeline .event { width: 25%; } .about-timeline .event .description p { font-size: 14px; } .about-timeline .static-1 { position: absolute; top: 500px; left: 0; } .about-timeline .static-1 .row-inner { flex-wrap: wrap; } .about-timeline .static-1 .left { width: 50%; flex-direction: column; justify-content: flex-start; padding-top: 60px; } .about-timeline .static-1 .left .image { height: 540px; margin-bottom: 120px; } .about-timeline .static-1 .left .graphic { width: 100%; } .about-timeline .static-1 .right { display: flex; width: 50%; flex-direction: column; align-items: flex-end; padding-top: 700px; } .about-timeline .static-1 .right .icon { width: 120px; padding-left: 0; margin-bottom: 40px; } .about-timeline .static-1 .right .title { width: 100%; text-align: right; } .about-timeline .static-2 { position: absolute; left: 0; } .about-timeline .static-2 .row-inner { flex-wrap: wrap; } .about-timeline .static-2 .row-inner .left { width: 50%; } .about-timeline .static-2 .row-inner .left .graphic { position: relative; z-index: -1; } .about-timeline .static-2 .row-inner .right { width: 50%; padding-top: 200px; } .about-timeline .static-2 .row-inner .right .image { margin-bottom: 80px; } /* Booking */ .booking-page .booking .row-inner { display: flex; flex-direction: row; max-width: 1200px; } .booking-page .booking .row-inner .col-1 { width: calc(100% - (300px + var(--padding))); } .booking-page .booking .row-inner .col-2 { width: calc(300px + var(--padding)) } .booking-page .booking .image { height: 26vh; } .booking-page .booking .options .item .info .name { font-size: 26px; } .booking-page .booking .options .item .info .description { font-size: 16px; } .booking-page .booking .controls .iframe { min-height: 770px } /* Gifting */ .gifting-page .gifting .row-inner { display: flex; flex-direction: row; } .gifting-page .gifting .row-inner .col-1 { width: 50%; } .gifting-page .gifting .row-inner .col-2 { width: 50%; } .gifting-page .gifting .image { height: 50vh; } .gifting-page .gifting .shop { height: 100%; } .gifting-page .gifting .shop .iframe { flex: 1; display: flex; justify-content: center; } /* Faqs */ .faqs-page .graphic { top: -80px; left: 40px; width: 50%; } /* Blog */ .blog-wrapper .bar-graphic { position: relative; z-index: -1; } .blog-wrapper .blog-feed { margin-top: -80px; } .blog-wrapper .blog-feed .loop { display: flex; flex-wrap: wrap; } .blog-wrapper .blog-feed .loop .post { width: 33.3333%; width: calc(100%/3); margin-bottom: 0; } .blog-wrapper .blog-feed .loop .post .image { margin-bottom: 14px; height: 240px; } .blog-wrapper .blog-feed .loop .post .info .name { font-size: 14px; margin-bottom: 14px; line-height: 1.5; display: -webkit-box; height: 42px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .blog-wrapper .blog-feed .loop .post .info .read { font-size: 14px; } .blog-wrapper .pagination .links a { width: 200px; } .blog-wrapper .pagination .links a:last-child { margin-left: 40px; } /* Single */ .post-wrapper .page-title { margin-bottom: 60px; } .post-wrapper .page-title .row-inner { flex-direction: row-reverse; } .post-wrapper .page-title .row-inner .col { width: 50%; } .post-wrapper .page-title .row-inner .col-1 { padding-top: 0; padding-bottom: 0; display: flex; align-items: flex-end; } .post-wrapper .content .row-inner .col { width: 50%; } .post-wrapper .share .title { margin-bottom: 8px; } .post-wrapper .share .item { margin-bottom: 4px; } .post-wrapper .share .item .link { text-decoration: none; } /* Page */ .page-wrapper .page-title .row-inner .col-1 { max-width: 900px; margin: 0 auto; } .page-wrapper .content .row-inner .col-1 { max-width: 900px; margin: 0 auto; padding-top: 0; } /* Press Area */ .press-page .page-title .row-inner { padding-bottom: 0; } .press-page .content.head .row-inner { padding-bottom: 0; } .press-page .tabs .selector { column-gap: 20px; } .press-page .tabs .selector .tab-selector { padding: 14px 24px; } .press-page .tabs .selector .tab-selector p { font-size: 14px; } .press-page .tabs .tabs-wrapper { max-width: 900px !important; } .press-page .tabs .tabs-wrapper .module-grid .item { width: calc(100% / 6); } .press-page .tabs .tabs-wrapper .module .title { padding-bottom: 14px; margin-bottom: 24px; } .press-page .tabs .tabs-wrapper .module .item-pdf { padding: 24px; } .press-page .tabs .tabs-wrapper .module .item-pdf .name { font-size: 14px; margin-top: 10px; } .press-page .tabs .tabs-wrapper .module-photo { column-gap: 24px; } .press-page .tabs .tabs-wrapper .module .item-photo { width: calc(100% / 6 - 20px); height: 180px; } } @media(min-width: 1400px){ /* -------------------------------------------- */ /*------------------------------------------------------------------------------------ Titles */ .title-style { font-size: 26px; } .title-style.small-size { font-size: 22px; } .title-style.medium-size { font-size: 44px; } .title-style.main-size { font-size: 80px; } .title-style.giant-size { font-size: 110px; } /*------------------------------------------------------------------------------------ Interface */ .main-nav .logo-wrapper { width: 20%; } .main-nav .logo-wrapper .logo { height: 46px; } .main-nav .links-wrapper { width: 20%; } .main-nav .links-wrapper .links .item { margin-left: 26px; } .main-nav .clock-wrapper { width: 20%; } .main-nav .clock-wrapper .inner .time { height: 26px; } .main-nav .clock-wrapper .inner .time .clock { height: 26px; font-size: 22px; } .main-nav .clock-wrapper .inner .time .separator { height: 42px; transform: rotate(23.5deg) translateY(-2px); margin: 0 16px; } .main-nav .clock-wrapper .inner .time .date { height: 26px; font-size: 22px; } .main-nav .clock-wrapper .inner .city { margin-top: 12px; } .main-nav .lang-wrapper { width: 20%; } .main-nav .language-selector .item { font-size: 16px; } .main-nav .language-selector .item.separator { padding: 0 4px; } .main-nav .actions-wrapper { width: 20%; } .main-nav .actions-wrapper .button-wrapper { margin-left: 12px; } .main-nav .actions-wrapper .button-wrapper .button { font-size: 16px; padding: 14px 28px 14px; } .about-button .link-wrapper .link { font-size: 20px; } /*------------------------------------------------------------------------------------ Footer */ footer { padding-bottom: 70px; } .rc-mf .rc-mf-laptop .separator { margin: 30px 0; } .rc-mf .rc-mf-laptop .rc-row .rc-col { padding-right: 50px; } .rc-mf .rc-mf-laptop .item { font-size: 15px; } .rc-mf .rc-mf-laptop .restaurant .name { font-size: 13px; margin-bottom: 8px; } .rc-mf .rc-mf-laptop .restaurant .links { padding-top: 6px; } .rc-mf .rc-mf-laptop .restaurant .links .item { margin-bottom: 6px; } .rc-mf .rc-mf-laptop .restaurant .links .item .icon { width: 8px; padding-top: 5px; } .rc-mf .rc-mf-laptop .row-1 .rc-col .name { min-height: 50px; } .rc-mf .rc-mf-laptop .row-1 .rc-col .address { min-height: 110px; } .rc-mf .rc-mf-laptop .row-1 .rc-col .web-wrapper { min-height: 24px; } .rc-mf .rc-mf-laptop .row-1 .rc-col .phone-wrapper { min-height: 44px; } .rc-mf .rc-mf-laptop .rc-row .rc-col { padding-right: 30px; } /*------------------------------------------------------------------------------------ Pages */ /* Home */ .home-landing .graphic { left: 120px; width: 22%; } .home-landing .awards { margin-top: -160px; } .home-landing .awards .item .icon { width: 110px; } .home-landing .slider { margin-top: -460px; } .home-landing .kitchen .row-inner { flex-direction: row-reverse; margin-top: 20px; } .home-landing .kitchen .text p { font-size: 30px; } .home-menus .menus { margin-top: -300px; } .home-menus .menus .menu { padding-right: 40px; } .home-about { margin-top: 0; } .home-about .about-cta .cta .graphic { width: 35%; right: -60px; top: -110px; } .home-about .controls { margin-top: -96px; position: relative; } .home-about .controls .button { padding: 26px 90px; } .home-restaurants { margin-top: 60px; } .home-restaurants .graph { margin-top: -200px; } .home-restaurants .restaurants { margin-top: -210px; } .home-restaurants .restaurants .restaurant .image { height: 220px; } .home-restaurants .restaurants .restaurant .info .line-item { font-size: 13px; } .home-shop .shop-module.bonuses { margin-top: -100px; } .home-shop .shop-module.bonuses .graphic { width: 54%; } .home-shop .shop-module .item.bonus .thumb { height: 280px; } .home-shop .shop-module .item.product .image { height: 550px; } .home-blog .news-feed { margin-top: -100px; } .home-blog .news-feed .graphic { width: 40%; right: -120px; top: -100px; } .home-blog .news-feed .loop { display: flex; } .home-blog .news-feed .post { width: 33.3333%; width: calc(100%/3); margin-bottom: 0; } .home-blog .news-feed .post .image img:nth-child(1) { opacity: 0.7; } /* About */ .about-landing .about .row-inner { flex-direction: row-reverse; } .about-landing .about .row-inner .col { width: 50%; } .about-landing .about .row-inner .col-2 .image { height: 80vh; } .about-landing .about .description p { font-size: 26px; } .about-timeline .section-title { position: absolute; width: 100%; top: 60px; } .about-timeline .timeline { margin-top: -40px; } .about-timeline .event { width: 25%; } .about-timeline .event .description p { font-size: 14px; } .about-timeline .static-1 { position: absolute; top: 500px; left: 0; } .about-timeline .static-1 .row-inner { flex-wrap: wrap; } .about-timeline .static-1 .left { width: 50%; flex-direction: column; justify-content: flex-start; padding-top: 160px; } .about-timeline .static-1 .left .image { height: 540px; margin-bottom: 120px; } .about-timeline .static-1 .left .graphic { width: 100%; } .about-timeline .static-1 .right { display: flex; width: 50%; flex-direction: column; align-items: flex-end; padding-top: 700px; } .about-timeline .static-1 .right .icon { width: 120px; padding-left: 0; margin-bottom: 40px; } .about-timeline .static-1 .right .title { width: 100%; text-align: right; } .about-timeline .static-2 { position: absolute; left: 0; } .about-timeline .static-2 .row-inner { flex-wrap: wrap; } .about-timeline .static-2 .row-inner .left { width: 50%; } .about-timeline .static-2 .row-inner .left .graphic { position: relative; z-index: -1; } .about-timeline .static-2 .row-inner .right { width: 50%; padding-top: 200px; } .about-timeline .static-2 .row-inner .right .image { margin-bottom: 80px; } /* Blog */ .blog-wrapper .page-title .col { padding-top: 0; } .blog-wrapper .bar-graphic { position: relative; z-index: -1; margin-top: -100px; } .blog-wrapper .blog-feed { margin-top: -180px; } .blog-wrapper .blog-feed .loop { display: flex; flex-wrap: wrap; } .blog-wrapper .blog-feed .loop .post { width: 33.3333%; width: calc(100%/3); margin-bottom: 0; } .blog-wrapper .blog-feed .loop .post .image { height: 280px; } .blog-wrapper .pagination .links a { width: 240px; } /* Faqs */ .faqs-page .graphic { top: -60px; left: 80px; width: 40%; } /* Single */ .post-wrapper .page-title { margin-bottom: 60px; } .post-wrapper .page-title .row-inner { flex-direction: row-reverse; } .post-wrapper .page-title .row-inner .col { width: 50%; } .post-wrapper .page-title .row-inner .col-1 { padding-top: 0; padding-bottom: 0; display: flex; align-items: flex-end; } .post-wrapper .content .row-inner .col { width: 50%; } .post-wrapper .share .title { margin-bottom: 8px; } .post-wrapper .share .item { margin-bottom: 4px; } .post-wrapper .share .item .link { text-decoration: none; } /* Page */ .page-wrapper .page-title .row-inner .col-1 { max-width: 1000px; } .page-wrapper .content .row-inner .col-1 { max-width: 1000px; } } @media(hover: hover) { /* -------------------------------------------- */ /*------------------------------------------ Switches */ .hover-only { display: block; } .hover-off { display: none; } /*------------------------------------------ Cursor States */ body, a, label { cursor: none; } .cursor-outer { width: 400px; height: 400px; position: fixed; top: -218px; left: -220px; z-index: 5000; pointer-events: none !important; backface-visibility: hidden; -webkit-font-smoothing: antialiased; } .cursor-outer .cursor { width: 100%; height: 100%; top: 3px; left: 4px; position: absolute; border-radius: 50%; transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275); transform: scale(0.025); transform-origin: center center; display: flex; justify-content: center; align-items: center; backface-visibility: hidden; -webkit-font-smoothing: antialiased; } .cursor-outer .cursor .icon-tag { opacity: 0; width: 100%; position: absolute; padding: 100px; } .cursor-outer .cursor .mystery-text-tag { padding: 60px; } .cursor-outer .cursor .new-page-tag { padding: 140px; } .cursor-outer .cursor .plus-tag { padding: 140px; } .cursor-outer .cursor .drag-h-tag { padding: 120px; } .cursor-outer.scale { opacity: 0.8; } .cursor-outer.scale .cursor { transform: scale(0.2); } .cursor-outer.mystery { opacity: 0.8; } .cursor-outer.mystery .cursor { transform: scale(0.175); } .cursor-outer.mystery .cursor .mystery-tag { opacity: 1; } .cursor-outer.mystery-text { opacity: 0.8; } .cursor-outer.mystery-text .cursor { transform: scale(0.3); } .cursor-outer.mystery-text .cursor .mystery-text-tag { opacity: 1; } .cursor-outer.new-page { opacity: 0.8; } .cursor-outer.new-page .cursor { transform: scale(0.175); } .cursor-outer.new-page .cursor .new-page-tag { opacity: 1; } .cursor-outer.plus { opacity: 0.8; } .cursor-outer.plus .cursor { transform: scale(0.175); } .cursor-outer.plus .cursor .plus-tag { opacity: 1; } .cursor-outer.drag-h { opacity: 0.8; } .cursor-outer.drag-h .cursor { transform: scale(0.175); } .cursor-outer.drag-h .cursor .drag-h-tag { opacity: 1; } }