/*
Theme Name: BMLUS 1.2.0
Author URI: https://offo.studio
Author: offo.studio
Author URI: https://offo.studio
Description: BMLUS
Version: 1.2.0
License: ©2026 2026 BMLUS / offo.studio
*/


/** ========================================================================== RESET */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	-webkit-text-size-adjust: 100%;
	text-transform: none;
}
html {
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
ul {
	list-style-type: none !important;
	-webkit-margin-before: 0 !important;
	-webkit-margin-after: 0 !important;
	-webkit-padding-start: 0 !important;

}


/** ========================================================================== LOAD */

#loading {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 999999;
	overflow: hidden;	
}
#loading #loading_logo { 
	animation: rotate 2s infinite;
	width: auto;
	height: 100px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -50px;
	margin-top: -50px;
	padding: 0;
}
#loading #loading_logo img {
	width: auto;
	height: 100%;
}
@keyframes rotate {
	0% {
		transform: rotate(0);
	}
	100% {
		transform: rotate(360deg);
	}
}


/** ========================================================================== BASIC */

body {
	font-family: 'museo-slab', serif;
	font-size: 16px;
	text-transform: none;
	text-align: left;
	line-height: 1.5em;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0em;
	color: #141010;
	background:#fbfaf6;	
	
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
	
	-webkit-hyphenate-limit-chars: auto 3;
	-moz-hyphenate-limit-chars: auto 3;
	-ms-hyphenate-limit-chars: auto 3;
	hyphenate-limit-chars: auto 3;

	-webkit-hyphenate-limit-lines: 2;
	-moz-hyphenate-limit-lines: 2;
	-ms-hyphenate-limit-lines: 2;
	hyphenate-limit-lines: 2;
} 
.site {
	margin: 0 auto;
	padding: 0;
	background:#fbfaf6;
	overflow: hidden;
}
main {
	min-height: 100vh;
}
.lazy {
	background: #f0efed;
}
img.lazy {
	background: none;
	display: block;
}
.top {
	padding-top: 10rem;
}
.chap {
	padding-top: 4rem;
	padding-bottom: 2rem;
}
section {
	position: relative;
}
section.chap {
	padding-top: 64px;
	padding-bottom: 6rem;
}
.max { 
	max-width: 800px;
}
.maxx { 
	max-width: 1470px;	
	max-width: 1200px;	
}

 
/** ========================================================================== TYPO */

@font-face {
	font-family: 'OFFONT';
	font-style: normal;
	font-weight: 400;
	src: url("fonts/OFFONT-Regular.woff2") format("woff2"), url("fonts/OFFONT-Regular.ttf") format("truetype");
	font-display: swap;
}
::selection {
	background: #333;
	color:#fbfaf6;
}
::-moz-selection {
	background: #333;
	color:#fbfaf6;
}
h1, h2, h3, h4, .subtitle { 
	font: 700 normal 18px/1.2em "alternate-gothic-condensed-a", sans-serif;
	letter-spacing: 0.02em;
	padding-bottom: 1rem;
}
h1 { 
	text-transform: uppercase;
}
h1 span {
	display: inline;
}
h1, 
h2 { 	
	text-transform: uppercase;
}
p, ul, li {
	font: 400 normal 18px/1.4em 'museo-slab', serif;
	text-transform: none;
	padding-bottom: 1rem;
}
blockquote {
	padding: 1em 6em;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}
blockquote p {
	text-align: center;
}
li {
	padding-bottom: .5rem;
}
i, em {
	text-decoration: none;
	font-style: italic;
	font-weight: 400;
}
b, strong { 
	letter-spacing: 0.05em;
	font-weight: 700;
}
mark {
	background: none !important;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 2px;
	padding-bottom: 2px;
}
a {
	color: #141010;
	outline: none;
	text-transform: none;
	text-decoration: none;
	-webkit-transition-duration: 0.2s;
	-moz-transition-duration: 0.2s;
	-o-transition-duration: 0.2s;
	transition-duration: 0.2s;
	border: none;
}
a:hover {
	color: #bfc400;
	border: none;
	cursor: pointer;
}
p a {
	white-space: nowrap;
}
.text p {
	padding-bottom: 1.5rem;
}
.text p:last-of-type {
	padding-bottom: 0;
}
.text.l h1 {
	font-size: 80px;
	font-size: 96px;
	text-align: center;
	line-height: 1em;
	color: #c9d322;	
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
	padding-bottom: 2rem;
}
.text.l h2,
.text.l h3 {
	font-size: 40px;
	text-align: center;
	color: #141010;
}
.text.l .subtitle {
	font-size: 40px;
	text-align: center;
	text-transform: uppercase;
	margin-top: -2rem;
	padding-bottom: 2rem;
}
.text.l :is(p, ul, li) {
	font-size: 22px;
}
.text.l p {
	padding-bottom: 1em;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}
.text ul,
.text ol {
	padding-bottom: 1rem;
}
.text ol {
	margin-left: 2em;
}
.text ul li {
	list-style: none;
	padding-left: 1.5em;
}
.text ul li::before {
	display: inline-block;
	width: 1em;
 	margin-left: -1em;	
	content: "-";
}
.image { 
	height: auto;
	line-height: 1px;
	position: relative;
}
.image img {
	width: 100%;
	height: auto;
}


/* ========================================================================== MAIN NAVIGATION */

header,
#logo,
#logo img,
#main-navigation, 
#main-navigation li,
#main-navigation li a,
#main-navigation_bg
{
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
header {
	position: fixed;
	top: 0;
	width: 100%;
	height: auto;
	margin: auto;
	z-index: 99999;
	background: transparent;
}
header {
	pointer-events: none;
}
.menu-main-navigation-container {
	pointer-events: all;
}
#main-navigation_bg {
	background: transparent;
	width: 100%;
	height: 64px;
	box-sizing: border-box;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}
.small_nav #main-navigation_bg {
	background: #fbfaf6;
}
#branding {
	grid-column-end: span 2;
}
#main-navigation {
	grid-column-end: span 10;
}
#logo a:hover {
	border-bottom: none;
}
#logo {
	width: auto;
	max-width: 300px;
	height: auto;
	padding-top: 10px;
}
.menu-main-navigation-container,
.menu-main-navigation-customer-container {
	text-align: right;
}
#main-navigation ul {
	margin: 0;
	padding: 0;
	text-align: right;
}
#main-navigation li {
	line-height: 0;
	display: inline-block;
	padding: 0;
	position: relative;
}
#main-navigation li a {
	font-family: 'alternate-gothic-condensed-a', sans-serif;
	font-size: 18px;
	font-weight: 700;
	color: #141010;
	text-transform: uppercase;
	border-bottom: none;
	line-height: 60px;
	padding-left: 10px;
	padding-right: 10px;
	letter-spacing: 0.02em;
	display: block;
	border-top: 4px solid transparent;
}
#main-navigation a:hover,
#main-navigation .nav_active {
	color: #c9d322;
	cursor: pointer;
}
#main-navigation .nav_active {
	border-top: 4px solid #141010;
}
.home #main-navigation li a,
.page-id-468 #main-navigation li a {
	color: #fbfaf6;
}
.small_nav #main-navigation li a,
.home .small_nav #main-navigation li a,
.page-id-468 .small_nav #main-navigation li a {
	color: #141010;
	border-top: 4px solid transparent;
} 
.small_nav #main-navigation a:hover {
	color: #c9d322;
	border-top: 4px solid #fbfaf6;
	cursor: pointer;
}
.small_nav #main-navigation .nav_active {
	color: #c9d322;
	border-top: 4px solid #141010;
	cursor: pointer;
}
.small_nav #logo {
	width: auto;
	height: 60px;
}
.small_nav #logo {
	padding-top: 4px;
}
.small_nav #logo img {
	width: auto;
	height: 100%;
}
.small_nav :is(#main-navigation, #main-navigation li) {
	padding-top: 0;
	padding-bottom: 0;
}
#cta_wrap {
	text-align: center;
	pointer-events: auto !important;
	padding: 0 1em;
	margin-top: 4em;
	margin-bottom: 2em;
}
a.cta_button,
#main-navigation li.cta_button a {
	z-index: 9;
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 24px;	
	color: #F5F5F5;
	text-transform: uppercase;
	border: none;
	background-color: #05BEAF;
	height: 100%;
	display: block;
	border-radius: 50px !important;
	padding: .5em 2em !important;	
} 
a.cta_button:hover,
#main-navigation li.cta_button a:hover {
	cursor: pointer;
	color: #F5F5F5;
	background-color: #14284B;
	border: none;
	box-shadow: none !important;
}
.small_nav #main-navigation li.cta_button a:hover,
.small_nav #main-navigation li.cta_button a.nav_active {
	color: #fbfaf6;
	border: none;
	background-color: #14284B;

}


/** ========================================================================== FRONTPAGE */

#hero {
	width: 100vw;
	height: 70vh;
	position: relative;
	overflow: hidden;
	z-index: 9;
}
.postslider_inner,
.postslider_inner .background_image,
.background_image {
	background-position: center center;	
	background-repeat: no-repeat;
	background-size: cover;
	width: 100vw;
	height: 70vh;
	position: relative;
	z-index: 2;
}
.postslider_inner .front_image,
.postslider_inner .background_image {
	position: absolute;
	top: 0;
	left: 0;
}
.postslider_inner .front_image {
	background-size: 70%;
}
.postslider .top_content {
	height: auto;
	box-sizing: border-box;
	position: absolute;
	z-index: 9;
	top: 120px;
}
.postslider :is(h1, h2, p){
	font-size: 32px;
	line-height: 1.2em;
	font-weight: 700;
}
.postslider .style_video .video iframe,
.postslider .style_video .video video{
	width: 100vw;
	height: 56.25vw;
	min-height: 100vh;
	min-width: 177.77vh;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#values #values_slider .value,
#values #values_slider .value .content_image,
#values #values_slider .value .content_all {
	min-height: 50vh;
}
.value .text.l h2,
.value .text.l .subtitle {
	text-align: center;
	width: 75%;
    margin: 0 auto;	
}
.value .text.l h2 {
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
	padding-bottom: 0;
}
.value .text.l .subtitle {
	font-size: 24px;
	margin-top: .1em;
	color: #c3775b;
}
.value .text.l .values_number {
	color: #c3775b;
}
.value .text.l p {
	font-size: 18px;
}
.brewery .intro_image,
.brewery .intro_image .image {
	margin: 0;
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 100%;
	height: 50vh;
}
.brewery .brewery_address {
	padding-top: 4em;
}
.brewery_address strong {
	line-height: 1.2em;
	padding-bottom: 1em;
	color: #dbed83 !important;
}
.brewery_address :is(p, a) {
	font-family: 'alternate-gothic-condensed-a', sans-serif !important;
	letter-spacing: .05em;
	color: #fbfaf6 !important;
	padding-bottom: .5em;
}
.brewery .brewery_address .address_logo {
	width: 75%;
}
#brewery_singlemap svg {
	width: 100%;
	height: auto;
	box-sizing: border-box;
}
#brewery_singlemap .brewery_city { display: none;}
#herbsthaeuser-brauerei-wunderlich_C #brewery_singlemap #brewery_cities #bad_mergentheim.brewery_city { display: block;}
#dachsenfranz-biermanufaktur_C #brewery_singlemap #brewery_cities #zuzenhausen.brewery_city { display: block;}
#bauhoefer_C #brewery_singlemap #brewery_cities #renchen.brewery_city { display: block;}
#schimpf_C #brewery_singlemap #brewery_cities #neustetten.brewery_city { display: block;}
#gruibinger-bier_C #brewery_singlemap #brewery_cities #gruibingen.brewery_city { display: block;}
#hirsch-brauerei-honer_C #brewery_singlemap #brewery_cities #wurmlingen.brewery_city { display: block;}
#brauerei-clemens-haerle_C #brewery_singlemap #brewery_cities #leutkirch.brewery_city { display: block;}
#braeunlinger-loewenbraeu_C #brewery_singlemap #brewery_cities #braeunlingen.brewery_city { display: block;}
#tettnanger-krone_C #brewery_singlemap #brewery_cities #tettnang.brewery_city { display: block;}
#stolz_C #brewery_singlemap #isny.brewery_city { display: block;}

#brewery_singlemap #map_shape {
	animation: stroke_colorpulse 4s infinite;
	transform-origin: center;
}
@keyframes stroke_colorpulse {
	0% {
		stroke: #fbfaf6;
		stroke-width: 6;
	}
	50% {
		stroke: #dbed83;
		stroke-width: 6;
	}
	100% {
		stroke: #fbfaf6;
		stroke-width: 6;
	}
}
.brewery_url_container {
	display: none;
}
#lieblingsbier {
	border-bottom: 3px solid #fbfaf6;
}
#llb_date p {
	font: 700 normal 40px/1.2em "alternate-gothic-condensed-a", sans-serif;
	font-size: 32px;
	text-align: center;
	color: #fbfaf6;
}
#hop_container {
	width: 100%;
	border-top: 3px solid #fbfaf6;
}
#hop_svg {
	width: 100px;
	height: 100px;
	float: right;
}
#hop_svg #hop {
	fill: white;
}

.video_container {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
}
.video_iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* ========================================================================== PARTNER */

#partner {
	text-align: center;
	font-size: 0px;
	background: #141010;
}
#partner h1 {
	font-size: 40px;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}
.partner_logo {
	width: 25%;
	display: inline-block;
}
.partner_logo .image {
	padding: 10px;
}


/* ========================================================================== CONTACT */
#kontakt :is(i, em) {
	font-style: normal !important;
	font-size: 18px !important;
	line-height: 1em;
}
#kontakt p,
#adresses p {
	font-family: 'alternate-gothic-condensed-a', sans-serif !important;
}
#adresses {
	border-top: 2px solid #fbfaf6;
}
#adresses_content {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 2em;
	row-gap: 6em;
}

#adresses h3 {
	font-size: 24px;
	text-align: left;
}

/* ========================================================================== STICKER */

#sticker {
	position: absolute;
	top: 64px;
	right: 4.335vw;
	z-index: 999;
}
#sticker_box {
	display: table;
	width: 300px;
	height: 300px;
}
#sticker_content {
	display: table-cell;
	vertical-align: middle;	
	transform: rotate(3deg);
	box-shadow: 6px 7px 20px rgba(0,0,0,.7);
	border-radius: 8px;
	overflow: hidden;
}
#sticker_content.sticker_noimg {
	padding: 1em;
}
#sticker_content.sticker_img {
	padding: 0;
}

#sticker_content p {	
	font: 700 normal 24px/0.95em "alternate-gothic-condensed-a", sans-serif;
	letter-spacing: 0.02em;
	text-align: center;
	text-transform: uppercase;
}
#sticker_content p:last-child {
	padding-bottom: 0;
}
#sticker_content strong {
	font: 700 normal 40px/0.95em "alternate-gothic-condensed-a", sans-serif;
	letter-spacing: 0.02em;
	text-align: center;
	text-transform: uppercase;
	padding-bottom: 0;
}


/* ========================================================================== BLOG */

.blog_element:last-of-type {
	margin-bottom: 0;
}
.blog_element.odd .content_all,
.blog_element.even .content_image {
	float: right;
}
.blog_element.even .content_all,
.blog_element.odd .content_image {
	float: left;
}
.blog_element .content_all,
.blog_element .content_image {
	width: 50%;
	height: 40rem;
}
.blog_element .content_image {
	overflow: hidden;
}
.blog_element .content_all {
	padding-top: 0;
	display: table;
}
.blog_element .content_all_inner {
	display: table-cell ;
	vertical-align: middle;
}
.blog_element.even .content_all_inner {
	padding-left: 10vw;
	padding-right: 4.334%;
}
.blog_element.odd .content_all_inner {
	padding-left: 4.334%;
	padding-right: 16.667%;
}
.blog_element .image,
.blog_element .image_container {
	margin: 0;
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 100%;
	height: 100%;
}
.blog_element h1 {
	font-size: 29px;	
	padding-bottom: .5em;
	margin-bottom: 0;
}
.blog_element p {
	font-size: 22px;
}
.blog_element .video {
	height: 100%;
}
.blog_element video {
	max-width: unset !important;
	height: 100%;
	transform: translate(-25%, 0);
}
.blog_element .content_image {
	width: 40%;
}
.blog_element.even .content_image {
	padding-right: 10%;
}
.blog_element.odd .content_image {
	padding-left: 10%;
}


/** ========================================================================== TAB CONTENT */

.tab_nav_inner { 
	z-index: 10001;
}
#tabs_nav {
	z-index: 19;
}
#tabs_nav,
#tabs_nav .tab_nav_inner,
#tabs_nav .image {
	transition: all .2s ease;	
}
#tabs_nav .image {
	height: 80px;
	width: auto;
}

#tabs_nav .image,
#tabs_nav a.inactive:hover .image,
.brew_nav #tabs_nav a.inactive:hover .image {
	height: 80px;
	width: auto;
	padding: 1rem 0;
	transform: scale(1);
}
#tabs_nav .inactive .image {
	transform: scale(.8);
}
#tabs_nav .grid {
	grid-template-columns: repeat(5, 1fr);
	row-gap: 0;
}
#tabs_nav a {
	text-align: center;	
	box-sizing: border-box;
}
.brew_nav #tabs_nav .tab_nav_inner.is_stuck .grid {
	grid-template-columns: repeat(10, 1fr);
}
.brew_nav #tabs_nav .tab_nav_inner.is_stuck .image {
	width: 100%;
	height: auto;
}
.brew_nav #tabs_nav .tab_nav_inner.is_stuck a.inactive:hover .image {
	width: 100%;
	height: auto;
	transform: scale(.8);
}
.scroll-down.brew_nav .tab_nav_inner.is_stuck {
	transform: translate(0, -200px);
}
.brew_nav #tabs_nav .image {
	transform: scale(.6);
}
.brew_nav #tabs_nav .inactive .image {
	transform: scale(.6);
}


/* ========================================================================== image_w_overlay */

.image_w_overlay {
	position: relative;
}
.image_w_overlay,
.image_w_overlay .background,
.image_w_overlay .overlay {
	overflow: hidden;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}
.image_w_overlay .overlay {
	position: absolute;
	z-index: 99;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	opacity: 0;
}
#tabs_nav .inactive .image_w_overlay .overlay {
	opacity: 0;	
}
#tabs_nav .inactive .image_w_overlay .background {
	opacity: 1;	
}
#tabs_nav .image_w_overlay .overlay {
	opacity: 1;	
}
#tabs_nav .image_w_overlay .background {
	opacity: 0;	
}



/* ========================================================================== MAP */
#navmap svg {
	width: 100%;
	height: auto;
	box-sizing: border-box;	
}



/* ========================================================================== FOOTER NAVIGATION */

footer {
	padding-top: 0;
	padding-bottom: 40px;
	clear: both !important;
	width: 100%;
	height: auto;
	border-top: 1px solid #dbdbd3;
}
#footer_inner {
	margin-top: 20px;
}
#footer-navigation {
	padding-top: 2em;
}
#footer-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#footer-navigation li {
	line-height: 25px;
	box-sizing: border-box;
}
#footer-navigation li a {
	font-family: 'alternate-gothic-condensed-a', sans-serif;
	font-size: 18px;
	font-weight: 700;
	color: #dbdbd3;
	text-transform: uppercase;
	text-decoration: none;
	border: none;
	display: block;
}
#footer-navigation a:hover {
	color: #c9d322;
	cursor: pointer;
}
#footer-small {
	padding-top: 2rem;
}


/** ========================================================================== BUTTONS ETC */

.button, 
input[type="button"], 
.input.button,
input[type="submit"],
input.submit,
.edit {	
	font-family: 'alternate-gothic-condensed-a', sans-serif;
	font-size: 24px;
	font-style: normal;
	color: #fbfaf6;
	font-weight: 700;
	text-transform: uppercase;
	text-align: center;
	text-indent: 0;
	background-color: #c9d322;
	border: 3px solid #c9d322;
	margin-top: 0;
	margin-bottom: 1rem;
	border-radius: 8px;
   	width: 100%;
	display: inline-block;
	line-height: 1em;
	padding: 0.5em 2em;
	box-sizing: border-box;
	-webkit-transition-duration: 0.2s;
	-moz-transition-duration: 0.2s;
	-o-transition-duration: 0.2s;
	transition-duration: 0.2s;
	
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}
.button:hover, 
.button:active, 
.edit:hover, 
.edit:active,
input[type="button"]:hover, 
input[type="submit"]:hover, 
.wpcf7-submit:hover {
	border: 3px solid #141010;
	color:#fbfaf6;
	background-color: #141010;
	cursor: pointer;
}


/* ========================================================================== COLOR THEMES */

.ct-light,
.ct-light-rhubarb {
	background: #fbfaf6;
}
.ct-light-rhubarb .text.l h1,
.ct-light-rhubarb .value .text.l .subtitle {
	color: #c3775b;
}

.ct-dark {
	background: #1f1f1f;
}
.ct-dark :is(h1, h3){
	font-weight: 700;
}
.ct-dark,
.ct-dark :is(h1, h2, h3, p, a){
	color: #fbfaf6;
}

.ct-sandgreen,
.ct-sandgreen-white {
	background: #617569;
}
.ct-sandgreen,
.ct-sandgreen :is(h1, h2, h3, p, a, .text.l h1){
	color: #dbed83;
}
.ct-sandgreen-white,
.ct-sandgreen-white :is(h1, h2, h3, p, a, .text.l h1){
	color: #fbfaf6;
}
.ct-sandgreen p.wp-caption-text{
	color: #fbfaf6 !important;
}
.ct-sandgreen .button,
.ct-sandgreen a.button {
	color: #dbed83 !important;
	background-color: #617569;
	border-color: #dbed83;
}
.ct-sandgreen .button:hover,
.ct-sandgreen a.button:hover {
	color: #617569 !important;
	background-color: #dbed83;
	border-color: #dbed83;
}
.ct-sandblue,
.ct-sandblue-white {
	background: #3c6d79;
}
.ct-sandblue,
.ct-sandblue :is(h1, h2, h3, p, a, .text.l h1){
	color: #f9af65;
}
.ct-sandblue-white,
.ct-sandblue-white :is(h1, h2, h3, p, a, .text.l h1){
	color: #fbfaf6;
}
.ct-sandblue .button,
.ct-sandblue a.button {
	color: #f9af65;
	background-color: #3c6d79;
	border-color: #f9af65;
}
.ct-sandblue .button:hover,
.ct-sandblue a.button:hover {
	color: #3c6d79;
	background-color: #f9af65;
	border-color: #f9af65;
}

.ct-sandblue-white .button,
.ct-sandblue-white a.button {
	color: #fbfaf6;
	background-color: #3c6d79;
	border-color: #fbfaf6;
}
.ct-sandblue-white .button:hover,
.ct-sandblue-white a.button:hover {
	color: #3c6d79;
	background-color: #fbfaf6;
	border-color: #fbfaf6;
}


.ct-lightgreen-rhubarb {
	background: #dbed83;
}
.ct-lightgreen-rhubarb,
.ct-lightgreen-rhubarb :is(h1, h2, h3, p, a, .text.l h1){
	color: #c3775b;
}


/** ========================================================================== IMAGES */

img {
	width: 100%;
}
img,
a img,
.alignleft a,
.alignright a,
.aligncenter a,
.alignnone a {
	border: none !important;
}
p img {
	max-width: 100%;
}
.entry-content img,
.comment-content img,
.widget img {
	max-width: 100%;
}
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"] {
	height: auto;
}
img.size-full,
img.size-large,
img.header-image,
img.wp-post-image {
	max-width: 100%;
	height: auto;
}
.text.l p.image_content {
	padding-bottom: 0;
}
.image_wrapper.landscape,
.image_wrapper.square {
	width: 50%;
}
.image_wrapper.portrait {
	width: 36%;
}
.image_wrapper .wp-caption {
	width: 100% !important;
}
.image_wrapper.align_left {
	float: left;
	margin-right: 4.334%;
	margin-left: -25%;
}
.image_wrapper.align_right {
	float: right;
	margin-left: 4.334%;
	margin-right: -25%;
}
.image_wrapper.align_center {
	width: 70%;
	display: block;
	margin: 1em auto;	
}
.image_wrapper.align_none {
	width: 100%;
	display: block;
	margin: 1em auto;	
}
.image_wrapper img {
	width: 100%;
	max-width: 100%;
	height: auto;
	margin-top: 0;
	margin-left: 0;
	box-sizing: border-box;
	border-radius: 4px;
}
.wp-caption-text {
	font-family: 'alternate-gothic-condensed-a', sans-serif !important;
	font-size: 18px !important;
	letter-spacing: .05em;
	border: none;
	padding-top: .5em;
	padding-bottom: 1em;
}
.image_wrapper p {
	padding-top: 0;
	padding-bottom: 0;
}
.image_wrapper.align_left .wp-caption-text,
.image_wrapper.align_center .wp-caption-text {
	text-align: right;
	padding-left: 2em;
}
.image_wrapper.align_right .wp-caption-text {
	text-align: left;
	padding-right: 2em;
}
embed,
iframe,
object,
video {
	max-width: 100%;
}
iframe{
	width: 100%;
}


/* ========================================================================== INSTAGRAM FEED */

.sb_instagram_header,
.sbi_follow_btn,
.sbi_lightbox_carousel_icon,
#sbi_load {
	display: none !important;
}


/* ========================================================================== INSTAGRAM LINKTREE*/

#insta_page :is(h1, h2, p){
	text-align: center;
}
#insta_page ul {
	list-style: none;
}
#insta_page li a {
	font-family: 'alternate-gothic-condensed-a', sans-serif;
	font-size: 24px;
	font-style: normal;
	color: #fbfaf6;
	font-weight: 700;
	text-transform: uppercase;
	text-align: center;
	text-indent: 0;
	background-color: #c9d322;
	border: 3px solid #c9d322;
	margin-top: 0;
	margin-bottom: 1rem;
	border-radius: 8px;
   	width: 100%;
	display: inline-block;
	line-height: 1em;
	padding: 0.5em 2em;
	box-sizing: border-box;
	-webkit-transition-duration: 0.2s;
	-moz-transition-duration: 0.2s;
	-o-transition-duration: 0.2s;
	transition-duration: 0.2s;
}
#insta_page li a:hover {
	border: 3px solid #141010;
	color:#fbfaf6;
	background-color: #141010;
	cursor: pointer;
}
.insta_page header,
.insta_page footer {
	display: none;	
}
.insta_page #logo {
    width: 100px;
    height: auto;
	margin: 0 auto;
    padding-bottom: 10px;
}


/** ========================================================================== CMPLZ COOKIE INFO */

.cmplz-cookiebanner .cmplz-message p {font-size: 12px !important;}
#cmplz-manage-consent {display: none !important;}


/* ========================================================================== RESPONSIVE */
 

@media only screen and (max-width: 1200px) { 

	.blog_element .text.l :is(p, ul, li) {
		font-size: 18px;
	}
	.blog_element .content_all, .blog_element .content_image {
		height: 34rem;
	}
	.scroll-down.brew_nav .tab_nav_inner.is_stuck {
		transform: translate(0, -200px);
	}
	#brauereien .c8 {
		width: 83.3334%;
	}
	#adresses_content {
		grid-template-columns: repeat(2, 1fr);
	}	
	#brewery_contact_block.c6 {
		width: 75%;
	}
	#brauereien .c8 {
		width: 60vw;
	}
	.image_wrapper.landscape, .image_wrapper.square {
		width: 40%;
	}	
	.image_wrapper.portrait {
		width: 27%;
	}
	.image_wrapper.align_left {
		margin-left: -16.667%;
	}
	.image_wrapper.align_right {
		margin-right: -16.667%;
	}
	
}


@media only screen and (max-width: 1024px) { 
		
	#logo {
		width: 50%;
	}
	#main-navigation li a, #main-navigation .sub-menu li a {
		font-size: 16px;
	}
	.text.l h2, .text.l h3 {
		font-size: 32px;
	}
	.text.l :is(p, ul, li) {
		font-size: 18px;
	}
	.blog_element .content_all, .blog_element .content_image {
		height: 34rem;
	}
	#tabs_nav .grid,
	.brew_nav #tabs_nav .tab_nav_inner.is_stuck .grid {
		grid-template-columns: repeat(5, 1fr);
	}
	.scroll-down.brew_nav .tab_nav_inner.is_stuck {
		transform: translate(0, -400px);
	}
	#tabs_nav .image, #tabs_nav a.inactive:hover .image, .brew_nav #tabs_nav a.inactive:hover .image {
		height: 80px;
		width: auto;
	}
	#willkommen .c6 {
		width: 75%;
	}	
	#brewery_contact_block.c6 {
		width: 100%;
	}
	#lieblingsbier.c10 {
		width: calc(100vw - 33%);
	}
	.partner_logo {
		width: 25%;
	}
	#navmap {
		width: 75%;
	}

}


@media only screen and (max-width: 768px) { 
		
	.small_nav #logo {
		width: auto;
		height: 40px;
	    padding-top: 14px;
	}
	h1, h2, h3, h4 {
		font-size: 32px;
	}	
	.text.l h1 {
		font-size: 54px;
	}
	.text.l .subtitle,
	.text.l h2 {
		font-size: 32px;
	}
	.text.l p {
		font-size: 18px;
	}
	footer {
		padding-bottom: 200px;
	}
	#main_inner {
		padding-bottom: 0;
	}	
	#willkommen .c6,
	#navmap,
	#lieblingsbier.c10 {
		width: 100%;
		padding-left: 5%;
	    padding-right: 5%;
	}
	footer {
		height: auto;
		padding-bottom: 100px;
	}
	footer .c2,
	footer .c4,
	footer .c6 {
		width: 100%;
		clear: both;
	}
	#footer_navigation {
		clear: both;
		margin-top: 1em;
	}
	.modal_wrapper {
		left: 5vw !important;
		width: 90vw !important;
		height: 90vh !important;
	}
	#tabs_nav .grid {
		grid-template-columns: repeat(2, 1fr);
	}
	#tabs_nav .image, #tabs_nav a.inactive:hover .image, 
	.brew_nav #tabs_nav a.inactive:hover .image {
		height: auto;
   		width: 70%;
	}
	#brewery_singlemap {
		display: none;
	}
	.brewery .brewery_address {
		text-align: center;
		padding-top: 0;
		padding-bottom: 2em;
		grid-column-end: span 12 !important;
	}
	.brewery .brewery_address .address_logo {
		width: 50%;
		margin: 0 auto;
	}
	.brewery .title_wrapper {
		padding-top: 1rem;
		position: relative;
		z-index: 99;
	}
	.brewery .text.l .title_wrapper.is_stuck h1 {
		font-size: 24px;
		padding-left: 14vw;
		padding-right: 14vw;
	}	
	.brewery .title_wrapper.is_stuck .subtitle {
		font-size: 16px;		
		padding: 0 15vw 4px 15vw;
	}
	#brauereien .c10 {
		width: 100%;
	}
	#brauereien .c8 {
		width: 80vw;
	}
	.blog_element {
		margin-bottom: 4em;
	}
	.blog_element.odd .content_all,
	.blog_element.even .content_image,
	.blog_element.even .content_all,
	.blog_element.odd .content_image {
		float: none;
	}
	.blog_element .content_all,
	.blog_element .content_image {
		width: 100%;
	}
	.blog_element.odd .content_image,
	.blog_element.even .content_image {
		max-height: 30vh;
		padding-left: 0;
		padding-right: 0;
	}
	.blog_element .content_all {
		padding-top: 2em;
		display: block;
		height: auto;
	}
	.blog_element .content_all_inner {
		display: block;
	}
	.blog_element.even .content_all_inner,
	.blog_element.odd .content_all_inner {
		padding-left: 1vw;
		padding-right: 1vw;
	}
	.blog_element.odd .button_wrapper,
	.blog_element.even .button_wrapper {
		text-align: center;
	}
	.blog_element.odd h1,
	.blog_element.even h1 {
		text-align: left;
	}
	.blog_element .text {
		padding: 0 4.166%;
	}
	.value .text.l h2,
	.value .text.l .subtitle {
		text-align: center;
	}
	.image_wrapper.landscape {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	.image_wrapper.square,
	.image_wrapper.portrait {
		width: 75%;
		margin-left: auto;
		margin-right: auto;	
	}
	.image_wrapper.align_left,
	.image_wrapper.align_right,
	.image_wrapper.align_center {
		float: none;
	}
	.image_wrapper.align_left .wp-caption-text,
	.image_wrapper.align_right .wp-caption-text {
		text-align: left;
	}
	.partner_logo {
		width: 50%;
	}
	.wp-caption-text {
    	font-size: 16px !important;
		text-align: left !important;
		padding-left: 0 !important;
	}
	
}

@media only screen and (max-width: 600px) {
	
	#logo {
		width: 160px;
		padding-top: 1rem;
		padding-left: 1rem;
	}	
	#fixhead,
	.small_nav #fixhead {
		height: 60px;
	}
	.small_nav #logo {
		padding-top: 8px;
	}
	.top {
		padding-top: 14rem;
	}
	#sticker {
		top: 160px;
	}
	#brauereien .c8 {
		width: 100%;
	}
	#adresses_content {
		grid-template-columns: repeat(1, 1fr);
		row-gap: 2em; 
	}
	footer {
		height: auto;
		margin-top: 0;
	}
	#main_inner {
		padding-bottom: 0;
	}
	#footer-navigation,
	#footer-navigation li {
		width: 100%;
		text-align: center;
	}
	#footer-navigation li a {
		font-size: 14px;
		line-height: 40px;
	}
	#footer-navigation::before,
	#footer-navigation::after {
		content: " ";
		display: table;
	} 
	#footer-navigation::after {
		clear: both;
	}
	#footer_inner #c {
		text-align: left;
		padding-top: 2em;
	}
	
}