:root {
  --yellow-neon: #F1F600;
  --yellow-bg: #EDE5C5;
--black: #292b2c;
--white: #f9f7f6;

--extra-small: 0.85rem;
  --small: 1rem;
  --medium: 1.25rem;
  --medium-large: 1.5rem;
  --large: 2.5rem;
  --xlarge: 3.5rem;
  --xxlarge: 4rem;
  --huge: 7rem;
}

/* Font Rafale */
@font-face {
    font-family: 'Rafale';
    src: url('/fileadmin/inhalte/ausstellungsseite-hosen/Rafale_BG.otf') format("opentype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Rafale2';
    src: url('/fileadmin/inhalte/ausstellungsseite-hosen/Rafale_RU.otf') format("opentype");
    font-weight: 400;
    font-style: normal;
}



h1 {
font-family: 'Rafale';
color: var(--yellow-neon);
font-size: var(--huge);
-webkit-text-stroke: 1.2px var(--black);
text-align: center;
margin-top: var(--large);
line-height: 0.9;
}


h2 {
font-family: 'Rafale';
font-size: var(--xlarge);
margin-top: var(--large);
margin-bottom: var(--large);
}

h3, h4 {
font-family: 'Rafale';
}


#events-calendar h4 {
font-size: var(--medium-large);
}

HEADER .date {
display: block;
text-align: center;
margin-bottom: var(--large);
}

.product-teaser.button {
justify-content: center;
  display: flex;
}

.btn.btn-primary,
.btn.btn-default.more {
background-color: var(--yellow-neon) !important;
color: var(--black);
border: 1px solid var(--black) !important;
}

#info .btn.btn-primary,
#publikation .btn.btn-primary,
#catalogue .btn.btn-primary {
background-color: var(--white) !important;
margin-top: var(--medium-large);
}


.btn.btn-primary:hover,
.btn.btn-default.more:hover,
#info .btn.btn-primary:hover,
#publikation .btn.btn-primary:hover,
#catalogue .btn.btn-primary:hover {
background-color: transparent !important;
color: var(--black);
border: 1px solid var(--black) !important;
box-shadow: none !important;
  transform: none !important;
}

.content span.large {
font-size: 1.471em;
  line-height: 1.296em;
margin-top: var(--large);
display: inline-block;
}

#info .section-content,
#publikation .section-content,
#catalogue .section-content {
background-color: var(--yellow-neon) !important;
padding-top: var(--large);
padding-bottom: var(--large);
margin-bottom: var(--large);
}

.block-address-info,
.block-opening-times {
margin-bottom: var(--medium-large);
margin-top: var(--medium-large);
}

/* Kleidertausch */
#c50570 > .row > .col-md-6.col-12:first-of-type,
#c50592 > .row > .col-md-6.col-12:first-of-type,
#c50699 > .row > .col-md-6.col-12:first-of-type,
#c50705 > .row > .col-md-6.col-12:first-of-type {
    max-width: 150px;
}

@media only screen and (min-width: 769px) {
#c50570 > .row > .col-md-6.col-12:first-of-type,
#c50592 > .row > .col-md-6.col-12:first-of-type,
#c50699 > .row > .col-md-6.col-12:first-of-type,
#c50705 > .row > .col-md-6.col-12:first-of-type  {
flex: 0 0 20%;
    max-width: 20%;
}

#c50570 > .row > .col-md-6.col-12:last-of-type,
#c50592 > .row > .col-md-6.col-12:last-of-type.
#c50699 > .row > .col-md-6.col-12:last-of-type,
#c50705 > .row > .col-md-6.col-12:last-of-type  {
flex: 0 0 80%;
    max-width: 80%;
align-items: center;
  display: flex;
}

#c50570 .ce-gallery,
#c50592 .ce-gallery.
#c50699 .ce-gallery,
#c50705 .ce-gallery {
margin-bottom: 0;
}
}

/* Bildergalerie */
.gallery-container {
background-color: var(--yellow-bg);
}

.gallery-sly .item {
height: auto !important;
}

/* Kalender 
.tag-1 {
background-color: var(--yellow-bg);
}*/

/* Hosen BG */
#content {
background-image: url("/fileadmin/inhalte/ausstellungsseite-hosen/img/hose1.svg");
  background-repeat: no-repeat;
  background-position: 110% 0;
  background-size: 50%;
}

#ueber-die-ausstellung .section-content,
#about-the-exhibition .section-content {
background-image: url("/fileadmin/inhalte/ausstellungsseite-hosen/img/hose4.svg");
  background-repeat: no-repeat;
  background-position: 102% 40%;
  background-size: auto 80%;
}

.gallery-container {
background-image: url("/fileadmin/inhalte/ausstellungsseite-hosen/img/hose3.svg");
  background-repeat: no-repeat;
  background-position: -5% 40%;
  background-size: auto 80%;
}

#rahmenprogramm .section-content,
#accompanying-programme .section-content {
background-image: url("/fileadmin/inhalte/ausstellungsseite-hosen/img/hose5.svg"), url("/fileadmin/inhalte/ausstellungsseite-hosen/img/hose6.svg");
  background-repeat: no-repeat;
  background-position: 102% 100px, -5% 1200px;
  background-size: auto 600px, auto 550px;
}

@media only screen and (max-width: 768px) {
#content,
#ueber-die-ausstellung .section-content,
#about-the-exhibition .section-content,
.gallery-container,
#rahmenprogramm .section-content,
#accompanying-programme .section-content {
  background-size: 100%;
}

#info .section-content {
padding: 20px;
}

.section-content h2 {
display: none;
}

h1 {
font-size: var(--xxlarge);
}

}



/* Gallery mobile */
@media (max-width: 768px) {
  .gallery-sly .item .img-fluid {
    max-height: none;
  }

.gallery-sly .item {
height: 500px !important;
  width: auto !important;
}
}