9 files changed, 234 insertions, 162 deletions

diff --git a/views/default/css/admin.php b/views/default/css/admin.php
index 73996a199..dc1b503cb 100644
--- a/views/default/css/admin.php
+++ b/views/default/css/admin.php
@@ -138,27 +138,10 @@ p {
 	visibility: hidden;
 	height: 0 !important;
 	line-height: 0;
+	overflow: hidden;
 	font-size: xx-large;
 	content: " x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x ";
 }
-.hidden {
-	display: none;
-}
-.centered {
-	margin: 0 auto;
-}
-.center {
-	text-align: center;
-}
-.float {
-	float: left;
-}
-.float-alt {
-	float: right;
-}
-.elgg-toggle {
-	cursor: pointer;
-}
 
 /* ***************************************
 	PAGE WRAPPER
@@ -338,6 +321,9 @@ p {
 .elgg-module-main > .elgg-head {
 	margin-bottom: 5px;
 }
+.elgg-module-info > .elgg-head {
+	margin-bottom: 10px;
+}
 .elgg-module-inline {
 	margin: 20px 0;
 }
@@ -412,9 +398,17 @@ p {
 .elgg-item {
 	margin: 3px;
 }
-.elgg-simple-list li {
+.elgg-list-simple li {
 	margin-bottom: 5px;
 }
+.elgg-list-distinct {
+	border-top: 1px dotted #CCCCCC;
+	margin: 5px 0;
+	clear: both;
+}
+.elgg-list-distinct > li {
+	border-bottom: 1px dotted #CCCCCC;
+}
 
 /* ***************************************
 	FORMS AND INPUT
@@ -453,6 +447,9 @@ textarea {
 .elgg-input-thin {
 	width: 400px;
 }
+.elgg-input-natural {
+	width: auto;
+}
 
 .elgg-button {
 	font-size: 14px;
@@ -512,7 +509,7 @@ a.elgg-button {
 }
 
 .elgg-form-settings {
-	max-width: 600px;
+	max-width: 800px;
 }
 
 /* **************************************
@@ -737,6 +734,20 @@ a.elgg-button {
 }
 
 /* ***************************************
+	GENERAL MENU
+*************************************** */
+.elgg-menu-general > li,
+.elgg-menu-general > li > a {
+	display: inline-block;
+	color: #999;
+}
+
+.elgg-menu-general > li:after {
+	content: "\007C";
+	padding: 0 4px;
+}
+
+/* ***************************************
 	HOVER MENU
 *************************************** */
 .elgg-menu-hover {
@@ -819,6 +830,9 @@ a.elgg-button {
 .elgg-menu-hz .elgg-body:after {
 	content: '.';
 }
+.elgg-menu > li:last-child::after {
+	display: none;
+}
 .elgg-menu-admin-footer a {
 	color: #eee;
 }
@@ -1002,66 +1016,6 @@ a.elgg-widget-collapsed:before {
 }
 
 /* ***************************************
-	SPACING (from OOCSS)
-*************************************** */
-.pan{padding:0}
-.pas{padding:5px}
-.pam{padding:10px}
-.pal{padding:20px}
-.ptn{padding-top:0}
-.pts{padding-top:5px}
-.ptm{padding-top:10px}
-.ptl{padding-top:20px}
-.prn{padding-right:0}
-.prs{padding-right:5px}
-.prm{padding-right:10px}
-.prl{padding-right:20px}
-.pbn{padding-bottom:0}
-.pbs{padding-bottom:5px}
-.pbm{padding-bottom:10px}
-.pbl{padding-bottom:20px}
-.pln{padding-left:0}
-.pls{padding-left:5px}
-.plm{padding-left:10px}
-.pll{padding-left:20px}
-.phn{padding-left:0;padding-right:0}
-.phs{padding-left:5px;padding-right:5px}
-.phm{padding-left:10px;padding-right:10px}
-.phl{padding-left:20px;padding-right:20px}
-.pvn{padding-top:0;padding-bottom:0}
-.pvs{padding-top:5px;padding-bottom:5px}
-.pvm{padding-top:10px;padding-bottom:10px}
-.pvl{padding-top:20px;padding-bottom:20px}
-.man{margin:0}
-.mas{margin:5px}
-.mam{margin:10px}
-.mal{margin:20px}
-.mtn{margin-top:0}
-.mts{margin-top:5px}
-.mtm{margin-top:10px}
-.mtl{margin-top:20px}
-.mrn{margin-right:0}
-.mrs{margin-right:5px}
-.mrm{margin-right:10px}
-.mrl{margin-right:20px}
-.mbn{margin-bottom:0}
-.mbs{margin-bottom:5px}
-.mbm{margin-bottom:10px}
-.mbl{margin-bottom:20px}
-.mln{margin-left:0}
-.mls{margin-left:5px}
-.mlm{margin-left:10px}
-.mll{margin-left:20px}
-.mhn{margin-left:0;margin-right:0}
-.mhs{margin-left:5px;margin-right:5px}
-.mhm{margin-left:10px;margin-right:10px}
-.mhl{margin-left:20px;margin-right:20px}
-.mvn{margin-top:0;margin-bottom:0}
-.mvs{margin-top:5px;margin-bottom:5px}
-.mvm{margin-top:10px;margin-bottom:10px}
-.mvl{margin-top:20px;margin-bottom:20px}
-
-/* ***************************************
 	ICONS
 *************************************** */
 .elgg-icon {
@@ -1351,3 +1305,116 @@ table.mceLayout {
 .elgg-output dd {
 	margin: 0 0 1em 2em;
 }
+
+/* ***************************************
+	HELPERS
+*************************************** */
+.hidden {
+	display: none;
+}
+.centered {
+	margin: 0 auto;
+}
+.center {
+	text-align: center;
+}
+.float {
+	float: left;
+}
+.float-alt {
+	float: right;
+}
+.elgg-toggle {
+	cursor: pointer;
+}
+.elgg-discover .elgg-discoverable {
+	display: none;
+}
+.elgg-discover:hover .elgg-discoverable {
+	display: block;
+}
+.elgg-transition:hover {
+	opacity: .7;
+}
+
+/* ***************************************
+	BORDERS AND SEPARATORS
+*************************************** */
+.elgg-border-plain {
+	border: 1px solid #eeeeee;
+}
+.elgg-border-transition {
+	border: 1px solid #eeeeee;
+}
+.elgg-divide-top {
+	border-top: 1px solid #CCCCCC;
+}
+.elgg-divide-bottom {
+	border-bottom: 1px solid #CCCCCC;
+}
+.elgg-divide-left {
+	border-left: 1px solid #CCCCCC;
+}
+.elgg-divide-right {
+	border-right: 1px solid #CCCCCC;
+}
+
+/* ***************************************
+	SPACING (from OOCSS)
+*************************************** */
+.pan{padding:0}
+.pas{padding:5px}
+.pam{padding:10px}
+.pal{padding:20px}
+.ptn{padding-top:0}
+.pts{padding-top:5px}
+.ptm{padding-top:10px}
+.ptl{padding-top:20px}
+.prn{padding-right:0}
+.prs{padding-right:5px}
+.prm{padding-right:10px}
+.prl{padding-right:20px}
+.pbn{padding-bottom:0}
+.pbs{padding-bottom:5px}
+.pbm{padding-bottom:10px}
+.pbl{padding-bottom:20px}
+.pln{padding-left:0}
+.pls{padding-left:5px}
+.plm{padding-left:10px}
+.pll{padding-left:20px}
+.phn{padding-left:0;padding-right:0}
+.phs{padding-left:5px;padding-right:5px}
+.phm{padding-left:10px;padding-right:10px}
+.phl{padding-left:20px;padding-right:20px}
+.pvn{padding-top:0;padding-bottom:0}
+.pvs{padding-top:5px;padding-bottom:5px}
+.pvm{padding-top:10px;padding-bottom:10px}
+.pvl{padding-top:20px;padding-bottom:20px}
+.man{margin:0}
+.mas{margin:5px}
+.mam{margin:10px}
+.mal{margin:20px}
+.mtn{margin-top:0}
+.mts{margin-top:5px}
+.mtm{margin-top:10px}
+.mtl{margin-top:20px}
+.mrn{margin-right:0}
+.mrs{margin-right:5px}
+.mrm{margin-right:10px}
+.mrl{margin-right:20px}
+.mbn{margin-bottom:0}
+.mbs{margin-bottom:5px}
+.mbm{margin-bottom:10px}
+.mbl{margin-bottom:20px}
+.mln{margin-left:0}
+.mls{margin-left:5px}
+.mlm{margin-left:10px}
+.mll{margin-left:20px}
+.mhn{margin-left:0;margin-right:0}
+.mhs{margin-left:5px;margin-right:5px}
+.mhm{margin-left:10px;margin-right:10px}
+.mhl{margin-left:20px;margin-right:20px}
+.mvn{margin-top:0;margin-bottom:0}
+.mvs{margin-top:5px;margin-bottom:5px}
+.mvm{margin-top:10px;margin-bottom:10px}
+.mvl{margin-top:20px;margin-bottom:20px}
diff --git a/views/default/css/elements/components.php b/views/default/css/elements/components.php
index f675ab7cb..77313fa1a 100644
--- a/views/default/css/elements/components.php
+++ b/views/default/css/elements/components.php
@@ -7,17 +7,6 @@
  * @package Elgg.Core
  * @subpackage UI
  */
-/**
- * elgg-body fills the space available to it.
- * It uses hidden text to expand itself. The combination of auto width, overflow
- * hidden, and the hidden text creates this effect.
- *
- * This allows us to float fixed width divs to either side of an .elgg-body div
- * without having to specify the body div's width.
- *
- * @todo check what happens with long <pre> tags or large images
- * @todo Move this to its own file -- it is very complicated and should not have to be overridden.
- */
 ?>
 
 /* ***************************************
diff --git a/views/default/css/elements/core.php b/views/default/css/elements/core.php
index 627cae55c..74f21ee59 100644
--- a/views/default/css/elements/core.php
+++ b/views/default/css/elements/core.php
@@ -46,13 +46,28 @@
 	*overflow:visible;
 }
 
-<?php //@todo isn't this only needed if we use display:table-cell? ?>
+<?php
+/**
+ * elgg-body fills the space available to it.
+ * It uses hidden text to expand itself. The combination of auto width, overflow
+ * hidden, and the hidden text creates this effect.
+ *
+ * This allows us to float fixed width divs to either side of an .elgg-body div
+ * without having to specify the body div's width.
+ *
+ * @todo check what happens with long <pre> tags or large images
+ * @todo Move this to its own file -- it is very complicated and should not have to be overridden.
+ */
+
+//@todo isn't this only needed if we use display:table-cell?
+?>
 .elgg-body:after,
 .elgg-col-last:after {
 	display: block;
 	visibility: hidden;
 	height: 0 !important;
 	line-height: 0;
+	overflow: hidden;
 	
 	/* Stretch to fill up available space */
 	font-size: xx-large;
@@ -68,8 +83,9 @@
 /* Enabled nesting of dropdown/flyout menus */
 .elgg-menu > li { position: relative; }
 
-/* Separators should only come between list items */
-.elgg-menu > li:last-child:after { display: none } 
+.elgg-menu > li:last-child::after {
+	display: none;
+}
 
 /* Maximize click target */
 .elgg-menu > li > a { display: block }
diff --git a/views/default/css/elements/forms.php b/views/default/css/elements/forms.php
index d14c341a7..81db81747 100644
--- a/views/default/css/elements/forms.php
+++ b/views/default/css/elements/forms.php
@@ -41,7 +41,7 @@ input, textarea {
 	box-sizing: border-box;
 }
 
-input:focus, textarea:focus {
+input[type=text]:focus, textarea:focus {
 	border: solid 1px #4690d6;
 	background: #e4ecf5;
 	color:#333;
@@ -72,7 +72,7 @@ input[type="radio"] {
 	width:auto;
 }
 .elgg-input-checkboxes.elgg-horizontal li,
-.elgg-input-radio.elgg-horizontal li {
+.elgg-input-radios.elgg-horizontal li {
 	display: inline;
 	padding-right: 10px;
 }
diff --git a/views/default/css/elements/helpers.php b/views/default/css/elements/helpers.php
index e6f59260d..e9a9e0a30 100644
--- a/views/default/css/elements/helpers.php
+++ b/views/default/css/elements/helpers.php
@@ -33,27 +33,10 @@
 	float: right;
 }
 
-.right {
-	float: right;
-}
-
-.left {
-	float: left;
-}
-
 .link {
 	cursor: pointer;
 }
 
-<?php @todo // do we need something like large and small? ?>
-.large {
-	font-size: 120%;
-}
-
-.small {
-	font-size: 80%;
-}
-
 .elgg-discover .elgg-discoverable {
 	display: none;
 }
diff --git a/views/default/css/elements/navigation.php b/views/default/css/elements/navigation.php
index bf1046dda..d5b20896a 100644
--- a/views/default/css/elements/navigation.php
+++ b/views/default/css/elements/navigation.php
@@ -130,9 +130,9 @@
 }
 
 .elgg-menu-topbar > li > a {
-	padding: 2px 15px 0;
+	padding-top: 2px;
 	color: #eee;
-	margin-top: 1px;
+	margin: 1px 15px 0;
 }
 
 .elgg-menu-topbar > li > a:hover {
@@ -372,7 +372,10 @@
 	position: absolute;
 	z-index: 10000;
 
-	width: 165px;
+	overflow: hidden;
+
+	min-width: 165px;
+	max-width: 250px;
 	border: solid 1px;
 	border-color: #E5E5E5 #999 #999 #E5E5E5;
 	background-color: #FFF;
diff --git a/views/default/css/elements/typography.php b/views/default/css/elements/typography.php
index f080a29b2..d93b28d2c 100644
--- a/views/default/css/elements/typography.php
+++ b/views/default/css/elements/typography.php
@@ -139,7 +139,7 @@ h6 { font-size: 0.8em; }
 .elgg-output dt { font-weight: bold }
 .elgg-output dd { margin: 0 0 1em 1em }
 
-.elgg-output ul, ol {
+.elgg-output ul, .elgg-output ol {
 	margin: 0 1.5em 1.5em 0;
 	padding-left: 1.5em;
 }
diff --git a/views/default/css/ie7.php b/views/default/css/ie7.php
index 754ed3664..db0125b4b 100644
--- a/views/default/css/ie7.php
+++ b/views/default/css/ie7.php
@@ -53,4 +53,13 @@
 
 .elgg-avatar {
 	display: inline;
+}
+
+.elgg-body-walledgarden .elgg-col-1of2 {
+	width: 255px;
+}
+
+.elgg-module-walledgarden > .elgg-head,
+.elgg-module-walledgarden > .elgg-foot {
+	width: 530px;
 }
\ No newline at end of file
diff --git a/views/default/css/walled_garden.php b/views/default/css/walled_garden.php
index 47850425b..ea2543587 100644
--- a/views/default/css/walled_garden.php
+++ b/views/default/css/walled_garden.php
@@ -6,36 +6,65 @@
 $url = elgg_get_site_url();
 
 ?>
-#elgg-walledgarden {
+.elgg-body-walledgarden {
 	margin: 100px auto 0 auto;
-	width: 563px;
-	min-height: 230px;
-	background: url(<?php echo $url; ?>_graphics/walled_garden_background_top.gif) no-repeat left top;
-	padding: 0;
 	position: relative;
+	width: 530px;
 }
-
-#elgg-walledgarden-bottom {
-	margin:0 auto;
-	background: url(<?php echo $url; ?>_graphics/walled_garden_background_bottom.gif) no-repeat left bottom;
-	width:563px;
-	height:54px;
+.elgg-module-walledgarden {
+	position: absolute;
+	top: 0;
+	left: 0;
+}
+.elgg-module-walledgarden > .elgg-head {
+	height: 17px;
+}
+.elgg-module-walledgarden > .elgg-body {
+	padding: 0 10px;
+}
+.elgg-module-walledgarden > .elgg-foot {
+	height: 17px;
+}
+.elgg-walledgarden-double > .elgg-head {
+	background: url(<?php echo $url; ?>_graphics/walled_garden/two_column_top.png) no-repeat left top;
+}
+.elgg-walledgarden-double > .elgg-body {
+	background: url(<?php echo $url; ?>_graphics/walled_garden/two_column_middle.png) repeat-y left top;
+}
+.elgg-walledgarden-double > .elgg-foot {
+	background: url(<?php echo $url; ?>_graphics/walled_garden/two_column_bottom.png) no-repeat left top;
+}
+.elgg-walledgarden-single > .elgg-head {
+	background: url(<?php echo $url; ?>_graphics/walled_garden/one_column_top.png) no-repeat left top;
+}
+.elgg-walledgarden-single > .elgg-body {
+	background: url(<?php echo $url; ?>_graphics/walled_garden/one_column_middle.png) repeat-y left top;
+}
+.elgg-walledgarden-single > .elgg-foot {
+	background: url(<?php echo $url; ?>_graphics/walled_garden/one_column_bottom.png) no-repeat left top;
 }
 
-#elgg-walledgarden-intro {
-	width: 230px;
-	float: left;
-	margin: 35px 15px 15px 35px;
+.elgg-col > .elgg-inner {
+	margin: 0 0 0 5px;
+}
+.elgg-col:first-child > .elgg-inner {
+	margin: 0 5px 0 0;
+}
+.elgg-col > .elgg-inner {
+	padding: 0 8px;
 }
 
-#elgg-walledgarden-intro ul {
-	float: left;
+.elgg-walledgarden-single > .elgg-body > .elgg-inner {
+	padding: 0 8px;
 }
 
-#elgg-walledgarden-login {
-	width: 230px;
-	float: left;
-	margin: 30px 15px 45px 19px;
+.elgg-module-walledgarden-login {
+	margin: 0;
+}
+.elgg-body-walledgarden h3 {
+	font-size: 1.5em;
+	line-height: 1.1em;
+	padding-bottom: 5px;
 }
 
 .elgg-heading-walledgarden {
@@ -43,27 +72,3 @@ $url = elgg_get_site_url();
 	margin-top: 60px;
 	line-height: 1.1em;
 }
-
-#elgg-walledgarden-lostpassword,
-#elgg-walledgarden-registration {
-	position: absolute;
-	right: 0;
-	top: 0;
-	width: 563px;
-	background-color: white;
-	padding: 0;
-	background: url(<?php echo $url; ?>_graphics/walled_garden_backgroundfull_top.gif) no-repeat left top;
-	height: auto;
-}
-
-.elgg-hiddenform-body {
-	padding: 30px 40px 0 40px;
-	height: auto;
-}
-.elgg-hiddenform-bottom {
-	margin: 0 auto;
-	background: url(<?php echo $url; ?>_graphics/walled_garden_backgroundfull_bottom.gif) no-repeat left bottom;
-	width: 563px;
-	height: 54px;
-	position: relative;
-}