@charset "UTF-8";
/* CSS Document */

* {top:0; left:0; margin:0; padding:0;}

body {position:absolute; width:100%; height:auto;}

h1 {font-family: sans-serif; font-weight:200; font-size:36px; line-height:48px; color:#000000;}
h2 {font-family: sans-serif; font-weight:200; font-size:24px; line-height:36px; color:#000000;}
h3 {font-family: sans-serif; font-weight:200; font-size:18px; line-height:30px; color:#000000;}
h4 {font-family: sans-serif; font-weight:400; font-size:18px; line-height:30px; color:#000000;}

li {font-family: sans-serif; font-weight:200; font-size:16px; line-height:28px; color:#000000;}

p {font-family: sans-serif; font-weight:100; font-size:16px; line-height: 28px; color:#222222;}

a {font-size:16px; text-decoration:none;}
a:hover {cursor:pointer; text-decoration:none;}

.visible {display:block;}

.element {width:70%; margin-left:50%; transform:translate(-50%,0); max-width:1280px; z-index:0;}

.element_full {width:100%;}

.avatar {position:sticky; top:80px; left:60%; width:40%; height:auto; float:right; background-image:url(graphik/prof_dr_med_heinrich_fuerst.jpg); background-size:cover;}

.profil {width:60%; height:auto;}

.heinrich_fuerst_surgeon {padding:100px;}

.chapter {padding: 0px 0px 40px 0px; text-align:center;}

.textblock {padding:80px 80px 120px 80px;}

.center {text-align:center;}

.left {text-align:left;}

#logo {margin:100px;}

#mail_icon {height:120px; width:120px; margin-top:60px; margin-left:50%; transform: translate(-60px, 0); background-image:url(graphik/mail_icon.svg); background-size: 200% auto; background-position:left; cursor:pointer;}

#mail_icon:hover {background-position:right;}


#focus-gesundheit {background-color:#ee001b; background-image:url(graphik/focus_gesundheit_top_mediziner.jpg); background-position:center; background-size:cover; background-attachment:fixed;}


@media screen and ( orientation: portrait ) {
	
	.avatar {position:relative; top:0px; left:0%; width:100%; height:auto; float:none;}
	
	.element {width:70%; margin-left:50%; transform:translate(-50%,0);}
	
	.profil {width:100%; height:auto;}
	
	.description {padding:40px;}
	
	#logo {margin:100px;}
	
	#focus-gesundheit {background-attachment:scroll;}
	
}

@media screen and ( orientation: portrait ) and (max-width:720px) {
	
	.visible {display:none;}
	
	.avatar {position:relative; top:0px; left:0%; width:100%; height:auto; float:none;}
	
	.element {width:100%; margin-left:50%; transform:translate(-50%,0);}
	
	.profil {width:100%; height:auto;}
	
	.heinrich_fuerst_surgeon {padding:60px;}
	
	.description {padding:40px;}
	
	.textblock {padding:60px 60px 80px 60px;}
	
	#logo {margin:60px;}
	
	#focus-gesundheit {background-attachment:scroll;}

	
}