+// dimensions
+@site-width: 940px;
+@nav-width: 200px;
+@site-gutter-width: 18px;
+@site-main-body-width: @site-width - 2*@site-gutter-width - @nav-width;
+
+// colors
+@site-header-color: #ddf;
+@nav-color: #dff;
+@site-body-color: #fff;
+@site-window-color: #eee;
+@site-footer-color: #ddf;
+@site-gutter-color: #fff;
+
+header, hgroup, section, footer, aside, nav, article, figure, img {
+ display: block;
+}
+
+body {
+ margin: 0;
+ padding: 0;
+ color: #000;
+ background: @site-window-color;
+ font: 14px "Verdana", sans-serif;
+}
+
+#centerer {
+ position: relative;
+ background: @nav-color;
+ margin: 15 auto;
+ width: @site-width;
+ -moz-box-shadow: 2px 2px 15px #777;
+ -webkit-box-shadow: 2px 2px 15px #777;
+ box-shadow: 2px 2px 13px #777;
+}
+
+header {
+ width: @site-width;
+ height: 100px;
+ background: @site-header-color;
+}
+
+@nav-padding: 10px;
+nav {
+ float: left;
+ width: @nav-width - 2*@nav-padding;
+ padding: @nav-padding;
+ background: @nav-color;
+ a {
+ display: block;
+ }
+}
+
+#main-body {
+ float: left;
+ width: @site-main-body-width;
+ padding: @site-gutter-width @site-gutter-width @site-gutter-width @site-gutter-width;
+ background: @site-body-color;
+}
+
+footer {
+ clear: both;
+ width: @site-width;
+ height: 50px;
+ background: @site-footer-color;
+}
+