/*kontakt.css - Version 2.0, by Markus Büsser
All associated graphics copyright © 2025, Markus Büsser
Erstellt am: 08.03.2020
Zuletzt geändert am: 22.03.2025*/

p.kontakt{width:100%;margin:10px 0 10px;clear:both;}

div.kontaktliste {width:100%;margin:0 0 50px;padding:0;clear:both;}
div.kontaktdaten {width:calc(100% - 20px);margin:0;padding:5px 10px;clear:both;display:table;}

div.name {position:relative;float:left; width:100%;}
div.tel {position:relative;float:left; width:100%;clear:both;}
div.mail {position:relative;float:left; width:100%;}
div.mail input {position:relative;float:left; width:auto;}

div.kontaktdaten p {width:100%;margin:0;padding:0;text-align:left;}

div.kontaktdaten_praxis {margin:10px 0 0 10px; padding:20px 0 0;}

div.kontaktdaten:hover, div.kontaktdaten_praxis:hover {background:#262626;}


/* Light Theme
@media screen and (prefers-color-scheme: light) { 
div.kontaktdaten:hover, div.kontaktdaten_praxis:hover {background:#e9e9e9;}} */


/* Für Bildschirmgrösse: 16px zusätzlich zu berechneter Grösse (wird von Browsern als Rand dazugezählt!) */
@media only screen and (min-width:300px) {
div.kontaktdaten {width:calc(100% - 20px);}
div.tel {width:calc(100% - 80px);}
div.mail {width:80px;}}

@media only screen and (min-width:345px) {
div.kontaktliste {width:270px;margin:0 auto 50px;padding:0;clear:both;}
div.kontaktdaten {width:calc(100% - 20px);}
div.kontaktdaten_praxis {width:270px;margin:-10px auto 0;}
div.tel {width:170px;}}

@media only screen and (min-width:433px) {
div.kontaktliste {margin:0 40px 50px;}
div.kontaktdaten_praxis {width:calc(100% - 100px);margin:-10px 50px 0;}}

@media only screen and (min-width:660px) {
div.kontaktliste {width:calc(100% - 80px);}
div.kontaktdaten {width:calc(100% - 20px);}
div.name {position:relative;float:left; width:50%;}
div.tel {position:relative;float:left; width:calc(50% - 80px);clear:none;}
div.mail {position:relative;float:right;}
div.mail input {position:relative;float:right; width:auto;}}

@media only screen and (min-width:850px) {
div.kontaktdaten {width:578px;}}