187 files changed, 2081 insertions, 1618 deletions

diff --git a/WebContent/VAADIN/themes/base/absolutelayout/absolutelayout.css b/WebContent/VAADIN/themes/base/absolutelayout/absolutelayout.css
deleted file mode 100644
index b2c2ed2858..0000000000
--- a/WebContent/VAADIN/themes/base/absolutelayout/absolutelayout.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.v-absolutelayout-wrapper {
-	position: absolute;
-	overflow: hidden;
-}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/absolutelayout/absolutelayout.scss b/WebContent/VAADIN/themes/base/absolutelayout/absolutelayout.scss
new file mode 100644
index 0000000000..ddb030c00f
--- /dev/null
+++ b/WebContent/VAADIN/themes/base/absolutelayout/absolutelayout.scss
@@ -0,0 +1,19 @@
+@mixin base-absolutelayout {
+
+.v-absolutelayout-wrapper {
+	position: absolute;
+	overflow: hidden;
+}
+.v-absolutelayout-margin, .v-absolutelayout-canvas {
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+.v-absolutelayout.v-has-height > div, .v-absolutelayout.v-has-height > div > div {
+	height: 100%;
+}
+.v-absolutelayout.v-has-width > div, .v-absolutelayout.v-has-width > div > div {
+	width: 100%;
+}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/accordion/accordion.css b/WebContent/VAADIN/themes/base/accordion/accordion.scss
index ad762ee0ac..6f4825f16b 100644
--- a/WebContent/VAADIN/themes/base/accordion/accordion.css
+++ b/WebContent/VAADIN/themes/base/accordion/accordion.scss
@@ -1,8 +1,10 @@
+@mixin base-accordion {
+
 .v-accordion {
 	position: relative;
 	outline: none;
 	overflow: hidden;
-	text-align: left /* Force default alignment */
+	text-align: left; /* Force default alignment */
 }
 .v-accordion-item {
 	position: relative;
@@ -23,4 +25,6 @@
 .v-accordion-item-content {
 	position: absolute;
 	width: 100%;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/base.scss b/WebContent/VAADIN/themes/base/base.scss
new file mode 100644
index 0000000000..58f0c32af7
--- /dev/null
+++ b/WebContent/VAADIN/themes/base/base.scss
@@ -0,0 +1,34 @@
+@import "absolutelayout/absolutelayout.scss";
+@import "accordion/accordion.scss";
+@import "button/button.scss";
+@import "caption/caption.scss";
+@import "common/common.scss";
+@import "csslayout/csslayout.scss";
+@import "customcomponent/customcomponent.scss";
+@import "customlayout/customlayout.scss";
+@import "datefield/datefield.scss";
+@import "dragwrapper/dragwrapper.scss";
+@import "embedded/embedded.scss";
+@import "formlayout/formlayout.scss";
+@import "gridlayout/gridlayout.scss";
+@import "label/label.scss";
+@import "link/link.scss";
+@import "loginform/loginform.scss";
+@import "menubar/menubar.scss";
+@import "notification/notification.scss";
+@import "orderedlayout/orderedlayout.scss";
+@import "paintable/paintable.scss";
+@import "panel/panel.scss";
+@import "popupview/popupview.scss";
+@import "progressindicator/progressindicator.scss";
+@import "select/select.scss";
+@import "shadow/shadow.scss";
+@import "slider/slider.scss";
+@import "splitpanel/splitpanel.scss";
+@import "table/table.scss";
+@import "tabsheet/tabsheet.scss";
+@import "textfield/textfield.scss";
+@import "tree/tree.scss";
+@import "treetable/treetable.scss";
+@import "upload/upload.scss";
+@import "window/window.scss";
diff --git a/WebContent/VAADIN/themes/base/button/button.css b/WebContent/VAADIN/themes/base/button/button.scss
index 48d30d4576..1d3c4abec1 100644
--- a/WebContent/VAADIN/themes/base/button/button.css
+++ b/WebContent/VAADIN/themes/base/button/button.scss
@@ -1,3 +1,5 @@
+@mixin base-button {
+
 /*
  * Default button (more customizable)
  * -------------------------------------- */
@@ -29,14 +31,6 @@
 	cursor: default;
 }
 
-.v-ie6 .v-button {
-	display: inline;
-}
-
-.v-ie7 .v-button {
-   display: inline;
-}
-
 .v-button-wrap,
 .v-button-caption {
 	vertical-align: middle;
@@ -117,10 +111,7 @@
 	zoom: 1;
 	float: none;
 }
-/* Fixes streched buttons in IE6 and IE7*/
-.v-ie6 .v-nativebutton {
-	width: 1px;
-}
+/* Fixes stretched buttons in IE7*/
 .v-ie .v-nativebutton {
 	overflow: visible;
 	padding-left: 1em;
@@ -147,12 +138,6 @@
 	white-space: nowrap;
 }
 
-/* Fix for IE6/IE7 issue where checkbox moves 1 pixel down after selection (#4636) */
-.v-ie6 .v-checkbox,
-.v-ie7 .v-checkbox {
-	vertical-align: baseline;
-}
-
 .v-checkbox .v-icon {
 	margin: 0 2px;
 }
@@ -173,4 +158,6 @@
 .v-checkbox-required {
 	background: #ffe0e0;
 }
-*/
\ No newline at end of file
+*/
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/caption/caption.css b/WebContent/VAADIN/themes/base/caption/caption.css
deleted file mode 100644
index bdeaae3de2..0000000000
--- a/WebContent/VAADIN/themes/base/caption/caption.css
+++ /dev/null
@@ -1,45 +0,0 @@
-.v-captionwrapper {
-	text-align: left; /* Force default alignment */
-}
-.v-caption {
-	overflow: hidden;
-	white-space: nowrap;
-}
-.v-errorindicator {
-	float: left;
-}
-.v-caption .v-icon {
-	float: left;
-	padding-right: 2px;
-	vertical-align: middle;
-}
-.v-caption .v-captiontext {
-	float: left;
-	overflow: hidden;
-	vertical-align: middle;
-}
-.v-caption .v-required-field-indicator {
-	float: left;
-}
-
-.v-caption-clearelem {
-	clear: both;
-	width: 0;
-	height: 0;
-	overflow: hidden;
-}
-
-/* Fix IE6 "double-float-margin-bug" */
-.v-ie6 .v-errorindicator,
-.v-ie6 .v-icon,
-.v-ie6 .v-captiontext,
-.v-ie6 .v-required-field-indicator {
-	display: inline;
-}
-
-.v-ie9 .v-gridlayout-margin>div>div>.v-caption,
-.v-ie9 .v-verticallayout>div>div>.v-caption,
-.v-ie9 .v-horizontallayout>div>div>.v-caption {
-	/* Fix possible sub pixel rounding errors that cause error indicators to drop */
-	margin-right:-0.5px;
-}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/caption/caption.scss b/WebContent/VAADIN/themes/base/caption/caption.scss
new file mode 100644
index 0000000000..c6fd124ad6
--- /dev/null
+++ b/WebContent/VAADIN/themes/base/caption/caption.scss
@@ -0,0 +1,27 @@
+@mixin base-caption {
+
+.v-captionwrapper {
+	text-align: left; /* Force default alignment */
+}
+.v-caption {
+	overflow: hidden;
+	white-space: nowrap;
+}
+.v-errorindicator {
+	display: inline-block;
+}
+.v-caption .v-icon {
+	display: inline-block;
+	padding-right: 2px;
+	vertical-align: middle;
+}
+.v-caption .v-captiontext {
+	display: inline-block;
+	overflow: hidden;
+	vertical-align: middle;
+}
+.v-caption .v-required-field-indicator {
+	display: inline-block;
+}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/common/common.css b/WebContent/VAADIN/themes/base/common/common.scss
index 74ed21bd1a..40bea2c9d6 100644
--- a/WebContent/VAADIN/themes/base/common/common.css
+++ b/WebContent/VAADIN/themes/base/common/common.scss
@@ -1,3 +1,5 @@
+@mixin base-common {
+
 /* References the BODY tag generated by Vaadin application servlet */
 .v-generated-body {
 	width: 100%;
@@ -31,9 +33,12 @@ div.v-app-loading {
 	width: 100%;
 	/* avoid scrollbars with margins in root layout */
 	outline: none;
+	position: relative;
+}
+/* Prevent margin collapse */
+.v-view.v-view-embedded {
 	margin-top: -1px;
 	border-top: 1px solid transparent;
-	position: relative;
 }
 /**
  * Try to handle printing somehow. Reasonable printing support 
@@ -89,7 +94,15 @@ div.v-app-loading {
 	border: none;
 	padding: 0;
 	margin: 0;
+	height: 100%;
+}
+.v-form-content {
+	height: 100%;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
 }
+
 /* Field modified */ /* Disabled by default
 .v-modified,
 .v-richtextarea.v-modified iframe.gwt-RichTextArea,
@@ -231,6 +244,12 @@ div.v-app-loading {
 	cursor: default;
 }
 
+.v-clip {
+	overflow: hidden;
+}
+
 .v-scrollable {
 	overflow: auto;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/csslayout/csslayout.css b/WebContent/VAADIN/themes/base/csslayout/csslayout.css
deleted file mode 100644
index 1f85d6f460..0000000000
--- a/WebContent/VAADIN/themes/base/csslayout/csslayout.css
+++ /dev/null
@@ -1,15 +0,0 @@
-.v-csslayout {
-	overflow: hidden;
-}
-.v-csslayout-margin-top {
-	padding-top: 12px;	
-}
-.v-csslayout-margin-bottom {
-	padding-bottom: 12px;	
-}
-.v-csslayout-margin-left {
-	padding-left: 12px;	
-}
-.v-csslayout-margin-right {
-	padding-right: 12px;	
-}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/csslayout/csslayout.scss b/WebContent/VAADIN/themes/base/csslayout/csslayout.scss
new file mode 100644
index 0000000000..7bd26d4197
--- /dev/null
+++ b/WebContent/VAADIN/themes/base/csslayout/csslayout.scss
@@ -0,0 +1,32 @@
+@mixin base-csslayout {
+
+.v-csslayout {
+	overflow: hidden;
+}
+.v-csslayout-margin, .v-csslayout-container {
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+.v-has-width > .v-csslayout-margin,
+.v-has-width > .v-csslayout-margin > .v-csslayout-container {
+	width: 100%;
+}
+.v-has-height > .v-csslayout-margin,
+.v-has-height > .v-csslayout-margin > .v-csslayout-container {
+	height: 100%;
+}
+.v-csslayout-margin-top {
+	padding-top: 12px;	
+}
+.v-csslayout-margin-bottom {
+	padding-bottom: 12px;	
+}
+.v-csslayout-margin-left {
+	padding-left: 12px;	
+}
+.v-csslayout-margin-right {
+	padding-right: 12px;	
+}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/customcomponent/customcomponent.css b/WebContent/VAADIN/themes/base/customcomponent/customcomponent.scss
index f6cfd31390..aaf3e75251 100644
--- a/WebContent/VAADIN/themes/base/customcomponent/customcomponent.css
+++ b/WebContent/VAADIN/themes/base/customcomponent/customcomponent.scss
@@ -1,3 +1,7 @@
+@mixin base-customcomponent {
+
 .v-customcomponent {
 	overflow: hidden;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/customlayout/customlayout.css b/WebContent/VAADIN/themes/base/customlayout/customlayout.scss
index b9c20dbbf8..26e1538d29 100644
--- a/WebContent/VAADIN/themes/base/customlayout/customlayout.css
+++ b/WebContent/VAADIN/themes/base/customlayout/customlayout.scss
@@ -1,3 +1,7 @@
+@mixin base-customlayout {
+
 .v-customlayout {
 	overflow: hidden;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/datefield/datefield.css b/WebContent/VAADIN/themes/base/datefield/datefield.scss
index 8e2e9aeb2b..12ce3df980 100644
--- a/WebContent/VAADIN/themes/base/datefield/datefield.css
+++ b/WebContent/VAADIN/themes/base/datefield/datefield.scss
@@ -1,3 +1,5 @@
+@mixin base-datefield {
+
 .v-datefield {
 	white-space: nowrap;
 	float: left; /* Force minimum width */
@@ -64,16 +66,6 @@
     color: #666;
 }
 
-.v-ie6 .v-datefield-calendarpanel-day,
-.v-ie7 .v-datefield-calendarpanel-day {
-	margin: 1px;
-}
-.v-ie6 .v-datefield-calendarpanel-day-focused,
-.v-ie7 .v-datefield-calendarpanel-day-focused {
-	border: 1px dotted black;
-	margin: 0px;
-}
-
 .v-datefield-time {
 	white-space: nowrap;
 }
@@ -97,10 +89,5 @@
 	background-color: #ffe0e0;
 }
 */
-/* IE somehow loses generic v-disabled alpha. See #1960 */
-.v-ie6 .v-disabled .v-datefield-button,
-.v-ie6 .v-disabled .v-datefield-textfield,
-.v-ie7 .v-disabled .v-datefield-button,
-.v-ie7 .v-disabled .v-datefield-textfield {
-	filter: alpha(opacity=30);
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/dragwrapper/dragwrapper.css b/WebContent/VAADIN/themes/base/dragwrapper/dragwrapper.scss
index 2061fec8c3..558b305742 100644
--- a/WebContent/VAADIN/themes/base/dragwrapper/dragwrapper.css
+++ b/WebContent/VAADIN/themes/base/dragwrapper/dragwrapper.scss
@@ -1,3 +1,5 @@
+@mixin base-dragwrapper {
+
 .v-ddwrapper {
 	padding: 2px;
 	-moz-border-radius: 4px;
@@ -156,3 +158,5 @@
 .no-vertical-drag-hints .v-ddwrapper-over-bottom:after {
 	display: none;
 }
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/embedded/embedded.css b/WebContent/VAADIN/themes/base/embedded/embedded.scss
index eea5937e59..53faaef2e8 100644
--- a/WebContent/VAADIN/themes/base/embedded/embedded.css
+++ b/WebContent/VAADIN/themes/base/embedded/embedded.scss
@@ -1,5 +1,8 @@
+@mixin base-embedded {
 
 .v-table .v-embedded-image {
     /* make embeddeds be centered in centered table cells. */
 	display: inline-block;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/formlayout/formlayout.css b/WebContent/VAADIN/themes/base/formlayout/formlayout.scss
index 9566ff1663..a45840ebab 100644
--- a/WebContent/VAADIN/themes/base/formlayout/formlayout.css
+++ b/WebContent/VAADIN/themes/base/formlayout/formlayout.scss
@@ -1,3 +1,11 @@
+@mixin base-formlayout {
+
+.v-formlayout.v-has-width > table {
+	width: 100%;
+}
+.v-formlayout.v-has-height > table {
+	height: 100%;
+}
 .v-formlayout-cell .v-errorindicator {
 	display: block;
 }
@@ -9,6 +17,9 @@
 	text-align:right;
 	white-space: nowrap;
 }
+.v-formlayout-errorcell, .v-formlayout-captioncell {
+	width: 1px; /* Don't use any extra space */
+}
 .v-formlayout-captioncell .v-caption {
 	overflow: visible;
 }
@@ -40,4 +51,6 @@
 }
 .v-formlayout-captioncell .v-caption .v-required-field-indicator {
 	float: none;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/gridlayout/gridlayout.css b/WebContent/VAADIN/themes/base/gridlayout/gridlayout.scss
index 87cdcfd361..72f7437e6e 100644
--- a/WebContent/VAADIN/themes/base/gridlayout/gridlayout.css
+++ b/WebContent/VAADIN/themes/base/gridlayout/gridlayout.scss
@@ -1,3 +1,11 @@
+@mixin base-gridlayout {
+
+.v-gridlayout {
+	position: relative;
+}
+.v-gridlayout-slot {
+	position: absolute;
+}
 .v-gridlayout-margin-top {
 	padding-top: 12px;
 }
@@ -23,8 +31,5 @@
 .v-gridlayout-spacing-off {
 	overflow: hidden;
 }
-/* Ensure that resizing gridlayout works in IE */
-.v-ie6 .v-gridlayout,
-.v-ie7 .v-gridlayout {
-	overflow: hidden;
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/label/label.scss b/WebContent/VAADIN/themes/base/label/label.scss
new file mode 100644
index 0000000000..e4f3f89062
--- /dev/null
+++ b/WebContent/VAADIN/themes/base/label/label.scss
@@ -0,0 +1,7 @@
+@mixin base-label {
+
+.v-label {
+	overflow: hidden;
+}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/link/link.css b/WebContent/VAADIN/themes/base/link/link.scss
index 322fb3e7ba..710f95d832 100644
--- a/WebContent/VAADIN/themes/base/link/link.css
+++ b/WebContent/VAADIN/themes/base/link/link.scss
@@ -1,3 +1,5 @@
+@mixin base-link {
+
 .v-link {
 	white-space: nowrap;	
 }
@@ -15,4 +17,6 @@
 .v-link img {
 	vertical-align: middle;
 	border:none;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/loginform/loginform.css b/WebContent/VAADIN/themes/base/loginform/loginform.scss
index 109d1a0a69..d2784fad47 100644
--- a/WebContent/VAADIN/themes/base/loginform/loginform.css
+++ b/WebContent/VAADIN/themes/base/loginform/loginform.scss
@@ -1,3 +1,5 @@
+@mixin base-loginform {
+
 .v-loginform {
 	height: 140px;
 	width: 200px;
@@ -6,4 +8,6 @@
 .v-app-loginpage .v-button,
 .v-app-loginpage .v-button {
 	float: left; /* Force minimum width for button */
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/menubar/menubar.css b/WebContent/VAADIN/themes/base/menubar/menubar.scss
index 8b44085c28..79b94a63af 100644
--- a/WebContent/VAADIN/themes/base/menubar/menubar.css
+++ b/WebContent/VAADIN/themes/base/menubar/menubar.scss
@@ -1,6 +1,9 @@
+@mixin base-menubar {
+
 .v-menubar {
 	float: left; /* Force minimum width */
 	white-space: nowrap;
+	overflow: hidden;
 }
 .v-menubar .v-menubar-menuitem {
 	cursor: default;
@@ -91,3 +94,5 @@
 .v-menubar-submenu .v-menubar-menuitem-checked .v-menubar-menuitem-caption { 
 	background: transparent url(img/check.gif) no-repeat left;
 }
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/notification/notification.css b/WebContent/VAADIN/themes/base/notification/notification.scss
index ccd5b8d218..e67ac14050 100644
--- a/WebContent/VAADIN/themes/base/notification/notification.css
+++ b/WebContent/VAADIN/themes/base/notification/notification.scss
@@ -1,3 +1,5 @@
+@mixin base-notification {
+
 .v-Notification {
 	background: #999;
 	color: #fff;
@@ -37,3 +39,5 @@
 	display: block;
 	margin: 0;
 }
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/orderedlayout/orderedlayout.css b/WebContent/VAADIN/themes/base/orderedlayout/orderedlayout.scss
index 9f91669385..7820d842fc 100644
--- a/WebContent/VAADIN/themes/base/orderedlayout/orderedlayout.css
+++ b/WebContent/VAADIN/themes/base/orderedlayout/orderedlayout.scss
@@ -1,3 +1,11 @@
+@mixin base-orderedlayout {
+
+.v-orderedlayout,
+.v-horizontallayout,
+.v-verticallayout {
+	position: relative;
+}
+
 .v-orderedlayout-margin-top,
 .v-horizontallayout-margin-top,
 .v-verticallayout-margin-top {
@@ -31,12 +39,9 @@
 	padding-top: 0;
 	padding-left: 0;
 }
-/* To make sure IE don't expand elements larger than they should */
-.v-ie6 .v-orderedlayout,
-.v-ie6 .v-horizontallayout,
-.v-ie6 .v-verticallayout,
-.v-ie7 .v-orderedlayout,
-.v-ie7 .v-horizontallayout,
-.v-ie7 .v-verticallayout {
-	overflow: hidden;
+
+.v-horizontallayout-slot, .v-verticallayout-slot {
+	position: absolute;
 }
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/paintable/paintable.scss b/WebContent/VAADIN/themes/base/paintable/paintable.scss
new file mode 100644
index 0000000000..87431ee225
--- /dev/null
+++ b/WebContent/VAADIN/themes/base/paintable/paintable.scss
@@ -0,0 +1,9 @@
+@mixin base-paintable {
+
+.v-connector {
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/panel/panel.css b/WebContent/VAADIN/themes/base/panel/panel.scss
index 74d7b67a35..93d82cd615 100644
--- a/WebContent/VAADIN/themes/base/panel/panel.css
+++ b/WebContent/VAADIN/themes/base/panel/panel.scss
@@ -1,3 +1,5 @@
+@mixin base-panel {
+
 .v-panel,
 .v-panel-caption,
 .v-panel-content,
@@ -7,7 +9,7 @@
 .v-panel-content-light,
 .v-panel-deco-light {
 	outline: none; /* Prevent selection outline which might break layouts or cause scrollbars */
-	text-align: left /* Force default alignment */
+	text-align: left; /* Force default alignment */
 }
 .v-panel-caption .v-errorindicator {
 	float: none;
@@ -29,6 +31,17 @@
 	overflow: hidden;
 }
 .v-panel-content {
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+.v-panel.v-has-width > .v-panel-content {
+	width: 100%;
+}
+.v-panel.v-has-height > .v-panel-content {
+	height: 100%;
 }
 .v-panel-deco {
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/popupview/popupview.css b/WebContent/VAADIN/themes/base/popupview/popupview.scss
index 8e31681c2d..e192d0d147 100644
--- a/WebContent/VAADIN/themes/base/popupview/popupview.css
+++ b/WebContent/VAADIN/themes/base/popupview/popupview.scss
@@ -1,3 +1,5 @@
+@mixin base-popupview {
+
 .v-popupview {
 	cursor: pointer;
 	text-decoration: underline;
@@ -10,4 +12,6 @@
 	width: 30px;
 	height: 30px;
 	background: transparent url(../common/img/ajax-loader-medium.gif) no-repeat 50%;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/progressindicator/progressindicator.css b/WebContent/VAADIN/themes/base/progressindicator/progressindicator.scss
index a9a90c4b06..4c1483886b 100644
--- a/WebContent/VAADIN/themes/base/progressindicator/progressindicator.css
+++ b/WebContent/VAADIN/themes/base/progressindicator/progressindicator.scss
@@ -1,21 +1,19 @@
+@mixin base-progressindicator {
+
 .v-progressindicator {
-	overflow: hidden; /* for IE6 */
 	width: 150px;
 }
 .v-progressindicator-wrapper {
-	overflow: hidden; /* for IE6 */
 	height: 7px;
 	border: 1px solid #ddd;
 }
 .v-progressindicator-indicator {
 	height: 7px;
-	overflow: hidden; /* for IE6 */
 	background: #ddd;
 }
 div.v-progressindicator-indeterminate {
 	height: 20px;
 	width: 20px;
-	overflow: hidden; /* for IE6 */
 	background: #fff url(../common/img/ajax-loader-medium.gif) no-repeat 50%;
 	border-radius: 4px;
 	-webkit-border-radius: 4px;
@@ -31,6 +29,7 @@ div.v-progressindicator-indeterminate {
 div.v-progressindicator-indeterminate-disabled {
 	height: 20px;
 	width: 20px;
-	overflow: hidden; /* for IE6 */
 	background: transparent;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/select/select.css b/WebContent/VAADIN/themes/base/select/select.scss
index 4487bc6a4e..d6ef6d3585 100644
--- a/WebContent/VAADIN/themes/base/select/select.css
+++ b/WebContent/VAADIN/themes/base/select/select.scss
@@ -1,3 +1,5 @@
+@mixin base-select {
+
 .v-select {
 	text-align: left;
 }
@@ -56,6 +58,7 @@
 .v-filterselect {
 	white-space: nowrap;
 	text-align: left;
+	display: inline-block;
 }
 .v-filterselect .v-icon {
 	float: left;
@@ -63,15 +66,19 @@
 .v-app .v-filterselect-input,
 .v-window .v-filterselect-input,
 .v-popupview-popup .v-filterselect-input {
+	margin: 0;
 	float: left;
 	-webkit-border-radius: 0px;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
 }
 .v-filterselect-prompt .v-filterselect-input {
 	color: #999;
 	font-style: italic;
 }
 .v-filterselect-button {
-	float: right;
+	display: inline-block;
 	cursor: pointer;
 	width: 1em;
 	height: 1em;
@@ -156,4 +163,6 @@
 .v-select-required .v-select-twincol-options {
 	background: #ffaaaa;
 }
-*/
\ No newline at end of file
+*/
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/shadow/shadow.css b/WebContent/VAADIN/themes/base/shadow/shadow.scss
index 209dd0e235..4e1085aa5a 100644
--- a/WebContent/VAADIN/themes/base/shadow/shadow.css
+++ b/WebContent/VAADIN/themes/base/shadow/shadow.scss
@@ -1,3 +1,5 @@
+@mixin base-shadow {
+
 .v-shadow {
 	position: absolute;
 }
@@ -67,19 +69,4 @@
     background: transparent url(img/bottom-right.png);
 }
 
-
-
-
-
-/* For IE6 (no transparent png's, we use a blur filter) */
-
-.v-ie6 .v-shadow * {
-	display: none;
-}
-
-.v-ie6 .v-shadow {
-	background: #000;
-	filter: progid:DXImageTransform.Microsoft.Blur(pixelRadius=2) alpha(opacity=20);
-	margin-top: -2px;
-	margin-left: -2px;
-}  
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/slider/slider.css b/WebContent/VAADIN/themes/base/slider/slider.scss
index 5ee6cbf31c..0c65bf1e73 100644
--- a/WebContent/VAADIN/themes/base/slider/slider.css
+++ b/WebContent/VAADIN/themes/base/slider/slider.scss
@@ -1,3 +1,5 @@
+@mixin base-slider {
+
 .v-slider {
 	margin: 5px 0;
 }
@@ -64,14 +66,4 @@
 }
 */
 
-/* IE specific styles */
-.v-ie6 .v-slider,
-.v-ie6 .v-slider-vertical {
-	margin: 0;
-}
-.v-ie6 .v-slider .v-slider-handle {
-	margin: -1px 0;
-}
-.v-ie6 .v-slider-vertical .v-slider-handle {
-	margin: 0 -1px;
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/splitpanel/splitpanel.css b/WebContent/VAADIN/themes/base/splitpanel/splitpanel.scss
index 80a2133b23..2c3e578b0b 100644
--- a/WebContent/VAADIN/themes/base/splitpanel/splitpanel.css
+++ b/WebContent/VAADIN/themes/base/splitpanel/splitpanel.scss
@@ -1,14 +1,14 @@
+@mixin base-splitpanel {
+
 .v-splitpanel-horizontal,
 .v-splitpanel-vertical {
 	overflow: hidden;
 }
 .v-splitpanel-hsplitter {
 	width: 6px;
-	font-size: 1px; /* for IE6 */
 }
 .v-splitpanel-hsplitter div {
 	width: 6px;
-	font-size: 1px; /* for IE6 */
 	position: absolute;
 	top: 0;
 	bottom: 0;
@@ -21,11 +21,9 @@
 }
 .v-splitpanel-vsplitter {
 	height: 6px;
-	font-size: 1px; /* for IE6 */
 }
 .v-splitpanel-vsplitter div {
 	height: 6px;
-	font-size: 1px; /* for IE6 */
 	background: #ddd;
 	cursor: s-resize;
 	cursor: row-resize;
@@ -33,13 +31,5 @@
 .v-disabled .v-splitpanel-vsplitter div {
 	cursor: default;
 }
-/* IE specific styles */
-.v-ie6 .v-splitpanel-hsplitter div {
-	height: 99%;
-}
-.v-ie6 .v-splitpanel-first-container,
-.v-ie6 .v-splitpanel-second-container,
-.v-ie7 .v-splitpanel-first-container,
-.v-ie7 .v-splitpanel-second-container {
-	position: relative;
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/styles.scss b/WebContent/VAADIN/themes/base/styles.scss
new file mode 100644
index 0000000000..89f76947f8
--- /dev/null
+++ b/WebContent/VAADIN/themes/base/styles.scss
@@ -0,0 +1,45 @@
+@import "base.scss";
+
+// @include base-app;
+
+// everything included from base theme
+// other themes should enclose corresponding definitions in theme selectors 
+
+@include base-absolutelayout;
+@include base-accordion;
+@include base-button;
+@include base-caption;
+
+// here for now to preserve old semantics
+@include base-common;
+
+@include base-csslayout;
+@include base-customcomponent;
+@include base-customlayout;
+@include base-datefield;
+@include base-dragwrapper;
+@include base-embedded;
+@include base-formlayout;
+@include base-gridlayout;
+@include base-label;
+@include base-link;
+@include base-loginform;
+@include base-menubar;
+@include base-notification;
+@include base-orderedlayout;
+@include base-paintable;
+@include base-panel;
+@include base-popupview;
+@include base-progressindicator;
+@include base-select;
+@include base-shadow;
+@include base-slider;
+@include base-splitpanel;
+@include base-table;
+@include base-tabsheet;
+@include base-textfield;
+@include base-richtextarea;
+@include base-tree;
+@include base-treetable;
+@include base-upload;
+@include base-window;
diff --git a/WebContent/VAADIN/themes/base/table/table.css b/WebContent/VAADIN/themes/base/table/table.scss
index b5bf1ef53c..d521b5ebae 100644
--- a/WebContent/VAADIN/themes/base/table/table.css
+++ b/WebContent/VAADIN/themes/base/table/table.scss
@@ -1,3 +1,5 @@
+@mixin base-table {
+
 /* Table theme building instructions
  * 
  * Vaadin scroll table is very complex widget with dozens of features. These 
@@ -26,9 +28,6 @@
 	overflow: hidden;
 	text-align: left; /* Force default alignment */
 }
-.v-ie7 .v-table {
-	overflow: visible;
-}
 .v-table-header-wrap {
 	overflow: hidden;
 	border: 1px solid #aaa;
@@ -102,10 +101,6 @@
 	white-space: nowrap;
 	margin-left: 6px;
 }
-.v-ie7 .v-table-caption-container-align-right {
-	margin-left: 0px;
-	padding-left: 6px;
-}
 .v-table-caption-container-align-right {
 	float: right;
 }
@@ -193,10 +188,6 @@
 .v-table.v-disabled .v-table-column-selector {
 	cursor: default;
 }
-.v-ie6 .v-table-column-selector,
-.v-ie7 .v-table-column-selector {
-	position: static;
-}
 .v-table-focus-slot-left {
 	border-left: 2px solid #999;
 	float: none;
@@ -252,11 +243,6 @@
 .v-off {
 	color: #ddd;
 }
-
-.v-table .v-checkbox {
-	display: inline-block;
-}
-
 /*************************************
  * Drag'n'drop styles
  *************************************/
@@ -292,4 +278,6 @@
 .v-ff .v-table-row-drag-bottom .v-table-cell-content:first-child:after,
 .v-ie .v-table-row-drag-bottom .v-table-cell-content:first-child:after {
 	margin-top: -2px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/tabsheet/tabsheet.css b/WebContent/VAADIN/themes/base/tabsheet/tabsheet.scss
index 7288d32d89..c58c25be58 100644
--- a/WebContent/VAADIN/themes/base/tabsheet/tabsheet.css
+++ b/WebContent/VAADIN/themes/base/tabsheet/tabsheet.scss
@@ -1,8 +1,10 @@
+@mixin base-tabsheet {
+
 .v-tabsheet,
 .v-tabsheet-content,
 .v-tabsheet-deco {
 	outline: none; /* Prevent selection outline which might break layouts or cause scrollbars */
-	text-align: left /* Force default alignment */
+	text-align: left; /* Force default alignment */
 }
 .v-tabsheet-tabs {
 	empty-cells: hide;
@@ -39,9 +41,6 @@
 	text-align: right;
 	margin-top: -1em;
 }
-.v-ff2 .v-tabsheet-scroller {
-	position: relative;
-}
 .v-disabled .v-tabsheet-scroller {
 	display: none;
 }
@@ -84,13 +83,9 @@
 	cursor: default;
 	visibility: hidden;
 }
-.v-tabsheet-tabitem:hover .v-tabsheet-caption-close,
-.v-ie6 .v-tabsheet-caption-close {
+.v-tabsheet-tabitem:hover .v-tabsheet-caption-close {
 	visibility: visible;
 }
-.v-ie6 .v-tabsheet-caption-close {
-	float: right;
-}
 .v-tabsheet-tabitem {
 	border: 1px solid #aaa;
 	border-right: none;
@@ -118,10 +113,6 @@
 	border-bottom: none;
 	position: relative;
 }
-.v-ie6 .v-tabsheet-content,
-.v-ie7 .v-tabsheet-content {
-	zoom: 1;
-}
 .v-tabsheet-deco {
 	height: 1px;
 	background: #aaa;
@@ -132,4 +123,6 @@
 }
 .v-tabsheet-hidetabs .v-tabsheet-deco {
 	height: 0;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/textfield/textfield-normal.css b/WebContent/VAADIN/themes/base/textfield/textfield-normal.css
deleted file mode 100644
index 557a960c76..0000000000
--- a/WebContent/VAADIN/themes/base/textfield/textfield-normal.css
+++ /dev/null
@@ -1,47 +0,0 @@
-.v-textfield {
-	text-align: left /* Force default alignment */
-}
-.v-textarea {
-	resize: none;
-}
-.v-textfield-focus,
-.v-textarea-focus {
-}
-input.v-textfield-prompt,
-textarea.v-textarea-prompt {
-	color: #999;
-	font-style: italic;
-}
-input.v-textfield-readonly,
-textarea.v-textarea-readonly {
-	background: transparent;
-	border: none;
-	resize: none;
-}
-input.v-disabled,
-textarea.v-disabled {
-	resize: none;
-}
-input.v-textfield-readonly:focus,
-textarea.v-textarea-readonly:focus {
-	outline: none;
-}
-/* Disabled by default
-.v-textarea-error,
-.v-textfield-error,
-.v-richtextarea-error iframe.gwt-RichTextArea {
-	background: #FFE0E0;	
-}
-*/
-/* Disabled by default
-.v-textarea-required,
-.v-textfield-required,
-.v-richtextarea-required iframe.gwt-RichTextArea {
-	background: #FFE0E0;	
-}
-*/
-/* Safari focus glow fix */
-.v-sa input:focus, 
-.v-sa textarea:focus {
-	outline-width: medium;
-}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/textfield/textfield.css b/WebContent/VAADIN/themes/base/textfield/textfield.css
deleted file mode 100644
index 956b302efe..0000000000
--- a/WebContent/VAADIN/themes/base/textfield/textfield.css
+++ /dev/null
@@ -1,2 +0,0 @@
-@import "textfield-normal.css";
-@import "richtext.css";
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/textfield/richtext.css b/WebContent/VAADIN/themes/base/textfield/textfield.scss
index 6a236886cc..b8e54e6887 100644
--- a/WebContent/VAADIN/themes/base/textfield/richtext.css
+++ b/WebContent/VAADIN/themes/base/textfield/textfield.scss
@@ -1,3 +1,61 @@
+// textfield-normal.css
+
+@mixin base-textfield {
+
+.v-textfield {
+	text-align: left; /* Force default alignment */
+}
+.v-textarea {
+	resize: none;
+}
+.v-textfield-focus,
+.v-textarea-focus {
+}
+input.v-textfield-prompt,
+textarea.v-textarea-prompt {
+	color: #999;
+	font-style: italic;
+}
+input.v-textfield-readonly,
+textarea.v-textarea-readonly {
+	background: transparent;
+	border: none;
+	resize: none;
+}
+input.v-disabled,
+textarea.v-disabled {
+	resize: none;
+}
+input.v-textfield-readonly:focus,
+textarea.v-textarea-readonly:focus {
+	outline: none;
+}
+/* Disabled by default
+.v-textarea-error,
+.v-textfield-error,
+.v-richtextarea-error iframe.gwt-RichTextArea {
+	background: #FFE0E0;	
+}
+*/
+/* Disabled by default
+.v-textarea-required,
+.v-textfield-required,
+.v-richtextarea-required iframe.gwt-RichTextArea {
+	background: #FFE0E0;	
+}
+*/
+/* Safari focus glow fix */
+.v-sa input:focus, 
+.v-sa textarea:focus {
+	outline-width: medium;
+}
+
+}
+
+// richtext.css
+
+@mixin base-richtextarea {
+
 .v-richtextarea {
 	border: 1px solid #aaa;
 	overflow: hidden;
@@ -55,4 +113,6 @@
 
 .v-richtextarea-readonly {
 	border: none;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/tree/img/connector-collapse-ie6.png b/WebContent/VAADIN/themes/base/tree/img/connector-collapse-ie6.png
deleted file mode 100644
index f0e5953235..0000000000
--- a/WebContent/VAADIN/themes/base/tree/img/connector-collapse-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/base/tree/img/connector-collapse-last-ie6.png b/WebContent/VAADIN/themes/base/tree/img/connector-collapse-last-ie6.png
deleted file mode 100644
index 0d2fd54885..0000000000
--- a/WebContent/VAADIN/themes/base/tree/img/connector-collapse-last-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/base/tree/img/connector-expand-ie6.png b/WebContent/VAADIN/themes/base/tree/img/connector-expand-ie6.png
deleted file mode 100644
index 1a7758fce5..0000000000
--- a/WebContent/VAADIN/themes/base/tree/img/connector-expand-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/base/tree/img/connector-expand-last-ie6.png b/WebContent/VAADIN/themes/base/tree/img/connector-expand-last-ie6.png
deleted file mode 100644
index db94fc0d8e..0000000000
--- a/WebContent/VAADIN/themes/base/tree/img/connector-expand-last-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/base/tree/tree-connectors.css b/WebContent/VAADIN/themes/base/tree/tree-connectors.css
deleted file mode 100644
index 6e7ce45391..0000000000
--- a/WebContent/VAADIN/themes/base/tree/tree-connectors.css
+++ /dev/null
@@ -1,49 +0,0 @@
-/* Make item caption height an even number (so that the connector dots overlap nicely) */
-.v-tree-connectors .v-tree-node-caption {
-	padding-top: 1px;
-}
-.v-tree-connectors .v-tree-node {
-	background: transparent url(img/connector-expand.png) no-repeat 2px -52px;
-}
-.v-tree-connectors .v-tree-node-expanded {
-	background: transparent url(img/connector-collapse.png) no-repeat 2px -52px;
-}
-.v-tree-connectors .v-tree-node-last {
-	background: transparent url(img/connector-expand-last.png) no-repeat 2px -52px;
-}
-.v-tree-connectors .v-tree-node-expanded.v-tree-node-last {
-	background: transparent url(img/connector-collapse-last.png) no-repeat 2px -52px;
-}
-.v-tree-connectors .v-tree-node-leaf {
-	background: transparent url(img/connector-leaf.png) repeat-y 2px 50%;
-}
-.v-tree-connectors .v-tree-node-leaf-last {
-	background: transparent url(img/connector-leaf-last.png) repeat-y 2px 50%;
-}
-.v-tree-connectors .v-tree-node-children {
-	background: transparent url(img/connector.png) repeat-y 2px 0;
-}
-.v-tree-connectors .v-tree-node-children-last {
-	background: transparent;
-}
-.v-tree-connectors .v-tree-node-drag-top,
-.v-tree-connectors .v-tree-node-expanded.v-tree-node-drag-top {
-	background-position: 2px -53px;
-}
-.v-tree-connectors .v-tree-node-drag-top.v-tree-node-leaf {
-	background-position: 2px 50%;
-}
-
-/* IE6 */
-.v-ie6 .v-tree-connectors .v-tree-node {
-	background: transparent url(img/connector-expand-ie6.png) no-repeat 2px -52px;
-}
-.v-ie6 .v-tree-connectors .v-tree-node-expanded {
-	background: transparent url(img/connector-collapse-ie6.png) no-repeat 2px -52px;
-}
-.v-ie6 .v-tree-connectors .v-tree-node-last {
-	background: transparent url(img/connector-expand-last-ie6.png) no-repeat 2px -52px;
-}
-.v-ie6 .v-tree-connectors .v-tree-node-last.v-tree-node-expanded {
-	background: transparent url(img/connector-collapse-last-ie6.png) no-repeat 2px -52px;
-}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/tree/tree.css b/WebContent/VAADIN/themes/base/tree/tree.css
deleted file mode 100644
index 59987731b0..0000000000
--- a/WebContent/VAADIN/themes/base/tree/tree.css
+++ /dev/null
@@ -1,2 +0,0 @@
-@import "tree-default.css";
-@import "tree-connectors.css";
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/tree/tree-default.css b/WebContent/VAADIN/themes/base/tree/tree.scss
index c486233ea8..0319bbe994 100644
--- a/WebContent/VAADIN/themes/base/tree/tree-default.css
+++ b/WebContent/VAADIN/themes/base/tree/tree.scss
@@ -1,3 +1,7 @@
+@mixin base-tree {
+
+// tree-default.css
+
 .v-tree {
 	text-align: left; /* Force default alignment */
 	overflow: hidden;
@@ -37,30 +41,9 @@ div.v-tree-node-leaf {
 .v-tree-node-children {
 	padding-left: 1em;
 }
-/* ie6compatnode is hidden from non ie6 browsers, for ie6 
- * uses weird hack to sink all events properly 
- */
-.v-tree-node-ie6compatnode {
-	display: none;
-}
-/* IMPORTANT keep the offsetWidth of this element the same as the margin-left of v-tree-node-caption */
-.v-ie6 .v-tree-node-ie6compatnode {
-	display: inline;
-	float: left;
-	background: orange;
-	margin: 0;
-	width: 0.8em;
-	height: 0.8em;
-	padding: 0.1em;
-	filter: alpha(opacity=0);
-}
-.v-ie6 .v-tree-node,
-.v-ie6 .v-tree-node-children {
-	clear: left;
-}
-/***************************************
- * Drag'n'drop styles
- ***************************************/
+
+// Drag'n'drop styles
+
 .v-tree .v-tree-node-drag-top {
 	border-top: 2px solid #1d9dff;
 	margin-top: -1px;
@@ -106,9 +89,6 @@ div.v-tree-node-leaf {
 	margin: -2px 2px -2px -2px;
 	background-color: #bcdcff;
 }
-.v-ie6 .v-tree .v-tree-node-caption-drag-center div {
-	margin: -2px ;
-}
 .v-tree .v-tree-node-caption-drag-center div {
 	background-color: rgba(169,209,255,.6);
 }
@@ -116,4 +96,46 @@ div.v-tree-node-leaf {
 .v-tree .v-tree-node-drag-top,
 .v-tree .v-tree-node-drag-bottom {
 	border-color: rgba(0,109,232,.6);
+}
+
+// tree-connectors.css
+
+.v-tree-connectors {
+	// Make item caption height an even number (so that the connector dots overlap nicely)
+	.v-tree-node-caption {
+		padding-top: 1px;
+	}
+	.v-tree-node {
+		background: transparent url(img/connector-expand.png) no-repeat 2px -52px;
+	}
+	.v-tree-node-expanded {
+		background: transparent url(img/connector-collapse.png) no-repeat 2px -52px;
+	}
+	.v-tree-node-last {
+		background: transparent url(img/connector-expand-last.png) no-repeat 2px -52px;
+	}
+	.v-tree-node-expanded.v-tree-node-last {
+		background: transparent url(img/connector-collapse-last.png) no-repeat 2px -52px;
+	}
+	.v-tree-node-leaf {
+		background: transparent url(img/connector-leaf.png) repeat-y 2px 50%;
+	}
+	.v-tree-node-leaf-last {
+		background: transparent url(img/connector-leaf-last.png) repeat-y 2px 50%;
+	}
+	.v-tree-node-children {
+		background: transparent url(img/connector.png) repeat-y 2px 0;
+	}
+	.v-tree-node-children-last {
+		background: transparent;
+	}
+	.v-tree-node-drag-top,
+	.v-tree-node-expanded.v-tree-node-drag-top {
+		background-position: 2px -53px;
+	}
+	.v-tree-node-drag-top.v-tree-node-leaf {
+		background-position: 2px 50%;
+	}
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/treetable/treetable.css b/WebContent/VAADIN/themes/base/treetable/treetable.scss
index 662839a4a2..30e6b9ccbd 100644
--- a/WebContent/VAADIN/themes/base/treetable/treetable.css
+++ b/WebContent/VAADIN/themes/base/treetable/treetable.scss
@@ -1,3 +1,5 @@
+@mixin base-treetable {
+
 .v-treetable-treespacer {
     display: inline-block;
     background: transparent;
@@ -13,18 +15,10 @@
     background: url(../treetable/img/arrow-right.png) right top no-repeat;
 }
 
-.v-ie6 .v-treetable-node-closed {
-	background-image: url(../treetable/img/arrow-right.gif); 
-} 
-
 .v-treetable-node-open {
     background: url(../treetable/img/arrow-down.png) right top no-repeat;
 }
 
-.v-ie6 .v-treetable-node-open {
-	background-image: url(../treetable/img/arrow-down.gif); 
-} 
-
 .v-treetable .v-checkbox {
 	display: inline-block;
 	padding-bottom: 4px;
@@ -71,3 +65,5 @@ div table.v-treetable-animation-clone tr.v-table-row td.v-table-cell-content,
 div table.v-treetable-animation-clone tr.v-table-row-odd td.v-table-cell-content {
 	visibility: visible;
 }
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/upload/upload.css b/WebContent/VAADIN/themes/base/upload/upload.scss
index e6b58fb14e..e5d94ce678 100644
--- a/WebContent/VAADIN/themes/base/upload/upload.css
+++ b/WebContent/VAADIN/themes/base/upload/upload.scss
@@ -1,11 +1,9 @@
+@mixin base-upload {
+
 .v-upload {
 	white-space: nowrap;
 }
 
-.v-ie6 .v-upload,
-.v-ie7 .v-upload {
-	margin:0;
-}
 
 .v-upload-immediate {
 	position: relative;
@@ -37,4 +35,5 @@
 	width: 100%;
 	text-align: left;
 }
-  
\ No newline at end of file
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/base/window/window.css b/WebContent/VAADIN/themes/base/window/window.scss
index 398238426e..33e54b046f 100644
--- a/WebContent/VAADIN/themes/base/window/window.css
+++ b/WebContent/VAADIN/themes/base/window/window.scss
@@ -1,16 +1,41 @@
+@mixin base-window {
+
 .v-window {
 	background: #fff;
 }
+.v-window-contents {
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+.v-window.v-has-width > div.popupContent,
+.v-window.v-has-width .v-window-wrap,
+.v-window.v-has-width .v-window-contents,
+.v-window.v-has-width .v-window-contents > div {
+	width: 100%;
+}
+
+.v-window.v-has-height > div.popupContent,
+.v-window.v-has-height .v-window-wrap,
+.v-window.v-has-height .v-window-contents,
+.v-window.v-has-height .v-window-contents > div {
+	height: 100%;
+}
+
 .v-window-outerheader {
 	padding: 0.3em 1em;
-	height: 1em;
+	height: 1.6em;
+	position: relative;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
 }
 
 .v-window-outerheader,
 .v-window-draggingCurtain {
  	cursor: move;	
 }
-
 .v-window-header {
 	font-weight: bold;
 }
@@ -22,21 +47,9 @@ div.v-window-header {
 	overflow: hidden;
 	padding: 0;
 }
-.v-ie6 .v-window-header {
-	width: 100%;
-}
 .v-window-header .v-icon {
 	vertical-align: middle; /* This has to be 'middle', not 'bottom', to allow larger icons than 16px */
 }
-/* Partial fix for bug #1106 */
-/* Target Firefox 2 (somehow this will force almost all window borders on top of a Flash object) */
-.v-window-contents, x:-moz-any-link {
-	overflow: hidden;
-}
-/* Target Firefox 3 (it doesn't need any trickery, so revert the previous) */
-.v-window-contents, x:-moz-any-link, x:default {
-	overflow: visible;
-}
 .v-window-contents > div {
 	outline: none;
 }
@@ -88,15 +101,6 @@ div.v-window-header {
 	height: 100%;
 	filter: alpha(opacity=50);
 }
-/* IE6 workaround for position:fixed; */
-.v-ie6 .v-window-modalitycurtain { 
-	position: absolute;
-	top: expression(document.documentElement.scrollTop + "px"); 
-}
-/* min-width for IE6 */
-.v-ie6 .v-window {
-	width: 0; /*  */
-}
 /* Shadow for window */
 .v-shadow-window {
 	position: absolute;
@@ -158,13 +162,5 @@ div.v-window-header {
     width: 28px;          height: 28px;
     background: transparent url(img/shadow/bottom-right.png);
 }
-/* For IE6 (no transparent png's, we use a blur filter) */
-.v-ie6 .v-shadow-window * {
-	display: none;
-}
-.v-ie6 .v-shadow-window {
-	background: #000;
-	filter: progid:DXImageTransform.Microsoft.Blur(pixelRadius=5) alpha(opacity=20);
-	margin-top: 2px;
-	margin-left: 2px;
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/chameleon.scss b/WebContent/VAADIN/themes/chameleon/chameleon.scss
new file mode 100644
index 0000000000..16f95bbbb4
--- /dev/null
+++ b/WebContent/VAADIN/themes/chameleon/chameleon.scss
@@ -0,0 +1,10 @@
+// this file just defines all chameleon mixins by importing them
+
+// common (mostly application or page level) parts of the theme
+
+@import "common/common.scss";
+
+// components - can override or replace in user themes
+
+@import "components/components.scss";
+@import "compound/compound.scss";
diff --git a/WebContent/VAADIN/themes/chameleon/common/common.css b/WebContent/VAADIN/themes/chameleon/common/common.css
deleted file mode 100644
index e1a5bdce7a..0000000000
--- a/WebContent/VAADIN/themes/chameleon/common/common.css
+++ /dev/null
@@ -1,168 +0,0 @@
-/*
- * Base theme is automatically included in the compiled theme.
- * @import "../../base/styles.css";
- */
-
-/*******************************************************************************
- * App background & tooltip
- ******************************************************************************/
-
-.v-app {
-	background: transparent;
-	overflow: hidden;
-	}
-
-.v-view {
-	margin-top: 0;
-	border-top: none;
-	}
-
-.v-tooltip {
-	background: #fdfdee;
-	border: 1px solid #c0c0b9;
-	padding: 1px 5px;
-	color: #222;
-	font-size: 0.9em;
-	line-height: normal;
-	-webkit-border-radius: 4px;
-	-moz-border-radius: 4px;
-	}
-
-.v-sa .v-tooltip,
-.v-ff3 .v-tooltip {
-	outline: 1px solid rgba(0,0,0,.2);
-	-webkit-border-radius: 0;
-	-moz-border-radius: 0;
-	border: none;
-	}
-
-
-/*******************************************************************************
- * Global fonts
- ******************************************************************************/
-
-/* First all the containers that have other components inside them, and are 
- * possibly overlay elements (which reside inside the BODY element, not the .v-app element)
- */
-/* Then come all other overlay elements, that do not have other arbitrary 
- * components inside them (from v-filterselect-suggestpopup onwards) */
-.v-app,
-.v-window,
-.v-popupview-popup,
-.v-tooltip,
-.v-app input,
-.v-app select,
-.v-app button,
-.v-app textarea,
-.v-window input,
-.v-window select,
-.v-window button,
-.v-window textarea,
-.v-popupview-popup input,
-.v-popupview-popup select,
-.v-popupview-popup button,
-.v-popupview-popup textarea,
-.v-filterselect-suggestpopup,
-.v-datefield-popup,
-.v-contextmenu,
-.v-Notification,
-.v-menubar-submenu,
-.v-table-header-drag,
-.v-menubar-submenu,
-.v-drag-element {
-	font-family: Arial, Helvetica, "Lucida Grande", "Lucida Sans Unicode", Tahoma, Verdana, sans-serif;
-	font-size: 13px;
-	line-height: 1.4;
-	color: #222;
-	}
-
-
-
-/*******************************************************************************
- * Generic overlay elements
- ******************************************************************************/
-.v-window,
-.v-popupview-popup,
-.v-filterselect-suggestpopup,
-.v-datefield-popup,
-.v-contextmenu,
-.v-Notification,
-.v-menubar-submenu {
-	background: #fff url(../img/grad-light-top.png) repeat-x;
-	background-color: rgba(255,255,255,.85);
-	border: 1px solid #adadad;
-	border-color: rgba(0,0,0,.4);
-	border-radius: 4px;
-	-webkit-border-radius: 4px;
-	-moz-border-radius: 4px;
-	overflow: hidden;
-	}
-
-.v-ie6 .v-window,
-.v-ie6 .v-popupview-popup,
-.v-ie6 .v-filterselect-suggestpopup,
-.v-ie6 .v-datefield-popup,
-.v-ie6 .v-contextmenu,
-.v-ie6 .v-Notification,
-.v-ie6 .v-menubar-submenu {
-	background-image: none;
-	}
-
-.v-filterselect-suggestpopup,
-.v-contextmenu,
-.v-menubar-submenu {
-	padding: 3px 0;
-	}
-
-.v-contextmenu .gwt-MenuItem,
-.v-filterselect-suggestpopup .gwt-MenuItem,
-.v-menubar-submenu .v-menubar-menuitem {
-	padding: .05em .7em;
-	user-select: none;
-	-webkit-user-select: none;
-	-moz-user-select: none;
-	-ms-user-select: none;
-	cursor: default;
-	}
-
-.v-contextmenu td.gwt-MenuItem-selected div,
-.v-filterselect-suggestpopup td.gwt-MenuItem-selected,
-.v-table .v-table-body .v-selected,
-.v-menubar-submenu span.v-menubar-menuitem-selected {
-	text-shadow: none;
-	}
-
-.v-contextmenu .gwt-MenuItem-selected,
-.v-filterselect-suggestpopup .gwt-MenuItem-selected,
-.v-table .v-selected,
-.v-menubar-submenu .v-menubar-menuitem-selected {
-	background-color: #333;
-	}
-
-.v-contextmenu .gwt-MenuItem-selected div {
-	background: transparent;
-	}
-
-
-/*******************************************************************************
- * Misc. generics
- ******************************************************************************/
-.v-errorindicator {
-	width: 13px;
-	height: 1.4em;
-	background: transparent url(../img/error-indicator.png) no-repeat right 50%;
-	}
-
-.v-caption-small .v-errorindicator {
-	height: 1.2em;
-	}
-
-.v-caption-big .v-errorindicator {
-	height: 1.8em;
-	}
-
-.v-tooltip .v-errormessage {
-	color: #b2320b;
-	padding-left: 14px;
-	background: transparent url(../img/error-indicator.png) no-repeat 0 50%;
-	}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/common/common.scss b/WebContent/VAADIN/themes/chameleon/common/common.scss
new file mode 100644
index 0000000000..a7878b38ec
--- /dev/null
+++ b/WebContent/VAADIN/themes/chameleon/common/common.scss
@@ -0,0 +1,164 @@
+// this file defines the common chameleon mixin any related variables etc.
+
+$chameleon-app-background: transparent;
+
+$chameleon-font-family: Arial, Helvetica, "Lucida Grande", "Lucida Sans Unicode", Tahoma, Verdana, sans-serif;
+$chameleon-font-size: 13px;
+$chameleon-line-height: 1.4;
+
+
+// rules on the application level, above theme selection
+@mixin chameleon-app {
+	// App background & tooltip
+	.v-app {
+		background: transparent;
+		overflow: hidden;
+		}
+	
+	.v-view {
+		margin-top: 0;
+		border-top: none;
+		}
+	
+	.v-tooltip {
+		background: #fdfdee;
+		border: 1px solid #c0c0b9;
+		padding: 1px 5px;
+		color: #222;
+		font-size: 0.9em;
+		line-height: normal;
+		-webkit-border-radius: 4px;
+		-moz-border-radius: 4px;
+		}
+	
+	.v-sa .v-tooltip {
+		outline: 1px solid rgba(0,0,0,.2);
+		-webkit-border-radius: 0;
+		-moz-border-radius: 0;
+		border: none;
+		}
+
+	// TODO move most of the rest to chameleon-common
+
+	// Global fonts
+	
+	// First all the containers that have other components inside them, and are 
+	// possibly overlay elements (which reside inside the BODY element, not the .v-app element)
+	
+	// Then come all other overlay elements, that do not have other arbitrary 
+	// components inside them (from v-filterselect-suggestpopup onwards)
+	
+	.v-app,
+	.v-window,
+	.v-popupview-popup,
+	.v-tooltip,
+	.v-app input,
+	.v-app select,
+	.v-app button,
+	.v-app textarea,
+	.v-window input,
+	.v-window select,
+	.v-window button,
+	.v-window textarea,
+	.v-popupview-popup input,
+	.v-popupview-popup select,
+	.v-popupview-popup button,
+	.v-popupview-popup textarea,
+	.v-filterselect-suggestpopup,
+	.v-datefield-popup,
+	.v-contextmenu,
+	.v-Notification,
+	.v-menubar-submenu,
+	.v-table-header-drag,
+	.v-menubar-submenu,
+	.v-drag-element {
+		font-family: $chameleon-font-family;
+		font-size: $chameleon-font-size;
+		line-height: $chameleon-line-height;
+		color: #222;
+		}
+	
+	
+	
+	// Generic overlay elements
+	
+	.v-window,
+	.v-popupview-popup,
+	.v-filterselect-suggestpopup,
+	.v-datefield-popup,
+	.v-contextmenu,
+	.v-Notification,
+	.v-menubar-submenu {
+		background: #fff url(../img/grad-light-top.png) repeat-x;
+		background-color: rgba(255,255,255,.85);
+		border: 1px solid #adadad;
+		border-color: rgba(0,0,0,.4);
+		border-radius: 4px;
+		-webkit-border-radius: 4px;
+		-moz-border-radius: 4px;
+		overflow: hidden;
+		}
+	
+	.v-filterselect-suggestpopup,
+	.v-contextmenu,
+	.v-menubar-submenu {
+		padding: 3px 0;
+		}
+	
+	.v-contextmenu .gwt-MenuItem,
+	.v-filterselect-suggestpopup .gwt-MenuItem,
+	.v-menubar-submenu .v-menubar-menuitem {
+		padding: .05em .7em;
+		user-select: none;
+		-webkit-user-select: none;
+		-moz-user-select: none;
+		-ms-user-select: none;
+		cursor: default;
+		}
+	
+	.v-contextmenu td.gwt-MenuItem-selected div,
+	.v-filterselect-suggestpopup td.gwt-MenuItem-selected,
+	.v-table .v-table-body .v-selected,
+	.v-menubar-submenu span.v-menubar-menuitem-selected {
+		text-shadow: none;
+		}
+	
+	.v-contextmenu .gwt-MenuItem-selected,
+	.v-filterselect-suggestpopup .gwt-MenuItem-selected,
+	.v-table .v-selected,
+	.v-menubar-submenu .v-menubar-menuitem-selected {
+		background-color: #333;
+		}
+	
+	.v-contextmenu .gwt-MenuItem-selected div {
+		background: transparent;
+		}
+	
+	
+	// Misc. generics
+	
+	.v-tooltip .v-errormessage {
+		color: #b2320b;
+		padding-left: 14px;
+		background: transparent url(../img/error-indicator.png) no-repeat 0 50%;
+		}
+
+}
+
+@mixin chameleon-common {
+	// Misc. generics
+	
+	.v-errorindicator {
+		width: 13px;
+		height: 1.4em;
+		background: transparent url(../img/error-indicator.png) no-repeat right 50%;
+		}
+	
+	.v-caption-small .v-errorindicator {
+		height: 1.2em;
+		}
+	
+	.v-caption-big .v-errorindicator {
+		height: 1.8em;
+		}	
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/accordion/accordion.css b/WebContent/VAADIN/themes/chameleon/components/accordion/accordion.scss
index 6b0f69aaaa..f33577db9e 100644
--- a/WebContent/VAADIN/themes/chameleon/components/accordion/accordion.css
+++ b/WebContent/VAADIN/themes/chameleon/components/accordion/accordion.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-accordion {
+
 .v-accordion {
 	border: 1px solid #b3b3b3;
 	}
@@ -14,10 +16,6 @@
 	border-style: solid none;
 	}
 	
-.v-ie6 .v-accordion-item-caption {
-	background-image: none;
-	}
-
 div.v-accordion-item-caption,
 div.v-accordion-item-open .v-accordion-item-caption:active {
 	background-color: transparent;
@@ -43,7 +41,7 @@ div.v-accordion-item-open .v-accordion-item-caption:active {
 
 .v-accordion-opaque .v-accordion-item-caption,
 .v-accordion-opaque .v-accordion-item-open {
-	border-none;
+	border: none;
 	}
 
 .v-accordion-opaque .v-accordion-item-caption,
@@ -77,4 +75,6 @@ div.v-accordion-item-open .v-accordion-item-caption:active {
 	border-radius: 0;
 	-webkit-border-radius: 0;
 	-moz-border-radius: 0;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/button/button.css b/WebContent/VAADIN/themes/chameleon/components/button/button.scss
index 0a9544b5ae..beeba2478f 100644
--- a/WebContent/VAADIN/themes/chameleon/components/button/button.css
+++ b/WebContent/VAADIN/themes/chameleon/components/button/button.scss
@@ -1,5 +1,6 @@
+@mixin chameleon-button {
+
 .v-button:active,
-.v-ie7 .v-pressed.v-button,
 .v-ie8 .v-pressed.v-button,
 div.v-button-down {
 	background-image: url(../../img/grad-dark-bottom2.png);
@@ -7,7 +8,6 @@ div.v-button-down {
 	}
 
 .v-button:active .v-button-wrap,
-.v-ie7 .v-pressed.v-button .v-button-wrap,
 .v-ie8 .v-pressed.v-button .v-button-wrap,
 .v-button-down .v-button-wrap {
 	background-image: url(../../img/grad-dark-top2.png);
@@ -22,10 +22,6 @@ div.v-button-down .v-button-wrap {
 	background-image: url(../../img/grad-dark-top2.png);
 	}
 
-.v-ie6 div.v-button-down .v-button-wrap {
-	background-image: none;
-	}
-
 .v-button {
 	overflow: hidden;
 	}
@@ -66,16 +62,6 @@ div.v-button-down .v-button-wrap {
 	overflow: hidden;
 	}
 	
-body.v-ie6 .v-button {
-	background-image: none;
-	}
-
-body.v-ie6 .v-button .v-button-wrap {
-	background-image: none;
-	display: inline;
-	zoom: 1;
-	}
-
 .v-button:focus {
 	outline: none;
 	}
@@ -110,7 +96,6 @@ body.v-ie6 .v-button .v-button-wrap {
 	}
 
 .v-button-small:active .v-button-wrap,
-.v-ie7 .v-button-small.v-pressed .v-button-wrap,
 .v-ie8 .v-button-small.v-pressed .v-button-wrap,
 .v-button-down.small .v-button-wrap {
 	padding: 2px 10px;
@@ -131,7 +116,6 @@ body.v-ie6 .v-button .v-button-wrap {
 	}
 
 .v-button-wide:active .v-button-wrap,
-.v-ie7 .v-button-wide.v-pressed .v-button-wrap,
 .v-ie8 .v-button-wide.v-pressed .v-button-wrap {
 	padding-left: 25px;
 	padding-right: 25px;
@@ -147,7 +131,6 @@ body.v-ie6 .v-button .v-button-wrap {
 	}
 
 .v-button-tall:active .v-button-wrap,
-.v-ie7 .v-button-tall.v-pressed .v-button-wrap,
 .v-ie8 .v-button-tall.v-pressed .v-button-wrap {
 	padding-top: 12px;
 	padding-bottom: 12px;
@@ -263,22 +246,6 @@ body.v-ie .v-pressed.v-button-borderless .v-button-wrap {
 	margin-right: -0.5em;
 	}
 	
-.v-ie6 .v-button-icon-on-right,
-.v-ie7 .v-button-icon-on-right {
-	position: relative;
-	}
-
-.v-ie6 .v-button-icon-on-right .v-button-caption,
-.v-ie7 .v-button-icon-on-right .v-button-caption {
-	padding-right: 14px;
-	}
-
-.v-ie6 .v-button-icon-on-right .v-icon,
-.v-ie7 .v-button-icon-on-right .v-icon {
-	position: absolute;
-	right: 0;
-	margin: 0;
-	}
 
 /*******************************************************************************
  * Icon-only
@@ -289,4 +256,6 @@ body.v-ie .v-pressed.v-button-borderless .v-button-wrap {
 
 .v-button-icon-only .v-icon {
 	margin-right: -.5em;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/components.css b/WebContent/VAADIN/themes/chameleon/components/components.css
deleted file mode 100644
index c497a4a323..0000000000
--- a/WebContent/VAADIN/themes/chameleon/components/components.css
+++ /dev/null
@@ -1,17 +0,0 @@
-@import "accordion/accordion.css";
-@import "button/button.css";
-@import "label/label.css";
-@import "menubar/menubar.css";
-@import "notification/notification.css";
-@import "panel/panel.css";
-@import "popupview/popupview.css";
-@import "progressindicator/progressindicator.css";
-@import "slider/slider.css";
-@import "splitpanel/splitpanel.css";
-@import "table/table.css";
-@import "textfield/textfield.css";
-@import "datefield/datefield.css"; /* datefield and selects must be after textfield */
-@import "selects/selects.css";
-@import "tabsheet/tabsheet.css";
-@import "tree/tree.css";
-@import "window/window.css";
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/components.scss b/WebContent/VAADIN/themes/chameleon/components/components.scss
new file mode 100644
index 0000000000..45a313ed60
--- /dev/null
+++ b/WebContent/VAADIN/themes/chameleon/components/components.scss
@@ -0,0 +1,41 @@
+@import "accordion/accordion.scss";
+@import "button/button.scss";
+@import "label/label.scss";
+@import "menubar/menubar.scss";
+@import "notification/notification.scss";
+@import "panel/panel.scss";
+@import "popupview/popupview.scss";
+@import "progressindicator/progressindicator.scss";
+@import "slider/slider.scss";
+@import "splitpanel/splitpanel.scss";
+@import "table/table.scss";
+@import "textfield/textfield.scss";
+// datefield and selects must be after textfield
+@import "datefield/datefield.scss";
+@import "selects/selects.scss";
+@import "tabsheet/tabsheet.scss";
+@import "tree/tree.scss";
+@import "window/window.scss";
+
+@mixin chameleon-components {
+
+	@include chameleon-accordion;
+	@include chameleon-button;
+	@include chameleon-label;
+	@include chameleon-menubar;
+	@include chameleon-notification;
+	@include chameleon-panel;
+	@include chameleon-popupview;
+	@include chameleon-progressindicator;
+	@include chameleon-slider;
+	@include chameleon-splitpanel;
+	@include chameleon-table;
+	@include chameleon-textfield;
+	// datefield and selects must be after textfield
+	@include chameleon-datefield;
+	@include chameleon-selects;
+	@include chameleon-tabsheet;
+	@include chameleon-tree;
+	@include chameleon-window;
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.css b/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.scss
index 71771ad6e1..2f9705ca58 100644
--- a/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.css
+++ b/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-datefield {
+
 .v-datefield-button {
 	background: #dadada url(../../img/date-btn.png) repeat-x 50% 0;
 	border: 1px solid gray;
@@ -23,25 +25,6 @@
 	height: 1.2em;
 	}
 
-.v-ie6 .v-datefield-button,
-.v-ie7 .v-datefield-button {
-	height: 1.55em;
-	margin-top: 1px;
-	padding: 0;
-	}
-
-.v-ie7 .v-datefield-button {
-	height: 1.85em;
-	}
-
-.v-ie7 .v-datefield-small .v-datefield-button {
-	height: 1.75em;
-	}
-
-.v-ie7 .v-datefield-big .v-datefield-button {
-	height: 2em;
-	}
-
 .v-ie8 .v-datefield-button {
 	height: 1.6em;
 	padding: 0;
@@ -116,10 +99,6 @@ td.v-datefield-calendarpanel-month {
 	text-shadow: 0 1px 0 rgba(255,255,255,.7);
 	}
 
-.v-ie6 td.v-datefield-calendarpanel-month {
-	background-image: none;
-	}
-
 span.v-datefield-calendarpanel-month {
 	display: block;
 	text-align: center;
@@ -172,10 +151,6 @@ td.v-datefield-calendarpanel-nextyear {
 	background-position: 0 0;
 	}
 
-.v-ie6 .v-datefield-calendarpanel-header button {
-	background-image: none;
-	}
-
 .v-datefield-calendarpanel-header button:active {
 	background-image: url(../../img/grad-dark-top2.png);
 	}
@@ -239,10 +214,6 @@ td.v-datefield-calendarpanel-nextyear {
 	margin-bottom: 2px;
 	}
 
-.v-ie6 .v-datefield-calendarpanel-weekdays strong {
-	background-image: none;
-	}
-
 .v-datefield-calendarpanel .v-first strong {
 	-webkit-border-bottom-left-radius: 3px;
 	-moz-border-radius-bottomleft: 3px;
@@ -293,10 +264,6 @@ td.v-datefield-calendarpanel-nextyear {
 	border: 1px solid #c9c9c9;
 	}
 
-.v-ie6 .v-datefield-calendarpanel-day-today {
-	background-image: none;
-	}
-
 .v-datefield-calendarpanel-day-selected,
 .v-datefield-calendarpanel-day-selected:hover {
 	margin: 0 0 0 .3em;
@@ -307,4 +274,6 @@ td.v-datefield-calendarpanel-nextyear {
 	padding: 0;
 	font-size: 0.9em;
 	margin: 0;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/label/label.css b/WebContent/VAADIN/themes/chameleon/components/label/label.scss
index f2d8e8ef69..7471242f70 100644
--- a/WebContent/VAADIN/themes/chameleon/components/label/label.css
+++ b/WebContent/VAADIN/themes/chameleon/components/label/label.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-label {
+
 /*******************************************************************************
  * Different headers
  ******************************************************************************/
@@ -124,4 +126,6 @@ body .v-label-loading {
 	border-radius: 2px;
 	-webkit-border-radius: 2px;
 	-moz-border-radius: 2px;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/menubar/menubar.css b/WebContent/VAADIN/themes/chameleon/components/menubar/menubar.scss
index 00b062f8d6..55ade4c060 100644
--- a/WebContent/VAADIN/themes/chameleon/components/menubar/menubar.css
+++ b/WebContent/VAADIN/themes/chameleon/components/menubar/menubar.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-menubar {
+
 .v-menubar {
 	padding: 0 .4em;
 	background: #c9c9c9 url(../../img/grad-light-top.png) repeat-x;
@@ -5,10 +7,6 @@
 	border-width: 1px 0;
 	}
 
-.v-ie6 .v-menubar {
-	background-image: none;
-	}
-
 .v-menubar .v-menubar-menuitem {
 	padding: .2em .5em;
 	line-height: normal;
@@ -27,6 +25,4 @@
 	background-position: 0 -1px;
 	}
 
-.v-ie6 .v-menubar-submenu .v-menubar-menuitem-selected {
-	background-image: none;
-	}
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/notification/notification.css b/WebContent/VAADIN/themes/chameleon/components/notification/notification.scss
index 1e4268cf92..9036c5c2d6 100644
--- a/WebContent/VAADIN/themes/chameleon/components/notification/notification.css
+++ b/WebContent/VAADIN/themes/chameleon/components/notification/notification.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-notification {
+
 div.v-Notification {
 	-moz-border-radius: 0;
 	-webkit-border-radius: 0;
@@ -47,10 +49,6 @@ div.v-Notification-tray {
 	text-shadow: 0 1px 1px rgba(0,0,0,.5);
 	}
 
-.v-ie6 .v-Notification-tray {
-	background-image: none;
-	}
-
 .v-Notification-tray h1 {
 	font-size: 14px;
 	line-height: 18px;
@@ -65,4 +63,6 @@ div.v-Notification-system {
 	color: #fff;
 	border: none;
 	background-color: #b40000;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/panel/panel.css b/WebContent/VAADIN/themes/chameleon/components/panel/panel.scss
index e83e245ce6..88b3d7b804 100644
--- a/WebContent/VAADIN/themes/chameleon/components/panel/panel.css
+++ b/WebContent/VAADIN/themes/chameleon/components/panel/panel.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-panel {
+
 .v-panel-caption {
 	background: #b9dcff;
 	font-size: 1.2em;
@@ -87,10 +89,6 @@ div.v-panel-content-light {
 	padding: .3em .6em;
 	}
 
-.v-ie6 .v-panel-bubble .v-panel-caption-bubble {
-	background-image: none;
-	}
-
 .v-panel-nocaption-bubble {
 	padding: 0;
 	margin: 0;
@@ -121,4 +119,6 @@ div.v-panel-borderless .v-panel-deco-bubble {
 
 div.v-panel-borderless .v-panel-content-bubble {
 	background: transparent;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/popupview/popupview.css b/WebContent/VAADIN/themes/chameleon/components/popupview/popupview.scss
index ab270d7c4b..88e13cb46d 100644
--- a/WebContent/VAADIN/themes/chameleon/components/popupview/popupview.css
+++ b/WebContent/VAADIN/themes/chameleon/components/popupview/popupview.scss
@@ -1,3 +1,7 @@
+@mixin chameleon-popupview {
+
 .v-popupview-popup {
 	padding: .3em .4em;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/progressindicator/progressindicator.css b/WebContent/VAADIN/themes/chameleon/components/progressindicator/progressindicator.scss
index b13b627ed6..6bacf31e3e 100644
--- a/WebContent/VAADIN/themes/chameleon/components/progressindicator/progressindicator.css
+++ b/WebContent/VAADIN/themes/chameleon/components/progressindicator/progressindicator.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-progressindicator {
+
 .v-progressindicator-wrapper {
 	border-radius: 2px;
 	-webkit-border-radius: 2px;
@@ -18,11 +20,6 @@
 	border: 1px solid #b3b3b3;
 	}
 
-.v-ie6 .v-progressindicator-wrapper,
-.v-ie6 .v-progressindicator-indicator {
-	background-image: none;
-	}
-
 
 /*******************************************************************************
  * Small
@@ -114,4 +111,6 @@
 
 .v-progressindicator-indeterminate.bar.v-disabled .v-progressindicator-indicator {
 	background: #fff;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/selects/selects.css b/WebContent/VAADIN/themes/chameleon/components/selects/selects.scss
index 170a4bb991..5e21ddff35 100644
--- a/WebContent/VAADIN/themes/chameleon/components/selects/selects.css
+++ b/WebContent/VAADIN/themes/chameleon/components/selects/selects.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-selects {
+
 .v-filterselect {
 	overflow: hidden;
 	}
@@ -84,16 +86,10 @@ body .v-filterselect-suggestpopup-big td {
 	-ms-user-select: none;
 	}
 
-.v-ie6 .v-filterselect-prevpage-off,
-.v-ie6 .v-filterselect-nextpage-off,
-.v-ie6 .v-filterselect-prevpage,
-.v-ie6 .v-filterselect-nextpage {
-	background-image: none;
-	}
-
 .v-filterselect-prevpage:active,
 .v-filterselect-nextpage:active {
-	background-image: (../../img/grad-dark-bottom2.png);
+	// TODO check - was missing a part of the rule
+	background-image: #c9c9c9 url(../../img/grad-dark-bottom2.png);
 	background-position: left bottom;
 	}
 
@@ -126,10 +122,6 @@ body .v-filterselect-suggestpopup-big td {
 	background-position: 0 -1px;
 	}
 
-.v-ie6 .v-filterselect-suggestmenu .gwt-menuItem-selected {
-	background-image: none;
-	}
-
 .v-filterselect-suggestpopup-small .v-filterselect-status {
 	font-size: .8em;
 	}
@@ -156,10 +148,6 @@ body .v-filterselect-suggestpopup-big td {
 	padding: .3em .5em;
 	}
 
-.v-ie6 .v-filterselect-select-button {
-	background-image: none;
-	}
-
 .v-filterselect-select-button .v-filterselect-input {
 	display: block;
 	width: 100% !important;
@@ -177,9 +165,4 @@ body .v-filterselect-suggestpopup-big td {
 	background-position: 100% -8px;
 	}
 
-.v-ie6 .v-filterselect-select-button .v-filterselect-button {
-	float: none;
-	position: relative;
-	margin: -1.8em -.5em -.3em -.5em;
-	padding: .3em .5em;
-	}
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/slider/slider.css b/WebContent/VAADIN/themes/chameleon/components/slider/slider.scss
index c0fc271d3f..bef69b3472 100644
--- a/WebContent/VAADIN/themes/chameleon/components/slider/slider.css
+++ b/WebContent/VAADIN/themes/chameleon/components/slider/slider.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-slider {
+
 .v-slider {
 	border-top: 1px solid #9a9c9e;
 	border-bottom: 1px solid #bdbfc1;
@@ -42,10 +44,6 @@
 	border-width: 0 1px;
 	}
 
-.v-ie6 .v-slider-vertical {
-	width: 6px;
-	}
-
 .v-slider-vertical .v-slider-base {
 	background-image: none;
 	width: 4px;
@@ -59,7 +57,4 @@
 	margin-left: -5px;
 	}
 
-.v-ie6 .v-slider-base,
-.v-ie6 .v-slider-handle {
-	background-image: none;
-	}
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/splitpanel/splitpanel.css b/WebContent/VAADIN/themes/chameleon/components/splitpanel/splitpanel.scss
index bd407592cb..99f51edc01 100644
--- a/WebContent/VAADIN/themes/chameleon/components/splitpanel/splitpanel.css
+++ b/WebContent/VAADIN/themes/chameleon/components/splitpanel/splitpanel.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-splitpanel {
+
 .v-splitpanel-hsplitter div,
 .v-splitpanel-vsplitter div {
 	background: transparent url(../../img/split-handle.png) no-repeat 2px 50%;
@@ -5,11 +7,6 @@
 	width: 9px;
 	}
 
-.v-ie6 .v-splitpanel-hsplitter div,
-.v-ie6 .v-splitpanel-vsplitter div {
-	background-image: url(../../img/split-handle-ie6.png);
-	}
-
 .v-splitpanel-vsplitter div {
 	background-position: 50% 2px;
 	margin: -1px 0;
@@ -35,13 +32,6 @@
 	background: #b3b3b3 url(../../img/grad-light-top.png) repeat-x;
 	}
 
-.v-ie6 .v-splitpanel-hsplitter,
-.v-ie6 .v-splitpanel-hsplitter-locked,
-.v-ie6 .v-splitpanel-vsplitter,
-.v-ie6 .v-splitpanel-vsplitter-locked {
-	background-image: none;
-	}
-
 /*******************************************************************************
  * Small
  ******************************************************************************/
@@ -61,11 +51,6 @@ body .v-splitpanel-vsplitter-small-locked {
 	line-height: 1px;
 	}
 
-body.v-ie6 .v-splitpanel-vsplitter-small,
-body.v-ie6 .v-splitpanel-vsplitter-small-locked {
-	overflow: hidden;
-	}
-
 .v-splitpanel-hsplitter-small div {
 	width: 7px;
 	margin-left: -2px;
@@ -79,7 +64,4 @@ body.v-ie6 .v-splitpanel-vsplitter-small-locked {
 	overflow: hidden;
 	}
 
-.v-ie6 .v-splitpanel-hsplitter-small div,
-.v-ie6 .v-splitpanel-vsplitter-small div {
-	background-image: none;
-	}
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/table/table.css b/WebContent/VAADIN/themes/chameleon/components/table/table.scss
index 66ab6d6101..8ecc1878ae 100644
--- a/WebContent/VAADIN/themes/chameleon/components/table/table.css
+++ b/WebContent/VAADIN/themes/chameleon/components/table/table.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-table {
+
 .v-table-header-wrap,
 .v-table-header-drag {
 	background: #c9c9c9 url(../../img/grad-light-top.png) repeat-x;
@@ -5,11 +7,6 @@
 	line-height: normal;
 	}
 
-.v-ie6 .v-table-header-wrap,
-.v-ie6 .v-table-header-drag {
-	background-image: none;
-	}
-
 .v-table-caption-container,
 .v-table-header-drag {
 	padding-top: .2em;
@@ -52,10 +49,6 @@ div.v-table-focus-slot-left {
 	background-position: 0 -1px;
 	}
 
-.v-ie6 .v-table tr.v-selected {
-	background-image: none;
-	}
-
 div.v-table-focus-slot-right {
 	background: transparent;
 	border-right: 2px solid #b3b3b3;
@@ -169,4 +162,6 @@ div.v-table-focus-slot-right {
 
 div.v-table-borderless .v-table-body {
 	background: transparent;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/tabsheet/tabsheet.css b/WebContent/VAADIN/themes/chameleon/components/tabsheet/tabsheet.scss
index 4ca7359094..258df79922 100644
--- a/WebContent/VAADIN/themes/chameleon/components/tabsheet/tabsheet.css
+++ b/WebContent/VAADIN/themes/chameleon/components/tabsheet/tabsheet.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-tabsheet {
+
 .v-tabsheet-spacertd div {
 	border-color: #b3b3b3;
 	border-left: none;
@@ -36,10 +38,6 @@
 	-moz-border-radius-topright: 2px;
 	}
 
-.v-ie6 .v-tabsheet-tabitem-selected .v-caption {
-	background-image: none;
-	}
-
 .v-tabsheet-content {
 	background: #fff;
 	border-color: #b3b3b3;
@@ -62,10 +60,6 @@
 	margin: .2em 0 0 0;
 	}
 
-.v-ie6 .v-tabsheet-caption-close {
-	background-image: url(../../img/close-btn-ie6.png);
-	}
-
 .v-tabsheet-caption-close:hover {
 	background-position: .5em -25px;
 	}
@@ -89,10 +83,6 @@
 	-moz-border-radius: 6px;
 	}
 
-.v-ie6 .v-tabsheet-scroller {
-	background-image: none;
-	}
-
 .v-tabsheet-scrollerPrev,
 .v-tabsheet-scrollerNext,
 .v-tabsheet-scrollerPrev-disabled,
@@ -109,13 +99,6 @@
 	filter: alpha(opacity=50);
 	}
 
-.v-ie6 .v-tabsheet-scrollerPrev,
-.v-ie6 .v-tabsheet-scrollerNext,
-.v-ie6 .v-tabsheet-scrollerPrev-disabled,
-.v-ie6 .v-tabsheet-scrollerNext-disabled{
-	background-image: url(../../img/tab-arrows-ie6.png);
-	}
-
 .v-tabsheet-scroller button::-moz-focus-inner {
 	border: none;
 	padding: 0;
@@ -174,4 +157,6 @@
 .v-tabsheet-tabs-borderless .v-tabsheet-tabitem-selected,
 .v-tabsheet-tabs-borderless .v-tabsheet-tabitem-selected .v-caption {
 	background-color: transparent;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/textfield/textfield.css b/WebContent/VAADIN/themes/chameleon/components/textfield/textfield.scss
index 9c448eee00..f8f3788c9e 100644
--- a/WebContent/VAADIN/themes/chameleon/components/textfield/textfield.css
+++ b/WebContent/VAADIN/themes/chameleon/components/textfield/textfield.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-textfield {
+
 input.v-textfield,
 textarea.v-textarea,
 .v-filterselect {
@@ -21,11 +23,15 @@ textarea.v-textarea,
 	padding: .2em;
 	}
 
-input.v-textfield[type="text"],
-.v-filterselect {
+input.v-textfield[type="text"] {
 	height: 1.2em;
 	}
 
+input.v-connector.v-textfield[type="text"],
+.v-filterselect {
+	height: 1.6em;
+	}
+
 body input.v-textfield,
 body textarea.v-textarea,
 body input.v-filterselect-input {
@@ -124,7 +130,4 @@ input.v-textfield-search[type=text],
 	padding-left: 17px;
 	}
 
-.v-ie6 input.v-textfield-search {
-	/* Compensate for big style as well, since IE6 doesn't handle the selector */
-	padding-left: 21px;
-	}
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/tree/tree.css b/WebContent/VAADIN/themes/chameleon/components/tree/tree.scss
index 64f59c116a..fc80f51a2a 100644
--- a/WebContent/VAADIN/themes/chameleon/components/tree/tree.css
+++ b/WebContent/VAADIN/themes/chameleon/components/tree/tree.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-tree {
+
 .v-tree-node-caption {
 	margin-left: 16px;
 	}
@@ -19,4 +21,6 @@
 
 .v-tree-connectors .v-tree-node-caption {
 	padding-bottom: 1px;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/components/window/window.css b/WebContent/VAADIN/themes/chameleon/components/window/window.scss
index 3034a58fbf..f1a6b5e529 100644
--- a/WebContent/VAADIN/themes/chameleon/components/window/window.css
+++ b/WebContent/VAADIN/themes/chameleon/components/window/window.scss
@@ -1,3 +1,5 @@
+@mixin chameleon-window {
+
 .v-window-closebox {
 	width: 14px;
 	height: 15px;
@@ -11,10 +13,6 @@
 	z-index: 2;
 	}
 
-.v-ie6 .v-window-closebox {
-	background-image: url(../../img/close-btn-ie6.png);
-	}
-
 .v-window-closebox:hover {
 	background-position: 0 -25px;
 	}
@@ -34,11 +32,6 @@
 	background-image: url(../../img/grad-light-top.png);
 	background-repeat: repeat-x;
 	}
-
-.v-ie6 .v-window-wrap {
-	background: transparent !important;
-	}
-
 .v-window-outerheader {
 	padding: .2em 1.7em .5em 1.2em;
 	height: auto;
@@ -59,4 +52,6 @@
 	width: 14px;
 	height: 14px;
 	bottom: 0;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/compound/compound.css b/WebContent/VAADIN/themes/chameleon/compound/compound.css
deleted file mode 100644
index 2a193ae46b..0000000000
--- a/WebContent/VAADIN/themes/chameleon/compound/compound.css
+++ /dev/null
@@ -1,3 +0,0 @@
-@import "sidebar-menu/sidebar-menu.css";
-@import "segment/segment.css";
-@import "toolbar/toolbar.css";
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/compound/compound.scss b/WebContent/VAADIN/themes/chameleon/compound/compound.scss
new file mode 100644
index 0000000000..b3f0e72f8f
--- /dev/null
+++ b/WebContent/VAADIN/themes/chameleon/compound/compound.scss
@@ -0,0 +1,134 @@
+@mixin chameleon-compound {
+
+	// segment.css
+
+	.v-horizontallayout-segment {
+		.v-button {
+			-webkit-border-radius: 0;
+			-moz-border-radius: 0;
+			border-radius: 0;
+			border-left-width: 0;
+			zoom: 1;
+			overflow: visible;
+
+			.v-button-wrap {
+				-webkit-border-radius: 0;
+				-moz-border-radius: 0;
+				border-radius: 0;
+				zoom: 1;
+				}
+			}
+		
+		.first {
+			-webkit-border-top-left-radius: 3px;
+			-webkit-border-bottom-left-radius: 3px;
+			-moz-border-radius-topleft: 3px;
+			-moz-border-radius-bottomleft: 3px;
+			border-top-left-radius: 3px;
+			border-bottom-left-radius: 3px;
+			border-left-width: 1px;
+
+			.v-button-wrap {
+				-webkit-border-top-left-radius: 2px;
+				-webkit-border-bottom-left-radius: 2px;
+				-moz-border-radius-topleft: 2px;
+				-moz-border-radius-bottomleft: 2px;
+				border-top-left-radius: 2px;
+				border-bottom-left-radius: 2px;
+				}
+		
+			}
+		
+		.last {
+			-webkit-border-top-right-radius: 3px;
+			-webkit-border-bottom-right-radius: 3px;
+			-moz-border-radius-topright: 3px;
+			-moz-border-radius-bottomright: 3px;
+			border-top-right-radius: 3px;
+			border-bottom-right-radius: 3px;
+		
+			.v-button-wrap {
+				-webkit-border-top-right-radius: 2px;
+				-webkit-border-bottom-right-radius: 2px;
+				-moz-border-radius-topright: 2px;
+				-moz-border-radius-bottomright: 2px;
+				border-top-right-radius: 2px;
+				border-bottom-right-radius: 2px;
+				}
+			}
+	}
+
+	// sidebar-menu.css
+	
+	.sidebar-menu * {
+		white-space: normal;
+		}
+	
+	.sidebar-menu {
+		.v-label {
+			font-size: 0.85em;
+			text-transform: uppercase;
+			font-weight: bold;
+			letter-spacing: 0.03em;
+			padding: 1em .9em .3em;
+			text-shadow: 0 1px 0 rgba(255,255,255,1);
+			}
+		
+		.v-nativebutton {
+			width: 100%;
+			padding: .1em 1.1em;
+			border: none;
+			background: transparent;
+			text-align: left;
+			}
+		
+		.v-nativebutton:focus {
+			outline: none;
+			font-weight: bold;
+			}
+		
+		.tab-selected,
+		.selected {
+			font-weight: bold;
+			background-color: #333;
+			background-image: url(../img/grad-light-top2.png);
+			background-position: 0 -1px;
+			color: #fff;
+			}
+		
+		.tab-selected:focus,
+		.selected:focus {
+			outline: none;
+			}
+		
+		.v-nativebutton::-moz-focus-inner {
+			border: none;
+			padding: 0;
+			}
+	}
+	
+	// toolbar.css
+	
+	.v-csslayout-toolbar {
+		background: transparent url(../img/grad-light-top.png) repeat-x;
+		border: 1px solid #b3b3b3;
+		border-width: 1px 0;
+	
+		.v-csslayout-margin {
+			margin: 3px .3em 2px;
+			padding-bottom: 1px;
+			overflow: hidden;
+			}
+		
+		.v-button,
+		.segment {
+			margin-right: 2px;
+			float: left;
+			}
+		
+		.segment .v-button {
+			margin-right: 0;
+			}
+		}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/compound/segment/segment.css b/WebContent/VAADIN/themes/chameleon/compound/segment/segment.css
deleted file mode 100644
index a529bff173..0000000000
--- a/WebContent/VAADIN/themes/chameleon/compound/segment/segment.css
+++ /dev/null
@@ -1,52 +0,0 @@
-.v-horizontallayout-segment .v-button {
-	-webkit-border-radius: 0;
-	-moz-border-radius: 0;
-	border-radius: 0;
-	border-left-width: 0;
-	zoom: 1;
-	overflow: visible;
-	}
-
-.v-horizontallayout-segment .v-button .v-button-wrap {
-	-webkit-border-radius: 0;
-	-moz-border-radius: 0;
-	border-radius: 0;
-	zoom: 1;
-	}
-
-.v-horizontallayout-segment .first {
-	-webkit-border-top-left-radius: 3px;
-	-webkit-border-bottom-left-radius: 3px;
-	-moz-border-radius-topleft: 3px;
-	-moz-border-radius-bottomleft: 3px;
-	border-top-left-radius: 3px;
-	border-bottom-left-radius: 3px;
-	border-left-width: 1px;
-	}
-
-.v-horizontallayout-segment .first .v-button-wrap {
-	-webkit-border-top-left-radius: 2px;
-	-webkit-border-bottom-left-radius: 2px;
-	-moz-border-radius-topleft: 2px;
-	-moz-border-radius-bottomleft: 2px;
-	border-top-left-radius: 2px;
-	border-bottom-left-radius: 2px;
-	}
-
-.v-horizontallayout-segment .last {
-	-webkit-border-top-right-radius: 3px;
-	-webkit-border-bottom-right-radius: 3px;
-	-moz-border-radius-topright: 3px;
-	-moz-border-radius-bottomright: 3px;
-	border-top-right-radius: 3px;
-	border-bottom-right-radius: 3px;
-	}
-
-.v-horizontallayout-segment .last .v-button-wrap {
-	-webkit-border-top-right-radius: 2px;
-	-webkit-border-bottom-right-radius: 2px;
-	-moz-border-radius-topright: 2px;
-	-moz-border-radius-bottomright: 2px;
-	border-top-right-radius: 2px;
-	border-bottom-right-radius: 2px;
-	}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/compound/sidebar-menu/sidebar-menu.css b/WebContent/VAADIN/themes/chameleon/compound/sidebar-menu/sidebar-menu.css
deleted file mode 100644
index 83b736584f..0000000000
--- a/WebContent/VAADIN/themes/chameleon/compound/sidebar-menu/sidebar-menu.css
+++ /dev/null
@@ -1,49 +0,0 @@
-.sidebar-menu * {
-	white-space: normal;
-	}
-
-.sidebar-menu .v-label {
-	font-size: 0.85em;
-	text-transform: uppercase;
-	font-weight: bold;
-	letter-spacing: 0.03em;
-	padding: 1em .9em .3em;
-	text-shadow: 0 1px 0 rgba(255,255,255,1);
-	}
-
-.sidebar-menu .v-nativebutton {
-	width: 100%;
-	padding: .1em 1.1em;
-	border: none;
-	background: transparent;
-	text-align: left;
-	}
-
-.sidebar-menu .v-nativebutton:focus {
-	outline: none;
-	font-weight: bold;
-	}
-
-.sidebar-menu .tab-selected,
-.sidebar-menu .selected {
-	font-weight: bold;
-	background-color: #333;
-	background-image: url(../../img/grad-light-top2.png);
-	background-position: 0 -1px;
-	color: #fff;
-	}
-
-.v-ie6 .sidebar-menu .tab-selected,
-.v-ie6 .sidebar-menu .selected {
-	background-image: none;
-	}
-
-.sidebar-menu .tab-selected:focus,
-.sidebar-menu .selected:focus {
-	outline: none;
-	}
-
-.sidebar-menu .v-nativebutton::-moz-focus-inner {
-	border: none;
-	padding: 0;
-	}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/compound/toolbar/toolbar.css b/WebContent/VAADIN/themes/chameleon/compound/toolbar/toolbar.css
deleted file mode 100644
index 594fc245a6..0000000000
--- a/WebContent/VAADIN/themes/chameleon/compound/toolbar/toolbar.css
+++ /dev/null
@@ -1,25 +0,0 @@
-.v-csslayout-toolbar {
-	background: transparent url(../../img/grad-light-top.png) repeat-x;
-	border: 1px solid #b3b3b3;
-	border-width: 1px 0;
-	}
-
-.v-ie6 .v-csslayout-toolbar {
-	background-image: none;
-	}
-
-.v-csslayout-toolbar .v-csslayout-margin {
-	margin: 3px .3em 2px;
-	padding-bottom: 1px;
-	overflow: hidden;
-	}
-
-.v-csslayout-toolbar .v-button,
-.v-csslayout-toolbar .segment {
-	margin-right: 2px;
-	float: left;
-	}
-
-.v-csslayout-toolbar .segment .v-button {
-	margin-right: 0;
-	}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/chameleon/img/close-btn-ie6.png b/WebContent/VAADIN/themes/chameleon/img/close-btn-ie6.png
deleted file mode 100644
index 334b03769a..0000000000
--- a/WebContent/VAADIN/themes/chameleon/img/close-btn-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/chameleon/img/date-btn-ie6.png b/WebContent/VAADIN/themes/chameleon/img/date-btn-ie6.png
deleted file mode 100644
index d22411b260..0000000000
--- a/WebContent/VAADIN/themes/chameleon/img/date-btn-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/chameleon/img/split-handle-ie6.png b/WebContent/VAADIN/themes/chameleon/img/split-handle-ie6.png
deleted file mode 100644
index 2e23c10d90..0000000000
--- a/WebContent/VAADIN/themes/chameleon/img/split-handle-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/chameleon/img/tab-arrows-ie6.png b/WebContent/VAADIN/themes/chameleon/img/tab-arrows-ie6.png
deleted file mode 100644
index 963cf2e1a0..0000000000
--- a/WebContent/VAADIN/themes/chameleon/img/tab-arrows-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/chameleon/styles.scss b/WebContent/VAADIN/themes/chameleon/styles.scss
new file mode 100644
index 0000000000..ee905c17e9
--- /dev/null
+++ b/WebContent/VAADIN/themes/chameleon/styles.scss
@@ -0,0 +1,10 @@
+@import "../base/styles.scss";
+@import "chameleon.scss";
+
+@include chameleon-app;
+
+// .v-theme-chameleon {
+@include chameleon-common;
+@include chameleon-components;
+@include chameleon-compound;
+// }
diff --git a/WebContent/VAADIN/themes/liferay/accordion/accordion.css b/WebContent/VAADIN/themes/liferay/accordion/accordion.scss
index 8faff71137..840c02feec 100644
--- a/WebContent/VAADIN/themes/liferay/accordion/accordion.css
+++ b/WebContent/VAADIN/themes/liferay/accordion/accordion.scss
@@ -1,3 +1,5 @@
+@mixin liferay-accordion {
+
 .v-accordion {
 	border: 1px solid #999;
 	-webkit-border-radius: 4px;
@@ -25,4 +27,6 @@
 
 .v-accordion-item-open .v-accordion-item-caption {
 	border-bottom: 1px solid #999;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/button/button.css b/WebContent/VAADIN/themes/liferay/button/button.scss
index 8181a041a0..3a2e4a7acb 100644
--- a/WebContent/VAADIN/themes/liferay/button/button.css
+++ b/WebContent/VAADIN/themes/liferay/button/button.scss
@@ -1,3 +1,5 @@
+@mixin liferay-button {
+
 .v-button:focus {
 	outline: none;
 }
@@ -50,11 +52,6 @@
 	line-height: 16px;	
 }
 
-.v-ie6 .v-button .v-button-wrap {
-	display: inline;
-	zoom: 1;
-}
-
 /* Link style button */
 .v-button-link,
 .v-disabled.v-button-link,
@@ -106,4 +103,6 @@ button.v-nativebutton-link-pressed,
 /* CheckBox */
 .v-checkbox input {
 	margin-right: 3px;	
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/common/common.css b/WebContent/VAADIN/themes/liferay/common/common.scss
index 26a0354ff3..a94431d4cb 100644
--- a/WebContent/VAADIN/themes/liferay/common/common.css
+++ b/WebContent/VAADIN/themes/liferay/common/common.scss
@@ -1,3 +1,5 @@
+@mixin liferay-common {
+
 div.v-app {
 	background-color: transparent;
 }
@@ -34,6 +36,4 @@ div.v-app {
 	margin: 1px 0 4px 0;
 }
 
-.v-ie6 .v-view {
-	border-top: none;
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/contextmenu/contextmenu.css b/WebContent/VAADIN/themes/liferay/contextmenu/contextmenu.scss
index e29f0976e1..7748580f0c 100644
--- a/WebContent/VAADIN/themes/liferay/contextmenu/contextmenu.css
+++ b/WebContent/VAADIN/themes/liferay/contextmenu/contextmenu.scss
@@ -1,3 +1,5 @@
+@mixin liferay-contextmenu {
+
 .v-contextmenu {
 	background: #ccc9c9 url(/html/themes/classic/images/application/menu_bg.png) repeat-x 0 0;
 	border: 1px solid;
@@ -37,4 +39,6 @@
 
 .v-contextmenu .gwt-MenuItem-selected div {
 	background: transparent;	
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/datefield/datefield.css b/WebContent/VAADIN/themes/liferay/datefield/datefield.scss
index 4307658449..4bfc810b52 100644
--- a/WebContent/VAADIN/themes/liferay/datefield/datefield.css
+++ b/WebContent/VAADIN/themes/liferay/datefield/datefield.scss
@@ -1,3 +1,5 @@
+@mixin liferay-datefield {
+
 .v-datefield-popup {
 	padding: 3px;
 	-webkit-border-radius: 4px;
@@ -116,13 +118,6 @@ span.v-datefield-calendarpanel-month {
 	min-width: 22px;
 }
 
-.v-ie6 .v-datefield-calendarpanel-prevyear button,
-.v-ie6 .v-datefield-calendarpanel-nextyear button,
-.v-ie7 .v-datefield-calendarpanel-prevyear button,
-.v-ie7 .v-datefield-calendarpanel-nextyear button {
-	width: 22px;
-}
-
 .v-datefield-calendarpanel-day {
 	display: block;
 	width: 22px;
@@ -170,4 +165,6 @@ span.v-datefield-calendarpanel-month {
 .v-datefield-calendarpanel-body table {
 	margin: 0 auto;
 	width: 200px;	
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/formlayout/formlayout.css b/WebContent/VAADIN/themes/liferay/formlayout/formlayout.scss
index 9cf250627e..3fa6fa20ee 100644
--- a/WebContent/VAADIN/themes/liferay/formlayout/formlayout.css
+++ b/WebContent/VAADIN/themes/liferay/formlayout/formlayout.scss
@@ -1,3 +1,7 @@
+@mixin liferay-formlayout {
+
 .v-formlayout .v-caption {
 	font-weight: normal;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/liferay.scss b/WebContent/VAADIN/themes/liferay/liferay.scss
new file mode 100644
index 0000000000..68e9efbfe2
--- /dev/null
+++ b/WebContent/VAADIN/themes/liferay/liferay.scss
@@ -0,0 +1,25 @@
+// this file just defines all reindeer mixins by importing them
+
+// common between others for now for backwards compatibility
+
+@import "accordion/accordion.scss";
+@import "button/button.scss";
+
+@import "common/common.scss";
+
+@import "contextmenu/contextmenu.scss";
+@import "datefield/datefield.scss";
+@import "formlayout/formlayout.scss";
+@import "menubar/menubar.scss";
+@import "notification/notification.scss";
+@import "panel/panel.scss";
+@import "popupview/popupview.scss";
+@import "progressindicator/progressindicator.scss";
+@import "select/select.scss";
+@import "slider/slider.scss";
+@import "splitpanel/splitpanel.scss";
+@import "table/table.scss";
+@import "tabsheet/tabsheet.scss";
+@import "textfield/textfield.scss";
+@import "tree/tree.scss";
+@import "window/window.scss";
diff --git a/WebContent/VAADIN/themes/liferay/menubar/menubar.css b/WebContent/VAADIN/themes/liferay/menubar/menubar.scss
index cb0812f268..71891ff059 100644
--- a/WebContent/VAADIN/themes/liferay/menubar/menubar.css
+++ b/WebContent/VAADIN/themes/liferay/menubar/menubar.scss
@@ -1,3 +1,5 @@
+@mixin liferay-menubar {
+
 .v-menubar {
 	background: #97A1AE url(/html/themes/classic/images/dockbar/dockbar_bg.png) repeat-x 0 0;
 	border-bottom: 1px solid #636364;
@@ -61,4 +63,6 @@
 .v-menubar span.v-menubar-menuitem-disabled:focus,
 .v-menubar span.v-menubar-menuitem-disabled:active {
 	color: #999;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/notification/notification.css b/WebContent/VAADIN/themes/liferay/notification/notification.scss
index 10168fecbd..2312768287 100644
--- a/WebContent/VAADIN/themes/liferay/notification/notification.css
+++ b/WebContent/VAADIN/themes/liferay/notification/notification.scss
@@ -1,3 +1,5 @@
+@mixin liferay-notification {
+
 .v-Notification {
 	background: #dff4ff;
 	color: #34404F;
@@ -45,4 +47,6 @@
 .v-Notification-system h1 {
 	display: block;
 	margin: 0;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/panel/panel.css b/WebContent/VAADIN/themes/liferay/panel/panel.scss
index bb0bbe5338..79172b2474 100644
--- a/WebContent/VAADIN/themes/liferay/panel/panel.css
+++ b/WebContent/VAADIN/themes/liferay/panel/panel.scss
@@ -1,3 +1,5 @@
+@mixin liferay-panel {
+
 .v-panel {
 	background: transparent url(top-left.png) no-repeat;
 }
@@ -80,3 +82,5 @@
 .v-ie .v-panel-caption-light {
 	border-bottom: 1px solid #999;
 }
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/popupview/popupview.css b/WebContent/VAADIN/themes/liferay/popupview/popupview.scss
index 06cfddb7fe..ab06d18c98 100644
--- a/WebContent/VAADIN/themes/liferay/popupview/popupview.css
+++ b/WebContent/VAADIN/themes/liferay/popupview/popupview.scss
@@ -1,3 +1,5 @@
+@mixin liferay-popupview {
+
 .v-popupview-popup {
 	background: #d4d4d4 url(/html/themes/classic/images/application/state_default_bg.png) repeat-x 0 0;
 	padding: 8px;
@@ -6,4 +8,6 @@
 	border-radius: 4px;
 	border: 1px solid #c8c9ca;
 	border-color :#c8c9ca #9e9e9e #9e9e9e #c8c9ca; 
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/progressindicator/progressindicator.css b/WebContent/VAADIN/themes/liferay/progressindicator/progressindicator.scss
index ad8fb1c871..4371b2aeef 100644
--- a/WebContent/VAADIN/themes/liferay/progressindicator/progressindicator.css
+++ b/WebContent/VAADIN/themes/liferay/progressindicator/progressindicator.scss
@@ -1,3 +1,5 @@
+@mixin liferay-progressindicator {
+
 .v-progressindicator-wrapper {
 	background: #dfe2e4 url(../../reindeer/progressindicator/img/base.gif) repeat-x;
 	border: 1px solid #bfbfbf;
@@ -9,4 +11,6 @@
 
 .v-progressindicator-indicator {
 	background: #f7f9f9 url(../../reindeer/progressindicator/img/progress.png);
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/select/select.css b/WebContent/VAADIN/themes/liferay/select/select.scss
index 48e35f9baa..3dbeaeab9d 100644
--- a/WebContent/VAADIN/themes/liferay/select/select.css
+++ b/WebContent/VAADIN/themes/liferay/select/select.scss
@@ -1,3 +1,5 @@
+@mixin liferay-select {
+
 .v-app select,
 .v-window select {
 	padding: 1px;	
@@ -7,10 +9,6 @@ select {
 	background-color: #fff;	
 }
 
-.v-ie6 select { 
-	font-size: 1em;
-}
-
 .v-filterselect-button {
 	width: 24px;
 	height: 24px;
@@ -78,4 +76,6 @@ select {
 .v-select-twincol-buttons .v-button-wrap { 
 	padding-left: 11px;
 	padding-right: 11px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/slider/slider.css b/WebContent/VAADIN/themes/liferay/slider/slider.scss
index 4f11091f16..d30de67da0 100644
--- a/WebContent/VAADIN/themes/liferay/slider/slider.css
+++ b/WebContent/VAADIN/themes/liferay/slider/slider.scss
@@ -1,3 +1,5 @@
+@mixin liferay-slider {
+
 .v-slider {
 	border: 1px solid #9e9e9e;
 	border-right: 1px solid #c8c9ca;
@@ -24,6 +26,11 @@
 	height: 10px;
 }
 
+/* Invalid rule (not used at least by some browsers */
+/*
 .v-slider-feedback {
 	background: #33;
+}
+*/
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/splitpanel/splitpanel.css b/WebContent/VAADIN/themes/liferay/splitpanel/splitpanel.scss
index 5ee753389f..b8058f8cb1 100644
--- a/WebContent/VAADIN/themes/liferay/splitpanel/splitpanel.css
+++ b/WebContent/VAADIN/themes/liferay/splitpanel/splitpanel.scss
@@ -1,3 +1,5 @@
+@mixin liferay-splitpanel {
+
 .v-splitpanel-hsplitter, 
 .v-splitpanel-hsplitter-locked {
 	font-size: 1px;
@@ -60,4 +62,6 @@
 	font-size: 1px;
 	height: 1px;
 	background: #c8c9ca;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/styles.scss b/WebContent/VAADIN/themes/liferay/styles.scss
new file mode 100644
index 0000000000..78fbd62c25
--- /dev/null
+++ b/WebContent/VAADIN/themes/liferay/styles.scss
@@ -0,0 +1,28 @@
+// this file actually attaches all liferay mixins to a parent style
+
+@import "../base/styles.scss";
+@import "liferay.scss";
+
+// .v-theme-liferay {
+	@include liferay-accordion;
+	@include liferay-button;
+	
+	@include liferay-common;
+	
+	@include liferay-contextmenu;
+	@include liferay-datefield;
+	@include liferay-formlayout;
+	@include liferay-menubar;
+	@include liferay-notification;
+	@include liferay-panel;
+	@include liferay-popupview;
+	@include liferay-progressindicator;
+	@include liferay-select;
+	@include liferay-slider;
+	@include liferay-splitpanel;
+	@include liferay-table;
+	@include liferay-tabsheet;
+	@include liferay-textfield;
+	@include liferay-tree;
+	@include liferay-window;
+// }
diff --git a/WebContent/VAADIN/themes/liferay/table/table.css b/WebContent/VAADIN/themes/liferay/table/table.scss
index 81446d4628..0e1b96f5b0 100644
--- a/WebContent/VAADIN/themes/liferay/table/table.css
+++ b/WebContent/VAADIN/themes/liferay/table/table.scss
@@ -1,3 +1,5 @@
+@mixin liferay-table {
+
 .v-table-body {
 	border: 1px solid #999;
 }
@@ -132,4 +134,6 @@
 
 .v-off {
 	color: #999;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/tabsheet/close-ie6.png b/WebContent/VAADIN/themes/liferay/tabsheet/close-ie6.png
deleted file mode 100644
index fcbbedb6d4..0000000000
--- a/WebContent/VAADIN/themes/liferay/tabsheet/close-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/liferay/tabsheet/tabsheet.css b/WebContent/VAADIN/themes/liferay/tabsheet/tabsheet.scss
index 4d5c21d7af..73e2c71dcb 100644
--- a/WebContent/VAADIN/themes/liferay/tabsheet/tabsheet.css
+++ b/WebContent/VAADIN/themes/liferay/tabsheet/tabsheet.scss
@@ -1,3 +1,5 @@
+@mixin liferay-tabsheet {
+
 .v-tabsheet-content {
 	border: none;
 }
@@ -132,7 +134,6 @@
 
 .v-tabsheet-caption-close {
 	background: transparent url(close.png) no-repeat right top;
-	-background-image: url(close-ie6.png);
 	cursor: default;
 	float: right;
 	margin: 3px -1px 0;
@@ -140,4 +141,6 @@
 	text-indent: -999px;
 	width: 13px;
 	height: 9px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/textfield/textfield.css b/WebContent/VAADIN/themes/liferay/textfield/textfield.scss
index b66a805eb0..9e3d2ece03 100644
--- a/WebContent/VAADIN/themes/liferay/textfield/textfield.css
+++ b/WebContent/VAADIN/themes/liferay/textfield/textfield.scss
@@ -1,3 +1,5 @@
+@mixin liferay-textfield {
+
 .v-app input[type="text"],
 .v-app input[type="password"],
 .v-app input[type="reset"],
@@ -12,4 +14,6 @@
 input.v-textfield-prompt, 
 textarea.v-textarea-prompt {
 	font-style: normal;	
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/tree/arrows_sprites-ie6.png b/WebContent/VAADIN/themes/liferay/tree/arrows_sprites-ie6.png
deleted file mode 100644
index c9a0bbd388..0000000000
--- a/WebContent/VAADIN/themes/liferay/tree/arrows_sprites-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/liferay/tree/tree.css b/WebContent/VAADIN/themes/liferay/tree/tree.scss
index 23fe10f52e..99ce8e709f 100644
--- a/WebContent/VAADIN/themes/liferay/tree/tree.css
+++ b/WebContent/VAADIN/themes/liferay/tree/tree.scss
@@ -1,6 +1,7 @@
+@mixin liferay-tree {
+
 .v-tree-node {
 	background: transparent url(arrows_sprites.png) no-repeat -42px 1px;
-	-background: transparent url(arrows_sprites-ie6.png) no-repeat -42px 1px;
 }
 
 .v-tree-node span {
@@ -56,4 +57,6 @@
 
 .v-tree-node-children {
 	padding-left: 14px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/liferay/window/window.css b/WebContent/VAADIN/themes/liferay/window/window.scss
index 6b61d880f1..54bfb37938 100644
--- a/WebContent/VAADIN/themes/liferay/window/window.css
+++ b/WebContent/VAADIN/themes/liferay/window/window.scss
@@ -1,3 +1,5 @@
+@mixin liferay-window {
+
 .v-window {
 	background: transparent;
 }
@@ -10,23 +12,8 @@
 	background: #fff url(top-left.png) no-repeat;
 }
 
-.v-ie6 .v-window-wrap,
-.v-ie7 .v-window-wrap {
-	background-position: 1px 1px;
-}
-
-.v-ie6 .v-window-wrap {
-	border-bottom: none;
-}
-
-.v-ie6 .v-window-footer {
-	border-bottom: 1px solid #c8c9ca;
-	margin-top: -1px;
-	padding-top: 1px;
-}
-
 .v-window-outerheader {
-	height: 16px;
+	height: 38px;
 	margin-left: 9px;
 	padding: 10px 40px 12px 2px;
 	background: transparent url(top-right.png) no-repeat right top;
@@ -77,4 +64,6 @@
 	width: 10px;
 	height: 10px;
 	bottom: 0;	
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer-tests/styles.css b/WebContent/VAADIN/themes/reindeer-tests/styles.css
index 243d1b87d4..7da9e50a46 100644
--- a/WebContent/VAADIN/themes/reindeer-tests/styles.css
+++ b/WebContent/VAADIN/themes/reindeer-tests/styles.css
@@ -20,6 +20,11 @@
 	display: none;
 }
 
+.v-disabled.v-datefield-enabled-readonly-styled,
+.v-readonly.v-datefield-enabled-readonly-styled {
+	padding-right: 0;
+}
+
 .popup-style .v-datefield-calendarpanel-header,
 .v-datefield-popup-popup-style .v-datefield-calendarpanel-time {
 	background: red;
diff --git a/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.css b/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.css
deleted file mode 100644
index 87c598956f..0000000000
--- a/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.css
+++ /dev/null
@@ -1,14 +0,0 @@
-/*------------
- * General vertical and horizontal sprites 
- * -----------*/
-/** sprite: verticals; sprite-image: url(../common/img/vertical-sprites.png); sprite-layout: vertical */
-/** sprite: horizontals; sprite-image: url(../common/img/horizontal-sprites.png); sprite-layout: horizontal */
-
-/** sprite: black-verticals; sprite-image: url(../common/img/black-vertical-sprites.png); sprite-layout: vertical; sprite-matte-color: #1e2022 */
-/** sprite: black-horizontals; sprite-image: url(../common/img/black-horizontal-sprites.png); sprite-layout: horizontal; sprite-matte-color: #1e2022 */
-
-/*------------
- * Buttons 
- * -----------*/
-/** sprite: buttons; sprite-image: url(../button/img/button-sprites.png); sprite-layout: vertical */
-/** sprite: black-buttons; sprite-image: url(../button/img/black-button-sprites.png); sprite-layout: vertical */
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.scss b/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.scss
new file mode 100644
index 0000000000..ffa7ca349a
--- /dev/null
+++ b/WebContent/VAADIN/themes/reindeer/a-sprite-definitions/a-sprite-definitions.scss
@@ -0,0 +1,14 @@
+/*------------
+ * General vertical and horizontal sprites 
+ * -----------*/
+/** sprite: verticals; sprite-image: url(common/img/vertical-sprites.png); sprite-layout: vertical */
+/** sprite: horizontals; sprite-image: url(common/img/horizontal-sprites.png); sprite-layout: horizontal */
+
+/** sprite: black-verticals; sprite-image: url(common/img/black-vertical-sprites.png); sprite-layout: vertical; sprite-matte-color: #1e2022 */
+/** sprite: black-horizontals; sprite-image: url(common/img/black-horizontal-sprites.png); sprite-layout: horizontal; sprite-matte-color: #1e2022 */
+
+/*------------
+ * Buttons 
+ * -----------*/
+/** sprite: buttons; sprite-image: url(button/img/button-sprites.png); sprite-layout: vertical */
+/** sprite: black-buttons; sprite-image: url(button/img/black-button-sprites.png); sprite-layout: vertical */
diff --git a/WebContent/VAADIN/themes/reindeer/accordion/accordion.css b/WebContent/VAADIN/themes/reindeer/accordion/accordion.scss
index 5e51a115d9..8ba0b2151f 100644
--- a/WebContent/VAADIN/themes/reindeer/accordion/accordion.css
+++ b/WebContent/VAADIN/themes/reindeer/accordion/accordion.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-accordion {
+
 .v-accordion {
 	border: 1px solid #bebebe;
 	border-radius: 2px;
@@ -42,4 +44,6 @@
 	border-radius: 0;
 	-webkit-border-radius: 0;
 	-moz-border-radius: 0;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/button/button-firefox.css b/WebContent/VAADIN/themes/reindeer/button/button-firefox.css
deleted file mode 100644
index 4e8a1f58c9..0000000000
--- a/WebContent/VAADIN/themes/reindeer/button/button-firefox.css
+++ /dev/null
@@ -1,5 +0,0 @@
-.v-ff2 .v-button .v-button-caption {
-	display: -moz-inline-box;
-	padding-top: 6px;
-	height: 20px;
-	}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/button/button-ie.css b/WebContent/VAADIN/themes/reindeer/button/button-ie.css
deleted file mode 100644
index aaac6bf0b6..0000000000
--- a/WebContent/VAADIN/themes/reindeer/button/button-ie.css
+++ /dev/null
@@ -1,75 +0,0 @@
-.v-ie6 .v-nativebutton-link,
-.v-ie7 .v-nativebutton-link,
-.v-ie8 .v-nativebutton-link {
-	padding: 0;
-	text-align: left;
-}
-
-/**
- * IE6 buttons --------------------------
- */
-.v-ie6 .v-button {
-	border: 1px solid #b3b3b3;
-	border-bottom-color: #9a9a9a;
-	background: #d8d8d8 url(img/right.png) no-repeat 0 -1px;
-	padding: 0 15px;
-	height: 23px;
-}
-.v-ie6 .v-button .v-button-wrap {
-	background: transparent;
-	height: 20px;
-	padding: 3px 0 0;
-	display: inline;
-	zoom: 1;
-}
-.v-ie6 .v-button-primary {
-	background-image: url(img/primary-right.png);
-}
-.v-ie6 .v-button-small {
-	background-image: url(img/small-right.png);
-	height: 17px;
-}
-.v-ie6 .v-button-small .v-button-wrap {
-	height: 17px;
-	padding: 0;
-}
-.v-ie6 .v-button.v-pressed {
-	background: transparent url(img/right-pressed.png) no-repeat 0 -1px;
-}
-/* Buttons on blue background */
-.v-ie6 .blue .v-button {
-	border-color: #84949c;
-	border-top-color: #83939b;
-	border-bottom-color: #888d91;
-}
-/* Buttons on black background */
-.v-ie6 .black .v-button {
-	border: 1px solid #0d0e0f;
-	background: #202224 url(img/black/right.png) no-repeat 0 -1px;
-	color: #c9ccce;
-}
-.v-ie6 .black .v-button-primary {
-	background-image: url(img/black/primary-right.png);
-}
-.v-ie6 .black .v-button-small {
-	background-image: url(img/black/small-right.png);
-}
-.v-ie6 .black .v-button.v-pressed {
-	background-image: url(img/black/right-pressed.png);
-}
-
-
-/* Link style button */
-.v-ie6 .v-button-link,
-.v-ie6 .black .v-button-link {
-	background: transparent;
-	border: none;
-	height: auto;
-	line-height: normal;
-	padding: 0;
-}
-.v-ie6 .v-button-link .v-button-wrap,
-.v-ie6 .black .v-button-link .v-button-wrap {
-	padding: 0;
-	height: auto;
-}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/button/button-ie.scss b/WebContent/VAADIN/themes/reindeer/button/button-ie.scss
new file mode 100644
index 0000000000..5bf38c4442
--- /dev/null
+++ b/WebContent/VAADIN/themes/reindeer/button/button-ie.scss
@@ -0,0 +1,8 @@
+@mixin reindeer-button-ie {
+
+.v-ie8 .v-nativebutton-link {
+	padding: 0;
+	text-align: left;
+}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/button/button-link-style.css b/WebContent/VAADIN/themes/reindeer/button/button-link-style.scss
index f4ba80b3cd..aebda24cd4 100644
--- a/WebContent/VAADIN/themes/reindeer/button/button-link-style.css
+++ b/WebContent/VAADIN/themes/reindeer/button/button-link-style.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-button-link-style {
+
 .v-button.v-button-link,
 .v-button.v-button-link:focus,
 .v-button.v-button-link:active,
@@ -32,4 +34,6 @@
 .v-button-link:focus .v-button-caption,
 .v-nativebutton-link:focus .v-nativebutton-caption {
 	outline: 1px dotted #1b699f;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/button/button-primary-style.css b/WebContent/VAADIN/themes/reindeer/button/button-primary-style.scss
index fdfe90ce3a..ffb4d250d3 100644
--- a/WebContent/VAADIN/themes/reindeer/button/button-primary-style.css
+++ b/WebContent/VAADIN/themes/reindeer/button/button-primary-style.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-button-primary-style {
+
 .v-button-primary:focus {
 	background-image: url(img/primary-left-focus.png); /** sprite-ref: buttons */
 	}
@@ -60,3 +62,5 @@
 .black .v-disabled.v-button-primary .v-button-wrap {
 	background-image: url(img/black/primary-right.png); /** sprite-ref: black-buttons; sprite-alignment: right */
 	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/button/button-small-style.css b/WebContent/VAADIN/themes/reindeer/button/button-small-style.scss
index fa6b177624..0ec33e330c 100644
--- a/WebContent/VAADIN/themes/reindeer/button/button-small-style.css
+++ b/WebContent/VAADIN/themes/reindeer/button/button-small-style.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-button-small-style {
+
 .v-button-small:focus {
 	background-image: url(img/small-left-focus.png); /** sprite-ref: buttons */
 	}
@@ -64,4 +66,6 @@
 .black .v-button-small .v-button-wrap,
 .black .v-disabled.v-button-small .v-button-wrap {
 	background-image: url(img/black/small-right.png); /** sprite-ref: black-buttons; sprite-alignment: right */
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/button/button-standard.css b/WebContent/VAADIN/themes/reindeer/button/button-standard.scss
index becd20457d..4df09bc1bd 100644
--- a/WebContent/VAADIN/themes/reindeer/button/button-standard.css
+++ b/WebContent/VAADIN/themes/reindeer/button/button-standard.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-button-standard {
+
 .v-button:focus {
 	background-image: url(img/left-focus.png); /** sprite-ref: buttons */
 	outline: none;
@@ -87,4 +89,6 @@
 .black .v-button-caption {
 	color: #c9ccce;
 	text-shadow: #121314 0 -1px 0;
-	}
\ No newline at end of file
+	}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/button/button.css b/WebContent/VAADIN/themes/reindeer/button/button.css
deleted file mode 100644
index 14da4facc5..0000000000
--- a/WebContent/VAADIN/themes/reindeer/button/button.css
+++ /dev/null
@@ -1,11 +0,0 @@
-/* Standard implementation of the button theme
- * These files contain styles that apply to all browsers
- */
-@import "button-standard.css";
-@import "button-primary-style.css";
-@import "button-small-style.css";
-@import "button-link-style.css";
-
-/* Browser-specific corrections to the standard implementation */
-@import "button-firefox.css";
-@import "button-ie.css";
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/button/button.scss b/WebContent/VAADIN/themes/reindeer/button/button.scss
new file mode 100644
index 0000000000..34a4efda04
--- /dev/null
+++ b/WebContent/VAADIN/themes/reindeer/button/button.scss
@@ -0,0 +1,22 @@
+/* Standard implementation of the button theme
+ * These files contain styles that apply to all browsers
+ */
+@import "button-standard.scss";
+@import "button-primary-style.scss";
+@import "button-small-style.scss";
+@import "button-link-style.scss";
+
+/* Browser-specific corrections to the standard implementation */
+@import "button-ie.scss";
+
+@mixin reindeer-button {
+
+	@include reindeer-button-standard;
+	@include reindeer-button-primary-style;
+	@include reindeer-button-small-style;
+	@include reindeer-button-link-style;
+
+	/* Browser-specific corrections to the standard implementation */
+	@include reindeer-button-ie;
+
+}
diff --git a/WebContent/VAADIN/themes/reindeer/common/common.css b/WebContent/VAADIN/themes/reindeer/common/common.scss
index 50dcdd84ab..86f546a6a2 100644
--- a/WebContent/VAADIN/themes/reindeer/common/common.css
+++ b/WebContent/VAADIN/themes/reindeer/common/common.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-common {
+
 .v-generated-body,
 .v-app {
 	background: #f5f5f5;
@@ -44,9 +46,6 @@
 	height: 16px;
 	background: transparent url(../common/icons/error.png) no-repeat 50%;
 }
-.v-ie6 .v-errorindicator {
-	background-image: url(../common/icons/error-ie6.png);
-}
 .v-tooltip {
 	background-color: #fffcdd;
 	border: 1px solid #b8b295;
@@ -122,4 +121,6 @@
 .portlet .v-popupview-popup .v-checkbox input {
 	margin-right: 3px;
 	background: transparent;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/common/icons/bullet-ie6.png b/WebContent/VAADIN/themes/reindeer/common/icons/bullet-ie6.png
deleted file mode 100644
index 7ba2e118a6..0000000000
--- a/WebContent/VAADIN/themes/reindeer/common/icons/bullet-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/common/icons/bullet-white-ie6.png b/WebContent/VAADIN/themes/reindeer/common/icons/bullet-white-ie6.png
deleted file mode 100644
index 9661802744..0000000000
--- a/WebContent/VAADIN/themes/reindeer/common/icons/bullet-white-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/common/icons/error-ie6.png b/WebContent/VAADIN/themes/reindeer/common/icons/error-ie6.png
deleted file mode 100644
index dce7941157..0000000000
--- a/WebContent/VAADIN/themes/reindeer/common/icons/error-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/datefield/datefield.css b/WebContent/VAADIN/themes/reindeer/datefield/datefield.scss
index 7217d70576..17b9d42cdb 100644
--- a/WebContent/VAADIN/themes/reindeer/datefield/datefield.css
+++ b/WebContent/VAADIN/themes/reindeer/datefield/datefield.scss
@@ -1,3 +1,8 @@
+@mixin reindeer-datefield {
+
+.v-datefield {
+	overflow: hidden;
+}
 input.v-textfield-readonly:focus{
 	background-color: transparent;	
 }
@@ -43,14 +48,9 @@ span.v-datefield-calendarpanel-month {
 .v-datefield-full {
 	min-width: 240px;
 }
-.v-ff2 .v-datefield-month,
-.v-ff2 .v-datefield-day,
-.v-ff2 .v-datefield-full {
-	min-width: 254px;
-}
-.v-datefield-popupcalendar,
-.v-ff2 .v-datefield-popupcalendar {
+.v-datefield-popupcalendar {
 	min-width: 0;
+	padding-right: 24px;
 }
 .v-datefield-year .v-datefield-calendarpanel {
 	width: 100px;
@@ -120,10 +120,6 @@ td.v-datefield-calendarpanel-nextyear {
 .v-ie .v-datefield-calendarpanel-nextmonth button {
 	border: none;
 }
-.v-ie6 .v-datefield-calendarpanel-prevmonth button,
-.v-ie6 .v-datefield-calendarpanel-nextmonth button {
-	width: 24px;
-}
 .v-datefield-calendarpanel-nextmonth button {
 	background-image: url(img/month-next.png); /** sprite-ref: verticals; sprite-alignment: center */
 }
@@ -231,21 +227,23 @@ td.v-datefield-calendarpanel-nextyear {
 	-moz-border-radius: 3px;
 }
 .v-sa .v-datefield-popup,
-.v-ff3 .v-datefield-popup,
 .v-op .v-datefield-popup {
 	background: rgba(255,255,255,.95);
 }
-.v-datefield-year .v-datefield-textfield {
-	width: 4em;
+.v-has-width > input.v-datefield-textfield {
+	width: 100%;
 }
-.v-datefield-month .v-datefield-textfield {
-	width: 5em;
+.v-datefield-year > .v-datefield-textfield {
+	width: 4.5em;
 }
-.v-datefield-day .v-datefield-textfield {
+.v-datefield-month > .v-datefield-textfield {
 	width: 5.5em;
 }
-.v-datefield-full .v-datefield-textfield {
-	width: 12em;
+.v-datefield-day > .v-datefield-textfield {
+	width: 6em;
+}
+.v-datefield-full >.v-datefield-textfield {
+	width: 12.5em;
 }
 .v-datefield-popupcalendar input.v-datefield-textfield {
 	border-right-width: 0;
@@ -253,7 +251,10 @@ td.v-datefield-calendarpanel-nextyear {
 	-moz-border-radius-bottomright: 0;
 	-webkit-border-top-right-radius: 0;
 	-webkit-border-bottom-right-radius: 0;
-	height: 14px;
+	height: 23px;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
 }
 .v-datefield.v-readonly input.v-datefield-textfield {
 	border-right-width: 1px;
@@ -267,6 +268,7 @@ td.v-datefield-calendarpanel-nextyear {
 }
 .v-datefield-popupcalendar .v-datefield-button {
 	width: 24px;
+	margin-right: -24px;
 	height: 23px;
 	background: transparent;
 	border: none;
@@ -289,11 +291,6 @@ td.v-datefield-calendarpanel-nextyear {
 	background-image: url(img/popup-btn-black-pressed.png); /** sprite-ref: black-verticals */
 }
 
-/* Small adjustment for IE6 */
-.v-ie6 .v-datefield-popupcalendar .v-datefield-button {
-	margin-top: 1px;
-}
-
 
 /*------------
 * on black background
@@ -371,4 +368,6 @@ td.v-datefield-calendarpanel-nextyear {
 }
 .black .v-datefield-prompt .v-datefield-textfield {
 	color: #5f6366;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/formlayout/formlayout.css b/WebContent/VAADIN/themes/reindeer/formlayout/formlayout.scss
index a5d465a91f..ab47767dcf 100644
--- a/WebContent/VAADIN/themes/reindeer/formlayout/formlayout.css
+++ b/WebContent/VAADIN/themes/reindeer/formlayout/formlayout.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-formlayout {
+
 .v-formlayout-errorcell {
 	width: 13px;
 }
@@ -6,9 +8,6 @@
 	height: 16px;
 	background: transparent url(../common/icons/error.png) no-repeat 50%;
 }
-.v-ie6 .v-formlayout-cell .v-errorindicator {
-	background-image: url(../common/icons/error-ie6.png);
-}
 .v-formlayout-captioncell {
 	text-align: right;
 	white-space: nowrap;
@@ -42,10 +41,6 @@
 	margin-top: 5px;
 	min-height: 20px;
 }
-.v-ie6 .v-form-errormessage {
-	height: 20px;
-	background-image: url(../common/icons/error-ie6.png);
-}
 .v-form fieldset {
 	border: none;
 	border-top: 1px solid #babfc0;
@@ -64,4 +59,6 @@
 }
 .black .v-form legend {
 	color: #e3e6e8;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/label/label.css b/WebContent/VAADIN/themes/reindeer/label/label.scss
index 905ed7251d..a8418718e0 100644
--- a/WebContent/VAADIN/themes/reindeer/label/label.css
+++ b/WebContent/VAADIN/themes/reindeer/label/label.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-label {
+
 .v-label {
 	line-height: 18px;
 }
@@ -119,4 +121,6 @@
 /* Labels inside Table don't need a line-height */
 .v-table .v-label {
 	line-height: normal;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/layouts/layouts.css b/WebContent/VAADIN/themes/reindeer/layouts/layouts.scss
index 528d4b9174..832e480010 100644
--- a/WebContent/VAADIN/themes/reindeer/layouts/layouts.css
+++ b/WebContent/VAADIN/themes/reindeer/layouts/layouts.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-layouts {
+
 .v-orderedlayout-margin-top,
 .v-horizontallayout-margin-top,
 .v-verticallayout-margin-top {
@@ -85,4 +87,6 @@
 }
 .v-panel-content > div.black {
 	background: #1e2022 url(img/black-bg.png) repeat-x;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/link/link.css b/WebContent/VAADIN/themes/reindeer/link/link.scss
index e3847f1180..291479b2d1 100644
--- a/WebContent/VAADIN/themes/reindeer/link/link.css
+++ b/WebContent/VAADIN/themes/reindeer/link/link.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-link {
+
 .v-link a:link span {
 	color: #1b699f;
 }
@@ -6,4 +8,6 @@
 }
 .v-link a:hover span {
 	color: #2483c4;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/menubar/menubar.css b/WebContent/VAADIN/themes/reindeer/menubar/menubar.scss
index 165eacc840..78f4a9fa45 100644
--- a/WebContent/VAADIN/themes/reindeer/menubar/menubar.css
+++ b/WebContent/VAADIN/themes/reindeer/menubar/menubar.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-menubar {
+
 .v-menubar {
 	height: 23px;
 	background: #323336 repeat-x;
@@ -70,3 +72,5 @@
 .v-menubar-submenu .v-menubar-menuitem-selected-unchecked .v-menubar-menuitem-caption {
 	background: transparent url(img/unchecked-selected.png) no-repeat left;
 }
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/notification/notification.css b/WebContent/VAADIN/themes/reindeer/notification/notification.scss
index 33b56ef891..d9ddd4da27 100644
--- a/WebContent/VAADIN/themes/reindeer/notification/notification.css
+++ b/WebContent/VAADIN/themes/reindeer/notification/notification.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-notification {
+
 .v-Notification {
 	color: #fff;
 	border-radius: 4px;
@@ -41,4 +43,6 @@
 }
 .v-Notification-system {
 	background-color: #b40000;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/panel/panel.css b/WebContent/VAADIN/themes/reindeer/panel/panel.scss
index 8ce943a7be..00483c5546 100644
--- a/WebContent/VAADIN/themes/reindeer/panel/panel.css
+++ b/WebContent/VAADIN/themes/reindeer/panel/panel.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-panel {
+
 .blue .v-panel-caption,
 .blue .v-panel-nocaption,
 .blue .v-panel-content {
@@ -23,6 +25,7 @@
 }
 .v-panel-content,
 .white .v-panel-content {
+	background: #fff;
 	border: 1px solid #dcdcdc;
 	border-bottom: none;
 	border-top: none;
@@ -32,13 +35,6 @@
 .v-ie9 .v-panel-content {
 	border-top-color: rgba(0,0,0,.07);
 }
-.v-panel-content > div {
-	background: #fff;
-	min-height: 100%;
-}
-.v-ie6 .v-panel-content {
-	background: #fff;
-}
 .blue .v-panel-deco {
 	border-color: #92a3ac;
 	background: #adc2cd;
@@ -64,9 +60,6 @@
 	display: inline-block;
 	vertical-align: middle;
 }
-.v-ie6 .v-panel-caption .v-errorindicator {
-	background-image: url(../common/icons/error-ie6.png);
-}
 
 /* Light style */
 .v-panel-light .v-panel-caption-light,
@@ -75,14 +68,11 @@
 }
 .v-panel-light .v-panel-content-light {
 	border: none;
-}
-.v-panel-content-light > div {
-	background: transparent;
-}
-.v-ie6 .v-panel-content-light {
 	background: transparent;
 }
 .v-panel-light .v-panel-deco-light {
 	height: 0;
 	border: none;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/popupview/popupview.css b/WebContent/VAADIN/themes/reindeer/popupview/popupview.scss
index 8336f46505..7e7f55fda5 100644
--- a/WebContent/VAADIN/themes/reindeer/popupview/popupview.css
+++ b/WebContent/VAADIN/themes/reindeer/popupview/popupview.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-popupview {
+
 .v-popupview {
 	color: #1b699f;
 }
@@ -7,4 +9,6 @@
 .v-popupview-popup {
 	background: #fff;
 	padding: 3px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/progressindicator/progressindicator.css b/WebContent/VAADIN/themes/reindeer/progressindicator/progressindicator.scss
index 70a42e483e..f3f3a59afb 100644
--- a/WebContent/VAADIN/themes/reindeer/progressindicator/progressindicator.css
+++ b/WebContent/VAADIN/themes/reindeer/progressindicator/progressindicator.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-progressindicator {
+
 .v-progressindicator-wrapper {
 	background: #dfe2e4 url(img/base.gif) repeat-x;
 	border: 1px solid #bfbfbf;
@@ -7,4 +9,6 @@
 }
 .v-progressindicator-indicator {
 	background: #f7f9f9 url(img/progress.png);
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/reindeer.scss b/WebContent/VAADIN/themes/reindeer/reindeer.scss
new file mode 100644
index 0000000000..0cd01f7885
--- /dev/null
+++ b/WebContent/VAADIN/themes/reindeer/reindeer.scss
@@ -0,0 +1,28 @@
+// this file just defines all reindeer mixins by importing them
+
+// common between others for now for backwards compatibility
+
+@import "accordion/accordion.scss";
+@import "a-sprite-definitions/a-sprite-definitions.scss";
+@import "button/button.scss";
+
+@import "common/common.scss";
+
+@import "datefield/datefield.scss";
+@import "formlayout/formlayout.scss";
+@import "label/label.scss";
+@import "layouts/layouts.scss";
+@import "link/link.scss";
+@import "menubar/menubar.scss";
+@import "notification/notification.scss";
+@import "panel/panel.scss";
+@import "popupview/popupview.scss";
+@import "progressindicator/progressindicator.scss";
+@import "select/select.scss";
+@import "slider/slider.scss";
+@import "splitpanel/splitpanel.scss";
+@import "table/table.scss";
+@import "tabsheet/tabsheet.scss";
+@import "textfield/textfield.scss";
+@import "tree/tree.scss";
+@import "window/window.scss";
diff --git a/WebContent/VAADIN/themes/reindeer/select/img/black/left-black-focus-ie6.png b/WebContent/VAADIN/themes/reindeer/select/img/black/left-black-focus-ie6.png
deleted file mode 100644
index 5cf13fac6a..0000000000
--- a/WebContent/VAADIN/themes/reindeer/select/img/black/left-black-focus-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/select/img/black/left-black-ie6.png b/WebContent/VAADIN/themes/reindeer/select/img/black/left-black-ie6.png
deleted file mode 100644
index d06d599e0e..0000000000
--- a/WebContent/VAADIN/themes/reindeer/select/img/black/left-black-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/select/img/left-focus-ie6.png b/WebContent/VAADIN/themes/reindeer/select/img/left-focus-ie6.png
deleted file mode 100644
index 643aac1bc9..0000000000
--- a/WebContent/VAADIN/themes/reindeer/select/img/left-focus-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/select/img/left-ie6.png b/WebContent/VAADIN/themes/reindeer/select/img/left-ie6.png
deleted file mode 100644
index 226aea1ad1..0000000000
--- a/WebContent/VAADIN/themes/reindeer/select/img/left-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/select/select.css b/WebContent/VAADIN/themes/reindeer/select/select.scss
index b23e7571e2..4a8d07fd91 100644
--- a/WebContent/VAADIN/themes/reindeer/select/select.css
+++ b/WebContent/VAADIN/themes/reindeer/select/select.scss
@@ -1,11 +1,11 @@
+@mixin reindeer-select {
+
 .v-filterselect {
 	height: 24px;
 	background-repeat: no-repeat;
 	background-image: url(img/left.png); /** sprite-ref: verticals; sprite-margin-bottom: 1px */
 	padding-left: 2px;
-}
-.v-ie6 .v-filterselect {
-	background-image: url(img/left-ie6.png); /** sprite-ref: verticals; sprite-margin-bottom: 1px */
+	padding-right: 25px; /* Space for the button */
 }
 .v-app .v-filterselect-input,
 .v-window .v-filterselect-input,
@@ -13,13 +13,16 @@
 	background: transparent repeat-x;
 	background-image: url(img/center.png); /** sprite-ref: verticals; sprite-alignment: repeat; sprite-margin-bottom: 1px */
 	border: none;
-	height: 16px;
+	height: 24px;
 }
 /* More specific selector to override padding */
 .v-app input.v-filterselect-input,
 .v-window input.v-filterselect-input,
 .v-popupview-popup input.v-filterselect-input {
 	padding: 4px 0 4px 2px;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
 }
 .v-filterselect-prompt .v-filterselect-input {
 	font-style: normal;
@@ -30,9 +33,6 @@
 .v-filterselect-focus {
 	background-image: url(img/left-focus.png); /** sprite-ref: verticals; sprite-margin-bottom: 1px */
 }
-.v-ie6 .v-filterselect-focus {
-	background-image: url(img/left-focus-ie6.png); /** sprite-ref: verticals; sprite-margin-bottom: 1px */
-}
 .v-filterselect-focus .v-filterselect-input {
 	background-image: url(img/center-focus.png); /** sprite-ref: verticals; sprite-alignment: repeat */
 }
@@ -42,6 +42,7 @@
 	height: 24px;
 	background-image: url(img/right.png); /** sprite-ref: verticals ; sprite-margin-bottom: 1px */
 	cursor: default;
+	margin-right: -25px;
 }
 .v-filterselect-button:hover {
 	background-image: url(img/right-hover.png); /** sprite-ref: verticals */
@@ -209,9 +210,6 @@
 .black .v-filterselect {
 	background-image: url(img/black/left-black.png); /** sprite-ref: black-verticals; sprite-margin-bottom: 1px */
 }
-.v-ie6 .black .v-filterselect {
-	background-image: url(img/black/left-black-ie6.png); /** sprite-ref: black-verticals; sprite-margin-bottom: 1px */
-}
 .v-app .black .v-filterselect-input,
 .v-window .black .v-filterselect-input,
 .v-window-black .v-filterselect-input,
@@ -222,9 +220,6 @@
 .black .v-filterselect-focus {
 	background-image: url(img/black/left-black-focus.png); /** sprite-ref: black-verticals; sprite-margin-bottom: 1px */
 }
-.v-ie6 .black .v-filterselect-focus {
-	background-image: url(img/black/left-black-focus-ie6.png); /** sprite-ref: black-verticals; sprite-margin-bottom: 1px */
-}
 .black .v-filterselect-focus .v-filterselect-input {
 	background-image: url(img/black/center-black-focus.png); /** sprite-ref: black-verticals; sprite-alignment: repeat; sprite-margin-bottom: 1px */
 }
@@ -266,14 +261,4 @@
 	color: #c9ccce;
 }
 
-/* Twincolselect needs a little tweak in IE6 */
-.v-ie6 .v-select-twincol-buttons .v-button {
-	padding-left: 12px;
-	padding-right: 12px;
-}
-
-/* IE6 needs some help identifying when the input is readonly */
-.v-ie6 .v-filterselect.v-readonly,
-.v-ie6 .v-filterselect .v-filterselect-input-readonly {
-	background: transparent;
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/slider/slider.css b/WebContent/VAADIN/themes/reindeer/slider/slider.scss
index cb5a0f7dbe..047237d262 100644
--- a/WebContent/VAADIN/themes/reindeer/slider/slider.css
+++ b/WebContent/VAADIN/themes/reindeer/slider/slider.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-slider {
+
 .v-slider {
 	border-top: 1px solid #9a9c9e;
 	border-bottom: 1px solid #bdbfc1;
@@ -38,4 +40,6 @@
 	width: 10px;
 	height: 10px;
 	margin-left: -5px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/splitpanel/splitpanel.css b/WebContent/VAADIN/themes/reindeer/splitpanel/splitpanel.scss
index ac27629187..07a38891f5 100644
--- a/WebContent/VAADIN/themes/reindeer/splitpanel/splitpanel.css
+++ b/WebContent/VAADIN/themes/reindeer/splitpanel/splitpanel.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-splitpanel {
+
 .v-splitpanel-hsplitter,
 .v-splitpanel-hsplitter-locked {
 	width: 7px;
@@ -63,4 +65,6 @@
 	height: 5px;
 	margin-top: -2px;
 	background: transparent;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/styles.scss b/WebContent/VAADIN/themes/reindeer/styles.scss
new file mode 100644
index 0000000000..51daace9d3
--- /dev/null
+++ b/WebContent/VAADIN/themes/reindeer/styles.scss
@@ -0,0 +1,32 @@
+// this file actually attaches all reindeer mixins to a parent style
+
+@import "../base/styles.scss";
+@import "reindeer.scss";
+
+// .v-theme-reindeer {
+	@include reindeer-accordion;
+	// TODO this is problematic: comments get stripped out
+	// @include a-sprite-definitions;
+	@include reindeer-button;
+	
+	@include reindeer-common;
+	
+	@include reindeer-datefield;
+	@include reindeer-formlayout;
+	@include reindeer-label;
+	@include reindeer-layouts;
+	@include reindeer-link;
+	@include reindeer-menubar;
+	@include reindeer-notification;
+	@include reindeer-panel;
+	@include reindeer-popupview;
+	@include reindeer-progressindicator;
+	@include reindeer-select;
+	@include reindeer-slider;
+	@include reindeer-splitpanel;
+	@include reindeer-table;
+	@include reindeer-tabsheet;
+	@include reindeer-textfield;
+	@include reindeer-tree;
+	@include reindeer-window;
+// }
diff --git a/WebContent/VAADIN/themes/reindeer/table/table.css b/WebContent/VAADIN/themes/reindeer/table/table.scss
index cab7d6a01f..cb190e1f30 100644
--- a/WebContent/VAADIN/themes/reindeer/table/table.css
+++ b/WebContent/VAADIN/themes/reindeer/table/table.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-table {
+
 /* Table on blue background */
 .blue .v-table-header-wrap {
 	border-color: #92a2aa;
@@ -25,24 +27,6 @@
 	line-height: normal;
 }
 
-.v-ie6 .v-table,
-.v-ie6 .v-table-header-wrap,
-.v-ie6 .v-table-footer-wrap,
-.v-ie6 .v-table-column-selector {
-	/* The header will overflow the Table due to a bug in IE6 after changes in #3003. To fix this (#7314) 
-	 * we need to apply position:relative to the wrappers and selector to make them appear on top of the 
-	 * header. We also need to apply it to the table root div to get rid of a really weird IE6 rendering bug
-	 * caused by all this relativeness (see attachment in #7314).  
-	 */
-	position: relative;
-}
-
-.v-ie6 .v-table.v-disabled,
-.v-ie7 .v-table.v-disabled {
-	/* Fixes ie issue #7324 where disabled shim does not cover table body */ 
-	position: relative;
-}
-
 .v-table-footer-wrap,
 .white .v-table-footer-wrap {
 	text-transform: none;
@@ -304,4 +288,6 @@
 .v-table-borderless .v-table-header-wrap,
 .v-table-borderless .v-table-body {
 	border: none;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-borderless-style.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-borderless-style.scss
index e9325404da..1efdab68af 100644
--- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-borderless-style.css
+++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-borderless-style.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-tabsheet-borderless-style {
+
 .v-tabsheet-borderless .v-tabsheet-tabitemcell-first {
 	padding-left: 7px;
 	background: url(img/framed/tab-first-left.png) no-repeat -3px 0;
@@ -17,4 +19,6 @@
 .v-tabsheet-borderless .v-tabsheet-deco {
 	height: 0;
 	border-top: none;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-hover-closable-style.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-hover-closable-style.scss
index 40b75c59b3..dda381b1b0 100644
--- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-hover-closable-style.css
+++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-hover-closable-style.scss
@@ -1,6 +1,10 @@
+@mixin reindeer-tabsheet-hover-closable-style {
+
 .v-tabsheet-tabs-hover-closable .v-tabsheet-caption-close {
 	visibility: hidden;
 }
 .v-tabsheet-tabs-hover-closable .v-tabsheet-tabitem:hover .v-tabsheet-caption-close {
 	visibility: visible;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.scss
index d0041e586a..608aae55cb 100644
--- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.css
+++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-tabsheet-minimal-style {
+
 /**
  * Tabsheet "minimal" style --------------
  */
@@ -105,8 +107,7 @@
 .v-tabsheet-tabs-minimal .v-tabsheet-caption-close {
 	margin-top: 1px;
 }
-.v-ff .v-tabsheet-tabs-minimal .v-tabsheet-caption-close,
-.v-ie7 .v-tabsheet-tabs-minimal .v-tabsheet-caption-close {
+.v-ff .v-tabsheet-tabs-minimal .v-tabsheet-caption-close {
 	margin-top: -15px;
 }
 .v-tabsheet-tabs-minimal .v-tabsheet-caption-close:hover,
@@ -143,4 +144,6 @@
 }
 .black .v-tabsheet-tabs-minimal .v-tabsheet-caption-close:active {
 	background: #626669;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.scss
index 1c22a68a99..11bb98536a 100644
--- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.css
+++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-tabsheet-normal-style {
+
 /* Default Tabsheet styles */
 
 .v-tabsheet-tabitemcell,
@@ -52,13 +54,6 @@
 	font-size: 14px;
 	font-weight: normal;
 }
-.v-ff .v-tabsheet-caption-close,
-.v-ie7 .v-tabsheet-caption-close {
-	margin-top: -17px;
-}
-.v-ie6 .v-tabsheet-caption-close {
-	float: none;
-}
 .v-tabsheet-caption-close:hover {
 	background-image: url(img/close-btn-hover.png); /** sprite-ref: verticals */
 }
@@ -108,8 +103,7 @@
 .v-tabsheet-tabsheetpanel {
 	background: #fff;
 }
-.v-sa .v-tabsheet-content,
-.v-ff3 .v-tabsheet-content {
+.v-sa .v-tabsheet-content {
 	border-color: rgba(0,0,0,.1);
 }
 .blue .v-tabsheet-deco {
@@ -123,8 +117,7 @@
 	background: #e2e2e2;
 	overflow: hidden;
 }
-.v-sa .v-tabsheet-deco,
-.v-ff3 .v-tabsheet-deco {
+.v-sa .v-tabsheet-deco {
 	border-top-color: rgba(0,0,0,.1);
 	background: rgba(0,0,0,.08);
 }
@@ -151,13 +144,6 @@
 	height: 16px;
 	background: transparent url(../common/icons/error.png) no-repeat 50%;
 }
-.v-ff2 .v-tabsheet-tabs .v-icon,
-.v-ff2 .v-tabsheet-tabs .v-errorindicator {
-	display: -moz-inline-stack;
-}
-.v-ie6 .v-tabsheet-tabs .v-errorindicator {
-	background-image: url(../common/icons/error-ie6.png);
-}
 .v-ie .v-tabsheet-tabs .v-errorindicator {
 	zoom: 1;
 	display: inline;
@@ -165,4 +151,6 @@
 .v-ie8 .v-tabsheet-tabs .v-errorindicator,
 .v-ie9 .v-tabsheet-tabs .v-errorindicator {
 	display: inline-block;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-scroller.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-scroller.scss
index 18ad5c9194..8f176e2150 100644
--- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-scroller.css
+++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-scroller.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-tabsheet-scroller {
+
 /* Tabsheet scroller styles */
 
 .v-tabsheet-scroller {
@@ -48,4 +50,6 @@
 	background-image: url(img/tab-next-disabled.png); /** sprite-ref: verticals; sprite-margin-bottom: 1px */
 	opacity: 1;
 	filter: none;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-selected-closable-style.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-selected-closable-style.scss
index e4b8e0cd5f..d26a569c25 100644
--- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-selected-closable-style.css
+++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-selected-closable-style.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-tabsheet-selected-closable-style {
+
 .v-tabsheet-tabs-selected-closable .v-tabsheet-tabitem .v-tabsheet-caption-close,
 .v-tabsheet-tabs-selected-closable .v-tabsheet-tabitem:hover .v-tabsheet-caption-close {
 	visibility: hidden;
@@ -5,4 +7,6 @@
 .v-tabsheet-tabs-selected-closable .v-tabsheet-tabitem-selected .v-tabsheet-caption-close,
 .v-tabsheet-tabs-selected-closable .v-tabsheet-tabitem-selected:hover .v-tabsheet-caption-close {
 	visibility: visible;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-small-style.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-small-style.scss
index e440f7fdd1..e4f098046c 100644
--- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-small-style.css
+++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-small-style.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-tabsheet-small-style {
+
 /**
  * Tabsheet bar style ---------------
  */
@@ -50,8 +52,7 @@
 .v-tabsheet-tabs-bar .v-tabsheet-caption-close {
 	margin-top: 1px;
 }
-.v-ff .v-tabsheet-tabs-bar .v-tabsheet-caption-close,
-.v-ie7 .v-tabsheet-tabs-bar .v-tabsheet-caption-close {
+.v-ff .v-tabsheet-tabs-bar .v-tabsheet-caption-close {
 	margin-top: -14px;
 }
 .v-tabsheet-tabs-bar .v-tabsheet-caption-close:hover {
@@ -108,3 +109,5 @@
 	border: none;
 }
 /* Content area font color specified with minimal style (reduces additional selectors) */
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css
deleted file mode 100644
index b636effb0f..0000000000
--- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.css
+++ /dev/null
@@ -1,8 +0,0 @@
-/* These styles get catenated together on build */
-@import "tabsheet-normal-style.css";
-@import "tabsheet-scroller.css";
-@import "tabsheet-borderless-style.css";
-@import "tabsheet-minimal-style.css";
-@import "tabsheet-small-style.css";
-@import "tabsheet-selected-closable-style.css";
-@import "tabsheet-hover-closable-style.css";
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.scss b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.scss
new file mode 100644
index 0000000000..8b9252cf68
--- /dev/null
+++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet.scss
@@ -0,0 +1,20 @@
+/* These styles get catenated together on build */
+@import "tabsheet-normal-style.scss";
+@import "tabsheet-scroller.scss";
+@import "tabsheet-borderless-style.scss";
+@import "tabsheet-minimal-style.scss";
+@import "tabsheet-small-style.scss";
+@import "tabsheet-selected-closable-style.scss";
+@import "tabsheet-hover-closable-style.scss";
+
+@mixin reindeer-tabsheet {
+
+	@include reindeer-tabsheet-normal-style;
+	@include reindeer-tabsheet-scroller;
+	@include reindeer-tabsheet-borderless-style;
+	@include reindeer-tabsheet-minimal-style;
+	@include reindeer-tabsheet-small-style;
+	@include reindeer-tabsheet-selected-closable-style;
+	@include reindeer-tabsheet-hover-closable-style;
+
+}
diff --git a/WebContent/VAADIN/themes/reindeer/textfield/textfield.css b/WebContent/VAADIN/themes/reindeer/textfield/textfield.scss
index 4c8ed4251e..8db2dda567 100644
--- a/WebContent/VAADIN/themes/reindeer/textfield/textfield.css
+++ b/WebContent/VAADIN/themes/reindeer/textfield/textfield.scss
@@ -1,3 +1,5 @@
+@mixin reindeer-textfield {
+
 /* Textfield on blue background */
 .blue .v-textfield,
 .blue .v-textarea {
@@ -20,7 +22,7 @@
 	-webkit-border-radius: 3px;
 	border-radius: 3px;
 	margin: 0;
-	height: 15px;
+	height: 23px;
 	line-height: normal;
 }
 .v-textarea,
@@ -35,6 +37,10 @@
 .v-window textarea.v-textarea  {
 	padding: 3px 3px 4px;
 }
+.v-app input.v-textfield.v-connector,
+.v-window input.v-textfield.v-connector {
+	height: 24px;
+}
 .v-app .v-textfield-focus,
 .v-window .v-textfield-focus,
 .v-popupview-popup .v-textfield-focus,
@@ -62,7 +68,8 @@ textarea.v-textarea-prompt {
 .v-app textarea.v-textarea-small {
 	font-size: 11px;
 }
-.v-table input.v-textfield {
+.v-app .v-table  input.v-textfield.v-connector,
+.v-window .v-table input.v-textfield.v-connector {
 	padding: 1px 2px;
 	height: auto;
 	line-height: normal;
@@ -71,14 +78,6 @@ textarea.v-textarea-prompt {
 	margin-top: -2px;
 	margin-bottom: -2px;
 }
-.v-ie6 .v-table-cell-wrapper input.v-textfield {
-	margin-top: -2px;
-	margin-bottom: -2px;
-}
-.v-ie6 .v-table-cell-wrapper div input.v-textfield {
-	margin-top: 0;
-	margin-bottom: 0;
-}
 /* Textfield on black background */
 .black .v-textfield,
 .black .v-textarea {
@@ -116,4 +115,6 @@ textarea.v-textarea-readonly,
 .black textarea.v-textarea-readonly {
 	border: none;
 	background: transparent;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/tree/img/arrows-ie6.png b/WebContent/VAADIN/themes/reindeer/tree/img/arrows-ie6.png
deleted file mode 100644
index e016e313a7..0000000000
--- a/WebContent/VAADIN/themes/reindeer/tree/img/arrows-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/tree/tree.css b/WebContent/VAADIN/themes/reindeer/tree/tree.scss
index 63ac914fdf..3a1ad35c81 100644
--- a/WebContent/VAADIN/themes/reindeer/tree/tree.css
+++ b/WebContent/VAADIN/themes/reindeer/tree/tree.scss
@@ -1,13 +1,8 @@
+@mixin reindeer-tree {
+
 .v-tree-node {
 	background: transparent url(img/arrows.png) no-repeat 6px -10px;
 }
-.v-ie6 .v-tree-node {
-	background-image: url(img/arrows-ie6.png);
-	background-repeat: no-repeat;
-}
-.v-ie6 div.v-tree-node-leaf {
-	background: transparent;
-}
 .v-tree-node-expanded {
 	background-position: -7px 5px;
 }
@@ -32,12 +27,6 @@
 .v-tree-node-children {
 	padding-left: 16px;
 }
-/* IMPORTANT keep the offsetWidth (width + padding) of this element the same as the margin-left of v-tree-node-caption */
-.v-ie6 .v-tree-node-ie6compatnode {
-	width: 14px;
-	height: 10px;
-	padding: 1px;
-}
 .v-tree-node-caption.v-tree-node-focused span{
 	padding-left: 1px;
 	padding-top: 0px;
@@ -46,9 +35,6 @@
 .v-tree-node-focused span{
 	border: 1px dotted black;	
 }
-.v-ie6 .v-tree-node-ie6compatnode.v-tree-node-focused{
-	padding-left: 0px;
-}
 /***************************************
  * Drag'n'drop styles
  ***************************************/
@@ -64,4 +50,6 @@
 }
 .v-tree-connectors .v-tree-node-drag-top.v-tree-node-leaf {
 	background-position: 2px 50%;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/reindeer/window/img/black/content-bg-ie6.png b/WebContent/VAADIN/themes/reindeer/window/img/black/content-bg-ie6.png
deleted file mode 100644
index 8ff06a11ed..0000000000
--- a/WebContent/VAADIN/themes/reindeer/window/img/black/content-bg-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/window/img/black/header-bg-ie6.png b/WebContent/VAADIN/themes/reindeer/window/img/black/header-bg-ie6.png
deleted file mode 100644
index ddfc27f6e6..0000000000
--- a/WebContent/VAADIN/themes/reindeer/window/img/black/header-bg-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/window/img/black/resize-ie6.png b/WebContent/VAADIN/themes/reindeer/window/img/black/resize-ie6.png
deleted file mode 100644
index 011b64a918..0000000000
--- a/WebContent/VAADIN/themes/reindeer/window/img/black/resize-ie6.png
+++ /dev/null
diff --git a/WebContent/VAADIN/themes/reindeer/window/window.css b/WebContent/VAADIN/themes/reindeer/window/window.scss
index 5b3997f444..ac8fa9c2c9 100644
--- a/WebContent/VAADIN/themes/reindeer/window/window.css
+++ b/WebContent/VAADIN/themes/reindeer/window/window.scss
@@ -1,37 +1,21 @@
+@mixin reindeer-window {
+
 .v-window {
 	background: transparent;
 }
 .v-window-wrap {
 	border: 1px solid #808386;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
 }
 .v-sa .v-window-wrap,
-.v-ff3 .v-window-wrap,
 .v-op .v-window-wrap {
 	border-color: rgba(0,0,0,.2);
 }
-.v-ff2 .v-window-wrap,
-.v-ie6 .v-window-wrap {
-	border: none;
-}
-.v-ff2 .v-window-outerheader,
-.v-ie6 .v-window-outerheader {
-	border: 1px solid #808386;
-	border-bottom: none;
-}
-.v-ff2 .v-window-contents,
-.v-ie6 .v-window-contents {
-	border: 1px solid #808386;
-	border-top: none;
-	border-bottom: none;
-}
-.v-ff2 .v-window-footer,
-.v-ie6 .v-window-footer {
-	border: 1px solid #808386;
-	border-top: none;
-}
 .v-window-outerheader {
 	padding: 12px 32px 0 14px;
-	height: 25px;
+	height: 37px;
 	background: black repeat-x;
 	background-image: url(img/header-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */
 }
@@ -50,9 +34,6 @@
 	padding-left: 13px;
 	background: transparent url(../common/icons/error.png) no-repeat 0 50%;
 }
-.v-ie6 .v-window-error .v-window-header {
-	background-image: url(../common/icons/error-ie6.png);
-}
 .v-window-resizebox {
 	width: 15px;
 	height: 15px;
@@ -136,12 +117,6 @@
 	background: #f7f7f8 repeat-x;
 	background-image: url(img/content-bg-light.png); /** sprite-ref: verticals; sprite-alignment: repeat */
 }
-.v-ie6 .v-window-light .v-window-wrap2 {
-	background-image: none;
-}
-
-
-
 
 
 /**
@@ -156,7 +131,6 @@
 	overflow: hidden;
 }
 .v-sa .v-window-black .v-window-wrap,
-.v-ff3 .v-window-black .v-window-wrap,
 .v-op .v-window-black .v-window-wrap {
 	border-color: rgba(0,0,0,.8);
 }
@@ -166,7 +140,6 @@
 	-webkit-border-radius: 7px;
 }
 .v-sa .v-window-black .v-window-wrap2,
-.v-ff3 .v-window-black .v-window-wrap2,
 .v-op .v-window-black .v-window-wrap2 {
 	background-color: rgba(29,32,33,.9);
 }
@@ -203,15 +176,11 @@
 	width: 14px;
 	height: 14px;
 }
-.v-ie6 .v-window-black .v-window-resizebox {
-	background-image: url(img/black/resize-ie6.png); /** sprite-ref: black-verticals; sprite-margin-bottom: 4px */
-}
-.v-ie6 .v-window-black .v-window-contents {
-	background: transparent url(img/black/content-bg-ie6.png) repeat-x;
-}
 /* Must be last to make this image last in the sprites */
 .v-window-black .v-window-contents {
 	border: none;
 	background: transparent repeat-x;
 	background-image: url(img/black/content-bg.png); /** sprite-ref: black-verticals; sprite-alignment: repeat */
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/absolutelayout/absolutelayout.css b/WebContent/VAADIN/themes/runo/absolutelayout/absolutelayout.scss
index 9373b73db8..623110ff63 100644
--- a/WebContent/VAADIN/themes/runo/absolutelayout/absolutelayout.css
+++ b/WebContent/VAADIN/themes/runo/absolutelayout/absolutelayout.scss
@@ -1,4 +1,8 @@
+@mixin runo-absolutelayout {
+
 .v-absolutelayout-wrapper {
 	position: absolute;
 	overflow:hidden;
 }
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/accordion/accordion.css b/WebContent/VAADIN/themes/runo/accordion/accordion.scss
index cad4bb94ba..f9c9487536 100644
--- a/WebContent/VAADIN/themes/runo/accordion/accordion.css
+++ b/WebContent/VAADIN/themes/runo/accordion/accordion.scss
@@ -1,3 +1,5 @@
+@mixin runo-accordion {
+
 .v-accordion-item-caption {
 	height: 31px;
 	background: #edf0f0 url(img/bg.png);
@@ -45,4 +47,6 @@
 	-moz-border-radius: 12px;
 	border-radius: 12px;
 	background-position: 15px 50%;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/button/button.css b/WebContent/VAADIN/themes/runo/button/button.scss
index 75557d8a39..5da6211804 100644
--- a/WebContent/VAADIN/themes/runo/button/button.css
+++ b/WebContent/VAADIN/themes/runo/button/button.scss
@@ -1,3 +1,5 @@
+@mixin runo-button {
+
 .v-button {
 	padding: 1px;
 	border: none;
@@ -26,7 +28,7 @@
 	border-color: rgba(146,151,152,.9);
 	border-top-color: rgba(146,151,152,1);
 	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4) inset;
-	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.4) inset;;
+	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.4) inset;
 	text-shadow: none;
 	}
 
@@ -56,12 +58,6 @@
 	text-overflow: ellipsis;
 	}
 
-.v-ie7 .v-button .v-button-wrap {
-	overflow: visible;
-}
-
-
-
 /* Small style */
 .v-button-small .v-button-wrap,
 .v-disabled.v-button-small .v-button-wrap {
@@ -102,8 +98,8 @@
 	border-bottom-color: #747f82;
 	color: #f0f2f2;
 	text-shadow: 0 -1px 0 #5d6969;
-	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4) inset;;
-	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.4) inset;;
+	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4) inset;
+	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.4) inset;
 	}
 
 .v-button-default .v-button-wrap,
@@ -160,13 +156,5 @@
 .v-checkbox .v-errorindicator {
 	padding-left: 10px;
 	}
-.v-ie6 .v-checkbox .v-errorindicator {
-	padding-right: 4px;
-	}
-.v-ie7 .v-checkbox .v-errorindicator {
-	padding-right: 7px;
-	}
-.v-ie6 .v-button .v-errorindicator,
-.v-ie7 .v-button .v-errorindicator {
-	padding-right: 5px;
-	}
\ No newline at end of file
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/caption/caption.css b/WebContent/VAADIN/themes/runo/caption/caption.scss
index d5be467822..dab33c99c7 100644
--- a/WebContent/VAADIN/themes/runo/caption/caption.css
+++ b/WebContent/VAADIN/themes/runo/caption/caption.scss
@@ -1,3 +1,5 @@
+@mixin runo-caption {
+
 .v-captionwrapper {
 	margin: 0.3em 0 0 0;
 }
@@ -6,10 +8,5 @@
 	height: 16px;
 	background: transparent url(../icons/16/error.png) no-repeat top right;
 }
-.v-ie6 .v-errorindicator {
-	/* gif for transparency */
-	background-image: url(../icons/16/error.gif);
+
 }
-.v-ie7 .v-errorindicator {
-	margin-left: -3px;
-}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/common/common.css b/WebContent/VAADIN/themes/runo/common/common.scss
index 2b3aa372a2..a7c8d7ab7e 100644
--- a/WebContent/VAADIN/themes/runo/common/common.css
+++ b/WebContent/VAADIN/themes/runo/common/common.scss
@@ -1,3 +1,5 @@
+@mixin runo-common {
+
 .v-generated-body {
 	background: #e9eced;
 }
@@ -105,4 +107,6 @@
 .v-embedded-icon-16 img {
 	width:16px;
 	height:16px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/datefield/datefield.css b/WebContent/VAADIN/themes/runo/datefield/datefield.scss
index b9a4efc50e..57ad061b65 100644
--- a/WebContent/VAADIN/themes/runo/datefield/datefield.css
+++ b/WebContent/VAADIN/themes/runo/datefield/datefield.scss
@@ -1,3 +1,5 @@
+@mixin runo-datefield {
+
 .v-datefield input.v-textfield,
 .v-datefield input.v-textfield[type=text] {
 	height: 18px;
@@ -107,7 +109,7 @@ td.v-datefield-calendarpanel-month {
 .v-datefield-calendarpanel-day-today {
 	border: 1px solid #429ce9;
 	width: 12px;
-	height: 14px
+	height: 14px;
 }
 .v-datefield-calendarpanel-day-entry {
 	color: #6a98b5;
@@ -143,9 +145,5 @@ td.v-datefield-calendarpanel-month {
 	color: #999;
 	font-style: normal;
 }
-/* IE specific styles */
-.v-ie7 .v-datefield-button {
-	background-position: right 1px;
-	height: 25px;
-	margin: 0;
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/formlayout/formlayout.css b/WebContent/VAADIN/themes/runo/formlayout/formlayout.scss
index fa4a7bde63..0766269d8b 100644
--- a/WebContent/VAADIN/themes/runo/formlayout/formlayout.css
+++ b/WebContent/VAADIN/themes/runo/formlayout/formlayout.scss
@@ -1,3 +1,5 @@
+@mixin runo-formlayout {
+
 .v-formlayout-cell .v-errorindicator {
 	width: 10px;
 	height: 16px;
@@ -36,9 +38,6 @@
 	margin-top: 5px;
 	min-height: 20px;
 }
-.v-ie6 .v-form-errormessage {
-	height: 20px
-}
 .v-form fieldset {
 	border: none;
 	border-top: 1px solid #babfc0;
@@ -54,4 +53,6 @@
 	padding: 0 4px 0.3em 4px;
 	font-weight: bold;
 	color: #464f52;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/gridlayout/gridlayout.css b/WebContent/VAADIN/themes/runo/gridlayout/gridlayout.scss
index a9c1fef15e..a8e9f7a7cd 100644
--- a/WebContent/VAADIN/themes/runo/gridlayout/gridlayout.css
+++ b/WebContent/VAADIN/themes/runo/gridlayout/gridlayout.scss
@@ -1,3 +1,5 @@
+@mixin runo-gridlayout {
+
 .v-gridlayout-margin-top {
 	padding-top: 15px;
 }
@@ -13,4 +15,6 @@
 .v-gridlayout-spacing-on {
 	padding-left: 8px;
 	padding-top: 8px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/label/label.css b/WebContent/VAADIN/themes/runo/label/label.scss
index e851bd74f3..94bb5637e9 100644
--- a/WebContent/VAADIN/themes/runo/label/label.css
+++ b/WebContent/VAADIN/themes/runo/label/label.scss
@@ -1,3 +1,5 @@
+@mixin runo-label {
+
 .v-label h1,
 .v-label h2,
 .v-label h3,
@@ -67,4 +69,6 @@
 .v-sa .v-label hr,
 .v-ie8 .v-label hr {
 	height: 1px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/link/link.css b/WebContent/VAADIN/themes/runo/link/link.scss
index a123156cb6..8c08a718b8 100644
--- a/WebContent/VAADIN/themes/runo/link/link.css
+++ b/WebContent/VAADIN/themes/runo/link/link.scss
@@ -1,3 +1,7 @@
+@mixin runo-link {
+
 .v-link a {
 	color: #464f52;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/menubar/menubar.css b/WebContent/VAADIN/themes/runo/menubar/menubar.scss
index 91cf78189d..a9c26a4b24 100644
--- a/WebContent/VAADIN/themes/runo/menubar/menubar.css
+++ b/WebContent/VAADIN/themes/runo/menubar/menubar.scss
@@ -1,3 +1,5 @@
+@mixin runo-menubar {
+
 .v-menubar {
 	color: #464f52;
 	border-left: 1px solid #c6cbcc;
@@ -32,4 +34,6 @@
 }
 .v-menubar-submenu .v-menubar-menuitem-caption .v-icon { 
 	vertical-align: middle;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/notification/notification.css b/WebContent/VAADIN/themes/runo/notification/notification.scss
index 1d9f868a14..f81f304923 100644
--- a/WebContent/VAADIN/themes/runo/notification/notification.css
+++ b/WebContent/VAADIN/themes/runo/notification/notification.scss
@@ -1,3 +1,5 @@
+@mixin runo-notification {
+
 .v-Notification {
 	font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif;
 	background-color: #94a0a3;
@@ -64,4 +66,6 @@
 	background-color: #ff0a0a;
 	font-size: .9em;
 	padding: 14px 32px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.css b/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.scss
index 306292d843..a8c85d9af6 100644
--- a/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.css
+++ b/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.scss
@@ -1,3 +1,5 @@
+@mixin runo-orderedlayout {
+
 .v-orderedlayout-margin-top,
 .v-horizontallayout-margin-top,
 .v-verticallayout-margin-top,
@@ -105,4 +107,6 @@ div.v-csslayout-box-shadow {
 .v-gecko .v-csslayout-box-shadow > .v-csslayout-margin {
 	-webkit-box-shadow: 0 2px 8px rgba(0,0,0,.4);
 	-moz-box-shadow: 0 2px 8px rgba(0,0,0,.4);
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/panel/panel.css b/WebContent/VAADIN/themes/runo/panel/panel.scss
index 8fcfcaf100..5963f73434 100644
--- a/WebContent/VAADIN/themes/runo/panel/panel.css
+++ b/WebContent/VAADIN/themes/runo/panel/panel.scss
@@ -1,3 +1,5 @@
+@mixin runo-panel {
+
 .v-panel {
 	background: transparent url(img/top-left.png) no-repeat;
 }
@@ -67,39 +69,15 @@
 	overflow: hidden;
 }
 /* IE specific rules */
-.v-ie6 .v-panel {
-	background: transparent;
-}
-.v-ie6 .v-panel-caption {
-	border: 1px solid #babfc0;
-	border-bottom: none;
-	background: #fff;
-	margin: 0;
-	padding-left: 18px
-}
-.v-ie6 .v-panel-nocaption {
-	border: none;
-	background: transparent;
-	margin: 0;
-	height: 0;
-}
-.v-ie6 .v-panel-caption-light {
-	border: none;
-	background: transparent;
-}
-.v-ie6 .v-panel-content,
-.v-ie7 .v-panel-content,
 .v-ie8 .v-panel-content {
 	border-bottom: 1px solid #babfc0;
 }
-.v-ie6 .v-panel-content-light, 
-.v-ie7 .v-panel-content-light, 
 .v-ie8 .v-panel-content-light {
 	border-bottom: none;
 }
-.v-ie6 .v-panel-deco, 
-.v-ie7 .v-panel-deco, 	 	 
 .v-ie8 .v-panel-deco { 
 	height: 0;
 	overflow: hidden;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/popupview/popupview.css b/WebContent/VAADIN/themes/runo/popupview/popupview.scss
index bbbfb69108..ddae62902e 100644
--- a/WebContent/VAADIN/themes/runo/popupview/popupview.css
+++ b/WebContent/VAADIN/themes/runo/popupview/popupview.scss
@@ -1,3 +1,5 @@
+@mixin runo-popupview {
+
 .v-popupview {
 	background: transparent;
 }
@@ -6,4 +8,6 @@
 	border-bottom: 1px solid #dee2e3;
 	background: #fff;
 	padding: 3px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/progressindicator/progressindicator.css b/WebContent/VAADIN/themes/runo/progressindicator/progressindicator.scss
index d8c110471a..31d4493b78 100644
--- a/WebContent/VAADIN/themes/runo/progressindicator/progressindicator.css
+++ b/WebContent/VAADIN/themes/runo/progressindicator/progressindicator.scss
@@ -1,3 +1,5 @@
+@mixin runo-progressindicator {
+
 .v-progressindicator-wrapper {
 	background: #dfe2e4 url(img/base.gif) repeat-x;
 	border: 1px solid #b6bbbc;
@@ -16,4 +18,6 @@
 }
 .v-progressindicator-indeterminate-disabled {
 	background: #dfe2e4;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/runo.scss b/WebContent/VAADIN/themes/runo/runo.scss
new file mode 100644
index 0000000000..9ef3ed118a
--- /dev/null
+++ b/WebContent/VAADIN/themes/runo/runo.scss
@@ -0,0 +1,27 @@
+// this file just defines all runo mixins by importing them
+
+@import "absolutelayout/absolutelayout.scss";
+@import "accordion/accordion.scss";
+@import "button/button.scss";
+@import "caption/caption.scss";
+@import "common/common.scss";
+@import "datefield/datefield.scss";
+@import "formlayout/formlayout.scss";
+@import "gridlayout/gridlayout.scss";
+@import "label/label.scss";
+@import "link/link.scss";
+@import "menubar/menubar.scss";
+@import "notification/notification.scss";
+@import "orderedlayout/orderedlayout.scss";
+@import "panel/panel.scss";
+@import "popupview/popupview.scss";
+@import "progressindicator/progressindicator.scss";
+@import "select/select.scss";
+@import "shadow/shadow.scss";
+@import "slider/slider.scss";
+@import "splitpanel/splitpanel.scss";
+@import "table/table.scss";
+@import "tabsheet/tabsheet.scss";
+@import "textfield/textfield.scss";
+@import "tree/tree.scss";
+@import "window/window.scss";
diff --git a/WebContent/VAADIN/themes/runo/select/select.css b/WebContent/VAADIN/themes/runo/select/select.scss
index ad1744288a..e043f143e3 100644
--- a/WebContent/VAADIN/themes/runo/select/select.css
+++ b/WebContent/VAADIN/themes/runo/select/select.scss
@@ -1,3 +1,5 @@
+@mixin runo-select {
+
 .v-select-select {
 	font-size: 13px;
 }
@@ -22,7 +24,7 @@
 .v-popupview-popup .v-filterselect .v-filterselect-input {
 	background: transparent url(img/bg-center-filter.png) no-repeat 1px 0;
 	border: none;
-	height: 20px;
+	height: 23px;
 	margin: 0;
 	padding: 2px 0 1px 2px;
 	font-size: 13px;
@@ -127,12 +129,6 @@
 	border-top: 1px solid #b6bbbc;
 }
 
-/* IE6 needs some help identifying when the input is readonly */
-.v-ie6 .v-filterselect.v-readonly,
-.v-ie6 .v-filterselect .v-filterselect-input-readonly {
-	background: transparent;
-}
-
 
 /* Error styles (disabled by default)
    ----------------------------------
@@ -163,4 +159,5 @@
 .v-select-required .v-select-twincol-options {
 	background: #FFE0E0;
 }
-*/
\ No newline at end of file
+*/
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/shadow/shadow.css b/WebContent/VAADIN/themes/runo/shadow/shadow.scss
index 2fc9a1c608..96a911fca4 100644
--- a/WebContent/VAADIN/themes/runo/shadow/shadow.css
+++ b/WebContent/VAADIN/themes/runo/shadow/shadow.scss
@@ -1,3 +1,5 @@
+@mixin runo-shadow {
+
 .v-shadow {
 	position: absolute;
 }
@@ -65,4 +67,6 @@
     bottom: -5px;           right: -4px;
     width: 8px;          height: 8px;
     background: transparent url(img/bottom-right.png);
-} 
\ No newline at end of file
+}
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/slider/slider.css b/WebContent/VAADIN/themes/runo/slider/slider.scss
index 07b10dfa17..3bc9e28702 100644
--- a/WebContent/VAADIN/themes/runo/slider/slider.css
+++ b/WebContent/VAADIN/themes/runo/slider/slider.scss
@@ -1,3 +1,5 @@
+@mixin runo-slider {
+
 .v-slider {
 	border-top: 1px solid #cccfd0;
 	border-bottom: 1px solid #cccfd0;
@@ -68,16 +70,4 @@
 	background-color: #FFE0E0;
 }
 */
-
-/* IE specific styles */
-
-.v-ie6 .v-slider,
-.v-ie6 .v-slider-vertical {
-	margin: 0;
-}
-.v-ie6 .v-slider .v-slider-handle {
-	margin: -1px 0;
-}
-.v-ie6 .v-slider-vertical .v-slider-handle {
-	margin: 0 -1px;
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/splitpanel/splitpanel.css b/WebContent/VAADIN/themes/runo/splitpanel/splitpanel.scss
index c74ab257ba..dd01217380 100644
--- a/WebContent/VAADIN/themes/runo/splitpanel/splitpanel.css
+++ b/WebContent/VAADIN/themes/runo/splitpanel/splitpanel.scss
@@ -1,3 +1,5 @@
+@mixin runo-splitpanel {
+
 .v-splitpanel-horizontal,
 .v-splitpanel-vertical {
 	overflow: hidden;
@@ -6,13 +8,11 @@
 .v-splitpanel-hsplitter,
 .v-splitpanel-hsplitter-locked {
 	width: 6px;
-	font-size: 1px; /* for IE6 */
 }
 
 .v-splitpanel-hsplitter div,
 .v-splitpanel-hsplitter-locked div {
 	width: 6px;
-	font-size: 1px; /* for IE6 */
 	position: absolute;
 	top: 0;
 	bottom: 0;
@@ -24,35 +24,16 @@
 .v-splitpanel-vsplitter,
 .v-splitpanel-vsplitter-locked {
 	height: 6px;
-	font-size: 1px; /* for IE6 */
 }
 
 .v-splitpanel-vsplitter div,
 .v-splitpanel-vsplitter-locked div {
 	height: 6px;
-	font-size: 1px; /* for IE6 */
 	background: #ccd2d0 url(img/bg_ver.png);
 	border: 1px solid #b6bbbc;
 	margin: -1px 0;
 }
 
-/* IE6 specific styles */
-
-.v-ie6 .v-splitpanel-hsplitter div,
-.v-ie6 .v-splitpanel-hsplitter-locked div {
-	height: 99%;
-}
-
-.v-ie6 .v-splitpanel-vsplitter,
-.v-ie6 .v-splitpanel-vsplitter-locked {
-	height: 8px;
-}
-
-.v-ie6 .v-splitpanel-vsplitter div,
-.v-ie6 .v-splitpanel-vsplitter-locked div {
-	margin: 0;
-}
-
 
 /* Rounded style */
 .v-splitpanel-hsplitter-rounded div,
@@ -72,10 +53,6 @@
 .v-splitpanel-vsplitter-rounded-locked div {
 	margin: -1px 4px;
 }
-.v-ie6 .v-splitpanel-hsplitter-rounded div,
-.v-ie6 .v-splitpanel-hsplitter-rounded-locked div {
-	height: 97%;
-}
 
 
 /* Small style */
@@ -106,4 +83,6 @@
 	background: transparent;
 	height: 5px;
 	margin: -2px 0 0 0;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/styles.scss b/WebContent/VAADIN/themes/runo/styles.scss
new file mode 100644
index 0000000000..1bbe531b23
--- /dev/null
+++ b/WebContent/VAADIN/themes/runo/styles.scss
@@ -0,0 +1,32 @@
+@import "../base/styles.scss";
+@import "runo.scss";
+
+// .v-theme-runo {
+@include runo-absolutelayout;
+@include runo-accordion;
+@include runo-button;
+@include runo-caption;
+
+@include runo-common;
+
+@include runo-datefield;
+@include runo-formlayout;
+@include runo-gridlayout;
+@include runo-label;
+@include runo-link;
+@include runo-menubar;
+@include runo-notification;
+@include runo-orderedlayout;
+@include runo-panel;
+@include runo-popupview;
+@include runo-progressindicator;
+@include runo-select;
+@include runo-shadow;
+@include runo-slider;
+@include runo-splitpanel;
+@include runo-table;
+@include runo-tabsheet;
+@include runo-textfield;
+@include runo-tree;
+@include runo-window;
+// }
diff --git a/WebContent/VAADIN/themes/runo/table/table.css b/WebContent/VAADIN/themes/runo/table/table.scss
index 8c82a6f3e8..47bcb2caca 100644
--- a/WebContent/VAADIN/themes/runo/table/table.css
+++ b/WebContent/VAADIN/themes/runo/table/table.scss
@@ -1,3 +1,5 @@
+@mixin runo-table {
+
 .v-table-header-wrap {
 	height: 36px;
 	border: 1px solid #b6bbbc;
@@ -28,10 +30,6 @@
 	text-shadow: #ffffff 0 1px 0;
 	margin-left: 4px;
 }
-.v-ie7 .v-table-caption-container-align-right {
-	margin-left: 0px;
-	padding-left: 0px;
-}
 .v-table-sort-indicator {
 	width: 0;
 	height: 36px;
@@ -158,20 +156,6 @@ tr.v-table-row-odd:hover {
 .v-table .v-link {
 	display: inline;
 }
-/* IE6 hack */
-.v-ie6 .v-table-scrollposition {
-	background: transparent;
-	/* 
-	AlphaImageLoader uses src attribute relative to host page, not CSS
-	We need multiple different filters because we cannot be sure how host page is served compared to theme resources
-	TODO: This actually does not work as expected, since only the last filter is applied. Can we chain filters together (i.e. contain all versions on one line)?
-	 */
-	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../VAADIN/themes/default/table/img/scroll-position-bg.png", sizingMethod="scale");
-	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../VAADIN/themes/default/table/img/scroll-position-bg.png", sizingMethod="scale");
-	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="VAADIN/themes/default/table/img/scroll-position-bg.png", sizingMethod="scale");
-	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/VAADIN/themes/default/table/img/scroll-position-bg.png", sizingMethod="scale");
-}
-
 
 /* Borderless style */
 .v-table-borderless .v-table-header-wrap,
@@ -218,3 +202,5 @@ tr.v-table-row-odd:hover {
 	line-height: 18px;
 	padding: 2px 0;
 }
+
+}
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.css b/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.scss
index 64cd85b61d..683eb35f4c 100644
--- a/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.css
+++ b/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.scss
@@ -1,3 +1,5 @@
+@mixin runo-tabsheet {
+
 .v-tabsheet-tabs {
 	height: 48px;
 }
@@ -132,24 +134,6 @@
 	padding-top: 12px;
 }*/
 /* IE specific styles */
-.v-ie6 .v-tabsheet-tabs {
-	height: 46px;
-}
-.v-ie6 .v-tabsheet-tabitem-selected {
-	border: 1px solid #babfc0;
-	border-bottom: none;
-	background: #fff;
-	margin-top: 0;
-	height: 23px;
-	padding: 18px 14px 6px 15px;
-	cursor: default;
-	color: #ee5311;
-}
-.v-ie6 .v-tabsheet-tabitem-selected .v-caption {
-	background: transparent;
-	padding: 0;
-	margin: 0;
-}
 .v-ie .v-tabsheet-content {
 	border-bottom: none;
 }
@@ -159,7 +143,6 @@
 	overflow: hidden;
 	margin: 0;
 }
-.v-ie7 .v-tabsheet-deco,
 .v-ie8 .v-tabsheet-deco,
 .v-ie9 .v-tabsheet-deco {
 	width: 100%;
@@ -267,23 +250,8 @@
 	margin-left: -3px;
 	padding-left: 3px;
 }*/
-/* IE specific styles */
-.v-ie6 .v-tabsheet-tabs-light,
-.v-ie7 .v-tabsheet-tabs-light {
-	height: 32px;
-}
-.v-ie6 .v-tabsheet-tabs-light .v-tabsheet-tabitem-selected,
-.v-ie7 .v-tabsheet-tabs-light .v-tabsheet-tabitem-selected {
-	border: none;
-	background: #fff url(img/inline-tab-right.png) no-repeat right top;
-	padding: 0;
-	height: 32px;
-}
-.v-ie6 .v-tabsheet-tabs-light .v-tabsheet-tabitem-selected .v-caption,
-.v-ie7 .v-tabsheet-tabs-light .v-tabsheet-tabitem-selected .v-caption {
-	background: transparent url(img/inline-tab-left.png) no-repeat -7px 0;
-	padding: 9px 11px 0 11px;
-}
 .v-ie .v-tabsheet-deco-light {
 	height: 0;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/textfield/textfield.css b/WebContent/VAADIN/themes/runo/textfield/textfield.scss
index f4ac207ea1..3382fbee91 100644
--- a/WebContent/VAADIN/themes/runo/textfield/textfield.css
+++ b/WebContent/VAADIN/themes/runo/textfield/textfield.scss
@@ -1,3 +1,5 @@
+@mixin runo-textfield {
+
 .v-textfield,
 .v-textarea {
 	background: #fff url(img/bg.png) repeat-x;
@@ -12,7 +14,7 @@ input.v-textfield,
 input[type=text].v-textfield,
 textarea.v-textarea {
 	font-size: 12px;
-	height: 16px;
+	height: 22px;
 	padding: 2px;
 }
 textarea.v-textarea {
@@ -39,7 +41,9 @@ input.v-textfield-small,
 input[type=text].v-textfield-small,
 textarea.v-textarea-small {
 	font-size: 11px;
-	height: 14px;
+	height: 18px;
 	line-height: 12px;
 	padding: 1px 2px;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/tree/tree.css b/WebContent/VAADIN/themes/runo/tree/tree.scss
index 03c8a0d829..cb3dff3156 100644
--- a/WebContent/VAADIN/themes/runo/tree/tree.css
+++ b/WebContent/VAADIN/themes/runo/tree/tree.scss
@@ -1,3 +1,5 @@
+@mixin runo-tree {
+
 .v-tree-node {
 	background: transparent url(img/collapsed.png) no-repeat 2px 1px;
 }
@@ -30,12 +32,6 @@
 .v-tree-node-children {
 	padding-left: 16px;
 }
-/* IMPORTANT keep the offsetWidth (width + padding) of this element the same as the margin-left of v-tree-node-caption */
-.v-ie6 .v-tree-node-ie6compatnode {
-	width: 14px;
-	height: 10px;
-	padding: 1px;
-}
 .v-tree{
 	outline:none;	
 }
@@ -47,9 +43,6 @@
 .v-tree-node-focused span{
 	border: 1px dotted black;	
 }
-.v-ie6 .v-tree-node-ie6compatnode.v-tree-node-focused{
-	padding-left: 0px;
-}
 /***************************************
  * Drag'n'drop styles
  ***************************************/
@@ -63,4 +56,6 @@
 }
 .v-tree-connectors .v-tree-node-drag-top.v-tree-node-leaf {
 	background-position: 2px 50%;
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/themes/runo/window/window.css b/WebContent/VAADIN/themes/runo/window/window.scss
index 81509146aa..b08f87b7fa 100644
--- a/WebContent/VAADIN/themes/runo/window/window.css
+++ b/WebContent/VAADIN/themes/runo/window/window.scss
@@ -1,3 +1,5 @@
+@mixin runo-window {
+
 .v-window {
 	color: #464f52;
 	font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif;
@@ -9,7 +11,7 @@
 	background: transparent url(img/top-left.png) no-repeat;
 }
 .v-window-outerheader {
-	height: 23px;
+	height: 49px;
 	margin-left: 9px;
 	padding: 15px 40px 11px 12px;
 	background: transparent url(img/top-right.png) no-repeat right top;
@@ -21,13 +23,15 @@
 	letter-spacing: -0.03em;
 	color: #f14c1a;
 	text-shadow: 0 1px 0 #fff;
-	/* This element is 100% wide in IE6 */
 }
-.v-window-contents {
+.v-window-contents > div {
 	background: #fff;
 	border: 2px solid #babfc0;
 	border-top: none;
 	border-bottom: none;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
 }
 .v-window div.v-window-footer {
 	height: 8px;
@@ -35,12 +39,7 @@
 	background: transparent url(img/bottom-right.png) no-repeat right bottom;
 	overflow: visible;
 }
-.v-ie7 .v-window-footer {
-	position: relative;
-	overflow: visible;
-}
-.v-window-resizebox,
-.v-ie7 .v-window-resizebox {
+.v-window-resizebox {
 	position: absolute; /* Needed to position the element over ScrollPanel, which is relatively positioned */
 	right: 5px;
 	width: 10px;
@@ -141,4 +140,6 @@
     bottom: -27px;           right: -20px;
     width: 39px;          height: 39px;
     background: transparent url(img/shadow/bottom-right.png);
+}
+
 }
\ No newline at end of file
diff --git a/WebContent/VAADIN/vaadinBootstrap.js b/WebContent/VAADIN/vaadinBootstrap.js
new file mode 100644
index 0000000000..1f5f3fa973
--- /dev/null
+++ b/WebContent/VAADIN/vaadinBootstrap.js
@@ -0,0 +1,281 @@
+(function() {
+	var defaults;
+	var apps = {};
+	var themesLoaded = {};
+	var widgetsets = {};
+	
+	
+    var log;
+    if (typeof console === "undefined" || !window.location.search.match(/[&?]debug(&|$)/)) {
+    	//If no console.log present, just use a no-op
+    	log = function() {};
+    } else if (typeof console.log === "function") {
+    	//If it's a function, use it with apply
+		log = function() {
+			console.log.apply(console, arguments);
+		};
+    } else {
+    	//In IE, its a native function for which apply is not defined, but it works without a proper 'this' reference
+    	log = console.log;
+    }
+	
+	var loadTheme = function(url) {
+		if(!themesLoaded[url]) {
+			log("loadTheme", url);
+			var stylesheet = document.createElement('link');
+			stylesheet.setAttribute('rel', 'stylesheet');
+			stylesheet.setAttribute('type', 'text/css');
+			stylesheet.setAttribute('href', url + "/styles.css");
+			document.getElementsByTagName('head')[0].appendChild(stylesheet);
+			themesLoaded[url] = true;
+		}		
+	}
+	
+	var isWidgetsetLoaded = function(widgetset) {
+		var className = widgetset.replace(/\./g, "_");
+		return (typeof window[className]) != "undefined";
+	}
+	
+	var loadWidgetset = function(basePath, widgetset) {
+		if (widgetsets[widgetset]) {
+			return;
+		}
+		log("load widgetset", basePath, widgetset)
+		setTimeout(function() {
+			if (!isWidgetsetLoaded(widgetset)) {
+				alert("Failed to load the widgetset: " + url);
+			}
+		}, 15000);
+		
+		var url = basePath + widgetset + "/" + widgetset + ".nocache.js?" + new Date().getTime();
+		
+		var scriptTag = document.createElement('script');
+		scriptTag.setAttribute('type', 'text/javascript');
+		scriptTag.setAttribute('src', url);
+		document.getElementsByTagName('head')[0].appendChild(scriptTag);
+		
+		widgetsets[widgetset] = {
+			pendingApps: []
+		};
+	}
+	
+	window.vaadin = window.vaadin || {
+		setDefaults: function(d) {
+			if (defaults) {
+				log("Ignoring new defaults as defaults have already been loaded");
+				return;
+			}
+			log("Got defaults", d)
+			defaults = d;
+		},
+		initApplication: function(appId, config) {
+			if (apps[appId]) {
+				throw "Application " + appId + " already initialized";
+			}
+			log("init application", appId, config);
+			
+			var testbenchId = appId.replace(/-\d+$/, '');
+			window.vaadin.clients[testbenchId] = {
+					isActive: function() {
+						return true;
+					}
+			}
+			
+			var getConfig = function(name) {
+				var value = config[name];
+				if (value === undefined) {
+					value = defaults[name];
+				}
+				return value;
+			}
+			
+			var fetchRootConfig = function() {
+				log('Fetching root config');
+				var url = getConfig('browserDetailsUrl');
+				if (!url) {
+					// No special url defined, use the default URL
+					url = getConfig('appUri');
+					// Add a slash to the end, because ApplicationConiguration.loadFromDOM does so...
+					if (url.length == 0 || url.substr(url.length-1) !== "/") {
+						url += '/';
+					}
+				}
+				url += ((/\?/).test(url) ? "&" : "?") + "browserDetails";
+				var rootId = getConfig("rootId");
+				if (rootId !== undefined) {
+					url += "&rootId=" + rootId;
+				}
+
+				url += '&initialPath=' + encodeURIComponent(getConfig("initialPath"));
+				url += '&initialParams=' + encodeURIComponent(JSON.stringify(getConfig("initialParams")));
+				
+				url += '&' + vaadin.getBrowserDetailsParameters(appId); 
+				
+				// Timestamp to avoid caching
+				url += '&' + (new Date()).getTime();
+				
+				var r = new XMLHttpRequest();
+				r.open('POST', url, true);
+				r.onreadystatechange = function (aEvt) {  
+					if (r.readyState == 4) {
+						if (r.status == 200){
+							log("Got root config response", r.responseText);
+							var updatedConfig = JSON.parse(r.responseText);
+							
+							// Copy new properties to the config object
+							for (var property in updatedConfig) {
+								if (updatedConfig.hasOwnProperty(property)) {
+									config[property] = updatedConfig[property];
+								}
+							}
+							
+							// Try bootstrapping again, this time without fetching missing info
+							bootstrapApp(false);
+						} else {
+							log('Error', r.statusText);  
+						}
+					}  
+				};
+				r.send(null);
+				
+				log('sending request to ', url);
+			};			
+			
+			//Export public data
+			var app = {
+				'getConfig': getConfig
+			};
+			apps[appId] = app;
+			
+			if (!window.name) {
+				window.name =  appId + '-' + Math.random();
+			}
+			
+			var bootstrapApp = function(mayDefer) {
+				var themeUri = getConfig('themeUri');
+				if (themeUri) {
+					loadTheme(themeUri);
+				}
+				
+				var widgetsetBase = getConfig('widgetsetBase');
+				var widgetset = getConfig('widgetset');
+				if (widgetset && widgetsetBase) {
+					loadWidgetset(widgetsetBase, widgetset);
+				}
+				
+				if (getConfig('uidl') === undefined) {
+					if (mayDefer) {
+						fetchRootConfig();
+					} else {
+						throw "May not defer bootstrap any more";
+					}
+				} else {
+					if (widgetsets[widgetset].callback) {
+						log("Starting from bootstrap", appId);
+						widgetsets[widgetset].callback(appId);
+					}  else {
+						log("Setting pending startup", appId);
+						widgetsets[widgetset].pendingApps.push(appId);
+					}
+				}
+			}
+			bootstrapApp(true);
+
+			if (getConfig("debug")) {
+				// TODO debug state is now global for the entire page, but should somehow only be set for the current application  
+				window.vaadin.debug = true;
+			}
+			
+			return app;
+		},
+		clients: {},
+		getApp: function(appId) {
+			var app = apps[appId]; 
+			return app;
+		},
+		loadTheme: loadTheme,
+		registerWidgetset: function(widgetset, callback) {
+			log("Widgetset registered", widgetset)
+			widgetsets[widgetset].callback = callback;
+			for(var i = 0; i < widgetsets[widgetset].pendingApps.length; i++) {
+				var appId = widgetsets[widgetset].pendingApps[i];
+				log("Starting from register widgetset", appId);
+				callback(appId);
+			}
+			widgetsets[widgetset].pendingApps = null;
+		},
+		getBrowserDetailsParameters: function(parentElementId) {
+			// Screen height and width
+			var url = 'sh=' + window.screen.height;
+			url += '&sw=' + window.screen.width;
+			
+			// Window height and width
+			var cw = 0;
+			var ch = 0;
+			if(typeof(window.innerWidth) == 'number') {
+				// Modern browsers
+				cw = window.innerWidth;
+				ch = window.innerHeight;
+			} else {
+				// IE 8
+				cw = document.documentElement.clientWidth;
+				ch = document.documentElement.clientHeight;
+			}
+			url += '&cw=' + cw + '&ch=' + ch;
+			
+
+			var d = new Date();
+			
+			url += '&curdate=' + d.getTime();
+			
+			var tzo1 = d.getTimezoneOffset(); // current offset
+			var dstDiff = 0;
+			var rtzo = tzo1;
+			
+			for (var m=12;m>0;m--) {
+				d.setUTCMonth(m);
+				var tzo2 = d.getTimezoneOffset();
+				if (tzo1 != tzo2) {
+					dstDiff =  (tzo1 > tzo2 ? tzo1-tzo2 : tzo2-tzo1); // offset w/o DST
+					rtzo = (tzo1 > tzo2 ? tzo1 : tzo2); // offset w/o DST
+					break;
+				}
+			}
+
+			// Time zone offset
+			url += '&tzo=' + tzo1;
+			
+			// DST difference
+			url += '&dstd=' + dstDiff;
+			
+			// Raw time zone offset
+			url += '&rtzo=' + rtzo;
+			
+			// DST in effect?
+			url += '&dston=' + (tzo1 != rtzo);
+			
+			var pe = document.getElementById(parentElementId);
+			if (pe) {
+				url += '&vw=' + pe.offsetWidth;
+				url += '&vh=' + pe.offsetHeight;
+			}
+			
+			// Uri fragment
+			if (location.hash) {
+				//Remove initial #
+				url += '&fr=' + encodeURIComponent(location.hash.replace(/^#/, ""));
+			}
+			// Window name
+			if (window.name) {
+				url += '&wn=' + encodeURIComponent(window.name);
+			}
+			
+			// Detect touch device support
+	        try { document.createEvent("TouchEvent"); url += "&td=1";} catch(e){};
+	        
+	        return url;
+		}
+	};
+	
+	log('Vaadin bootstrap loaded');
+})();
\ No newline at end of file
diff --git a/WebContent/WEB-INF/web.xml b/WebContent/WEB-INF/web.xml
index 73d9951d21..5b250d86f2 100644
--- a/WebContent/WEB-INF/web.xml
+++ b/WebContent/WEB-INF/web.xml
@@ -22,11 +22,7 @@
 
 	<servlet>
 		<servlet-name>VaadinApplicationRunner</servlet-name>
-		<servlet-class>com.vaadin.terminal.gwt.server.ApplicationRunnerServlet</servlet-class>
-		<init-param>
-			<param-name>defaultPackages</param-name>
-		    <param-value>com.vaadin.tests,com.vaadin.tests.tickets,com.vaadin.tests.components,com.vaadin.tests.components.layouts,com.vaadin.tests.components.panel,com.vaadin.tests.components.combobox,com.vaadin.tests.components.popupview,com.vaadin.tests.components.datefield,com.vaadin.tests.components.richtextarea,com.vaadin.tests.components.absolutelayout,com.vaadin.tests.components.embedded,com.vaadin.tests.components.splitpanel,com.vaadin.tests.components.abstractfield,com.vaadin.tests.components.form,com.vaadin.tests.components.table,com.vaadin.tests.components.accordion,com.vaadin.tests.components.label,com.vaadin.tests.components.tabsheet,com.vaadin.tests.components.beanitemcontainer,com.vaadin.tests.components.link,com.vaadin.tests.components.textfield,com.vaadin.tests.components.button,com.vaadin.tests.components.optiongroup,com.vaadin.tests.components.tree,com.vaadin.tests.components.caption,com.vaadin.tests.components.orderedlayout,com.vaadin.tests.components.window,com.vaadin.tests.dd,com.vaadin.tests.validation</param-value>
-		</init-param>
+		<servlet-class>com.vaadin.launcher.ApplicationRunnerServlet</servlet-class>
 	</servlet>
 
 	<!-- For testing GAE - the deployment script changes this to use GAEApplicationServlet -->
diff --git a/WebContent/release-notes.html b/WebContent/release-notes.html
index f9aaf12b1b..c73f9701c5 100644
--- a/WebContent/release-notes.html
+++ b/WebContent/release-notes.html
@@ -4,8 +4,8 @@
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <title>Vaadin Framework @version@</title>
     <link rel="stylesheet" type="text/css" href="css/styles.css" />
-
-<!--[if lte IE 6]>
+    
+    <!--[if lte IE 6]>
 		<link rel="stylesheet" type="text/css" href="css/ie.css" />
 		<![endif]-->
     <style type="text/css">
@@ -21,11 +21,10 @@
 	content: counters(item, ".") ". ";
 	counter-increment: item
 }
-    </style>
+</style>
   </head>
 
   <body>
-
     <div id="header">
       <h1>Vaadin &ndash; thinking of U and I</h1>
       <div id="version">
@@ -33,54 +32,43 @@
       </div>
     </div> <!-- /header -->
 
-	<div id="content">
-
+    <div id="content">
       <p>Version @version@ built on @builddate@.</p>
 
-      <!-- ================================================================ -->
       <h2 id="tableofcontents">Release Notes for Vaadin Framework @version@</h2>
       <ul>
-        <!-- <li><a href="#security-fixes">Security fixes in Vaadin @version-minor@</a></li> -->
-        <li><a href="#overview">Overview of Vaadin @version-minor@ Release</a></li>
-        <li><a href="#changes">Changes in Vaadin @version@</a></li>
-        <li><a href="#enhancements">Enhancements in Vaadin @version-minor@</a></li>
-        <li><a href="#backwardsincompatibilities">Backwards
-            incompatible changes in Vaadin @version-minor@</a></li>
         <li><a href="#overview">Package contents</a></li>
+        <li><a href="#enhancements">Enhancements in Vaadin @version-minor@</a></li>
+        <li><a href="#changelog">Complete change log for Vaadin @version@</a></li>
+        <li><a href="#migrating">Migrating from Vaadin 6 to Vaadin 7</a></li>
         <li><a href="#dependencies">Vaadin @version@ dependencies</a></li>
         <li><a href="#upgrading">Upgrading to Vaadin @version-minor@</a></li>
-        <li><a href="#knownissues">Known problems and limitations in
-            Vaadin @version@</a></li>
         <li><a href="#supportedversions">Supported technologies</a></li>
         <li><a href="#vaadinontheweb">Vaadin on the Web</a></li>
       </ul>
 
-      <p>
-        <b>Vaadin</b> is a Java application development framework for building modern web
-        applications that look great, perform well and make you and your users
-        happy. Vaadin is available under the Apache 2 license (see <tt>license.html</tt>
-        in the JAR).
-      </p>
-
-      <!-- ================================================================ -->
-      <h2 id="overview">Overview of Vaadin @version@ Release</h2>
+      <h2 id="overview">Package Contents</h2>
 
       <p>
-        Vaadin @version@ is a maintenance release that includes a number of important bug
-        fixes.
+        <b>Vaadin</b> is a Java framework for building modern web applications that look
+        great, perform well and make you and your users happy. <b>Vaadin</b> is available
+        under the Apache 2 license (see license.html).
       </p>
-
-      <!-- ================================================================ -->
-      <!-- Change log                                                       -->
-      <!-- For maintenance releases, this should be above the enhancements  -->
-
-      <h3 id="changes">Changes in Vaadin @version@</h3>
-
+      
       <p>
-        This release includes the following closed issues:
+        <b>Vaadin</b> is distributed as a single JAR file. Inside the JAR you will find:
       </p>
 
       <ul>
+<<<<<<< HEAD
+        <li>Vaadin server and client side classes (<tt>/com</tt>)</li>
+        <li>Vaadin server and client side sources (<tt>/com</tt>)</li>
+        <li>The default widget set (<tt>/VAADIN/widgetsets</tt>)</li>
+        <li>Themes: Runo, Reindeer and Chameleon (<tt>/VAADIN/themes</tt>)</li>
+        <li>Release notes (<tt>/release-notes.html</tt>)</li>
+        <li>Licensing information (<tt>/license.html</tt>)</li>
+      </ul>
+=======
   <li><a href="http://dev.vaadin.com/ticket/8932">#8932</a>: Custom build from 6.8</li>
   <li><a href="http://dev.vaadin.com/ticket/8193">#8193</a>: Enter ClickShortcut not working in a PopupView</li>
   <li><a href="http://dev.vaadin.com/ticket/8584">#8584</a>: Invalid behavior of multiselection for com.vaadin.ui.Table</li>
@@ -112,223 +100,209 @@
         href="http://dev.vaadin.com/query?status=closed&resolution=fixed&milestone=Vaadin+@version@&order=priority">full
         list of the closed issues</a> can be found at <tt>dev.vaadin.com</tt>.
       </p>
+>>>>>>> remotes/origin/6.8
 
-      <!-- ================================================================ -->
-      <h3 id="enhancements">Enhancements in Vaadin @version-minor@</h3>
+      <h2 id="enhancements">Enhancements in Vaadin @version-minor@</h2>
 
       <p>
-        Below is a list of enchacements in the current minor release branch, first
-        released in @version-minor@.0.
+        @version-minor@ is the third development release of the upcoming Version 7 of the
+        Vaadin Framework. It introduces the third set of new features in Vaadin 7, for the
+        purpose of receiving feedback about the changes.
       </p>
 
+      <p>The major changes in this third alpha phase are:</p>
+
       <ul>
-        <li>
-          Native scrolling support for Android and iOS (<a href="http://dev.vaadin.com/ticket/8763">#8763</a>)
+        <li>GWT is now built into Vaadin Framework
           <ul>
-            <li>
-              Non-native scrolling implementation used in iOS 5 because of an iOS bug (see <a href="http://dev.vaadin.com/ticket/8792">#8792</a>)
-            </li>
+            <li>New SuperDevMode allows debugging client-side Java code in the browser without any plugins</li>
           </ul>
         </li>
-        <li>
-          Possibility to fire <b>Button</b> click events on the server-side (<a href="http://dev.vaadin.com/ticket/8209">#8209</a>)
-        </li>
-        <li>
-          Possibility to use HTML inside a <b>Button</b> caption (<a href="http://dev.vaadin.com/ticket/8663">#8663</a>)
-        </li>
-        <li>
-          Possibility to set "alternative text" (<tt>alt</tt> attribute) for the <b>Embedded</b> component (<a href="http://dev.vaadin.com/ticket/6085">#6085</a>)
-        </li>
-        <li>
-          Possibility to query the browser window width and height on the server-side (<a href="http://dev.vaadin.com/ticket/5655">#5655</a>)
-        </li>
-        <li>
-          Keyboard navigation in <b>TabSheet</b>  (<a href="http://dev.vaadin.com/ticket/5100">#5100</a>)
-        </li>
-        <li>
-          Max/min limits for splitter position in <b>SplitPanel</b> (<a href="http://dev.vaadin.com/ticket/1744">#1744</a>)
-        </li>
-        <li>
-          Extended day range in month view to six full weeks in <b>DateField</b> (<a href="http://dev.vaadin.com/ticket/6718">#6718</a>)
-        </li>
-        <li>
-          Non-collapsible <b>Table</b> columns (<a href="http://dev.vaadin.com/ticket/7495">#7495</a>)
-        </li>
-        <li>
-          Selecting a <b>TabSheet</b> tab by its position or a <b>Tab</b> instance (<a href="http://dev.vaadin.com/ticket/8203">#8203</a>)
-        </li>
-        <li>
-          Getting a component by its index or the index of a given component in <b>CssLayout</b> (<a href="http://dev.vaadin.com/ticket/7614">#7614</a>)
-        </li>
-        <li>
-          Removing all <b>Validators</b> of a <b>Field</b> at once (<a href="http://dev.vaadin.com/ticket/8307">#8307</a>)
-        </li>
-        <li>
-          Debug IDs unique to a window, not the whole application (<a href="http://dev.vaadin.com/ticket/5109">#5109</a>)
-        </li>
-        <li>
-          Larger default size for the debug window (<a href="http://dev.vaadin.com/ticket/8523">#8523</a>)
-        </li>
-        <li>
-          Compatibility with Google SuperDevMode (<a href="http://dev.vaadin.com/ticket/8924">#8924</a>)
-        </li>
-        <li>
-          An add-on for handling broken classloaders (<a href="http://dev.vaadin.com/ticket/8447">#8447</a>)
+        <li>Support for JavaScript components - GWT integration code not required</li>
+        <li>Handle JavaScript callbacks on the server-side</li>
+        <li>Component and root extensions</li>
+        <li>Navigation API for view navigation
           <ul>
-            <li>
-              Available in Vaadin Directory: <a href="http://vaadin.com/addon/vaadin-application-server-class-loader-workaround">Vaadin-application-server-class-loader-workaround</a>
-            </li>
+            <li>View navigation with bookmarking/linking with URI fragments and browser history support</li>
+            <li>Access control for views, view change confirmation</li>
           </ul>
         </li>
+        <li>Resource loading (JS/CSS) by the framework</li>
       </ul>
+        
+      <p>
+        The enhancements are described in more detail in the <a
+        href="https://vaadin.com/wiki/-/wiki/Main/Vaadin+7">mini-tutorials</a> in the
+        Vaadin Wiki.
+      </p>
+
+      <p>
+        Please see the release notes for <a
+        href="http://vaadin.com/download/prerelease/7.0/7.0.0/7.0.0.alpha1/release-notes.html">alpha1</a>
+        and <a
+        href="http://vaadin.com/download/prerelease/7.0/7.0.0/7.0.0.alpha2/release-notes.html">alpha2</a>
+        for a complete list of major enhancements for Vaadin 7 so far.
+      </p>
 
-      <!-- ================================================================ -->
+      <h3 id="changelog">ChangeLog</h3>
 
-      <!--
-      <h3 id="backwardsincompatibilities">Backwards incompatible changes in Vaadin
-      @version-minor@</h3>
+      <p>
+        For a complete list of changes in this release, please see the <a
+        href="http://dev.vaadin.com/query?status=closed&group=resolution&milestone=Vaadin+7.0.0.alpha3">list
+        of closed tickets</a>.
+      </p>
 
-      <p><i>-- To be done --</i></p>
-      -->
-      <!--  <h2 id="security-fixes">Security fixes in Vaadin @version-minor@</h2>-->
+      <h2 id="migrating">Migrating from Vaadin 6</h2>
 
-      <!-- ================================================================ -->
-      <h3 id="overview">Package Contents</h3>
+      <p>
+        All Vaadin 6 applications need some changes when migrating to Vaadin 7. The most
+        obvious changes are in the application/window API and require extending either
+        <b>Root</b> or <b>Root.LegacyApplication</b> instead of <b>Application</b>.
+      </p>
 
       <p>
-        Vaadin Framework is distributed as a single JAR file. Inside the JAR you will
-        find:
+        Vaadin 6 add-ons (ones that contain widgets) do not work in Vaadin 7 - please
+        check the add-ons in <a href="http://vaadin.com/directory/">Vaadin Directory</a>
+        for Vaadin 7 support.
       </p>
 
-      <ul>
-        <li>Vaadin server and client side classes (/com)</li>
-        <li>Vaadin server and client side sources (/com)</li>
-        <li>The default widget set (/VAADIN/widgetsets)</li>
-        <li>Themes: Runo, Reindeer and Chameleon (/VAADIN/themes)</li>
-        <li>Release notes (/release-notes.html)</li>
-        <li>Licensing information (/license.html)</li>
-      </ul>
+      <p>
+        Any custom client-side widgets need to be changed to use the new client-server
+        communication API or the Vaadin 6 compatibility API.
+      </p>
 
-      <!-- ================================================================ -->
-      <h3 id="dependencies">Vaadin @version@ dependencies</h3>
+      <p>
+        A detailed list of migration changes are given in the <a
+        href="http://dev.vaadin.com/wiki/Vaadin7/MigrationGuide">Vaadin 7 Migration
+        Guide</a>.
+      </p>
+
+      <h2 id="dependencies">Vaadin @version@ Dependencies</h2>
+
+      <h3>Bean Validation</h3>
 
       <p>
-		Vaadin uses GWT @gwt-version@ for widget set compilation. GWT can be
-		downloaded from <a href="http://code.google.com/webtoolkit/">http://code.google.com/webtoolkit/</a>.
-		GWT can also be automatically downloaded by the Vaadin Plug-in for
-		Eclipse. Please note that GWT @gwt-version@ requires the <i>validation-api-1.0.0.GA.jar</i>
-		and <i>validation-api-1.0.0.GA-sources.jar</i> files in addition to <i>gwt-dev.jar</i>
-		and <i>gwt-user.jar</i> for widget set compilation.
+        If you want to use the bean validation feature in Vaadin 7, you need a Bean
+        Validation API implementation. You need to install the JAR in the
+        <tt>WEB-INF/lib</tt> directory.
       </p>
 
-      <!-- ================================================================ -->
       <h2 id="upgrading">Upgrading to Vaadin @version-minor@</h2>
 
+      <h3>Upgrading the Eclipse Plugin</h3>
+
       <p>
-        When upgrading from an earlier Vaadin version, you must:
+        This release requires that you use the <i>experimental</i> Vaadin Plugin for
+        Eclipse. Its update site is
+        <tt>http://vaadin.com/eclipse/experimental</tt>. Please see the <a
+        href="http://vaadin.com/eclipse">installation instructions</a> for more details.
       </p>
 
+      <h3>General Upgrading Instructions</h3>
+
+      <p>
+        When upgrading from an earlier Vaadin version, you must:
+      </p>
+		
       <ul>
         <li>Recompile your classes using the new Vaadin JAR. Binary
           compatibility is only guaranteed for maintenance releases of
           Vaadin.</li>
+
         <li>Recompile any add-ons you have created using the new Vaadin
           JAR.</li>
-        <li>Recompile your widget set using the new Vaadin JAR and the
-          newly compiled add-ons.</li>
-        <li>If you have extracted a theme from the Vaadin JAR, you need
-          to update it with the theme provided in the new Vaadin JAR.</li>
-      </ul>
 
-      <p>Remember also to refresh the project in your IDE to ensure that the new version
-      of everything is in use.</p>
+        <li>Recompile your widget set using the new Vaadin JAR and the newly compiled
+        add-ons.</li>
 
-      <p>Using the "?debug" URL parameter you can verify that the
-        version of the servlet (JAR), the theme and the widgetset all match.</p>
+        <li>If you have extracted a theme from the Vaadin JAR, you need to update it with
+        the theme provided in the new Vaadin JAR.</li>
+      </ul>
 
       <p>
-        <b>Eclipse</b> users should always check if there is a new version of the Eclipse
-        Plug-in available. The Eclipse Plug-in can be used to update the Vaadin version in
-        the project (Project properties &raquo; Vaadin).
+        Remember also to refresh the project in your IDE to ensure that the new version of
+        everything is in use.
       </p>
 
       <p>
-        <b>Maven</b> users should update the Vaadin dependency version in the
-        <tt>pom.xml</tt> unless it is defined as <tt>LATEST</tt> . You must also ensure
-        that the GWT dependency uses the correct version and recompile your project and
-        your widget set.
-		</p>
-
-      <p>
-		<b>Liferay and other portal</b> users must install the new
-		vaadin-@version@.jar as
-		<tt>ROOT/WEB-INF/lib/vaadin.jar</tt> in the portal. Additionally the
-		contents of the <tt>VAADIN</tt> folder from the JAR must be extracted
-		to the <tt>ROOT/html/VAADIN</tt> directory in the Liferay
-		installation. If your portal uses custom widgets, install the latest
-		version of <a
-			href="http://vaadin.com/directory#addon/vaadin-control-panel-for-liferay">Vaadin
-			Control Panel for Liferay</a> for easy widget set compilation.
+        Using the "?debug" URL parameter you can verify that the version of the servlet
+        (JAR), the theme and the widgetset all match.
       </p>
 
-      <h3>Upgrading from Vaadin 6.5 or earlier</h3>
-      
       <p>
-		If you are upgrading from 6.5.x or earlier, notice that Vaadin
-		@version@ uses GWT @gwt-version@. Upgrade your dependencies as
-		necessary. See <a href="#dependencies">the dependencies</a> section
-		for more information.
+        <b>Eclipse</b> users should always check if there is a new version of
+        the Eclipse Plug-in available. The Eclipse Plug-in can be used to
+        update the Vaadin version in the project (Project properties &raquo;
+        Vaadin).
       </p>
 
-      <h3 id="widgetupgrade">Upgrading from Vaadin 6.1 or earlier</h3>
-
       <p>
-        The way widget sets are created was completely changed in Vaadin 6.2.  Existing
-        projects, where custom widgets (a custom widget set) are used, must be migrated
-        when upgrading to Vaadin 6.2 or later.  Projects where the default widget set is
-        used do not need migration.  See <a
-        href="http://vaadin.com/download/release/6.2/6.2.0/release-notes.html">Vaadin
-        6.2.0 release notes</a> for more details.
+        <b>Maven</b> users should update the Vaadin dependency version in the
+        <tt>pom.xml</tt> unless it is defined as <tt>LATEST</tt> . You must also ensure
+        that the GWT dependency uses the correct version and recompile your project and
+        your widget set.
       </p>
 
-      <h4 id="gae">Notes and Limitations for Google App Engine</h4>
-
       <p>
-        The following instructions and limitations apply when you run a Vaadin application
-        under the Google App Engine.
+        <b>Liferay and other portal</b> users must install the new vaadin-@version@.jar as
+        <t>ROOT/WEB-INF/lib/vaadin.jar</b> in the portal. Additionally the contents of the
+        <tt>VAADIN</tt> folder from the JAR must be extracted to the
+        <tt>ROOT/html/VAADIN</tt> directory in the Liferay installation. If your portal
+        uses custom widgets, install the latest version of <a
+        href="http://vaadin.com/directory#addon/vaadin-control-panel-for-liferay">Vaadin
+        Control Panel for Liferay</a> for easy widget set compilation.
       </p>
+      
+      <h2 id="gae">Notes and Limitations for Google App Engine</h4>
+
+      <p>The following instructions and limitations apply when you run a Vaadin
+      application under the Google App Engine.</p>
 
       <ul>
-        <li><p> Applications must use <b>GAEApplicationServlet</b> instead of
-        <b>ApplicationServlet</b> in <tt>web.xml</tt>.  </p></li>
+        <li>
+          <p>
+            Applications must use <b>GAEApplicationServlet</b> instead of
+            <b>ApplicationServlet</b> in <tt>web.xml</tt>.
+          </p>
+        </li>
 
-        <li><p>
+        <li>
+          <p>
             Session support must be enabled in
-					<tt>appengine-web.xml</tt>
-					:
-				</p> <pre>    &lt;sessions-enabled&gt;true&lt;/sessions-enabled&gt;</pre>
+            <tt>appengine-web.xml</tt>:
+          </p>
+          
+          <pre>    &lt;sessions-enabled&gt;true&lt;/sessions-enabled&gt;</pre>
         </li>
 
-        <li><p>Avoid using the session for storage, usual App Engine
-            limitations apply (no synchronization, i.e, unreliable).</p>
+        <li>
+          <p>
+            Avoid using the session for storage, usual App Engine limitations apply (no
+            synchronization, i.e, unreliable).
+          </p>
         </li>
 
-        <li><p>
+        <li>
+          <p>
             Vaadin uses memcache for mutex, the key is of the form
             <tt>_vmutex&lt;sessionid&gt;</tt>.
           </p>
         </li>
 
         <li>
-          <p> The Vaadin <b>WebApplicationContext</b> class is serialized separately into
-          memcache and datastore; the memcache key is <tt>_vac&lt;sessionid&gt;</tt> and
-          the datastore entity kind is <tt>_vac</tt> with identifiers of the type
-          <tt>_vac&lt;sessionid&gt;</tt>.</p>
+          <p>
+            The Vaadin <b>WebApplicationContext</b> class is serialized separately into
+            memcache and datastore; the memcache key is <tt>_vac&lt;sessionid&gt;</tt> and
+            the datastore entity kind is <tt>_vac</tt> with identifiers of the type
+            <tt>_vac&lt;sessionid&gt;</tt>.
+          </p>
         </li>
 
         <li>
-          <p>DO NOT update application state when serving an <b>ApplicationResource</b>
-          (e.g <b>ClassResource</b>.<i>getStream()</i>).</p>
+          <p>
+            DO NOT update application state when serving an <b>ApplicationResource</b>
+            (e.g <b>ClassResource</b>.<i>getStream()</i>).
+          </p>
         </li>
 
         <li>
@@ -355,13 +329,15 @@
         href="http://dev.vaadin.com/">dev.vaadin.com</a>.
       </p>
 
-      <!-- ================================================================ -->
-      <h2 id="supportedversions">Supported technologies</h2>
+      <h2 id="supportedversions">Supported Technologies</h2>
 
       <p>
-        Vaadin is based on <b>Java 5</b> and it is also compatible with most other
-        operating system supporting Java 5 or newer. Vaadin is supported on the following
-        <b>operating systems</b>:
+        Vaadin 7 is compatible with <b>Java 6</b> and it is also compatible with most other
+        operating system supporting Java 6 or newer. 
+      </p>
+
+      <p>
+        Vaadin 7 is supported on the following <b>operating systems</b>:
       </p>
 
       <ul>
@@ -371,22 +347,22 @@
       </ul>
 
       <p>
-        Vaadin requires <b>Java Servlet API 2.3</b> but also supports later versions and
+        Vaadin 7 requires <b>Java Servlet API 2.4</b> but also supports later versions and
         should work with any Java application server that conforms to the standard. The
         following <b>application servers</b> are supported:
       </p>
 
       <ul>
-        <li>Apache Tomcat, version 4.1-7.0</li>
+        <li>Apache Tomcat, version 5.0-7.0</li>
         <li>Oracle WebLogic&reg; Server, version 9.2-10.3.5(11gR1)</li>
         <li>IBM WebSphere&reg; Application Server, version 6.1-8.0</li>
-        <li>JBoss Application Server, 3.2.8-7.0</li>
+        <li>JBoss Application Server, 4.0.0-7.0</li>
         <li>Jetty, version 5.0-7.0</li>
         <li>Glassfish, version 2.0-3.1</li>
       </ul>
 
       <p>
-        Vaadin supports JSR-168 and JSR-286 Portlet specifications. All portals that
+        Vaadin 7 supports the JSR-286 Portlet specification. All portals that
         implement either of the portlet specifications should work. The following
         <b>portals</b> are supported:
       </p>
@@ -395,8 +371,6 @@
         <li>Liferay Portal 5.2-6.0</li>
         <li>GateIn Portal 3.1</li>
         <li>eXo Platform 3</li>
-        <li>Oracle WebLogic&reg; Portal 10gR3</li>
-        <li>WebSphere Portal 6.1-7.0</li>
       </ul>
 
       <p>
@@ -404,20 +378,28 @@
       </p>
 
       <p>
-        Vaadin supports the following <b>browsers</b>:
+        Vaadin supports the following <b>desktop browsers</b>:
       </p>
 
       <ul>
+<<<<<<< HEAD
+        <li>Mozilla Firefox 12</li>
+        <li>Internet Explorer 8-9</li>
+        <li>Safari 5</li>
+        <li>Opera 11</li>
+        <li>Google Chrome 19</li>
+=======
         <li>Mozilla Firefox 3-14</li>
         <li>Internet Explorer 6-9</li>
         <li>Safari 4-5</li>
         <li>Opera 10-12</li>
         <li>Google Chrome 13-21</li>
+>>>>>>> remotes/origin/6.8
       </ul>
 
       <p>
-        Vaadin supports the built-in browsers in the following <b>mobile operating
-        systems</b>:
+        Additionally, Vaadin supports the built-in browsers in the following 
+        <b>mobile operating systems</b>:
       </p>
 
       <ul>
@@ -425,52 +407,54 @@
         <li>Android 2-4</li>
       </ul>
 
-      <!-- ================================================================ -->
       <h2 id="vaadinontheweb">Vaadin on the Web</h2>
 
       <ul>
-        <li><a href="http://vaadin.com">vaadin.com - The developer portal containing
-        everything you need to know about Vaadin</a></li>
-
-        <li><a href="http://demo.vaadin.com">demo.vaadin.com - A collection of demos for
-        Vaadin</a></li>
-
-        <li><a href="http://vaadin.com/learn">vaadin.com/learn - Getting started with
-        Vaadin</a></li>
-
-        <li><a href="http://vaadin.com/forum">vaadin.com/forum - Forums for Vaadin related
-        discussions</a></li>
-
-        <li><a href="http://vaadin.com/book">vaadin.com/book - Book of Vaadin - everything
-        you need to know about Vaadin</a></li>
-
-        <li><a href="http://vaadin.com/api">vaadin.com/api - Online javadocs</a></li>
+        <li><a href="http://vaadin.com">vaadin.com - The developer
+            portal containing everything you need to know about Vaadin</a>
+        </li>
+        <li><a href="http://demo.vaadin.com">demo.vaadin.com - A
+            collection of demos for Vaadin</a></li>
+        <li><a href="http://vaadin.com/learn">vaadin.com/learn -
+            Getting started with Vaadin</a></li>
+        <li><a href="http://vaadin.com/forum">vaadin.com/forum -
+            Forums for Vaadin related discussions</a>
+        </li>
+        <li><a href="http://vaadin.com/book">vaadin.com/book - Book
+            of Vaadin - everything you need to know about Vaadin</a> 
+        </li>
+        <li><a href="http://vaadin.com/api">vaadin.com/api - Online
+            javadocs</a>
+        </li>
+        <li><a href="http://vaadin.com/directory">vaadin.com/directory
+            - Add-ons for Vaadin</a>
+        </li>
 
-        <li><a href="http://vaadin.com/directory">vaadin.com/directory - Add-ons for
-        Vaadin</a></li>
+        <li><a href="http://vaadin.com/pro-account">vaadin.com/pro-account
+            - Commercial support and tools for Vaadin development </a>
+        </li>
+        <li><a href="http://vaadin.com/services">vaadin.com/services
+            - Expert services for Vaadin</a>
+        </li>
+        <li><a href="http://vaadin.com/company">vaadin.com/company
+            - Information about the company behind Vaadin</a>
+        </li>
 
         <li><a href="http://dev.vaadin.com">dev.vaadin.com - Bug tracker</a></li>
 
         <li><a
-        href="http://dev.vaadin.com/svn/versions/@version-minor@">dev.vaadin.com/svn/versions/@version-minor@
-        - Source code </a> </li>
-
-        <li><a href="http://vaadin.com/pro-account">vaadin.com/pro-account
-            - Commercial support and tools for Vaadin development </a></li>
-
-        <li><a href="http://vaadin.com/services">vaadin.com/services
-            - Expert services for Vaadin</a> </li>
-
-        <li><a href="http://vaadin.com/company">vaadin.com/company
-            - Information about the company behind Vaadin </a></li>
+        href="http://dev.vaadin.com/wiki/Vaadin/Development/StartingVaadin7Development">How
+        to get the source code of Vaadin</a>
+        </li>
       </ul>
 	</div> <!-- /content-->
 
+
 	<div id="footer">
-      <span class="slogan"><strong>vaadin <em>}&gt;</em> </strong> thinking of U and I<span>
-      <a href="#top">&uarr; Back to top</a>
+		<span class="slogan"><strong>vaadin <em>}></em> </strong>
+			thinking of U and I<span> <a href="#top">&uarr; Back to
+					top</a>
 	</div> <!-- /footer -->
-
   </body>
 </html>
 
diff --git a/WebContent/statictestfiles/browserfeatures/fullHeightScrollbar.html b/WebContent/statictestfiles/browserfeatures/fullHeightScrollbar.html
new file mode 100644
index 0000000000..2e280da64e
--- /dev/null
+++ b/WebContent/statictestfiles/browserfeatures/fullHeightScrollbar.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+<style type="text/css">
+.wrapper {
+	height: 150px;
+	width: 150px;
+	border: 1px solid black;
+	overflow: auto;
+	position: relative;
+}
+
+.content {
+	height: 100%;
+	width: 250px;
+	background: grey;
+}
+
+</style>
+<script type="text/javascript">
+function disableScrolling() {
+	var result = document.getElementsByClassName("content");
+	for(var i = 0; i < result.length; i++) {
+		var e = result[i];
+		e.style.width = "100%";
+	}
+}
+
+function triggerReflow() {
+	var style = "top";
+	var styleValue = "1px";
+	var result = document.getElementsByClassName("wrapper");
+	for(var i = 0; i < result.length; i++) {
+		var e = result[i];
+		var originalValue = e.style[style];
+		e.style[style] = styleValue;
+		e.offsetWidth;
+		e.style[style] = originalValue;
+	}
+}
+</script>
+</head>
+<body scroll="auto">
+<p>This test is used to verify how browsers take horizontal scrollbars into account when calculating 100% height and what happens when scrolling is no longer needed. This test tells which browsers need which workarounds for related features.</p>
+
+<p>Basic situation.
+<div class="wrapper"><div class="content"></div></div>
+</p>
+
+<p>
+Situation with position: absolute on the inner element.
+<div class="wrapper"><div class="content" style="position: absolute"></div></div>
+</p>
+
+<button id="disableScrolling" onclick="disableScrolling()">Disable scrolling</button>
+<button id="triggerReflow" onclick="triggerReflow()">Trigger reflow</button>
+</body>
+</html>
diff --git a/WebContent/statictestfiles/jsextension.js b/WebContent/statictestfiles/jsextension.js
new file mode 100644
index 0000000000..1a46300e45
--- /dev/null
+++ b/WebContent/statictestfiles/jsextension.js
@@ -0,0 +1,24 @@
+window.com_vaadin_tests_extensions_SimpleJavaScriptExtensionTest_SimpleJavascriptExtension = function() {
+	var self = this;
+	var state = this.getState();
+	
+	//var rpc = this.getRpcProxy("com.vaadin.tests.extensions.SimpleJavaScriptExtensionTest.SimpleJavaScriptExtensionServerRpc");
+	var rpc = this.getRpcProxy();
+
+//	this.registerRpc("com.vaadin.tests.extensions.SimpleJavaScriptExtensionTest.SimpleJavaScriptExtensionClientRpc", {
+	this.registerRpc({
+		'greet': function(greeting) {
+			var response = window.prompt(state.prefix + greeting);
+			if (response !== null) {
+				rpc.greet(response);
+			}
+		}
+	});
+	
+	this.greetToClient = function(greeting) {
+		var response = window.prompt(state.prefix + greeting);
+		if (response !== null) {
+			self.greetToServer(response);
+		}
+	} 
+}
\ No newline at end of file