/************************************************/
/*    © by Werbeagentur Gössler & Sailer OG     */
/*             www.goesslersailer.at            */
/************************************************/

.cbp-spmenu {background: #ffffff; position: fixed; overflow: auto;}
.cbp-spmenu h3 {color: #afdefa;	font-size: 100%; padding: 20px;	margin: 0; font-weight: 300; background: #0d77b6;}
.cbp-spmenu a {display: block;	color: #fff; font-size: 100%;	font-weight: 300; width:150px;}
.cbp-spmenu-vertical {width: 100%; height: 100%; top: 0; z-index: 99;}
.cbp-spmenu-right {	right: -100%;}
.cbp-header-left {right:0%;}
.cbp-spmenu-right.cbp-spmenu-open {	right: 0px;}
.cbp-spmenu-push {overflow-x:hidden;position: relative;	left: 0;}
.cbp-spmenu-push-toleft {left:-100%; overflow-y:hidden;}
.cbp-header-toleft {width:100%; left:auto; right:auto;}

.cbp-header-top-push{
left:auto;
right:auto;
width:100%;
}

.cbp-header-top-start {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background-color: transparent;
  transition: background-color 0.3s ease;
  z-index: 3;
  padding: 10px;
}

/* Startseite */
.cbp-header-top-start.scrolled {
  background-color: #ffffff;
}

/* Logo normal */
.cbp-header-top-start .bildlogo {
  height:220px; 
  width:120px;
  transform: scale(1);
  transform-origin:center top;
  transition: transform 0.4s ease;
  display: block;
  background: url("../img/header/logo-judenburg-com-farbe.svg") no-repeat center;
  background-size: contain;
  margin: -12px 0 0 0;
}

.cbp-header-top-start .bildlogo:hover {
  background: url("../img/header/logo-judenburg-com-farbe-hover.svg") no-repeat center;
  background-size: contain;
}

/* Logo nach Scroll */
.cbp-header-top-start.scrolled .bildlogo {
  background-image: url("../img/header/logo-judenburg-com-farbe-hover.svg");
  transform: scale(0.4); /* 100px / 200px ≈ 0.5 */
  margin: -2px 0 0 0;
}

/* Wenn Header gescrollt */
.cbp-header-top-start.scrolled .gs-navbar a {
  color: var(--color-text);
  text-shadow: 0 0px 0px rgba(0, 0, 0, 0);
}

.wetter-icon {
    margin: 32px 10px 0 15px;
    color: #ffffff;
    font-size: 110%;
    font-weight: 600;
    float: right;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.50);
    }

.cbp-header-top-start .wetter-icon{
  color: var(--color-weiss);
}

.cbp-header-top .wetter-icon{
  color: var(--color-text);
  text-shadow: 0 0px 0px rgba(0, 0, 0, 0)!important;
}


.cbp-header-top-start.scrolled .wetter-icon{
  color: var(--color-text);
  text-shadow: 0 0px 0px rgba(0, 0, 0, 0)!important;
}

.cbp-header-top.scrolled .wetter-icon{
  color: var(--color-text);
text-shadow: 0 0px 0px rgba(0, 0, 0, 0)!important;
}

.cbp-header-top-start.scrolled .bildlogo:hover {
  background: url("../img/header/logo-judenburg-com-farbe-hover.svg") no-repeat center;
  background-size: contain;
}

/* Wenn Header gescrollt */
.cbp-header-top-start.scrolled .gs-navbar li ul a {
  color: #ffffff;
}

/* Unterseiten */
.cbp-header-top {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background-color: transparent;
  transition: background-color 0.3s ease;
  z-index: 2;
  padding: 10px;
}

.cbp-header-top.scrolled {
  background-color: #ffffff;
}

/* Logo normal */
.cbp-header-top .bildlogo {
  height:120px; 
  width:84px;
  transform: scale(1);
  transform-origin: left top; /* skaliert von links-mitte aus */
  transition: transform 0.4s ease;
  display: block;
  background: url("../img/header/logo-judenburg-com-farbe.svg") no-repeat center;
  background-size: contain;
}

/* Logo nach Scroll */
.cbp-header-top.scrolled .bildlogo {
background-image: url("../img/header/logo-judenburg-com-farbe-hover.svg");
  transform: scale(0.68); /* 100px / 185px ≈ 0.54 */
}

/* Wenn Header gescrollt */
.cbp-header-top.scrolled .gs-navbar a {
  color: var(--color-text);
  text-shadow: 0;
}

/* Wenn Header gescrollt */
.cbp-header-top.scrolled .gs-navbar a:hover {
  color: var(--color-melone); /* Schrift rot */
}

/* Wenn Header gescrollt */
.cbp-header-top.scrolled .gs-navbar li ul a {
  color: #ffffff;
  
}

.header-height-dyn{height:150px;}

.symb_last{
right:0px;
left:auto;	
}
.close-mn {padding: 20px 0; text-align: center; background-color: #efefef!important; border: 0px!important; font-size: 90%!important}
.close-mn a:hover {background-color: #fff!important; color: var(--color-melone)!important; }

/* Transitions */
.cbp-spmenu,.cbp-spmenu-push {-webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; transition: all 0.3s linear;}

.gs-navbar li {margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; position:relative; list-style:none; float:left; font-size:100%}
.gs-navbar li ul {margin:0px 0px 10px 0px; padding:10px 10px 10px 10px; display:none; position:absolute; z-index:103; left:0px; top:auto; background-color:var(--color-mint); border-radius: 5px 0px 5px 5px; }
.gs-navbar li ul.symb_last {left:auto; right:0px;}
.gs-navbar li ul li {margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; float:none; font-size:95%;}
.gs-navbar li ul li ul {margin:0px 0px 0px 0px; padding:10px 10px 10px 10px; display:none; position:absolute; z-index:103; left:200px; top:-10px; background-color:var(--color-mint);}
.gs-navbar li ul li ul li {margin:0px 0px 0px 0px; padding:0px 0px 0px 0px;}

/* Unternavigation in modernen Browsern einblenden */
.gs-navbar li:hover a{color:var(--color-melone); }
.gs-navbar li:hover ul {display:block;}
.gs-navbar li:hover ul li ul {display:none;}
.gs-navbar li:hover ul li:hover ul {display:block;}
.gs-navbar li:hover ul li:hover ul li ul {display:none;}


/* 1 Ebene */
.cbp-header-top-start .gs-navbar a {display:block; font-size:120%; font-weight: normal; text-decoration:none; padding:12px 20px; color:#ffffff; background-color:transparent; letter-spacing: 0.09em; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.50);}
.cbp-header-top-start .gs-navbar a:hover {color:var(--color-weiss); background-color:var(--color-mint); border-radius: 5px 5px 0px 0px;}
.cbp-header-top-start .gs-navbar a.aktuell {color:var(--color-melone); border-bottom: 0px var(--color-melone) solid; background-color:transparent;}

.cbp-header-top .gs-navbar a {display:block; font-size:120%; font-weight:normal; text-decoration:none; padding:12px 20px; color:#000000; background-color:transparent; letter-spacing: 0.09em;}
.cbp-header-top .gs-navbar a:hover {color:var(--color-melone); background-color:transparent;}
.cbp-header-top .gs-navbar a.aktuell {color:var(--color-melone); border-bottom: 0px var(--color-melone) solid; background-color:transparent;}


/* 2 Ebene */
.gs-navbar li:hover ul a {display:block; height:auto; font-size:110%; line-height:normal; text-transform:none; color:#FFFFFF; margin:0px 0px 0px 0px; padding:6px 10px 6px 10px; border-top:0px #FFFFFF solid; width:auto; min-width:200px; background-image:none;letter-spacing: normal;text-shadow: 0 0px 0px rgba(0, 0, 0, 0.00);}
.gs-navbar li:hover ul a:hover {color:#FFFFFF; background-color:#FFFFFF;}
.gs-navbar li:hover ul a.aktuell {color:var(--color-melone); background-color:#FFFFFF;font-weight:normal; }

/* 3 Ebene */
.gs-navbar li:hover ul li:hover a {color:var(--color-melone); background-color:#ffffff;}
.gs-navbar li:hover ul li:hover ul a {display:block; height:auto; line-height:18px; text-decoration:none; color:var(--color-melone); border-top:1px var(--color-melone) solid; padding:6px 10px 6px 10px; width:auto; min-width:150px; background-color:#FFFFFF;}

/* 4 Ebene */
.gs-navbar li:hover ul li:hover ul a {color:var(--color-melone); background-color:#ffffff;}
.gs-navbar li:hover ul li:hover ul a:hover {display:block; height:auto; line-height:18px; text-decoration:none; color:#ffffff; border-top:1px var(--color-melone) solid; padding:6px 10px 6px 10px; width:auto; min-width:150px; background-color:var(--color-mint);}
.gs-navbar li:hover ul li:hover ul a.aktuell {color:#ffffff; background-color:var(--color-mint);}



/* Mobil */
#navimobil li div {display:block; padding:10px 0px; width:45px; background-color:transparent; position:absolute; top:2px; right:0px; text-align:center; cursor:pointer;font-size:130%}

#navimobil li ul{position:relative;background-color:transparent; padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;}

#navimobil li:hover a{color:var(--color-melone); background-color:transparent;}
#navimobil li:hover ul {display:none;}
#navimobil li:hover ul li ul {display:none;}
#navimobil li:hover ul li:hover ul {display:none;}
#navimobil li:hover ul li:hover ul li ul {display:none;}


#navimobil a {display:block; font-size:100%; font-weight:normal;  text-decoration:none; padding:12px 10px 12px 10px; color:var(--color-melone); background-color:transparent; text-transform:uppercase; width:auto;border-top:1px var(--color-weiss) solid;}
#navimobil a:hover {color:var(--color-melone); background-color:transparent; }
#navimobil a.aktuell {color:#fff; font-weight:bold; background-color:var(--color-mint);}

#navimobil li:hover ul a {display:block; height:auto; line-height:normal;background-color:#f3f3f3; color:var(--color-melone); text-transform:none; margin:0px 0px 0px 0px; padding-left:5%; border-top:1px #FFFFFF solid; width:auto; min-width:200px; background-image:none;}
#navimobil li:hover ul a:hover {color:var(--color-melone); background-color:#E6E6E6; text-transform:none;}
#navimobil li:hover ul a.aktuell {color:#fff; background-color:var(--color-mint); font-weight:normal; }


/* 2 Ebene */
#navimobil li ul div {display:block; padding:13px 0px; width:45px; background-color:transparent; position:absolute; right:0px; top:1px; text-align:center; cursor:pointer;}
#navimobil li ul a { overflow:hidden;white-space: nowrap;display:block; line-height:normal;font-weight:normal; text-transform:none; color:var(--color-melone); margin:0px 0px 0px 0px; padding-left:5%; border-top:1px #FFFFFF solid; width:auto; background-color:#E6E6E6;}
#navimobil li ul a.symb2 {border-top:1px #FFFFFF solid;}
#navimobil li ul a.aktuell {color:#FFFFFF; background-color:var(--color-mint);}
#navimobil li ul a.aktuell_symb2 {border-top:1px #FFFFFF solid; color:#FFFFFF; background-color:var(--color-mint);}

/* 3 Ebene */
#navimobil li ul li ul div {display:block; padding:13px 0px; width:45px; background-color:transparent; position:absolute; right:0px; top:1px; text-align:center; cursor:pointer;}
#navimobil li ul li ul a { overflow:hidden;white-space: nowrap;display:block; line-height:normal;font-weight:normal; text-transform:none; color:var(--color-melone); margin:0px 0px 0px 0px; padding-left:8%; border-top:1px #FFFFFF solid; width:auto; background-color:#E6E6E6;}
#navimobil li ul li ul a.symb2 {border-top:1px #FFFFFF solid;}
#navimobil li ul li ul a.aktuell {color:#FFFFFF; background-color:var(--color-mint);}
#navimobil li ul li ul a.aktuell_symb2 {border-top:1px #FFFFFF solid; color:#FFFFFF; background-color:var(--color-mint);}


/* Auflösung */
@media only screen and (max-width: 1200px) {
.gs-navbar li { font-size:130%;}
.gs-navbar a {padding-left:6px; padding-right:6px;}
}
@media only screen and (max-width: 1010px) {
.gs-navbar li { font-size:130%;}
.gs-navbar a {padding-left:6px; padding-right:6px;}
}
@media only screen and (max-width: 920px) {
.gs-navbar li { font-size:130%;left:0px}
.gs-navbar a {padding-left:5px; padding-right:5px;}
}
@media only screen and (max-width: 800px) {

.cbp-header-top-start {
    height: 85px;
}
.cbp-header-top {
    height: 85px;
}

/* Logo nach Scroll */
.cbp-header-top-start.scrolled .bildlogo {
    transform: scale(0.34);
    margin: -3px 0 0 0;
}

.cbp-header-top.scrolled .bildlogo {
  transform: scale(0.60);
}
.gs-navbar ul {-webkit-box-shadow:none; box-shadow:none;}	
.gs-navbar {float:none;}
.gs-navbar li { font-size:130%;}
.gs-navbar li ul li ul {left:0px; top:0px;}
.gs-navbar a {padding-left:10px; padding-right:10px;}
.header-height-dyn{height:130px;}
}