First attempt at re-designing the Individual page header area, as discussed on forum and emails.

Needs CAREFUL review.

1 files changed, 34 insertions, 19 deletions

diff --git a/themes/webtrees/style.css b/themes/webtrees/style.css
index 7b9dc97189..6590b9ad35 100644
--- a/themes/webtrees/style.css
+++ b/themes/webtrees/style.css
@@ -330,14 +330,15 @@ a:hover .nameZoom {
 	color: #333;
 	font: bold 16px tahoma, arial, helvetica, sans-serif;
 	letter-spacing: .2px;
+	line-height:	2;
+	padding: 0 5px;
 }
 
 .date {
 	color: #333377;
 }
 
-.label, .field {
-	font: 11px tahoma, arial, helvetica, sans-serif;
+.field {
 }
 
 .label {
@@ -364,6 +365,7 @@ a:hover .nameZoom {
 
 .indent {
 	padding-left: 7px;
+/*	position: absolute;*/
 }
 
 .indent_rtl {
@@ -1432,42 +1434,55 @@ text-align: center;
 }
 
 dl {
-	margin-bottom:20px;
+	/*margin-top:10px;*/
+	margin: 0;
 }
 
 dt {
 	float:left; 
 	font-weight:bold;
-	margin-right:10px;
-	clear:both; 
+	margin-right:10px; 
+	clear:both;
 }
 
-#indi_details dt:after { content: ":"; }
+#indi_top {
+}
 
-#facts_content dd {
-	float:left;
-	width: 70%;
+#indi_name {
+	vertical-align:	top;
+	width: 45%;
 }
 
-#indi_mainimage, #nameparts1, #nameparts2, #nameparts3, #nameparts4, #sex, #mainfacts {
-	float:left;
-	margin-right:15px;
-	max-width:	25%;
+#indi_name a {
+	color: #333377;
+}
+
+#indi_details {
+	display: block;
+/*	white-space: nowrap;*/
+margin-left: 15px;
+}
+
+#indi_details dt:after { content: ":"; }
+
+
+#indi_mainimage, #nameparts, #sex, #mainfacts {
+	margin-right:25px;
+	vertical-align:	top;
 }
 
 #hitcounter {
 	display: block;
-	width: 100%;
 	margin-bottom:10px;
 }
 
-.clearfloat {
-	clear: both;
+#facts_content dd {
+	float:left;
+	width: 70%;
 }
 
-#indi_details {
-	display: block;
-	width: 100%;
+.clearfloat {
+	clear: both;
 }
 
 /* tables for Module Admin tab */