html, body {height: 100%; scroll-behavior: smooth;}
.flex-column { display: flex; flex-flow: column; height: 100%; }
.content {flex-grow : 1;}

.lhp-theme-blue {color:#fff !important; background-color:#0f6689 !important}
.lhp-theme-yellow {color:#000 !important; background-color:#FCD821 !important}
.lhp-theme-grey {color:#000; background-color:#cecece}
.lhp-theme-lightgrey {color:#000; background-color:#f1f1f1}
.lhp-theme-white {color:#000; background-color:#fff}
.lhp-theme-white-blue {color:#0f6689; background-color:#fff}
.lhp-theme-white-black {color:#000; background-color:#fff}
.lhp-color-yellow {color:#FCD820}
.lhp-color-blue {color:#0f6689}
.lhp-color-grey {color:#9E9E9E}
.lhp-color-traffic-red {color:#C1121C}
.lhp-color-dark-grey {color:#616161}
.lhp-color-light-grey {color:#cecece}
.lhp-color-black {color:#000}
.lhp-color-signal-red {color:#a02128}
.lhp-bordercolor-black { border-color: #000}

.lhp-logotext { font-size:22px; font-weight: 300; line-height: 1.2;}
.lhp-logoheader {padding:10px 16px 0px 14px; line-height: normal;}

.topnav .fa,.topnav .fab {font-size:20px !important; padding: 12px 12px 14px 12px;}
.lhp-sidebar {width: 225px !important}


.lhp-box {background-color:#fff;padding:0.01em 16px;margin:16px 0;box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important}
.lhp-box-content {margin: 2px 8px 8px 8px;}

/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky {position: fixed !important; top: 0; width: 100%; max-width:1140px}

/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .w3-main {padding-top: 40px}

footer {padding-left: 16px; padding-right: 16px; font-size:15px !important}
footer .w3-bar-item {padding: 8px 4px !important;} /* ; display: inline-block !important; float: none !important}  */
footer a, .lhp-links a {text-decoration: none}
footer a:hover, .lhp-links a:hover {text-decoration:underline }
.lhp-footer-fixed { position: fixed; left: 0; bottom: 0;}

/* style unterseiten */
.lhp-text a:not(.footer) {color: #0078a8;}
.lhp-text h2 {padding-top: 32px;}
.lhp-text h3 {padding-top: 24px;}

/* Images */
.lhp-img {display:inline-block !important; background-size:auto; background-position: left; background-repeat: no-repeat }
.lhp-img-logo {width:155px; height:81px; background-size:contain; background-image: url("../images/logo_lhp2024.svg") }
/*.lhp-img-logo-weiss {width:61px; height:32px; background-size:contain; background-image: url("../images/logo_lhp3_weiss2.png") } */
.lhp-img-logo-weiss {width:61px; height:32px; background-size:contain; background-image: url("../images/logo_lhp3_weiss2.svg") }
.lhp-img-appstore {width:120px; height:40px; background-image: url("../images/app-store-40.png") }
.lhp-img-googleplay {width:135px; height:40px; background-image: url("../images/google-play-40.png") }
.lhp-img-app-meinepegel-80 {width:80px; height:80px; background-image: url("../images/logo-meine-pegel_80px.png") }
.lhp-img-app-flyer {width:108px; height:152px; background-image: url("../images/flyer_app.jpg"); vertical-align: text-top;}

/* Statische Karten */
.lhp-warnkarte {width:200px; height:280px;background-image: url("../webservices/get_karte_warnungen.php?size=small")}

/* Fonts */
@font-face { font-family: 'fira sans';
              src: url('../fonts/fira-sans-v10-latin-regular.woff2') format('woff2'),
                  url('../fonts/fira-sans-v10-latin-regular.woff') format('woff'); }

@font-face { font-family: 'fira sans';
             src: url('../fonts/fira-sans-v10-latin-300.woff2') format('woff2'),
                  url('../fonts/fira-sans-v10-latin-300.woff') format('woff');
             font-weight: 300; }

@font-face { font-family: 'ink free';
              src: url('../fonts/ink-free.woff2') format('woff2'),
                   url('../fonts/ink-free.woff') format('woff'); }

/* Überschreibe w3.css */
html, body, h1, h2, h3, h4, h5, h6 {
  font-family: "fira sans", sans-serif }
html, body {font-size:16px !important }

.lhp-ink-free {font-family: "ink free", sans-serif }

.w3-medium {font-size:14px}
.w3-large {font-size:20px !important}

.lhp-light {font-weight: 300}


.w3-round-top {border-top-left-radius:4px; border-top-right-radius:4px}
.w3-round-bottom {border-bottom-left-radius:4px; border-bottom-right-radius:4px}

/* Responsive Design */
/* large = default */
/*  .topnav .w3-bar a.active {background-color:#0f6689; color:#FCD820}*/
.topnav .w3-bar a.active {background-color:#FCD820; color:#000;}
#radar {height: 186px;}

/* Logos weg, wenn zu wenig Platz */
@media (min-width:993px) and (max-height:800px) {
.lhp-logo-hide {display: none;}
}

/* medium und small */
@media (max-width:992px) {
    .topnav .w3-bar a.active {background-color:#0f6689; color:#FFF;}
}

/* medium.. */
@media (max-width:992px) and (min-width:601px)
    { footer {font-size:12px !important}
      #radar {height: 186px !important}
}

/* small... */
@media (max-width:600px) {
	.topnav .symbol {padding: 14px 4px 13px 4px;font-size:16px !important }
     .lhp-img-logo {width:115px; height:60px; background-image: url("../images/logo_lhp3.png") }
     .lhp-logotext { font-size:16px;}
     footer {font-size:10px !important}
     .lhp-bar-twolines {text-align:left !important; line-height: 0.8 !important;}
     #radar {height: auto;}
}

/*Tabelle Startseite*/
table, th, td {
  font-size:12px;
  border: 1px solid #cecece;
  border-collapse: collapse;
}
th, td {
  padding: 5px;
}
td > span{color:#000 !important; font-weight:normal;border: 1px solid #cecece;}
th {
  text-align: left;
}

.lhp-table-large td,.lhp-table-large th {font-size:16px;}

/*Einfärbung aktiv ja/nein oder keine info Link zum Landesportal*/
.lhp-aktiv {background-color: #F1F1F1; color: #000 !important;}
.lhp-aktiv0 {background-color: #CDE0C5; color: #000 !important;}
.lhp-aktiv1 {background-color: #FFFFBF; color: #000 !important;}

.lhp-hwk1 {background-color: #ffff4c; color: #000 !important;}
.lhp-hwk2 {background-color: #ffc04c; color: #000 !important;}
.lhp-hwk3 {background-color: #e74c4c; color: #fff !important;}
.lhp-hwk4 {background-color: #b457b4; color: #fff !important;}
.lhp-img-report{opacity: 0.25;}

.lhp-teaser {
    position: relative;
}
.lhp-logo-ontop {
    position:absolute;
    bottom: 4px;
    right: 4px;
}

.lhp-logo-ontop-top {
    position:absolute;
    top: 4px;
    right: 4px;
}

.lhp-hr {margin:10px 0 6px;}

.lhp-no-underline {text-decoration: none}
.lhp-no-margin {margin:0px;}
.lhp-margin-tiny {margin:4px;}
.lhp-margin-right-tiny {margin-right:4px;}
.lhp-margin-left-tiny {margin-left:4px;}
.lhp-margin-top-tiny {margin-top:4px;}
.lhp-margin-bottom-tiny {margin-bottom:4px;}
.lhp-margin-top-small {margin-top:8px;}
.lhp-margin-bottom-small {margin-bottom:8px;}
.lhp-margin-right-small {margin-right:8px;}
.lhp-margin-left-small {margin-left:8px;}
.lhp-margin-left-12 {margin-left:12px;}
.lhp-margin-top-12 {margin-top:12px;}
.lhp-margin-right-12 {margin-right:12px;}
.lhp-margin-right-24 {margin-right:24px;}
.lhp-margin-left-24 {margin-left:24px;}
.lhp-margin-top-32 {margin-top:32px !important;}
.lhp-margin-left-160 {margin-left:160px;}
.lhp-margin-bottom-48 {margin-bottom:48px;}
.lhp-padding-right-24 {padding-right: 24px !important;}
.lhp-padding-left-24 {padding-left: 24px !important;}
.lhp-padding-bottom-24 {padding-bottom: 24px !important;}
.lhp-padding-tiny {padding:4px;}
.lhp-padding-12 {padding:12px;}

.lhp-max-height {height: 100%;}

.lhp-vertical-align-middle {vertical-align: middle !important;}

.lhp-overflow-x {overflow-x:auto;}
.lhp-flex-grow {flex-grow : 1;}

.lhp-badge {border: none; vertical-align: top}

.lhp-font-bold {font-weight: bold;}
.lhp-font-normal {font-weight: normal;}

.lhp-accordion {transition: 0.5 !important;}
.lhp-font-16 {font-size: 16px;}

.lhp-rotate-344 {rotate: 344deg;}
.lhp-lineheight-1 {line-height: 1.0;}
.lhp-ul-margins li {margin-top:8px;}

.lhp-min-width-260 {min-width:260px;}
.lhp-pointer {cursor:pointer;}