/*
Theme Name: Stadtblick
Author: Lopar Media GmbH
Author URI: https://lopar-media.ch/
*/

@font-face {
font-family:'ABCMonumentGrotesk';
src: url('assets/fonts/ABCMonumentGrotesk-Medium.woff2') format('woff2'),
     url('assets/fonts/ABCMonumentGrotesk-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  }
      



:root {

  --h1-fs: 94px;
  --h1-lh: 94px;
  --h1-ls: 0px;

  --h2-fs: 44px;
  --h2-lh: 50px;
  --h2-ls: 0px;

  --lauftext-fs: 24px;
  --lauftext-lh: 28px;
  --lauftext-ls: 0px;

  --info-fs: 20px;
  --info-lh: 25px;
  --info-ls: 0px;

  --footer-fs: 16px;
  --footer-lh: 20px;
  --footer-ls: 0px;

}

@media (max-width: 767.98px) {

  :root {
    --h1-fs: 39px;
    --h1-lh: 39px;
    --h1-ls: 0px;

    --h2-fs: 24px;
    --h2-lh: 28px;
    --h2-ls: 0px;

    --lauftext-fs: 17px;
    --lauftext-lh: 21px;
    --lauftext-ls: 0px;

    --info-fs: 17px;
    --info-lh: 21px;
    --info-ls: 0px;

    --footer-fs: 18px;
    --footer-lh: 21px;
    --footer-ls: 0px;
  }
}

body {
  font-family:'ABCMonumentGrotesk';
  font-size: var(--lauftext-fs);
  line-height: var(--lauftext-lh);
  letter-spacing: var(--laufschrift-ls);
  font-weight: 500;
  color: #000000;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

body.page-id-120 {
	background-color: #E0E5DD;
}
.logo {
  width: 570px;
}

@media (max-width: 767.98px) {
  .logo {
    width: 244px;
  }
}

footer {
  font-size: var(--footer-fs);
  line-height: var(--footer-lh);
  letter-spacing: var(--footer-ls);
}

h1, .h1 {
  font-size: var(--h1-fs);
  line-height: var(--h1-lh);
  letter-spacing: var(--h1-ls);
  margin-bottom: 0;
}

h2, .h2 {
  font-size: var(--h2-fs);
  line-height: var(--h2-lh);
  letter-spacing: var(--h2-ls);
}

.py-5 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
}

.info {
  font-size: var(--info-fs);
  line-height: var(--info-lh);
  letter-spacing: var(--info-ls);

}

.navbar-toggler {
  right: 25px;
  top: 21px;
  padding: 0;
  border: none;
}


.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 79 63'%3E%3C!-- Generator: Adobe Illustrator 29.5.1, SVG Export Plug-In . SVG Version: 2.1.0 Build 141) --%3E%3Cdefs%3E%3Cstyle%3E .st0 %7B fill: none; stroke: %23000; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cpath class='st0' d='M0,1h79'/%3E%3Cpath class='st0' d='M0,32.2h79'/%3E%3Cpath class='st0' d='M0,62h79'/%3E%3C/svg%3E");
  background-repeat: no-repeat no-repeat;
  background-position: center center;
  background-size: cover;
  width: 75px;
  height: 60px;
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 66 65'%3E%3Cdefs%3E%3Cstyle%3E .st0 %7B fill: none; stroke: %23000; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cpath class='st0' d='M.8,1.5l64,62'/%3E%3Cpath class='st0' d='M64.8,1.5L.7,63.5'/%3E%3C/svg%3E");
}



@media (max-width: 767.98px) {
  .navbar-toggler-icon {
    width: 38px;
    height: 30px;
	background-size: contain;
	background-image: url("data:image/svg+xml,%3Csvg width='23' height='20' viewBox='0 0 23 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 1H22.6028' stroke='black' stroke-width='2'/%3E%3Cpath d='M0 9.92031H22.6028' stroke='black' stroke-width='2'/%3E%3Cpath d='M0 18.4528H22.6028' stroke='black' stroke-width='2'/%3E%3C/svg%3E%0A");
  }
	
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 66 65'%3E%3C!-- Generator: Adobe Illustrator 29.5.1, SVG Export Plug-In . SVG Version: 2.1.0 Build 141) --%3E%3Cdefs%3E%3Cstyle%3E .st0 %7B fill: none; stroke: %23000; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Cpath class='st0' d='M.8,1.5l64,62'/%3E%3Cpath class='st0' d='M64.8,1.5L.7,63.5'/%3E%3C/svg%3E");
}

  .navbar-toggler {
    top: 16px;
    right: 12px;
  }
}

.navbar-toggler:focus {
  box-shadow: none;
}

.navbar {
  --bs-navbar-padding-y: 0;
}

.navbar-nav {
    --bs-nav-link-padding-x: 0;
    --bs-nav-link-padding-y: 0.5rem;eight: ;
    --bs-nav-link-color: #000;
    --bs-nav-link-hover-color: var(--bs-navbar-hover-color);
    --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color);
}

.navbar-collapse.collapsing {
  height: auto !important;
  transition: none !important;
  overflow: hidden;
}

.menu-item {
  padding-right: .25rem !important;
  padding-left: .25rem !important;
  border-top: 2px solid #000;
}

.menu-item:hover {
  background-color: #E0E5DD;
}

.btn {
  --bs-btn-padding-x: 20px;
  --bs-btn-padding-y: 10px;
  --bs-btn-font-family: ;
  --bs-btn-font-size: var(--laufschrift-fs);
  --bs-btn-font-weight: 500;
  --bs-btn-line-height: var(--laufschrift-lh);
  --bs-btn-border-width: 2px;
}


.btn-light {
  --bs-btn-color: #6B1B31;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #762C34;
  --bs-btn-border-color: #762C34;
  --bs-btn-hover-color: #fff;
}

.btn-dark {
	--bs-btn-color: #fff;
	--bs-btn-bg: #000000;
	--bs-btn-border-color: #000000;
	--bs-btn-hover-color: #000;
	--bs-btn-hover-bg: #E0E5DD;
	--bs-btn-hover-border-color: #E0E5DD;
	--bs-btn-focus-shadow-rgb: 66, 70, 73;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #4d5154;
	--bs-btn-active-border-color: #373b3e;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: #000000;
	--bs-btn-disabled-border-color: #000000;
}

.btn-outline-dark {
    --bs-btn-color: #212529;
    --bs-btn-border-color: #212529;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #E0E5DD;
    --bs-btn-hover-border-color:#E0E5DD;
    --bs-btn-focus-shadow-rgb: 33, 37, 41;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #212529;
    --bs-btn-active-border-color: #212529;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #212529;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #212529;
    --bs-gradient: none;
}

.bg-grau {
  background-color: #E0E5DD;
}

.bg-weinrot {
  background-color: #762C34;
  color: #fff;
}

.text-grau {
  color: #ABAEA7;
}

.text-rosa {
  color: #D7A2AA;
}

ul {
  list-style: none;
  padding-left: 0;
}

.sticky-top {
  top: 101px;
}


@media (max-width: 767.98px) {
  .sticky-top {
    top: 61px;
  }
}




.flickity-button {
    position: absolute;
    background: transparent;
    border: none;
    color: #333;
}

.flickity-prev-next-button.next {
    right: 20px;
    background-image: url("data:image/svg+xml,%3Csvg width='66' height='47' viewBox='0 0 66 47' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30.0499 47L42.7812 33.9338C44.3767 32.24 46.5291 30.3627 48.3989 28.5771C45.3075 28.6689 42.4986 28.6689 40.5374 28.6689H0V18.5146H40.5374C42.5069 18.5146 45.2161 18.5146 48.3989 18.6064C46.4294 16.7291 44.3767 14.6599 42.5983 12.7742L30.1496 0H44.1025L66.0083 23.4958L44.1025 46.9917H30.0582L30.0499 47Z' fill='black'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: cover;

}

.bg-weinrot .flickity-prev-next-button.next {
    right: 20px;
    background-image: url("data:image/svg+xml,%3Csvg width='66' height='47' viewBox='0 0 66 47' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30.0499 47L42.7812 33.9338C44.3767 32.24 46.5291 30.3627 48.3989 28.5771C45.3075 28.6689 42.4986 28.6689 40.5374 28.6689H0V18.5146H40.5374C42.5069 18.5146 45.2161 18.5146 48.3989 18.6064C46.4294 16.7291 44.3767 14.6599 42.5983 12.7742L30.1496 0H44.1025L66.0083 23.4958L44.1025 46.9917H30.0582L30.0499 47Z' fill='white'/%3E%3C/svg%3E ");
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: cover;
}

.flickity-prev-next-button.previous {
    left: 20px;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 66 47'%3E%3C!-- Generator: Adobe Illustrator 29.3.1, SVG Export Plug-In . SVG Version: 2.1.0 Build 151) --%3E%3Cpath d='M36,0l-12.7,13.1c-1.6,1.7-3.7,3.6-5.6,5.4,3.1,0,5.9,0,7.9,0h40.5v10.2H25.5c-2,0-4.7,0-7.9,0,2,1.9,4,3.9,5.8,5.8l12.4,12.8h-14S0,23.5,0,23.5L21.9,0h14S36,0,36,0Z'/%3E%3C/svg%3E ");
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: cover;
}

.bg-weinrot .flickity-prev-next-button.previous {
    left: 20px;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 66 47'%3E%3Cdefs%3E%3Cstyle%3E .st0 %7B fill: none; %7D .st1 %7B fill: %23fff; %7D .st2 %7B clip-path: url(%23clippath); %7D %3C/style%3E%3CclipPath id='clippath'%3E%3Crect class='st0' x='0' y='0' width='66' height='47'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg class='st2'%3E%3Cpath class='st1' d='M36,0l-12.7,13.1c-1.6,1.7-3.7,3.6-5.6,5.4,3.1,0,5.9,0,7.9,0h40.5v10.2H25.5c-2,0-4.7,0-7.9,0,2,1.9,4,3.9,5.8,5.8l12.4,12.8h-14S0,23.5,0,23.5L21.9,0h14S36,0,36,0Z'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: cover;
}



.flickity-button:hover {
    background-color: transparent;
    cursor: pointer;
}

.flickity-prev-next-button.previous {
    left: 20px;
}

.flickity-prev-next-button svg {
  display: none;
}

.flickity-prev-next-button {
    top: 101%;
    width: 66px;
    height: 47px;
    border-radius: 0;
    transform: translateY(50%);
}

@media (max-width: 767.98px) {
  .flickity-prev-next-button {
    width: 32px;
    height: 21px;
  }
}

.bg-img {

  overflow: hidden;
  width: 100%;
  position: relative;
}

img.bg-image {
    animation: moveLeftRight 10s infinite alternate ease-in-out;
}

.bg-image {
  height: 65vh;
  width: 120%;
  z-index: 0;
	position: relative;
	left: -5%;
  object-fit: cover;
}

@media (max-width: 767.98px) {
  .bg-image {
    height: 75vh;
   
  }
}

@keyframes moveLeftRight{
  0% {
    transform: translateX(-2.5%);
  }
  100% {
    transform: translateX(2.5%);
  }
}


@media (min-width: 992px) {
	.py-lg-5 {
		padding-top: 5rem !important;
		padding-bottom: 5rem !important;
	}
}

.page-id-120 .wp-block-heading a {
  color: black;
  text-decoration: none;
}

