.wpcf7 .screen-reader-response {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
word-wrap: normal !important;
}
.wpcf7 form .wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid #00a0d2; }
.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
display: none;
}
.wpcf7 form.sent .wpcf7-response-output {
border-color: #46b450; }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
border-color: #dc3232; }
.wpcf7 form.spam .wpcf7-response-output {
border-color: #f56e28; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: #ffb900; }
.wpcf7-form-control-wrap {
position: relative;
}
.wpcf7-not-valid-tip {
color: #dc3232; font-size: 1em;
font-weight: normal;
display: block;
}
.use-floating-validation-tip .wpcf7-not-valid-tip {
position: relative;
top: -2ex;
left: 1em;
z-index: 100;
border: 1px solid #dc3232;
background: #fff;
padding: .2em .8em;
width: 24em;
}
.wpcf7-list-item {
display: inline-block;
margin: 0 0 0 1em;
}
.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
content: " ";
}
.wpcf7-spinner {
visibility: hidden;
display: inline-block;
background-color: #23282d; opacity: 0.75;
width: 24px;
height: 24px;
border: none;
border-radius: 100%;
padding: 0;
margin: 0 24px;
position: relative;
}
form.submitting .wpcf7-spinner {
visibility: visible;
}
.wpcf7-spinner::before {
content: '';
position: absolute;
background-color: #fbfbfc; top: 4px;
left: 4px;
width: 6px;
height: 6px;
border: none;
border-radius: 100%;
transform-origin: 8px 8px;
animation-name: spin;
animation-duration: 1000ms;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@media (prefers-reduced-motion: reduce) {
.wpcf7-spinner::before {
animation-name: blink;
animation-duration: 2000ms;
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes blink {
from {
opacity: 0;
}
50% {
opacity: 1;
}
to {
opacity: 0;
}
}
.wpcf7 [inert] {
opacity: 0.5;
}
.wpcf7 input[type="file"] {
cursor: pointer;
}
.wpcf7 input[type="file"]:disabled {
cursor: default;
}
.wpcf7 .wpcf7-submit:disabled {
cursor: not-allowed;
}
.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
direction: ltr;
}
.wpcf7-reflection > output {
display: list-item;
list-style: none;
}
.wpcf7-reflection > output[hidden] {
display: none;
}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, font, 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 {
background: transparent;
border: 0;
margin: 0;
padding: 0;
}
h1, h2, h3, h4, h5, h6 {
clear: both;
}
ol, ul {
list-style: none;
}
blockquote {
quotes: none;
}
blockquote:before, blockquote:after {
content: none;
}
del {
text-decoration: line-through;
}
table {
border-spacing: 0;
}
a img {
border: none;
}
img {
vertical-align: middle;
}
a {
color: #7E8800;
}
a:hover {
color: #7E8800;
}
.clear {
clear: both;
}  @font-face {
font-display: swap; font-family: 'Georama';
font-style: normal;
font-weight: 300;
src: url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-300.eot); src: url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-300.eot?#iefix) format('embedded-opentype'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-300.woff2) format('woff2'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-300.woff) format('woff'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-300.ttf) format('truetype'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-300.svg#Georama) format('svg'); } @font-face {
font-display: swap; font-family: 'Georama';
font-style: normal;
font-weight: 500;
src: url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-500.eot); src: url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-500.eot?#iefix) format('embedded-opentype'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-500.woff2) format('woff2'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-500.woff) format('woff'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-500.ttf) format('truetype'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-500.svg#Georama) format('svg'); } @font-face {
font-display: swap; font-family: 'Georama';
font-style: normal;
font-weight: 700;
src: url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-700.eot); src: url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-700.eot?#iefix) format('embedded-opentype'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-700.woff2) format('woff2'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-700.woff) format('woff'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-700.ttf) format('truetype'), url(//www.huabn-theater.at/wp-content/themes/huabn/fonts/georama-v8-latin-700.svg#Georama) format('svg'); }
body {
font-size:1em;
line-height:1.6;
font-family: 'Georama', sans-serif;
font-weight: 300;
}
strong, b {
font-weight: 700;
} html {
scroll-behavior: smooth;
}
body {
background:#fff url(//www.huabn-theater.at/wp-content/themes/huabn/images/bg.jpg) repeat center top;
background-size:100px 100px;
-webkit-text-size-adjust: none;
text-size-adjust: none;
color:#72442A;
}
h1, h2, h3, h4, h5, h6 {
clear: both;
line-height: 1.2;
font-weight:500;
}
h1 {
font-size: 2rem;
padding-bottom:0.75rem;
margin-bottom: 0.75rem;
text-align: center;
color:#7E8800;
text-transform: uppercase;
}
h2 {
font-size: 1.625rem;
margin: 1rem 0 0.75rem 0;
}
h3 {
font-size: 1.375rem;
margin: 1rem 0 0.75rem 0;
}
h4 {
font-size: 1.25rem;
margin: 1rem 0 0.75rem 0;
}
h5 {
font-size: 1.125rem;
margin: 1rem 0 0.75rem 0;
}
hr {
width:100%;
border-top: 1px solid #72442A;
border-bottom: none;
clear: both;
height: 0;
margin: .75rem 0;
padding: 0;
}
img {
max-width: 100%;
height: auto;
}
.alignleft {
float:left;
margin: 0 1em 1em 0;
}
.alignright {
float:right;
margin: 0 0 1em 1em;
}
.aligncenter, .center {
text-align:center;
display:block;
margin-left:auto;
margin-right:auto;
}
.color1 {color:#9E5426; color:rgba(158, 84, 38,1)}
.color2 {color:#7E8800; color:rgba(126, 136, 0,1)}
.color3 {color:#72442A; color:rgba(114, 68, 42,1)}
.color4 {color:#B81B36; color:rgba(184, 27, 54,1)}
.hellbraun {color:#9E5426;}
.gruen {color:#7E8800;}
.braun {color:#72442A;}
.rot {color:#B81B36;}
a.arrow-down {
width: 2rem;
height: 2rem;
margin: 1rem auto;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/arrow-down.svg) no-repeat center 0;
background-size:100% auto;
transition: .2s;
display: block;
}
a.arrow-down:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/arrow-down.svg) no-repeat center .25rem;
background-size:100% auto;
} .content-center,
.footer-center{
min-width:18rem;
width: 90%;
margin:0 5%;
}
.header-center,
.full-center {
min-width:20rem;
width: 100%;
}
@media screen and (min-width: 80rem) {
.content-center {
width: 72rem;
margin:0 auto;
}
.header-center,
.full-center {
width: 80rem;
margin:0 auto;
}
}
@media screen and (min-width: 88.8888rem) {
.footer-center {
width: 80rem;
margin:0 auto;
}
}
.divider {
width: 13.125rem;
height:2rem;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/divider.svg) no-repeat center center;
background-size:cover;
margin: 2rem auto 1rem;
}
.divider-top .divider {
margin: 2rem auto 0;
}
.divider-bottom .divider {
margin: 0 auto 2rem;
}
.divider-none .divider {
margin: 0 auto 0;
}
.divider-big .divider {
margin: 4rem auto 4rem;
} .site-header {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/bg-header.svg) no-repeat right 1rem;
background-size: 5rem 5rem;
height:9rem;
width: 100%;
}
body.home .site-header {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/bg-header.svg) no-repeat right 1rem;
background-size: 7rem 7rem;
height:18rem;
}
@media screen and (min-width: 35em) {
.site-header {
height:0;
}
body.home .site-header {
height:0;
}
}
.header-left {
position: absolute;
top:0;
left:0;
}
.header-icons {
position: absolute;
top: 6.5rem;
left: 3vw;
z-index: 9;
}
body.home .header-icons {
top: 14rem;
}
.header-icons ul {
display:flex;
}
.header-icons ul li{
flex:2.5rem;
padding-right:.5rem;
}
.header-icons ul li a{
display: block;
width:2rem;
height:0;
padding-bottom:100%;
transition: .2s;
}
.header-icons a.telefon{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-telefon-dark.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.mail{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-mail-dark.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.location{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-location-dark.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.facebook{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-facebook-dark.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.instagram{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-instagram-dark.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.telefon:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-telefon-dark.svg) no-repeat center center; background-size:130% 130%;
}
.header-icons a.mail:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-mail-dark.svg) no-repeat center center; background-size:130% 130%;
}
.header-icons a.location:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-location-dark.svg) no-repeat center center; background-size:130% 130%;
}
.header-icons a.facebook:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-facebook-dark.svg) no-repeat center center; background-size:130% 130%;
}
.header-icons a.instagram:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-instagram-dark.svg) no-repeat center center; background-size:130% 130%;
}
@media screen and (min-width: 35em) {
.header-icons {
top: 2rem;
}
body.home .header-icons {
top: 4rem;
left: 2vw;
}
body.home .header-icons {
animation-name: animation-icons;
animation-duration: 6s;
animation-timing-function: linear;
}
body.home .bx-controls-direction {
animation-name: animation-icons;
animation-duration: 6s;
animation-timing-function: linear;
}
body.home .main-navigation label {
animation-name: animation-icons;
animation-duration: 6s;
animation-timing-function: linear;
}
.header-icons a.telefon{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-telefon.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.mail{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-mail.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.location{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-location.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.facebook{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-facebook.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.instagram{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-instagram.svg) no-repeat center center; background-size:100% 100%;
}
.header-icons a.telefon:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-telefon.svg) no-repeat center center; background-size:130% 130%;
}
.header-icons a.mail:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-mail.svg) no-repeat center center; background-size:130% 130%;
}
.header-icons a.location:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-location.svg) no-repeat center center; background-size:130% 130%;
}
.header-icons a.facebook:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-facebook.svg) no-repeat center center; background-size:130% 130%;
}
.header-icons a.instagram:hover {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/icon-instagram.svg) no-repeat center center; background-size:130% 130%;
}
}
.header-logo {
position: absolute;
top:0;
left:50%;
}
.header-subpage {
position: relative;
}
.header-subpage .logo {
position: absolute;
width: 100%;
height:auto;
top:-9rem;
left:0;
}
.header-subpage .logo-size {
width: 17rem;
margin: 3rem auto 0;
}
.header-subpage .logo-size a{
display: block;
overflow:hidden;
text-indent: -9999px;
width: 100%;
height: 0;
padding-bottom: 10%;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/logo-huabn-mobile.svg) no-repeat center center;
background-size: cover;
}
.header-subpage .logo-size a.logo-keller{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/logo-keller-mobile.svg) no-repeat center center;
background-size: cover;
}
.header-subpage .headerimage{
margin-bottom: 2rem;
}
@media screen and (min-width: 35rem) {
.header-subpage .logo {
top:0;
}
.header-subpage .headerimage{
padding-top:0;
margin-bottom: 2.5rem;
}
.header-subpage .logo-size {
width: 5rem;
width: clamp(5rem,13vw,10rem);
margin: 1rem auto 0;
margin-top: clamp(1rem,2vw,2rem);
}
.header-subpage .logo-size a{
padding-bottom: 100%;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/logo-huabn-kreis.svg) no-repeat center center;
background-size: cover;
}
.header-subpage .logo-size a.logo-huabn-ohne{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/logo-huabn.png) no-repeat center center;
background-size: cover;
}
.header-subpage .logo-size a.logo-keller{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/logo-keller-kreis.svg) no-repeat center center;
background-size: cover;
}
.header-subpage .logo-size a.logo-keller-ohne{
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/logo-keller.png) no-repeat center center;
background-size: cover;
}
}
.header-subpage-titel {
text-align: center;
position: absolute;
bottom:7%;
width: 100%;
color:#fff;
text-shadow: 1px 1px 5px rgba(0,0,0,.3);
}
.header-subpage-titel h1{
text-transform: uppercase;
font-weight: 700;
width: 100%;
margin:0;
padding:0;
color:#fff;
font-size: clamp(1.25rem, 2.5vw, 2rem);
line-height: 1;
}
.header-subpage-titel h2{
width: 100%;
font-weight: 300;
margin:0;
padding:0;
color:#fff;
font-size: clamp(1.125rem, 2vw, 1.75rem);
line-height: 1;
}
@media screen and (min-width: 35rem) {
.header-subpage-titel {
}
} @-webkit-keyframes animation-icons {
0% {
opacity: 0;
}
90% {
opacity: 0;
}
100% { opacity: 1; }
}
@-webkit-keyframes animation-willkommen {
0% {
opacity: 1;
}
85% {
opacity: 1;
}
95% { opacity: 0; }
100% { opacity: 0; }
} .slider-area {
position: relative;
z-index: 1;
}
.home-willkommen {
display: none;
}
h1.home-logo {
margin:0;
padding:0;
text-indent: -9999px;
overflow: hidden;
z-index: 11;
position: absolute;
top:-17rem;
left:0;
height: 13rem;
width: 100%;
background:url(//www.huabn-theater.at/wp-content/themes/huabn/images/logo-huabn.svg) no-repeat center center;
background-size: auto 100%;
}
@media screen and (min-width: 35em) {
.slider-area {
}
.home-willkommen {
width: 100%;
height: 22vw;
display: block;
position: absolute;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/home-herzlichwillkommen.png) no-repeat center center;
background-size: auto 100%;
top:0;
left:0;
text-indent: -9999px;
overflow: hidden;
z-index: 9;
animation-name: animation-willkommen;
animation-duration: 6s;
animation-timing-function: linear;
opacity: 0;
}
h1.home-logo {
margin:0;
padding:0;
text-indent: -9999px;
overflow: hidden;
z-index: 11;
position: absolute;
top:1vw;
height: 20vw;
left:0;
width: 100%;
background:url(//www.huabn-theater.at/wp-content/themes/huabn/images/home-logo.png) no-repeat center center;
background-size: auto 100%;
animation-name: animation-logo;
animation-duration: 6s;
animation-timing-function: linear;
}
@-webkit-keyframes animation-logo {
0% {
top:20vw;
height: 30vw;
opacity: 0;
}
10% {
opacity: 0;
}
20% {
opacity: 1;
}
85% {
top:20vw;
height: 30vw;
}
100% {
top:1vw;
height: 20vw;
}
}
}
@media screen and (min-width: 80em) {
h1.home-logo {
top:1rem;
height: 16rem;
}
.home-willkommen {
height: 18rem;
}
@-webkit-keyframes animation-logo {
0% {
top:16rem;
height: 24rem;
opacity: 0;
}
10% {
opacity: 0;
}
20% {
opacity: 1;
}
85% {
top:16rem;
height: 24rem;
}
100% {
top:1rem;
height: 16rem;
}
}
}
.home-slider li {
}
.home-slider .slide-image {
position: relative;
height: 0;
width: 100%;
padding-bottom:56.25%;
} .bx-wrapper .bx-controls-direction a {
z-index: 15;
}
.bx-wrapper .bx-controls-direction a {
top: 47%;
}
@media screen and (min-width: 40em){
.bx-wrapper .bx-controls-direction a {
top: 50%;
}
}
.slider-textblock {
position: absolute;
bottom:0;
width:100%;
background:rgba(126, 136, 0,.8);
padding: .5rem 0;
color:#fff;
line-height: 1.1;
}
.slider-textblock-color2 {
background:rgba(184, 27, 54,.8);
}
.slider-textblock-color3 {
background:rgba(114, 68, 42,.8);
}
.slider-zeile2 {
text-transform: uppercase;
}
.home-slider li .slider-link {
position: absolute;
left:1%;
bottom: .25rem;
}
.home-slider li .slider-link span {
width:100%;
height: 0;
padding-bottom:100%;
display: block;
position: relative;
}
.home-slider li .slider-link span a{
display: block;
position: absolute;
top:0;
left:0;
width:100%;
height: 100%;
border-radius: 50%;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/infos-button.svg) no-repeat center center;
background-size:cover;
border: solid 1px #fff;
overflow: hidden;
text-indent: -999px;
}
.home-slider li .slider-link span a:hover{
border: solid 1px rgba(126, 136, 0,1);
}
.slider-zeile1,
.slider-zeile2 {
font-size:clamp(.875rem, 2vw, 1.75rem);
padding-left:6.5rem;
}
.home-slider li .slider-link {
width:clamp(4rem,7.5vw,6.5rem);
}
@media screen and (min-width: 35em) {
.slider-zeile1,
.slider-zeile2 {
padding-left:8.5rem;
}
.home-slider li .slider-link {
}
.slider-textblock {
bottom:5%;
}
.home-slider li .slider-link {
bottom: -.75rem;
}
}
.text-home-nav {
text-align: center;
color:#7E8800;
padding-bottom: .75rem;
}
.text-home-nav h3 {
text-align: center;
color:#7E8800;
text-transform: uppercase;
margin:0;
padding:0 0 .25rem;
}
.navigation-blocks {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.navigation-blocks li {
flex: 0 0 47.3%;
margin-bottom:4vw;
}
.navigation-blocks li a{
background:#e1dcd7;
display: block;
position: relative;
width:100%;
height:0;
padding-bottom:100%;
}
.navigation-blocks li a > div {
position: absolute;
width:100%;
left:0;
}
@media screen and (min-width: 40em) {
.navigation-blocks li {
flex: 0 0 31.1%;
margin-bottom:3vw;
}
}
@media screen and (min-width: 60em) {
.navigation-blocks li {
flex: 0 0 23.1%;
margin-bottom:1.5rem;
}
}
.navblock-bild {
filter: sepia(.95);
opacity: .8;
transition: .4s;
height:100%;
}
.navigation-blocks a:hover .navblock-bild {
filter: sepia(.0);
opacity: 1;
}
.navblock-feld {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/home-nav-field0.svg) no-repeat center center;
background-size:cover;
opacity: .9;
height:100%;
}
.navigation-blocks a:hover .navblock-feld {
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/home-nav-field1.svg) no-repeat center center;
background-size:cover;
}
.navblock-text {
width:100%;
height:25%;
overflow:hidden;
display: flex;
text-align: center;
align-items: center;
bottom:0;
}
.navblock-text span{
flex:1;
padding:0 11%;
}
.navigation-blocks a,
.navigation-blocks a .navblock-text  {
color:#72442A;
text-decoration: none;
text-transform: uppercase;
font-size:.875rem;
line-height: 1.1;
font-weight: 500;
}
a:hover .navblock-text {
color:#fff;
} .header-center{
position: relative;
}
.main-navigation {
width:100%;
}
.main-navigation .title {
position: absolute;
top: 2.5rem;
right: 1.5rem;
height: 1.5rem;
font-size:.875rem;
color:#fff;
}
.main-navigation input {
display: none;
}
.main-navigation li{
font-weight: 500;
text-transform: uppercase;
}
.main-navigation li a{
text-decoration: none;
color:#72442A;
}
.main-navigation nav > ul > li:nth-child(1) a{
color:#9E5426;
}
.main-navigation nav > ul > li:nth-child(2) a{
color:#B81B36;
}
.main-navigation nav > ul > li:nth-child(3) a{
color:#7E8800;
}
.main-navigation li a:hover {
color: #B81B36;
}
.main-navigation li.current_page_item a {
font-weight: 700;
}
.main-navigation label {
position: absolute;
top: 6.25rem;
right: 1.5rem;
height: 2.5rem;
width: 2.5rem;
z-index: 20;
background:#7E8800;
border-radius: 50%;
}
body.home .main-navigation label {
top: 14rem;
}
@media screen and (min-width: 35em) {
.main-navigation label {
top: 2rem;
height: 3rem;
width: 3rem;
}
body.home .main-navigation label {
top: 4rem;
}
}
.main-navigation input + label span {
position: absolute;
width: 70%;
height: 0.25rem;
border-radius: 2px;
top: 47%;
left: 15%;
display: block;
background: #fff;
transition: .4s;
}
.main-navigation input + label span:first-child {
top: 27%;
}
.main-navigation input + label span:last-child {
top: 67%;
}
.main-navigation body label:hover {
cursor: pointer;
}
.main-navigation input:checked + label span {
opacity: 0;
top: 47%;
}
.main-navigation input:checked + label span:first-child {
opacity: 1;
transform: rotate(45deg);
}
.main-navigation input:checked + label span:last-child {
opacity: 1;
transform: rotate(-45deg);
}
.main-navigation .after-checkbox {
background: #fff;
position: absolute;
right:0;
top:0;
display:none;
z-index: 19;
width: 100%;
box-sizing: border-box;
padding: 1.5rem 4.5rem 1.5rem 1rem;
}
@media screen and (min-width: 35em) {
.main-navigation .after-checkbox {
top:0;
right:0;
width: 22rem;
padding-right:5rem;
padding-left:2rem;
}
}
.main-navigation input:checked ~ .after-checkbox {
display:block;
}
.main-navigation ul  {
}
.main-navigation ul li {
padding: 0.25em 1.5em;
font-size:1.25rem;
line-height: 1.1;
}
.main-navigation ul li ul{
padding: 0;
}
.main-navigation ul li ul li{
padding: 0 .25em 0 1rem;
}
.main-navigation ul li ul li a{
font-size:1rem;
line-height: 1.1;
font-weight: 300;
text-transform: none;
}
.main-navigation li.current_page_item ul li a {
font-weight: 300;
}
.after-checkbox nav > ul {
border-top: solid 1px rgba(158, 84, 38,.6);
}
.after-checkbox nav > ul > li {
border-bottom: solid 1px rgba(158, 84, 38,.6);
}
@media screen and (min-width: 45em) {
} main.site-main {
min-height:10rem;
}
.page-content p,
.main-content p,
.contentblock p,
.textarea p{
padding-bottom:1rem;
}
section.section {
padding: 0 0 2.5rem;
}
h2.section-title {
text-align:center;
text-transform:uppercase;
margin: 1rem 0 1.25rem 0;
}
main.farbe-gruen h2 {
}
main.farbe-gruen h2.section-title {
color:#7E8800;
}
main.farbe-braun h2.section-title {
color:#9E5426;
}
main.farbe-rot h2.section-title {
color:#B81B36;
}
.contentblock {
padding-bottom:1.5rem;
}
main.farbe-gruen .textarea h1,
main.farbe-gruen .textarea h2,
main.farbe-gruen .textarea h3{
color:#7E8800;
}
main.farbe-braun .textarea h1,
main.farbe-braun .textarea h2,
main.farbe-braun .textarea h3{
color:#9E5426;
}
main.farbe-rot .textarea h1,
main.farbe-rot .textarea h2,
main.farbe-rot .textarea h3{
color:#B81B36;
}
.textarea h1 {
color:#B81B36;
}
.textarea h2{
font-weight:700;
}
.textarea h2+h3{
margin:0;
padding:0;
top: -1.125rem;
position: relative;
font-weight: 500;
line-height: 1.3;
}
.section-button {
text-align: center;
}
.section-button a{
display:inline-block;
text-decoration: none;
padding: .5rem 2rem;
min-width:14rem;
font-weight:700;
text-transform:uppercase;
font-size:.875rem;
}
.section-button-100 a{
display:block;
min-width:auto;
width: 100%;
box-sizing: border-box;
}
main.farbe-gruen .section-button a {
border: solid 1px #7E8800;
color:#7E8800;
}
main.farbe-braun .section-button a {
border: solid 1px #9E5426;
color:#9E5426;
}
main.farbe-rot .section-button a {
border: solid 1px #B81B36;
color:#B81B36;
}
main.farbe-braun .section-button a {
border: solid 1px #9E5426;
color:#9E5426;
}
main.farbe-rot .section-button a {
border: solid 1px #B81B36;
color:#B81B36;
}
main.farbe-gruen .section-button a:hover,
main.farbe-rot .section-button a:hover,
main.farbe-braun .section-button a:hover{
border: solid 1px #000;
color:#000;
}
.content-zweispaltig-bild > div:first-child {
padding-bottom:1rem;
}
@media screen and (min-width: 40em) {
.content-zweispaltig{
column-count: 2;
column-gap: 4%;
}
.content-zweispaltig-bild{
display: flex;
justify-content: space-between;
}
.content-zweispaltig-bild > div:first-child {
flex: 0 0 30%;
padding-bottom:0;
}
.content-zweispaltig-bild > div:last-child {
flex: 0 0 66%;
}
}
@media screen and (min-width: 55em) {
.content-zweispaltig  {
text-align: justify;
column-gap: 3.5%;
}
} .textarea-border {
padding:1rem;
border-radius: 1rem;
}
.textarea-border .contentblock{
padding-bottom:0;
}
.border-gruen{
border: solid 2px #7E8800;
}
.border-braun{
border: solid 2px #9E5426;
}
.border-rot{
border: solid 2px #B81B36;
} @media screen and (min-width: 55em) {
.veranstaltung-block {
display: flex;
justify-content: space-between;
}
.veranstaltung-block > div  {
flex: 0 0 47.75%;
}
}
.veranstaltung-farbblock {
padding: .25rem .5rem .375rem;
margin-bottom:.5rem;
text-align: center;
}
main.farbe-gruen .veranstaltung-farbblock {
background:#7E8800;
}
main.farbe-braun .veranstaltung-farbblock {
background:#9E5426;
}
main.farbe-rot .veranstaltung-farbblock {
background:#B81B36;
}
main .textarea .veranstaltung-farbblock h3 {
color:#fff;
font-size: 2.5rem;
font-size: clamp(1.5rem,2.5vw,2.5rem);
line-height: 1;
font-weight: 500;
margin:0;
padding:0;
}
main .textarea .veranstaltung-farbblock h3,
main .textarea .veranstaltung-farbblock h4{
color:#fff;
}
.veranstaltung-farbblock h4 {
color:#fff;
font-size: 1.75rem;
font-size: clamp(1rem,1.75vw,1.75rem);
line-height: 1;
text-transform:uppercase;
font-weight: 500;
margin:0;
padding:0;
}
.veranstaltung-block h5 {
text-align: center;
}
main.farbe-gruen h5 {
color:#7E8800;
}
main.farbe-braun h5 {
color:#9E5426;
}
main.farbe-rot h5 {
color:#B81B36;
}
.veranstaltung-text {
text-align: center;
padding-bottom:.25rem;
}
.veranstaltung-block .section-button{
padding: .125rem 10%;
}
.veranstaltung-block .section-button a{
display: block;
width:auto;
box-sizing: border-box;
} .subpages-slider {
display:flex;
flex-wrap: wrap;
justify-content: space-between;
}
.subpages-slider li{
flex: 0 0 48.5%;
margin-bottom:1rem;
line-height: 1.1;
}
@media screen and (min-width: 40em) {
.subpages-slider li{
flex: 0 0 31.5%;
}
}
@media screen and (min-width: 60em) {
.subpages-slider li{
flex: 0 0 24%;
}
}
.subpages-slider .subpages-slider-space{
width:100%;
height: 0;
padding-bottom:100%;
background:#fff;
position: relative;
}
.subpages-slider .subpages-slider-bild {
width:100%;
height: 100%;
position: absolute;
top:0;
left:0;
}
.subpages-slider .subpages-slider-text {
width:100%;
position: absolute;
left:0;
bottom:5%;
background:rgba(184, 27, 54,.7);
text-align: center;
color:#fff;
}
.subpages-slider .subpages-slider-text span{
display: block;
padding: .25rem .5rem;
text-align: center;
font-size: clamp(.75rem,1.75vw,1rem);
color:#fff;
} .subpages-links {
display:flex;
flex-wrap: wrap;
justify-content: space-between;
}
.subpages-links li{
flex: 0 0 100%;
margin-bottom:1rem;
line-height: 1.1;
}
@media screen and (min-width: 30em) {
.subpages-links li{
flex: 0 0 48.5%;
}
}
@media screen and (min-width: 45em) {
.subpages-links li{
flex: 0 0 31.5%;
}
}
.subpages-links .subpages-links-space{
width:100%;
height: 0;
padding-bottom:100%;
background:#fff;
position: relative;
margin-bottom:.5rem;
}
.subpages-links li.farbe-gruen .subpages-links-space,
.subpages-links li.farbe-gruen .subpages-links-text{
background:#7E8800;
}
.subpages-links li.farbe-braun .subpages-links-space,
.subpages-links li.farbe-braun .subpages-links-text{
background:#9E5426;
}
.subpages-links li.farbe-rot .subpages-links-space,
.subpages-links li.farbe-rot .subpages-links-text{
background:#B81B36;
}
.subpages-links .subpages-links-bild {
width:calc(100% - 0.5rem);
height: calc(100% - 0.5rem);
position: absolute;
top:.25rem;
left:.25rem;
}
.subpages-links .subpages-links-text {
width:100%;
position: absolute;
left:0;
bottom:0;
text-align: center;
color:#fff;
}
.subpages-links .subpages-links-text span{
display: block;
padding: .5rem .5rem;
text-align: center;
font-size: 1rem;
color:#fff;
}
.subpages-links .subpages-links-text em{
display: block;
font-size: .875rem;
font-style: normal;
text-transform:uppercase;
}
.subpages-links .subpages-links-text strong{
display: block;
font-size: 1.25rem;
}
@media screen and (min-width: 30em) {
.subpages-links .subpages-links-text em{
font-size: clamp(.75rem,1.75vw,1rem);
}
.subpages-links .subpages-links-text strong{
font-size: clamp(1rem,2vw,1.5rem);
}
}
@media screen and (min-width: 45em) {
}
main .subpages-links .section-button-100 a{
border: 2px solid #9E5426;
color: #9E5426;
}
main .subpages-links .section-button-100 a:hover{
border: 2px solid #000;
color: #000;
} .galerie-liste {
display:flex;
flex-wrap: wrap;
justify-content: space-between;
}
.galerie-liste li{
flex: 0 0 48.5%;
margin-bottom:1rem;
line-height: 1.1;
}
@media screen and (min-width: 40em) {
.galerie-liste li{
flex: 0 0 31.5%;
}
}
.galerie-liste .galerie-liste-space{
width:100%;
height: 0;
padding-bottom:100%;
background:#fff;
position: relative;
}
.galerie-liste .galerie-liste-bild {
width:100%;
height: 100%;
position: absolute;
top:0;
left:0;
}
.galerie-liste .galerie-liste-text {
display: block;
text-align: center;
color:#72442A;
padding: .5rem 0 1rem;
}
.galerie-liste a,
.galerie-liste a .galerie-liste-text{
color:#72442A;
text-decoration: none;
}
.galerie-liste .galerie-liste-lupe {
width:100%;
height: 100%;
position: absolute;
top:0;
left:0;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/overlay-view.svg);
background-size: cover;
opacity: .7;
}
.galerie-liste a:hover .galerie-liste-lupe {
opacity: 1;
}
.galerie-liste .galerie-download-text {
display: flex;
padding-top:.5rem;
}
.galerie-liste .galerie-download-text strong{
display: block;
flex:1;
text-align: center;
color:#72442A;
padding: .5rem 0 1rem;
}
.galerie-liste .galerie-download-text a{
display: block;
flex: 0 0 1.5rem;
width: 1.5rem;
height: 1.5rem;
margin-top:.25rem;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/button-download.svg);
background-size:cover;
} .bildergalerie ul {
display:flex;
flex-wrap: wrap;
justify-content: space-between;
list-style: none;
}
.bildergalerie li{
flex: 0 0 48%;
margin-bottom:0.75rem;
}
@media screen and (min-width: 30em) {
.bildergalerie li{ flex: 0 0 32%;}
}
@media screen and (min-width: 40em) {
.bildergalerie li{ flex: 0 0 24%;}
}
@media screen and (min-width: 50em) {
.bildergalerie li{ flex: 0 0 19%;}
} .site-footer {
padding:1.5rem 0 3rem 0;
} .footer-newsletter{
text-align: center;
color:#72442A;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/bg-newsletter.svg) no-repeat center bottom;
background-size: auto 14rem;
padding-bottom:7rem;
}
.footer-newsletter a {
color:#72442A;
}
.footer-newsletter h2{
color:#7E8800;
text-transform:uppercase;
font-weight:400;
font-size:2rem;
}
.newsletter-einleitung {
padding-bottom:1.25rem;
}
.tnp-widget .footer-newsletter .tnp-privacy-field {
padding-bottom: .75rem;
}
.footer-newsletter .tnp-widget .tnp-field {
max-width:28rem;
margin: 0 auto .75rem;
}
.footer-newsletter .tnp-subscription input[type="text"],
.footer-newsletter .tnp-subscription input[type="email"]{
max-width:28rem;
margin: 0 auto .75rem;
background:none;
border-top:none;
border-left:none;
border-right:none;
border-bottom:solid 1px #7E8800;
font-size:1rem;
padding:.25rem;
height: auto;
}
.footer-newsletter  .tnp-subscription label {
padding:0;
text-align:left;
font-weight: 300;
font-size:.875rem;
max-width:28rem;
margin: 0 auto ;
color: #7E8800;
}
.footer-newsletter .tnp-field input[type="submit"]{
width:12rem;
margin: .25rem auto;
border:solid 1px #7E8800;
padding:.25rem;
background: transparent;
color: #7E8800;
font-weight: 500;
cursor: pointer;
outline: none;
} .footer-instagram {
padding: 3rem 0;
background: url(//www.huabn-theater.at/wp-content/themes/huabn/images/bg-instagram.svg) no-repeat center bottom;
background-size: auto 100%;
}
.footer-instagram h2{
color:#72442A;
text-transform:uppercase;
font-weight:400;
font-size:1.25rem;
} .footer-logos {
display: flex;
flex-wrap: wrap;
align-items: center;
padding:.75rem 0;
}
.footer-logos li {
padding:.5rem 1rem .5rem 0;
}
.footer-links {
border-top: solid 3px #7E8800;
padding-top:.5rem;
}
.footer-navigation {
padding: .5rem 0;
display:flex;
flex-wrap: wrap;
}
.footer-navigation ul{
display:flex;
flex-wrap: wrap;
}
.footer-navigation ul li{
position: relative;
padding-right:1.5rem;
}
.footer-navigation ul li:after{
position: absolute;
display:block;
content:'|';
right:.75rem;
top:0;
color:#72442A;
}
.footer-navigation ul li:last-child:after{
}
.footer-navigation a{
text-decoration: none;
text-transform: uppercase;
font-size:.875rem;
color:#72442A;
}
.footer-navigation a:hover{
color:#7E8800;
}
.footer-navigation div{
font-size:.875rem;
line-height: 1.75;
color:#72442A;
}
.footer-navigation .current-menu-item a {
color:#7E8800;
}div.tnp-subscription,
form.tnp-subscription, form.tnp-profile {
display: block;
margin: 1em auto;
max-width: 500px;
width: 100%;
}
div.tnp-profile {
display: block;
margin: 1em 0;
max-width: 500px; } .tnp-subscription div.tnp-field,
.tnp-profile div.tnp-field
{
margin-bottom: .7em;
border: 0;
padding: 0;
}
.tnp-subscription label,
.tnp-profile label
{
display: block;
color: inherit;
font-weight: normal;
line-height: normal;
padding: 0;
margin: 0;
margin-bottom: .25em;
font-size: .9em;
}
.tnp-subscription .tnp-field-checkbox label,
.tnp-profile .tnp-field-checkbox label
{
display: inline-block;
}
.tnp-subscription input[type=text],
.tnp-subscription input[type=email],
.tnp-subscription input[type=submit],
.tnp-subscription select,
.tnp-subscription textarea,
.tnp-profile input[type=text],
.tnp-profile input[type=email],
.tnp-profile input[type=submit],
.tnp-profile select,
.tnp-profile textarea
{
width: 100%;
padding: .7em;
display: block;
border: 1px;
color: #444;
border-color: #ddd;
background-color: #f4f4f4;
background-image: none;
text-shadow: none;
font-size: 1em;
margin: 0;
line-height: normal;
box-sizing: border-box;
}
.tnp-subscription input[type=checkbox],
.tnp-widget input[type=radio],
.tnp-profile input[type=checkbox]
{ max-width: 1em;
display: inline-block;
margin-right: .5em;
} .tnp-subscription select option,
.tnp-profile select option
{
margin-right: .75em;
}
.tnp-subscription input.tnp-submit,
.tnp-profile input.tnp-submit,
.tnp-unsubscribe button.tnp-submit,
.tnp-reactivate button.tnp-submit
{
background-color: #444;
color: #fff;
width: auto;
height: auto;
margin: 0;
display: inline-block;
}
@media all and (max-width: 480px) {
.tnp-subscription input[type=submit],
.tnp-profile input[type=submit] {
width: 100%;
}
}
.tnp-widget {
width: 100%;
display: block;
box-sizing: border-box;
}
.tnp-widget .tnp-field {
margin-bottom: 10px;
border: 0;
padding: 0;
}
.tnp-widget label {
display: block;
color: inherit;
font-size: 14px;
}
.tnp-widget input[type=text], .tnp-widget input[type=email], .tnp-widget input[type=submit], .tnp-widget select {
width: 100%;
padding: 10px;
display: block;
border: 1px solid #ddd ;
border-color: #ddd;
background-color: #f4f4f4;
background-image: none;
text-shadow: none;
color: #444;
font-size: 14px;
line-height: normal;
box-sizing: border-box;
height: auto;
}
.tnp-widget input[type=checkbox], .tnp-widget input[type=radio] {
width: auto;
display: inline-block;
} .tnp-widget select option {
margin-right: 10px;
}
.tnp-widget input.tnp-submit {
background-color: #444;
background-image: none;
text-shadow: none;
color: #fff;
margin: 0;
}
.tnp-field input[type="submit"] {
position: inherit;
}
.tnp-field label {
} .tnp-widget-minimal {
width: 100%;
}
.tnp-widget-minimal form {
margin: 0;
padding: 0;
border: 0;
}
.tnp-widget-minimal input.tnp-email {
width: 100%;
box-sizing: border-box;
padding: 10px;
display: inline-block;
border: 1px solid #ddd;
background-color: #f4f4f4;
color: #444;
font-size: 14px;
}
.tnp-widget-minimal input.tnp-submit {
width: 100%;
box-sizing: border-box;
padding: 10px;
display: inline-block;
border: 1px;
border-color: #ddd;
background-color: #444;
background-image: none;
text-shadow: none;
color: #fff;
font-size: 14px;
line-height: normal;
border-radius: 0px;
height: auto;
margin: 0;
} .tnp-subscription-minimal {
width: 100%;
box-sizing: border-box;
margin: 10px 0;
}
.tnp-subscription-minimal form {
width: auto;
margin: 0;
padding: 0;
border: 0;
white-space: nowrap;
}
.tnp-subscription-minimal input.tnp-email,
.tnp-subscription-minimal input.tnp-name
{
width: 70%;
max-width: 300px;
box-sizing: border-box;
padding: 10px;
display: inline-block;
border: 1px solid #ddd;
background-color: #f4f4f4;
color: #444;
font-size: 14px;
line-height: 20px;
border-radius: 0px;
margin-right: 10px;
}
.tnp-subscription-minimal.with-name input.tnp-email,
.tnp-subscription-minimal.with-name input.tnp-name
{
width: 31%;
}
.tnp-subscription-minimal .tnp-privacy-field {
margin-top: 10px;
} .tnp-subscription-minimal input.tnp-submit {
width: 29%;
box-sizing: border-box;
display: inline-block;
padding: 10px;
border: 1px;
border-color: #ddd;
background-color: #444;
background-image: none;
text-shadow: none;
color: #fff;
font-size: 14px;
line-height: 20px;
border-radius: 0px;
margin: 0;
}
.tnp-subscription-posts {
margin-top: 2em;
margin-bottom: 2em;
padding: 2rem;
}
.tnp-subscription-posts .tnp-subscription {
max-width: auto;
margin: 0;
}
@media all and (max-width: 525px) {
.tnp-subscription-minimal.with-name input.tnp-email,
.tnp-subscription-minimal.with-name input.tnp-name,
.tnp-subscription-minimal input.tnp-submit
{
width: 100%;
max-width: 100%;
margin: 0;
display: block;
margin-bottom: .5rem;
}
} .tnp-button-form button.tnp-submit {
box-sizing: border-box;
padding: 10px;
display: inline-block;
border: 1px;
border-color: #ddd;
background-color: #444;
background-image: none;
text-shadow: none;
color: #fff;
font-size: 14px;
line-height: normal;
border-radius: 0px;
height: auto;
margin: 0;
} .tnp-comments {
clear: both;
margin-top: 15px;
margin-bottom: 15px;
}
.tnp-comments label {
display: block;
}
.tnp-comments input[type=checkbox] {
display: inline-block;
width: auto!important;
} .tnp-lock {
clear: both;
display: block;
box-sizing: border-box;
box-shadow: none;
margin: 20px;
padding: 15px;
background-color: #fff;
border: 1px solid #ddd;
}
.tnp-nl-checkout {
margin-bottom: 1em;
}