/*  Farben: 		blau (#312783 alt)	#172983			gelb #ffed00

*/

/* Admin  auch: .mceContentBody */
#tinymce div { border:1px solid #cc7777; padding:3px; margin:0 0 5px 5px; }
#tinymce p { }
#tinymce .clearfix::after { content: "\00000A"; display: block; visibility: visible; height:auto; }
#tinymce .kal-datum { width:18%; color:#aa0000; margin:0; }
#tinymce .kal-zeit { width:20%; margin:0;}
#tinymce .kal-text { width:56%;margin:0; }


/* header  */
.uk-navbar-container, .uk-section-secondary { /* für Verlauf Header */ }
.uk-navbar-container { border-bottom:2px solid #fff; }
.uk-logo { margin-top:20px; height:135px; }
.tm-bottom  { border-top:2px solid #fff;  }
.tm-bottom , .tm-bottom  a { color:#fff; }
.uk-navbar { height:150px; /* Grafik im Header */ }
.uk-navbar-nav { eight:180px; }
.uk-navbar-nav > li ,.uk-navbar-nav > li > a  { align-self:center; eight:30px; }
.uk-section-default { ackground-image:none; }
.uk-offcanvas .uk-nav-sub li.uk-active a { color:#0000aa !important; }
.tm-bottom .uk-nav-default > li > a { color: #fff; }
.tm-bottom .uk-nav-default > li.uk-active > a, .tm-bottom .uk-nav-default > li > a:hover, .tm-bottom .uk-nav-default > li > a:focus { color: #ffed00; }
aside .uk-panel { text-align:center;  }
#module-100 { display:none; }
/* (alt: versteckte die leere Cookie-Spalte im Footer - gibt es nicht mehr, siehe "Footer" unten)
.tm-bottom > div  > div > div:nth-child(2) { width:0; flex:0; } */

#lazySlider { margin: 0px !important; }
#home-slider > div { height:100% !important; }

/* Unterstrich wie live: über Text + 15px links/rechts, wächst beim Hover von links */
.uk-navbar-nav > li > a::before { left:-15px; right:calc(100% + 15px); }
.uk-navbar-nav>li.uk-active>a::before, .uk-navbar-nav>li:hover>a::before { right: -15px;  left:-15px; }


/* offvanvas */
.uk-offcanvas .uk-nav-sub li.uk-active a { color: #fff !important; }


.leiste-oben { border-bottom:10px solid; border-color:#172983; margin:0 !important; }
.leiste-unten { border-top:10px solid; border-color:#172983; margin:0 !important; }
.leiste-oben img { vertical-align:bottom; }
.leiste-unten img { vertical-align:top; }
.sprung-mobile { display:none !important; }
.show-mobile { display:none !important; }

/* content */
.tm-page { /* Verlauf auf Seite */ }
ol { margin-top:10px; }
ol li { line-height:1.86; }
.td { padding:0; vertical-align:top; }
.facebook  a img{ padding-top:10px; width:30px; height:auto; }
.facebook  a:hover img { opacity:0.7; }
.gold { color:#aa0000; text-transform:uppercase;  font-weight:300; font-size:2em; }
.adresse { width: 80px; float:left; }
.links-50 { margin-right:2%; float:left; width:48%; }
.rechts-50 { margin-left:2%; float:left; width:48%; }
.rechts:after, .rechts-50:after, .adresse_re:after, .ueber-re:after { clear:both; }
.uk-button { text-align:left; }

.uk-navbar-toggle { color:#172983; }
.uk-navbar-toggle svg   { transform:scale(2, 2); }
.uk-navbar-toggle rect {  height:3px;  }

/* news */
.news article { border:1px solid #ccc;  }
.news article  h1 { padding:20px 20px 0px 20px;  }
.news article  p  { padding-left:20px; padding-right:20px; text-align:left; }
.news article > p  { padding-bottom:20px; margin-top:20px !important;  }
.news article > p  .uk-button { line-height:150%; padding:10px 20px !important; }
.news article .uk-margin-medium-bottom {  margin-bottom: 20px!important; }{  }

/* Gallery */
.ba-gallery > p { display:none; }
.uk-transition-toggle:hover .uk-transition-scale-up {
  --uk-scale-x: 1.5;
  --uk-scale-y: 1.5;
  opacity: 1;
}

/* Cookies */
.home .jb h4{ font-size:13px; float:left !important; padding-left:20px; vertical-align:middle; padding-top:5px; }
.jb.cookie p { color: #555 !important; }
.jb.cookies .uk-button { box-shadow:none;  }
.jb.cookie div.cookie-bg { opacity:.9;  }
.jb.cookie  { padding:10px 10px; }
.jb.cookie  p { isplay:none; color:#555; width:90%; float:left; font-size:13px; }
.jb.cookie  h2 { display:none; }
.jb.accept { text-shadow:none; padding:3px 8px; margin:2px 20px; float:right !important; font-size:14px; min-height:10px; line-height:130%; position:absolute; bottom:5px; right:10px; }
.jb.accept.red { background: #ccc;  }
.jb.cookie.red p a { color: #ccc; }
.jb.bottom.red .jb.cookie-bg.white, .jb.bottom.red .jb.cookie-bg.black { border-top: 1px solid #ccc; }

/* kontakt sidebar */
#kontakt-sidebar { position:fixed; right:0px; top:210px; z-index:200; width:250px; }
.kontakt-item { padding:15px 10px 15px 75px; color:#fff; margin-bottom:4px;  }
.link-wrap { position:relative; right:-180px; -webkit-transition: right 1s ease; -moz-transition: right 1s ease; -o-transition: right 1s ease; transition: right 1s ease; }
.link-wrap:hover { right:0px; }
.telefon { background:url("../images/logo-telefon.png") 	12px 7px no-repeat #172983;}
.email { background:url("../images/logo-email.png") 		10px 3px no-repeat #172983; }
.fb { background:url("../images/logo-fb.png") 			12px 6px no-repeat #172983; }
.shop { background:url("../images/shop.png") 			12px 6px no-repeat #172983; }
.ua-safari .link-wrap {  }


/* Videos */
.video_sect { font-size:.85em; line-height:140%; } 
.video { height:100%;  }
.video2 {   clear: both;  display: block;  text-align: center; }
.video3 { display: block;  margin: 0 auto;  padding: 0; }
.video4 { width: 100%!important;  position: relative!important;
    padding: 0 0 56% 0!important; }
.video4 iframe, .avVideo .video3 .video4 object, .avVideo .video3 .video4 embed, .avVideo .video3 .video4 > div {
    position: absolute!important;  top: 0; left: 0;
    min-width: 320px!important; width: 100%!important; height: 100%!important; }
.video2 div, .video2 iframe, .video2 object, .video2 embed {  outline: 0 none; }


/* social */
.social { position:absolute; top:20px; right:10%; background:none !important; padding:0 !important;}


@media (min-width: 600px) {
	#lazySlider .lazySlider-nav-arrows span { width:35px; height:35px; background-size:cover; }
}
@media (min-width: 1000px) {
	#lazySlider .lazySlider-nav-arrows span { width:50px; height:50px; }
	.kacheln  .el-item { height:400px; }
}

/* war live wirkungslos (Spalten dort 2/3 : 1/3) - deaktiviert, damit es gleich aussieht
@media (min-width: 1000px) {
	.referenzen  .ref-texte .uk-first-column { width: 49% !important; }
} */

@media (max-width: 1650px) {
 .leben { right:0%; }
}
@media (max-width: 1300px) {
	/* YOOtheme 5: Abstand der Menüpunkte über gap (30px) statt padding 0 15px */
	.uk-nav-default > li > a { letter-spacing:0.5px; font-size:12px; }
}
@media (max-width: 1200px) {
	.uk-navbar-nav > li:last-child > a { padding-right:0; }
	.uk-logo { padding:0; }
	.uk-logo img { max-width: 320px;}
}
@media (max-width: 1130px) {
	.uk-navbar-nav { gap: 24px; } /* live: padding 0 12px */
	.uk-navbar-nav > li > a { letter-spacing:0.5px; }
	.uk-navbar-nav > li.uk-active > a::before, .uk-navbar-nav > li > a:hover::before { left:-12px; right:-12px; }
}
@media (max-width: 1100px) {
 .leben { right:0%; }
 .uk-navbar { background-position: 80% 40%; }
}
@media (max-width: 1030px) {
	.uk-navbar-nav { gap: 16px; } /* live: padding 0 8px */
	.uk-navbar-nav > li > a { letter-spacing:0.5px; }
	.uk-navbar-nav > li.uk-active > a::before, .uk-navbar-nav > li > a:hover::before { left:-8px; right:-8px; }
}
@media (max-width: 960px) {
	.show-desktop { display:none !important; }
	.show-mobile { display:block !important; }
 .uk-navbar-item { height:135px; }
  .leben { right:10%; top:50px }
  .leben img { height:80px; width:auto;}
  .uk-navbar { height:160px; /* Grafik im Header */ }
  .uk-logo { margin-top:0px; height:135px; }
}

@media (max-width: 768px) {
	h1 { font-size:2.3em; }
	h2 { font-size:1.8em; }
	/* kontakt sidebar */
	#kontakt-sidebar { top:20px; width:220px; }
	.kontakt-item { padding:10px 10px 5px 60px; color:#fff; margin-bottom:4px;  }
	.telefon { background:url("../images/logo-telefon.png") 	7px 7px no-repeat #172983;}
	.email { background:url("../images/logo-email.png") 		7px 6px no-repeat #172983; }
	.fb { 	background:url("../images/logo-fb.png") 		7px 6px no-repeat #172983; }
	.shop { background:url("../images/shop.png") 			7px 6px no-repeat #172983; }
	.telefon, .email, .fb, .shop { background-size:12%; }
}
@media (max-width: 640px) {
	.sprung-desktop { display:none !important; }
	.sprung-mobile { display:block !important; }
	.sprung-mobile  .uk-tile-xlarge { padding-top: 100px; padding-bottom: 100px; }
	.uk-logo { height:110px; }
}
@media (max-width: 620px) {
	.home h1 { font-size:5.5vw; }
}
@media (max-width: 500px) {
	.leben { display:none; }

}
@media (max-width: 390px) {
	h1 { font-size:1.8em; }
	h2 { font-size:1.3em; }
	.uk-logo { height:90px; }
	.uk-navbar { height:150px; /* Grafik im Header */ }
}

/* =====================================================================
   Angleichung an Live-Version (sijo.at) nach Update auf YOOtheme Pro 5
   ===================================================================== */

/* Live wird zusätzlich ein Bootstrap-2-CSS geladen, das die Grundschrift
   des <body> auf Helvetica 14px / #333 setzt - nur auf der Startseite
   (Menüeintrag Home hat dafür die Seitenklasse "startseite") */
body.startseite { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; color: #333; }
body.startseite .tm-bottom .uk-nav-default > li > a { line-height: 20px; }

/* Text-Elemente im Builder: live bleibt der Abstand unter dem letzten Absatz
   erhalten (YOOtheme 5 entfernt ihn per .uk-panel > :last-child) */
#tm-main .uk-panel.uk-margin { display: block; } /* statt flow-root, damit Abstände wie live zusammenfallen */
#tm-main .uk-panel.uk-margin > :is(p, ul, ol):last-child { margin-bottom: 20px; }

/* Footer: 3 gleich breite Spalten, zwischen 1. und 2. Spalte 40px zusätzlicher
   Abstand (live war dort die leere Cookie-Modul-Spalte) */
@media (min-width: 960px) {
	.tm-bottom > .uk-container > .uk-grid > * { flex: 1 1 1px; min-width: 0; }
	.tm-bottom > .uk-container > .uk-grid > :nth-child(2) { margin-left: 40px; }
}

/* News - Blogansicht: Beiträge wie live spaltenweise (von oben nach unten) */
@media (min-width: 960px) {
	.news #tm-main .uk-grid.uk-child-width-1-2\@m { display: block; column-count: 2; column-gap: 0; margin-left: -40px; }
	.news #tm-main .uk-grid.uk-child-width-1-2\@m > * { width: auto; padding-left: 40px; margin-top: 0; margin-bottom: 70px; break-inside: avoid; }
}
/* Beitragstitel in der Blogansicht ist jetzt h2 (früher h1) */
.news article h2 { padding: 20px 20px 0px 20px; margin: 0 0 20px; }

/* News - Einzelansicht: live ohne Rahmen und Innenabstand */
.news #tm-main > .uk-container > article { border: 0; }
.news #tm-main > .uk-container > article h1,
.news #tm-main > .uk-container > article p { padding-left: 0; padding-right: 0; }
.news #tm-main > .uk-container > article h1 { padding: 0 0 20px; margin-bottom: 0; }
.news #tm-main > .uk-container > article > p { padding-bottom: 0; }

/* Mobile-Header: Logo vertikal zentriert und in die Logo-Höhe eingepasst (wie live) */
.tm-header-mobile .uk-navbar-center { align-items: center; }
.tm-header-mobile .uk-logo picture, .tm-header-mobile .uk-logo img { height: 100%; width: auto; }

/* Footer mobil: Spalten ohne Zwischenabstand untereinander (wie live) */
@media (max-width: 959px) {
	.tm-bottom > .uk-container > .uk-grid > .uk-grid-margin { margin-top: 0; }
}
@media (max-width: 960px) {
	/* Spalte, die nur ein .show-desktop-Element enthält (Sidebar-Menü), mobil komplett ausblenden,
	   sonst bleibt der Grid-Abstand als Lücke stehen */
	.uk-grid > :has(> .show-desktop:only-child) { display: none; }
}

/* Umbrechende Grids (Builder-Spalten, Galerien, mobil): live ohne zusätzlichen Abstand
   untereinander - ausgenommen die neue Referenzen-Galerie (kleiner Abstand) */
#tm-main .uk-grid:not(.uk-grid-small):not(.uk-grid-row-small):not(.uk-grid-row-large) > .uk-grid-margin { margin-top: 0; }
