/*
Theme Name: Fischküche Reck
Author: ticktoo Systems GmbH / Pedro Stoehr
Author URI: https://ticktoo.com
Template: bones
*/

/*! IMPORTS ------------------------------------------------------------ */

@import url('fonts/Overpass/Overpass.css');
@import url('fonts/HaveHeart/HaveHeart.css');
@import url('fonts/Microbrew/Microbrew.css');
@import url('../bones/vendor/bootstrap-5.3.2-dist/css/bootstrap.min.css');
@import url('vendor/fontawesome-pro-6.4.2-web/css/all.min.css');
@import url('vendor/fontawesome-pro-6.4.2-web/css/sharp-regular.min.css');

/*! VARS --------------------------------------------------------------- */

:root {
	--theme-font: 'Overpass', Helvetica Neue, Helvetica, sans-serif;
  --theme-font-extra-one: 'HaveHeart-One', Helvetica Neue, Helvetica, sans-serif;
  --theme-font-extra-two: 'Microbrew Two', Helvetica Neue, Helvetica, sans-serif;
  --theme-color: 54,27,30;
  --theme-color-red: 187,17,17;
  --theme-color-red-dark: 153,17,17;
  --theme-color-red-darker: 54,27,30;
  --theme-color-red-light: 229,23,23;
  --theme-color-creme: 234,231,223;
  --theme-color-creme-light: 248,247,244; 
  --theme-color-creme-dark: 204,202,196; 
  --theme-color-pink: 220,50,110;
	--bs-link-color-rgb:187,17,17;
  --bs-link-hover-color-rgb: 187,17,17;
  --theme-transition: all .25s ease-in-out;
  --theme-border-radius: 10px;
}

/*! GENERAL ------------------------------------------------------------ */

body{background:rgb(var(--theme-color-creme)) url(img/asset_noise.svg) repeat left top;background-size:400px 400px;color:rgb(var(--theme-color));font-family:var(--theme-font);font-size:1.1rem;line-height:1.5}
a{opacity:1;transition:var(--theme-transition)}
a:hover{opacity:.875}
.group:after{content:".";clear:both;display:block;height:0;visibility:hidden}
h1,h2,h3{font-family:var(--theme-font-extra-two);}
h1{color:rgb(var(--theme-color-red));font-size:3rem;hyphens:auto;line-height:1.1;padding:1rem 0 1.5rem 0;margin:0;text-align: center;}
h2{color:rgb(var(--theme-color-red));font-size:2.1rem;padding:.75rem 0 1rem 0;margin:0}
h3{font-size:1.6rem;padding:.75rem 0;margin:0}
h4{font-size:1rem;padding:.75rem 0}
.home h1{font-family:var(--theme-font-extra-one);color:rgb(var(--theme-color-red));font-size:4.5rem;font-weight:normal;line-height:1;margin:0;padding:2rem 0 2rem 0;text-align:center;}
.home h2{text-align:center}
.btn-one{border:1px solid rgb(var(--theme-color-red-darker));background-color:rgb(var(--theme-color-red-darker));color:rgb(var(--theme-color-creme-light));text-align:center;cursor:pointer;font-size:1rem;border-radius:4px;text-decoration:none;padding:.75rem 1rem .5rem;line-height:1;transition:var(--theme-transition)}
.btn-two{font-family:var(--theme-font-extra-two);text-transform:uppercase;border:1px solid rgb(var(--theme-color-red-darker));background-color:rgb(var(--theme-color-creme-light));color:rgb(var(--theme-color-red-darker));cursor:pointer;border-radius:4px;text-decoration:none;font-size:1.1rem;padding:.5rem 1rem;line-height:1}
.btn-two:hover{background-color:rgb(var(--theme-color-red-darker));color:rgb(var(--theme-color-creme-light))}
figure img{border-radius:10px;width:960px;max-width:100%;height:auto}
figure figcaption{font-size:.9rem;margin-top:.75rem}
.block-bild-text{margin-top:1rem;margin-bottom:2rem}
video{max-width:100%;height:auto;border-radius:10px;margin-bottom:1.5rem}

/*! HEADER ------------------------------------------------------------- */

header{background-color:transparent;color:rgb(var(--theme-color-creme));position:absolute;left:0;top:0;width:100%;z-index:101}
html > body header{position:fixed}
header .container{position:relative}
header .brand{left:50%;position:absolute;transform:translateX(-50%)}
header .brand a{background:url(img/logo.svg) no-repeat 0 0;display:block;text-indent:-9999px}
header .brand a:hover{opacity:1}
header a{color:rgb(var(--theme-color-creme));text-decoration:none}
header .menu{position:absolute;right:2rem}
header .booking{position:absolute;left:2rem}
header .menu,header .booking{font-size:.9rem;letter-spacing:.025em;font-weight:600;text-transform:uppercase}
.header-main header,#nothome header{background-color:rgba(var(--theme-color-creme-light),.8);backdrop-filter:blur(3px);}
.header-main header a,#nothome header a{color:rgb(var(--theme-color-red));text-decoration:none}
.header-main header .brand a,#nothome header .brand a{background:url(img/logo_red.svg) no-repeat 0 0}
#main-nav ul{list-style-type:none;margin:0;padding:0}
#main-nav li{margin-bottom:.75rem}
#main-nav a{color:rgb(var(--theme-color));font-size:1.1rem;font-weight:bold;text-transform:uppercase;text-decoration:none}
#main-nav a:hover,.current-menu-item a,.current-menu-parent a{color:rgb(var(--theme-color-red))!important}
.nav-cta{margin-top:2rem}
.nav-cta a{display:block;background-color:rgb(var(--theme-color-red))!important;color:rgb(var(--theme-color-creme))!important;text-align:center;padding:1rem 1rem .75rem;line-height:1;border-radius:6px}
.offcanvas .brand{margin-bottom:1rem}
.offcanvas .brand a{background:url(img/logo_red.svg) no-repeat 0 0;display:block;text-indent:-9999px}
.offcanvas .brand a:hover{opacity:1}
.offcanvas .brand a{background-size:100% auto;height:auto;width:100%;padding-top:10%}
.nav-service.first {margin-top:1.5rem}
.nav-service {margin-bottom:.5rem!important}
.nav-service a{font-size: .9rem!important;}

/*! SITE -------------------------------------------------------------------- */

main{background:rgb(var(--theme-color-creme-light)) url(img/asset_noise_dark.svg) repeat left top;background-size:400px 400px}
main li{margin-bottom:1rem}

/*! INTRO ---- */

section.intro{background:rgb(var(--theme-color-red-dark));background:linear-gradient(0deg,rgba(var(--theme-color-red-dark),1) 0%,rgba(var(--theme-color-red-darker),1) 100%);background-attachment:scroll;color:rgb(var(--theme-color-creme));overflow:hidden!important;position:relative;user-select:none}
section.intro .sf-logo{position:absolute;left:50%;top:40%;transform:translate(-50%, -40%);text-align:center;text-transform:uppercase;z-index:9;width:100%}
section.intro .sf-hungry{position:absolute;left:50%;bottom:8rem;transform:translateX(-50%);text-align:center;text-transform:uppercase;font-size:.9rem;color:rgb(var(--theme-color-creme));font-weight:600;z-index:3}
section.intro .sf-booking{position:absolute;left:50%;bottom:6rem;transform:translateX(-50%);text-align:center;text-transform:uppercase;z-index:9;width:100%}
section.intro .sf-booking a{background-color:rgb(var(--theme-color-creme-light));border-radius:6px;color:rgb(var(--theme-color-red));display:block;font-size:1.2rem;font-weight:bold;padding: 1.25rem 1.5rem 1rem 1.5rem;line-height:1;text-decoration:none;text-transform:uppercase;width:100%}
section.intro .sf-video video{background-attachment:fixed;box-sizing:border-box;height:100vh;left:0;max-height:100vh;object-fit:cover;object-position:center top;position:absolute;top:0;width:100%;z-index:1}

/*! HERO ---- */

section.hero{position:relative;z-index:23}
section.hero img{border-radius:var(--theme-border-radius)}

/*! SEASONS --- */

section.seasons .season-item{position:relative;}
section.seasons .season-item img{border-radius:var(--theme-border-radius)}
section.seasons .season-item h3{color:rgb(var(--theme-color-red));font-family:var(--theme-font-extra-one);font-size:2.7rem;font-weight:normal;line-height:1;margin-bottom:0;padding-bottom:.5rem;text-align:center}
section.seasons .season-item p{font-size:.9rem;font-weight:600;margin-bottom:.5rem;padding:0 2rem;text-align:center;text-transform:uppercase}
section.seasons a{text-decoration:none!important}
section.seasons a p{color:rgb(var(--theme-color));}
section.seasons .season-item .date{opacity:.5}

.ribbon{font-size:.9rem;font-weight:bold;text-transform:uppercase;color:rgb(var(--theme-color-creme));padding-top:.25rem}
.ribbon{--f:.25em;position:absolute;top:0;right:0;padding-inline:1lh;padding-bottom:var(--f);border-image:conic-gradient(#0008 0 0) 51%/var(--f);clip-path:polygon(100% calc(100% - var(--f)),100% 100%,calc(100% - var(--f)) calc(100% - var(--f)),var(--f) calc(100% - var(--f)),0 100%,0 calc(100% - var(--f)),999px calc(100% - var(--f) - 999px),calc(100% - 999px) calc(100% - var(--f) - 999px));transform:translate(calc((1 - cos(45deg))*100%),-100%) rotate(45deg);transform-origin:0 100%;background-color:rgb(var(--theme-color-red))}

/*! Blog ---- */

.blog-archive{background:rgb(var(--theme-color-creme)) url(img/asset_noise.svg) repeat left top;background-size:400px 400px;border-radius:var(--theme-border-radius);margin-bottom:2.5rem;overflow:hidden}
.blog-archive a{display:block;color:rgb(var(--bt-body));text-decoration:none}
.blog-archive .archive-content{padding:.75rem 1.5rem 1rem}
.blog-archive .archive-date{color:rgb(var(--theme-color-red));font-size:.9rem;font-weight:bold;padding-bottom:.25rem}
.blog-archive h3{margin:0;padding:0}
.blog-archive h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:90%}
.blog-meta{margin:-1rem 0 2rem;text-align:center;font-family:var(--theme-font-extra-two)}

.txt-share{text-align:center;padding-top:2rem}
.txt-share p{font-family:var(--theme-font-extra-two);}
.txt-share ul{list-style-type:none;margin:0 auto;padding:0}
.txt-share li{display:inline-block;margin:0 .5rem}
.txt-share i{font-size:1.5rem}
.txt-share a,.txt-share a:hover,.txt-share a:focus{box-shadow:none}

.link-item{margin-bottom:1.5rem}
.link-item i{display:block;font-size:3rem;margin-bottom:1rem;padding-top:1rem}
.link-item a{background:#FFF url(img/asset_noise_dark.svg) repeat left top;background-size:400px 400px;border-radius:10px;color:rgb(var(--ewd-creme));display:block;font-size:1.2rem;font-weight:bold;padding:1.5rem 2rem;text-align:center;text-decoration:none}

.logo-image{align-items:center;display:flex;height:100px;justify-content:center;margin-bottom:1rem;padding:10px}
.logo-image .style-svg{display:inline-block;height:100%;max-width:140px;max-height:100px;width:auto}
.logo-image .style-pixel{display:inline-block;height:auto;max-width:140px;max-height:100px;width:auto}

/*! FOOTER ------------------------------------------------------------------ */

footer{color:rgb(var(--theme-color));font-size:.9rem;padding:3rem 0 1rem;text-transform:uppercase}
footer .footer-item{text-align:center}
footer a{color:rgb(var(--theme-color))!important}
footer .footer-item a{color:rgb(var(--theme-color-red));text-decoration:none}
footer h3{color:rgb(var(--theme-color-red));font-family:var(--theme-font-extra-two);font-size:1.3rem;font-weight:normal;margin-bottom:0}
footer ul{list-style-type:none;margin:0;padding:0}
footer .socials li{margin:0 .5rem}
footer p:last-child{margin-bottom:0}
footer .footer-item ul{list-style-type:none;margin:0;padding:0}
footer .footer-item strong{text-transform:uppercase}
footer .menu{list-style-type:none;margin:0;padding:0}
footer .menu a{text-decoration:none}
footer .menu li:last-child a{margin-right:0}

/*! LAZY BLOCKS ------------------------------------------------------------- */

/*! SPACER */

.block-spacer{display:block;height:1rem;width:100%}
.block-spacer.x2{height:2rem}
.block-spacer.x3{height:3rem}
.block-spacer.x4{height:4rem}
.block-spacer.x6{height:6rem}

/*! BOOTSTRAP PARTS modified ------------------------------------------------ */

.container{padding:0 2rem}
.img-fluid{height:auto;max-width:100%;width:100%}
.offcanvas{background-color:rgb(var(--theme-color-creme-light))}
.offcanvas-header{position:relative}
.offcanvas .btn-close{position:absolute;right:1.5rem;top:1.5rem}
.offcanvas-body{padding:3rem 2rem}
.offcanvas-backdrop.show{background:rgb(var(--theme-color-red));opacity:.9}
.btn-close:focus{box-shadow:0 0 0 .25rem rgba(var(--theme-color),0.15);outline:0}

/*! WP Modifiers ------------------------------------------------------------ */

.wp-block-image.size-large img,
.wp-block-image.size-full img{border-radius:6px;display:block;height:auto;max-width:100%;width:1200px;}
figcaption{font-size:.85rem;color:#999}
.wp-block-embed-youtube {margin:0;padding:0;}
.wp-block-embed-youtube .wp-block-embed__wrapper{height:0;margin-bottom:24px;padding-bottom:56.25%;padding-top:30px;position:relative;overflow:hidden}
.wp-block-embed-youtube .wp-block-embed__wrapper iframe,.wp-block-embed-youtube .wp-block-embed__wrapper object,.wp-block-embed-youtube .wp-block-embed__wrapper embed,.wp-block-embed-youtube .wp-block-embed__wrapper video{height:100%;left:0;position:absolute;top:0;width:100%}
.wp-block-file{border:1px solid #DDD;height:42px;line-height:42px;margin-bottom:10px;position:relative;width:100%}
.wp-block-file a {border: 0;}
.wp-block-file a:not(.wp-block-file__button){background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><path fill='rgb(29,29,27)' d='M47 48H1c-.6 0-1-.4-1-1V37c0-.6.4-1 1-1s1 .4 1 1v9h44v-9c0-.6.4-1 1-1s1 .4 1 1v10c0 .6-.4 1-1 1zM24 38c-.3 0-.5-.1-.7-.3l-14-14c-.3-.3-.4-.7-.2-1.1.1-.4.5-.6.9-.6h6V1c0-.6.4-1 1-1h14c.6 0 1 .4 1 1v21h6c.4 0 .8.2.9.6.2.4.1.8-.2 1.1l-14 14c-.2.2-.4.3-.7.3zM12.4 24L24 35.6 35.6 24H31c-.6 0-1-.5-1-1V2H18v21c0 .6-.4 1-1 1h-4.6z'/></svg>");background-position:10px center;background-repeat:no-repeat;background-size:24px 24px;color:var(--agf-blue-light);display:block;font-weight:600;padding-left:50px;text-decoration:none}
.wp-block-file a:not(.wp-block-file__button):hover{color:#999;}
.wp-block-file__button{display:none}
.wp-block-button__link{font-family:var(--theme-font-extra-two);text-transform:uppercase;background-color:transparent;border:2px solid rgb(var(--theme-color-red))!important;border-radius:var(--theme-border-radius);color:rgb(var(--theme-color-red));font-size:1.6rem;line-height:1;font-weight:normal!important;letter-spacing:.025em;margin-bottom:0!important;outline:0!important;padding:.5rem 1.5rem;width:100%;transition:var(--theme-transition)}
.wp-block-button__link:hover{background-color:rgb(var(--theme-color-red));color:rgb(var(--theme-color-creme-light));}

/*! ANIMATIONS ------------------------------------------------------------- */

.inview{animation-duration:var(--animate-duration);animation-fill-mode:both;animation-name:hider;opacity:0}
.slow{animation-delay:var(--animate-duration)}
.fadeIn{animation-name:fadeIn}
.fadeInLeft{animation-name:fadeInLeft}
.fadeInRight{animation-name:fadeInRight}
.zoomIn{animation-name:zoomIn}
.pulse{animation-name:pulse;animation-iteration-count:infinite;}
.pulsate{animation:pulsate 2s ease-out;animation-iteration-count:infinite;opacity:.5;}
.fadeInOut{animation: fadeinout 4s linear forwards;}

/*! KEYFRAMES ------- */

@keyframes fadeIn {
    0%{opacity:0}
    100%{opacity:1}
}
@keyframes fadeInLeft {
    0%{opacity:0;transform:translateX(-100px)}
    100%{opacity:1;transform:translateX(0)}
}
@keyframes fadeInRight {
    0%{opacity:0;transform:translateX(100px)}
    100%{opacity:1;transform:translateX(0)}
}
@keyframes zoomIn {
    from{opacity:0;-webkit-transform:scale3d(0.3,0.3,0.3);transform:scale3d(0.3,0.3,0.3)}
    100%{opacity:1}
}
@keyframes hider {
    0%{opacity:1}
    100%{opacity:0}
}
@keyframes pulse {
    0%{transform:scale(0.95);box-shadow:0 0 0 0 rgba(250,40,60,0.7)}
    70%{transform:scale(1);box-shadow:0 0 0 10px rgba(250,40,60,0)}
    100%{transform:scale(0.95);box-shadow:0 0 0 0 rgba(250,40,60,0)}
}
@keyframes pulsate {
    0%{opacity:.1}
    50%{opacity:1}
    100%{opacity:.1}
}
@keyframes fadeinout {
    0%{opacity:0}
    50%{opacity:1}
    100%{opacity:.5}
}

.UfIWW{font-family:var(--theme-font)!important}
h3.sc-22o7gi-0{font-size:1.3rem!important;padding:0!important}
.sc-1bt50l8-0{padding:.75rem 0 .5rem!important}
.kvYHhi,.fCILDH{border-bottom-style:dashed!important}
h2.sc-22o7gi-0{text-align:center}
.dazubi,.gPSvQG{display:none!important}
h1.ot-title{display:none!important}
#ot-widget-container3{text-align:center!important}
#ot-widget-container3 iframe{margin:0 auto!important}

/*! RESPONSIVE, BABY! -------------------------------------------------- */

@media screen and (min-width: 1200px){ /* EXTRA LARGE */
  .container-md,.container-sm,.container{max-width:1000px}
  .container.custom{max-width: 1600px!important;}
  .container.custom-2{max-width: 1200px!important;}
}
@media screen and (min-width: 992px){ /* LARGE */     
	.admin-bar header{top:32px}
  header{height:93px}
  header .brand{top:20px}
  header .brand a{background-size:325px 43px;height:43px;width:325px}
  header .menu,header .booking{top:33px}
  section.intro{height:100vh}
  section.intro .sf-booking{display:none}
  body.home section.hero{transform:translateY(-6rem);margin-bottom:-6rem}
  section.seasons [class*="col-"]:nth-child(1){transform:rotate(-3deg)}
  section.seasons [class*="col-"]:nth-child(3){transform:rotate(5deg)}
  footer .copy{text-align:left}
  footer .legal{text-align:right}
  .oversized{margin-right:-4rem;margin-left:-4rem;width:calc(100% + 8rem)}
  #nothome main{padding-top:6rem}
  .block-bild-text figure{transform:rotate(3deg)}
  .block-bild-text .order-lg-first figure{transform:rotate(-3deg)}
  .block-bild-text img{margin-top:1rem}
}
@media screen and (max-width: 991.98px){ /* SMALL + MEDIUM */
  h1{font-size:2.8rem}
  .home h1{font-size:3.2rem;}
  header{height:60px}
  header .brand{left:2rem;position:absolute;top:15px;transform:translateX(0)}
  header .brand a{background-size:226px 30px;height:30px;width:226px}
  header .menu,header .booking{top:18px}
  header .booking{display:none}
  section.intro{height:80vh}
  section.intro .sf-logo{position:absolute;left:50%;top:35%;transform:translate(-50%,-35%)}
  section.intro .sf-hungry{display:none}
  body.home section.hero{margin-bottom:-4rem;transform:translateY(-4rem)}
  section.seasons .season-item{margin-bottom:2rem;overflow:hidden}
  section.seasons .item-content{background-color:rgba(var(--theme-color-red),.8);border-radius:0 0 var(--theme-border-radius) var(--theme-border-radius);bottom:0;left:0;padding:0 1rem .5rem;position:absolute}
  section.seasons .item-content h3,
  section.seasons .item-content p{color:rgb(var(--theme-color-creme-light))}
  footer .footer-item{margin-bottom:2rem}
  footer h3{margin-bottom:0}
  footer .legal{text-align:center}
  footer .copy{text-align:center;margin-top:10px}
  footer .menu li{text-align:center;padding:5px 0}
  footer .menu li a{display:block}
  .container.no-container-on-mobile{width:95%;padding:0}
  .blog-box{padding:2rem}
  #nothome main{padding-top:4rem}
}
@media screen and (min-width: 576px) and (max-width: 991.98px){ /* MEDIUM ONLY */ }
@media screen and (max-width: 575.98px){ /* SMALL ONLY*/ }

/*! END OF LINE */