/* listen-it.de (D343): Stil der Website (stil.css) mit den Akzenten von Listen-It. Hellblau #2E75B6 wie der Streifen von
   Briefbogen und Signatur ersetzt das MessNode-Orange (Marken-Strich, Fokussaum, Pfeile); stil.css bleibt unverändert, damit
   messnode.de nicht mitgeändert wird. Strenge Richtlinie: nur eigene Dateien, nichts Eingebettetes. */
.li{--orange:#2E75B6}
/* Kopf wie der Briefbogen: navy Linie mit hellblauem Streifen darunter */
.li .kopf{border-bottom:3px solid var(--navy);box-shadow:0 2px 0 #2E75B6}
.wm-li{display:block;flex:none;line-height:0}
.wm-li img{width:131px;height:44px}
.wm-fuss{margin:0 0 18px;font:600 30px/1 var(--sans);letter-spacing:-.01em;color:#fff}
.wm-fuss span{display:block;margin-top:9px;font:500 10.5px/1 var(--mono);letter-spacing:.31em;text-transform:uppercase;color:#AEBBCB}
/* Unsere Produkte: vier Kacheln nebeneinander, darunter zwei, am Handy eine */
.loesungen.vier-kacheln{grid-template-columns:repeat(4,1fr)}
.loesungen.vier-kacheln .loesung{grid-column:auto}
@media (max-width:1100px){.loesungen.vier-kacheln{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.loesungen.vier-kacheln{grid-template-columns:1fr}}
.loesungen.drei-kacheln{grid-template-columns:repeat(3,1fr)}
.loesungen.drei-kacheln .loesung{grid-column:auto}
@media (max-width:900px){.loesungen.drei-kacheln{grid-template-columns:1fr}}
@media (max-width:374px){.wm-li img{width:113px;height:38px}}

/* Fuß: die Kontaktspalte etwas breiter, damit die E-Mail-Adresse nicht im Wort umbricht */
.li .fuss .w{grid-template-columns:2fr 1fr 1fr 1fr 1.3fr}
.li .fuss a[href^="mailto:"]{white-space:nowrap}
@media (max-width:900px){.li .fuss .w{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.li .fuss .w{grid-template-columns:1fr}}