Bug 429153 - Separate ide.css into two files.
diff --git a/bundles/org.eclipse.orion.client.ui/web/css/controls.css b/bundles/org.eclipse.orion.client.ui/web/css/controls.css
new file mode 100644
index 0000000..69c959e
--- /dev/null
+++ b/bundles/org.eclipse.orion.client.ui/web/css/controls.css
@@ -0,0 +1,1074 @@
+/*

+ * Provide the Orion specific styles. All the document level styls should live in pages.css

+*/

+.navlink {

+	display: inline-block;

+	padding: 2px;

+	color: #333333;

+}

+

+.navlink:hover {

+	color: #F58B0F;

+}

+

+.navlink > span {

+	color: inherit;

+}

+

+.nav_fakelink:hover {

+	cursor: pointer;

+}

+

+.navlinkonpage, .nav_fakelink {

+	text-decoration: none;

+	padding: 2px;

+	color: #555;

+}

+

+.navlinkonpage:active {

+	text-decoration: none;

+}

+

+.navlinkonpage:hover {

+	text-decoration: none;

+	border-bottom: 1px dotted;

+	color: #F58B0F;

+}

+

+.dragOver {

+	background: #ffffd8;

+	outline: #AAA 2px dotted !important;

+}

+

+.logo {

+	background-image: url(../images/core_sprites.png);

+	background-repeat: no-repeat;

+	background-position: 0 -517px; 

+	width: 37px; height: 14px; 

+	margin-top: 6px;

+	margin-right:5px;

+}

+

+.toolbarTarget:focus{

+	outline:none;

+}

+

+.pageNav {

+	color: #808080;

+	font-size: 8pt;

+}

+

+.pageActions {

+	min-height: 20px;

+	margin-top: 8px;

+}

+

+/* 4px margin used by toolbar, plus 4px of border/padding */

+.status {

+	padding-top: 10px;

+	color:#555;

+	vertical-align: baseline;

+}

+

+/* marker for finding section and main toolbars */

+.toolComposite {

+}

+

+.taskTitle {

+	min-width: 10em;

+}

+

+.taskDescription {

+	font-size: 8pt;

+	padding: 8px;

+}

+

+.pageNavigationActions {

+	text-align: right;

+	min-height: 30px;

+}

+

+/* slideout styles */

+

+/* the left hand side of slideout containing parameter fields */

+.parameters {

+	color: whitesmoke;

+	vertical-align: middle;

+}

+

+/* the right hand side of slideout containing dismiss buttons */

+.parametersDismiss {

+	color: whitesmoke;

+	vertical-align: middle;

+	font-weight: normal;

+	padding: 3px;

+	padding-bottom: 0;

+}

+

+/* buttons used to dismiss or complete a slideout */

+.dismissButton {

+	border: 1px solid transparent;

+	background: transparent;

+	color: #666;

+    border-radius: 1px;

+	padding: 2px;

+	font: 8pt Lucida Sans Unicode,Lucida Grande,Verdana,Arial,Helvetica,Myriad,Tahoma,clean,sans-serif;  /* to override user agent stylesheet */

+	margin: 0 4px 0;

+	vertical-align: middle;

+	min-height: 16px;

+	min-width: 16px;

+}

+

+.cancelButton {

+	border: 1px solid transparent;

+	background: #D3D3D3 !important;

+	color: black;

+    border-radius: 3px;

+	padding: 2px;

+	font: 8pt Lucida Sans Unicode,Lucida Grande,Verdana,Arial,Helvetica,Myriad,Tahoma,clean,sans-serif;  /* to override user agent stylesheet */

+	margin: 0 4px 0;

+	vertical-align: middle;

+	min-height: 16px;

+}

+

+.dismissButton:hover {

+	color: #fdfdfd;

+}

+

+.parameterPrompt {

+	color: #fdfdfd;

+	display: block;

+	padding: 6px 4px 0;

+}

+

+/* button contained in a slideout next to parameter fields */

+.parameterInlineButton {

+	vertical-align: baseline;

+}

+

+/* parameter labels */

+label.parameterInput{

+	color: #555;

+	white-space: nowrap;

+}

+

+/* parameter fields */

+.parameterInput {

+	margin: 4px;

+	font-weight: normal;

+	vertical-align: baseline;

+	color:#333;

+	outline:none;

+}

+

+/* Adjust default sizes and layout for certain types */

+input.parameterInput[type=url] {

+	width: 30em;

+}

+

+input.parameterInput[type=checkbox] {

+	width: auto;

+}

+

+textarea.parameterInput {

+	vertical-align: top;

+	width: 50em;

+}

+

+.parameterPopup {

+	min-width: 15em;

+	max-width: 100em;

+	color: #333;

+}

+

+.parameterPopup > label{

+	color: whitesmoke;

+}

+

+.parameterPopup > input{

+	color: #333;

+}

+

+

+.navTableHeading {

+	color: #404040;

+	border-bottom: 1px solid #404040;

+}

+

+.navColumn {

+	min-width: 150px;

+	vertical-align: baseline;

+	padding: 2px;

+}

+

+.navColumnNoIcon {

+	padding: 6px;

+}

+

+.navRow {

+	vertical-align: baseline;

+	border-spacing: 8px;

+}

+

+.disabledNavRow > .navColumn > .mainNavColumn {

+	outline: 1px dashed lightgray;

+}

+

+.disabledNavRow > .navColumn > .mainNavColumn > * {

+	color: gray;

+	cursor: default;

+}

+

+.disabledNavRow > .navColumn > .mainNavColumn > *:hover {

+	border: none;

+}

+

+.mainNavColumn {

+	display: inline-block;

+	padding: 2px;

+	vertical-align: baseline;

+	white-space: nowrap;

+}

+

+.singleNavColumn {

+	width: 100%;

+	white-space: nowrap;

+}

+

+.actionsColumn {

+	min-width: 300px;

+	text-align: right;

+	padding-left: 16px;

+	vertical-align: middle;

+	height: 24px;  /* breathing room */

+}

+

+.selectionCheckmarkSprite {

+	display: inline-block; 

+	vertical-align: middle; 

+	background-image: url(../images/core_sprites.png);

+	padding: 4px;

+	padding-left: 8px;

+	padding-right: 8px;

+	margin-right: 4px;

+}

+

+.modelDecorationSprite { 

+	display: inline-block; 

+	vertical-align: middle; 

+	background-image: url(../images/core_sprites.png);

+	margin-left: 8px;

+	padding-right: 8px;

+	margin-right: 8px;

+}

+

+.advancedSearchDecorationSprite { 

+	display: inline-block; 

+	vertical-align: middle; 

+	background-image: url(../images/core_sprites.png);

+	margin-left: 0px;

+	padding-right: 0px;

+}

+

+.thumbnail {

+	vertical-align: middle; 

+	padding: 0;

+	margin: 0;

+	margin-left: 8px; 

+	padding-right: 8px;

+	margin-right: 8px;

+	height: 16px;

+	width: 16px;

+	vertical-align:bottom;

+}

+

+/* less hit-area since we aren't worried about touch */

+@media all and (min-device-width: 1025px) {

+	.modelDecorationSprite { 	

+		padding: 0;

+		margin: 0;

+		margin-left: 2px;

+		padding-right: 2px;

+		margin-right: 2px;

+	}

+	

+	.thumbnail {

+		margin-left: 2px; 

+		padding-right: 2px;

+		margin-right: 2px;

+		max-height: 24px;

+		max-width: 48px;

+		vertical-align:bottom;

+	}

+	

+	.selectionCheckmarkSprite { 	

+		padding: 0;

+		padding-left: 2px;

+		padding-right: 2px;

+		margin-right: 2px;

+	}

+	

+	.checkColumn {

+		width: 22px;

+	}

+}

+

+.pane {

+   	margin: 0;

+    padding: 0;

+    background: #FFFFFF;

+    min-width: 300px;

+}

+

+.userEditBoxPrompt {

+	background: white;

+	color: black;

+}

+

+.auxPadding {

+	padding-left: 8px;

+	padding-top: 2px;

+    padding-bottom: 8px;

+}

+ 

+.help {

+	font-weight: bold;

+	font-size: 1.2em;

+	padding-left: 8px;

+	padding-right: 8px;

+}

+

+.footer {

+	text-align: left;

+	width: 100%;

+	border: 0;

+	padding: 0;

+}

+

+.toolbarLabel {

+	padding-left: 8px;

+}

+

+.slideContainer {

+	height: auto;

+	float: right;

+	margin: 2px;

+	margin-top: 0;

+	margin-left: 4px;

+	display: none;

+	vertical-align: middle;

+	font-size: 11px;

+	z-index: 51;

+	color: #999;

+}

+

+.slideParameters {

+	border: 1px solid #bbb;

+	background-color: lightgrey;

+	border-radius: 5px;

+}

+

+.mainToolbar .slideContainer {

+	border-top: 0;

+	border-top-left-radius: 0;

+	border-top-right-radius: 0;

+	position: absolute;

+	top: -36px;

+	-webkit-transition: top 0.3s ease;

+	-moz-transition: top 0.3s ease;

+	-o-transition: top 0.3s ease;

+	transition: top 0.3s ease;

+}

+

+.mainToolbar .slideParameters {

+	border-top: 0;

+	border-top-left-radius: 0;

+	border-top-right-radius: 0;

+	position: absolute;

+}

+

+.slideContainerActive {

+	display: block;

+}

+

+.activeCommand {

+	background-color: #e3e3e3;

+	border: 1px solid #9a9a9a;

+}

+

+/* marker used by parameter collectors to identify commands */

+.commandMarker {

+}

+

+.bannerMenu {

+	margin: 0;

+	margin-left: 8px;

+	margin-right: 8px;

+	font-size: 7pt;

+	display: inline-block;

+	padding-top:0 !important;

+	vertical-align: baseline;

+}

+

+.bannerMenuSearchOptions {

+	margin-left: -20px;

+}

+

+.bannerButton {

+	border: 1px solid transparent;

+	text-align: center;

+	vertical-align: baseline;

+    cursor: pointer;

+    display: inline-block;

+    border-radius:3px;

+    margin: 2px;

+    padding: 2px;

+}

+

+.bannerButton:hover {

+	background-color: #e6e6e6;

+	border: 1px solid #808080;

+}

+

+.toolbarButton {

+	border: 0;

+	padding: 0;

+	height: 20px;

+}

+

+.keyAssistFloat {

+	color: white;

+	display: none;

+	background: rgba(51, 51, 51, 0.9);

+	position: fixed;

+	right: 44px;

+	top: 75px;

+	min-width: 250px;

+	padding: 5px;

+	z-index:100;

+	border-radius: 4px;

+}

+

+.keyAssistContents {

+	width: auto;

+	height: 400px;

+	margin-top: 8px;

+	margin-bottom: 1px;

+	overflow: hidden;

+}

+

+.keyAssistInput {

+	color: inherit;

+	background: #333;

+	width: 100%;

+	margin: 0;

+	padding-left: 0;

+	padding-right: 0;

+}

+

+.keyAssistList {

+	width: 100%;

+	border-collapse: collapse;

+	outline: none;

+}

+

+.keyAssistItem {

+}

+

+.keyAssistItem:hover {

+	color: black;

+	background: rgba(255, 255, 255, 0.3);

+}

+

+.keyAssistFloat h2 {

+	color: gold;

+}

+

+.keyAssistItem.selected {

+	color: black;

+	background: rgba(255, 255, 255, 0.6);

+}

+

+.keyAssistName {

+	text-align: left;

+	padding: 3px;

+	border-top-left-radius: 4px;

+	border-bottom-left-radius: 4px;

+}

+

+.keyAssistAccel {

+	/*font-family: Monaco;*/

+	font-size: 10pt;

+	font-weight: bold;

+	color: gold;

+	text-align: right;

+	padding: 3px;

+	border-top-right-radius: 4px;

+	border-bottom-right-radius: 4px;

+}

+

+.inputCompletionContainer {

+	border-radius:1px;

+	color: black;

+	display: block;

+	border:  1px solid #DDD;

+	background: #fefefe;

+	max-height: 300px;

+	max-width: 300px;

+	min-width: 150px;

+	position: absolute;

+	overflow-y: auto;

+	overflow-x: hidden;

+	padding: 2px;

+	box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);

+	z-index:200;

+}

+

+.inputCompletionDismissButton {

+	background: transparent;

+	color: silver;

+    border-radius: 1px;

+	padding: 0;

+	font: 8pt Lucida Sans Unicode,Lucida Grande,Verdana,Arial,Helvetica,Myriad,Tahoma,clean,sans-serif;  /* to override user agent stylesheet */

+	vertical-align: middle;

+	min-height: 16px;

+	min-width: 16px;

+}

+

+.inputCompletionLILeftTD {

+	height: 19px;

+}

+

+.inputCompletionLIRightTD {

+	width: 19px;

+	height: 19px;

+}

+

+.inputCompletionUL {

+	list-style : none;

+	margin: 0;

+	padding: 0;

+}

+

+.inputCompletionLISelected {

+	background : #ffeecc;/*#0080ff;*/

+}

+

+.inputCompletionLICategory {

+	font-weight: bold;

+}

+

+.inputCompletionLINormal {

+	background : white;

+}

+

+#tree {

+	margin-right: 9em;

+	overflow-x: hidden;

+}

+

+#treeButtons br {

+	line-height: 0.5em;

+}

+

+#treeButtons {

+	margin: 0;

+	padding: 0;

+	float: right;

+	width: 9em;

+}

+

+#treeButtons .contentButton {

+	width: 8.5em;

+	margin: 0;

+	margin-bottom: 3px;

+	font-size: 1em;

+}

+

+.testResult {

+	background-color: #444444 !important;

+	color: white;

+}

+

+/* TODO these "item" classes should be removed. Check for users. */

+.folderItem {

+	background: url(../images/folder.png);

+}

+.fileItem {

+	background: url(../images/file.png);

+}

+.newItem {

+	background: url(../images/addcontent.png);

+}

+

+.treetable {

+	border-collapse: collapse;

+	border-spacing: 0;

+	width:100%;

+}

+

+.miniNavTreeTable {

+	border-spacing: 0;

+	width:100%;

+	padding-left:4px;

+}

+

+.secondaryColumn {

+	color: #666666;	

+	padding-right: 8px;

+	padding-top: 8px;

+	vertical-align:top;

+}

+

+.secondaryColumnRight {

+	color: #666666;	

+	padding-right: 8px;

+	padding-top: 8px;

+	vertical-align:top;

+	text-align: right;

+}

+

+.secondaryColumnLeft {

+	color: #666666;	

+	padding-right: 8px;

+	padding-left: 8px;

+	padding-top: 8px;

+	vertical-align:top;

+	text-align: left;

+}

+

+.primaryColumn {

+	color: #3087B3;

+	text-decoration: none;

+	vertical-align:top;

+}

+

+.checkColumn {

+	padding: 0;

+}

+

+.testNavTreetable {

+	min-width: 150px;

+}

+

+.testResultTreetable {

+	min-width: 600px;

+}

+

+.selectionModelContainer {

+	outline: none;

+	-webkit-touch-callout: none;

+	-webkit-user-select: none;

+	-khtml-user-select: none;

+	-moz-user-select: -moz-none; /*-moz-none allows override in children*/

+	-ms-user-select: none;

+	user-select: none;

+}

+

+.treeIterationCursor {

+	border-radius:4px;

+}

+

+.treeIterationCursorRow {

+	background-color: #f3f6fe;

+}

+

+.treeIterationCursorRow_Dotted {

+	background-color: #f3f6fe;

+}

+

+.searchCmdGroupMargin {

+	margin-left: 16px;

+	margin-top: 2px;

+}

+

+.LoginWindowLeft {

+	padding-left: 0.5em;

+}

+

+.LoginWindowRight {

+	padding-right: 0.5em;

+}

+

+.LoginWindowComment {

+	font-size: 0.9em;

+	padding-left: 15px;

+}

+

+#outline #switchOutlineMenu {

+	float: right;

+}

+

+#outline #switchOutlineMenu .commandImage {

+	display: none;

+}

+

+#outline>ul {

+	padding-left: 0 !important;

+	clear: both;

+	margin: 4px 0 0 8px;

+}

+

+#outline ul {

+	padding-left: 14px;

+}

+

+#outline li {

+	padding-bottom: 2px;

+	list-style-type: none;

+	white-space: nowrap; /*wrapping makes indented list hard to read*/

+}

+

+.uploadContainer{

+	padding:20px;

+	font-weight:bold;

+}

+

+.dottedOutline{

+	border: #DDD 4px dashed;

+	border-radius: 2px;

+	padding:50px;

+	height:300px;

+	width: 300px;

+}

+

+.floatingSection{

+	color: #DDD;

+}

+

+.uploadInstruction{

+	font-size: 18pt;

+	color: #CCC;

+	padding: 0 0 25px;

+	text-align:center;

+}

+

+.tipInstruction{

+	font-size: 12pt;

+	color: #CCC;

+	padding: 0 0 100px;

+	text-align:center;

+}

+

+.uploadOptions {

+	font-size: 14pt;

+	color: #BBB;

+	padding: 0 0 100px;

+	text-align: center;

+	vertical-align: middle;

+}

+

+.uploadOptionsItem {

+	font-size: 12pt;

+	color: #BBB;

+	text-align: center;

+	vertical-align: middle;

+	margin: 0 8px !important;

+}

+

+/* don't try to fight the poor styling and alignment of file inputs.  The browser will defeat you.  Just make it look like its own reasonable island */

+/* the real solution is to overlay a styled button on top.  http://stackoverflow.com/questions/572768/styling-an-input-type-file-button/9546968  */

+.uploadChooser{

+	vertical-align: middle;

+	margin-right: 24px;

+	margin-bottom: 4px;

+	border: 1px solid #dedede;

+    border-radius:1px;

+}

+

+.targetSelector{

+

+}

+

+#folderNameparameterCollector{

+	color:#333;

+}

+

+#urlparameterCollector{

+	color:#333;

+}

+

+.setting-control {

+	display: inline-block;

+	width: 130px;

+	padding: 4px;

+	margin: 5px;

+	background-color: white;

+	border: 1px solid #CCC;

+	border-radius: 3px;

+	font-size: 12px;

+	color: #222;

+}

+

+.local .setting-label {

+	width: 150px;

+	text-align: right;

+	display: inline-block;

+}

+

+.delegatedUI {

+	position: absolute; 

+	min-width: 250px;

+	min-height: 100px;

+	/* width, height may be overridden by the provider */

+	width: 600px;

+	height: 400px;

+	z-index: 150;

+	border: 1px inset;

+}

+

+/* FOR NAVIGATION DROP DOWN */

+

+.centralNavigation {

+	margin-bottom:2px;

+	cursor:pointer;

+}

+

+.centralNavigation:hover{

+	color: #F58B0F;

+}

+

+.navigationLabel{

+	color:#ddd;

+	cursor:pointer;

+	display: inline;

+	padding-right: 3px;

+}

+

+.groupedContentDivider{

+	float: left;

+	width: 1px;

+	height: 160px;

+	margin-top: 10px;

+	margin-bottom: 10px;

+	border-left: dashed 1px #ddd;

+}

+

+.navigationBreadcrumb{

+	font-family: sans-serif;

+	padding-bottom:5px;

+}

+

+.currentLocation{

+	margin-left:auto;

+	margin-right:auto;

+}

+

+.modifiedFileMarker{

+	color:#333;

+	padding-left:5px;

+}

+

+.noFile {

+	padding: 10px;

+	vertical-align: middle;

+}

+

+.icon-inline {

+	display: inline-block;

+	vertical-align: middle;

+	margin: 0 2px 0 2px;

+}

+

+.projectNavColumn {

+    color: #666;

+    font-weight: bold;

+}

+

+.projectPrimaryNavColumn {

+	color: #000;

+}

+

+.projectNavColumn a{

+	color: #555;

+    font-weight: bold;

+}

+

+.projectPrimaryNavColumn a{

+	color: #555;

+    font-weight: bold;

+}

+

+.projectInformationNode{

+

+}

+

+.sectionWrapper, .sectionTable{

+	text-align: left;

+	border-collapse: collapse;

+	border-spacing: 0;

+	padding: 0;

+	margin-top: 30px;

+	overflow-y: hidden; /* prevent vertical scrollbar from showing during expand/collapse */

+}

+

+.mainpane .sectionTable .treetable, .mainpane .sectionWrapper .treetable, .mainpane .sectionTable .treetable .actionsColumn{

+	min-width: inherit;

+}

+

+.fixedMinWidthText {

+	overflow: hidden;

+	text-overflow: ellipsis;

+	display: block;

+	max-width: 300px;

+}

+

+.sectionTable {

+	margin-top: 0;

+	margin-left: 6%;

+	margin-right: 6%;

+	border: 1px solid;

+	border-bottom-left-radius: 3px;

+	border-bottom-right-radius: 3px;

+	border-color:#dadada;

+	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.1);

+	-webkit-transition: all 0.5s ease;

+	transition: all 0.5s ease;

+	-webkit-transform-origin: top;

+	-ms-transform-origin: top;

+	transform-origin: top;

+}

+

+/* sectionTable preceeded by a sectionWrapper */

+.sectionWrapper+.sectionTable {

+	margin-top: 2px;

+	border-top: none;

+}

+

+.sectionTable:last-child {

+	margin-bottom: 20px;

+}

+

+.sectionTable.sectionClosed {

+	height: 0;

+	-webkit-transform: scaleY(0);

+	-ms-transform: scaleY(0);

+	transform: scaleY(0);

+}

+

+.sectionWrapper{

+	border: 1px solid;

+	margin-left: 5%;

+	margin-right: 5%;

+	background: none repeat scroll 0 0 #f4f4f4;

+	vertical-align: middle;

+	font-weight: bold;

+	padding: 6px;

+	color: gray;

+	margin-bottom: 0;

+	border-color: #dadada;

+	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);

+	transition: all 0.5s ease;

+}

+

+.sectionWrapper.sectionClosed {

+	box-shadow: none;

+	opacity: 0.9;

+	background: none;

+}

+

+.sectionWrapper.sectionClosed:hover {

+	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);

+	opacity: 1;

+	transition: all 0.3s;

+}

+

+.sectionTable td {

+	border-bottom: 1px solid #dadada;

+	vertical-align: middle;

+	color: gray;

+}

+

+.sectionTable tr:last-child td{

+	border-bottom: 0;

+}

+

+.sectionTable div.lightTreeTableRow:last-child, .sectionTable div.lightTreeTableRow:last-child{

+	border-bottom: 0;

+}

+

+.orionMarkdown {

+	padding: 8px;

+	color: gray;

+}

+

+.orionMarkdown img {

+	max-width: 100%;

+}

+

+.orionMarkdown pre, .orionMarkdown code {

+	background-color: #fafafa;

+	border: 1px solid #ddd;

+	border-radius: 3px;

+}

+

+.orionMarkdown pre {

+	padding: 6px 10px;

+	overflow: auto;

+}

+

+.orionMarkdown code {

+	padding: 0 5px;

+	margin: 0 2px;

+}

+

+.orionMarkdown pre code {

+	background-color: transparent;

+    padding: 0;

+	border: 0;

+	margin: 0;

+}

+

+.orionProject input, .orionProject textarea{

+	border: 1px solid lightgrey;

+}

+

+.orionProject .discreetInput {

+	border: 1px solid transparent; /* prevent movement on hover */

+	color: gray;

+	font: 8pt Lucida Sans Unicode,Lucida Grande,Verdana,Arial,Helvetica,Myriad,Tahoma,clean,sans-serif;

+	width: 90%;

+	margin-left: 0;

+	min-height: 15px;

+	background-color: inherit;

+}

+

+.orionProject .discreetInput:hover, .orionProject .discreetInput:focus {

+	border: 1px solid lightgrey;

+	color: black;

+	background-color: white;

+}

+

+.discreetInputLabel {

+	font-weight: bold;

+	padding: 8px;

+}

+

+.orionMarkdown h1 {

+	position: relative;

+}

+

+.sectionTreeTable {

+	border-spacing: 0;

+	width:100%;

+}

+

+.sectionTreeTable td {

+	border-bottom: none !important;

+}

+

+.sectionTreeTableHeader{

+	background: none !important;

+}

+

+.lightSectionTreeTableRow {

+	background-color: #FFFFFF;

+}

+

+.darkSectionTreeTableRow {

+	background-color: #f5f7f9;

+}

+

+.lightTreeTableRow, .darkTreeTableRow {

+	border-bottom: 1px solid #dadada;

+}

diff --git a/bundles/org.eclipse.orion.client.ui/web/css/ide.css b/bundles/org.eclipse.orion.client.ui/web/css/ide.css
index 517a4f2..d592f61 100644
--- a/bundles/org.eclipse.orion.client.ui/web/css/ide.css
+++ b/bundles/org.eclipse.orion.client.ui/web/css/ide.css
@@ -5,1131 +5,6 @@
 @import "./progress.css";
 @import "./assistance.css";
 @import "../font/font.css";
-
-html {
-  cursor: default;
-  height: 100%;
-}
-
-html, body {
-	margin: 0;
-	padding: 0;
-	font: 9pt Arial,Helvetica,Myriad,Tahoma,clean,sans-serif, Lucida Sans Unicode,Lucida Grande,Verdana; 
-	min-width:700px;
-} 
-
-h1 {
-	font-size:1.5em;
-	font-weight: bold;
-	color: #6d6d6d;
-	line-height: 36px;
-	position:absolute;
-	top:0;
-	bottom:0;
-	margin:auto;
-}
-
-h2 {
-	font-size: 1.1em;
-	font-weight: bold;
-	color: #6d6d6d;
-	margin-top: 4px;
-	margin-bottom: 4px;
-}
-
-/** remove unwanted borders on img in IE **/
-img {
-	border: 0;
-}
-
-/**
- * Remove unwanted button padding in Firefox
- */ 
-button::-moz-focus-inner {
-    border: 0;
-    padding: 0;
-}
-
-.navlink {
-	display: inline-block;
-	padding: 2px;
-	color: #333333;
-}
-
-.navlink:hover {
-	color: #F58B0F;
-}
-
-.navlink > span {
-	color: inherit;
-}
-
-.nav_fakelink:hover {
-	cursor: pointer;
-}
-
-.navlinkonpage, .nav_fakelink {
-	text-decoration: none;
-	padding: 2px;
-	color: #555;
-}
-
-.navlinkonpage:active {
-	text-decoration: none;
-}
-
-.navlinkonpage:hover {
-	text-decoration: none;
-	border-bottom: 1px dotted;
-	color: #F58B0F;
-}
-
-.dragOver {
-	background: #ffffd8;
-	outline: #AAA 2px dotted !important;
-}
-
-.logo {
-	background-image: url(../images/core_sprites.png);
-	background-repeat: no-repeat;
-	background-position: 0 -517px; 
-	width: 37px; height: 14px; 
-	margin-top: 6px;
-	margin-right:5px;
-}
-
-.toolbarTarget:focus{
-	outline:none;
-}
-
-.pageNav {
-	color: #808080;
-	font-size: 8pt;
-}
-
-.pageActions {
-	min-height: 20px;
-	margin-top: 8px;
-}
-
-/* 4px margin used by toolbar, plus 4px of border/padding */
-.status {
-	padding-top: 10px;
-	color:#555;
-	vertical-align: baseline;
-}
-
-/* marker for finding section and main toolbars */
-.toolComposite {
-}
-
-.taskTitle {
-	min-width: 10em;
-}
-
-.taskDescription {
-	font-size: 8pt;
-	padding: 8px;
-}
-
-.pageNavigationActions {
-	text-align: right;
-	min-height: 30px;
-}
-
-/* slideout styles */
-
-/* the left hand side of slideout containing parameter fields */
-.parameters {
-	color: whitesmoke;
-	vertical-align: middle;
-}
-
-/* the right hand side of slideout containing dismiss buttons */
-.parametersDismiss {
-	color: whitesmoke;
-	vertical-align: middle;
-	font-weight: normal;
-	padding: 3px;
-	padding-bottom: 0;
-}
-
-/* buttons used to dismiss or complete a slideout */
-.dismissButton {
-	border: 1px solid transparent;
-	background: transparent;
-	color: #666;
-    border-radius: 1px;
-	padding: 2px;
-	font: 8pt Lucida Sans Unicode,Lucida Grande,Verdana,Arial,Helvetica,Myriad,Tahoma,clean,sans-serif;  /* to override user agent stylesheet */
-	margin: 0 4px 0;
-	vertical-align: middle;
-	min-height: 16px;
-	min-width: 16px;
-}
-
-.cancelButton {
-	border: 1px solid transparent;
-	background: #D3D3D3 !important;
-	color: black;
-    border-radius: 3px;
-	padding: 2px;
-	font: 8pt Lucida Sans Unicode,Lucida Grande,Verdana,Arial,Helvetica,Myriad,Tahoma,clean,sans-serif;  /* to override user agent stylesheet */
-	margin: 0 4px 0;
-	vertical-align: middle;
-	min-height: 16px;
-}
-
-.dismissButton:hover {
-	color: #fdfdfd;
-}
-
-.parameterPrompt {
-	color: #fdfdfd;
-	display: block;
-	padding: 6px 4px 0;
-}
-
-/* button contained in a slideout next to parameter fields */
-.parameterInlineButton {
-	vertical-align: baseline;
-}
-
-/* parameter labels */
-label.parameterInput{
-	color: #555;
-	white-space: nowrap;
-}
-
-/* parameter fields */
-.parameterInput {
-	margin: 4px;
-	font-weight: normal;
-	vertical-align: baseline;
-	color:#333;
-	outline:none;
-}
-
-/* Adjust default sizes and layout for certain types */
-input.parameterInput[type=url] {
-	width: 30em;
-}
-
-input.parameterInput[type=checkbox] {
-	width: auto;
-}
-
-textarea.parameterInput {
-	vertical-align: top;
-	width: 50em;
-}
-
-.parameterPopup {
-	min-width: 15em;
-	max-width: 100em;
-	color: #333;
-}
-
-.parameterPopup > label{
-	color: whitesmoke;
-}
-
-.parameterPopup > input{
-	color: #333;
-}
-
-
-.navTableHeading {
-	color: #404040;
-	border-bottom: 1px solid #404040;
-}
-
-.navColumn {
-	min-width: 150px;
-	vertical-align: baseline;
-	padding: 2px;
-}
-
-.navColumnNoIcon {
-	padding: 6px;
-}
-
-.navRow {
-	vertical-align: baseline;
-	border-spacing: 8px;
-}
-
-.disabledNavRow > .navColumn > .mainNavColumn {
-	outline: 1px dashed lightgray;
-}
-
-.disabledNavRow > .navColumn > .mainNavColumn > * {
-	color: gray;
-	cursor: default;
-}
-
-.disabledNavRow > .navColumn > .mainNavColumn > *:hover {
-	border: none;
-}
-
-.mainNavColumn {
-	display: inline-block;
-	padding: 2px;
-	vertical-align: baseline;
-	white-space: nowrap;
-}
-
-.singleNavColumn {
-	width: 100%;
-	white-space: nowrap;
-}
-
-.actionsColumn {
-	min-width: 300px;
-	text-align: right;
-	padding-left: 16px;
-	vertical-align: middle;
-	height: 24px;  /* breathing room */
-}
-
-.selectionCheckmarkSprite {
-	display: inline-block; 
-	vertical-align: middle; 
-	background-image: url(../images/core_sprites.png);
-	padding: 4px;
-	padding-left: 8px;
-	padding-right: 8px;
-	margin-right: 4px;
-}
-
-.modelDecorationSprite { 
-	display: inline-block; 
-	vertical-align: middle; 
-	background-image: url(../images/core_sprites.png);
-	margin-left: 8px;
-	padding-right: 8px;
-	margin-right: 8px;
-}
-
-.advancedSearchDecorationSprite { 
-	display: inline-block; 
-	vertical-align: middle; 
-	background-image: url(../images/core_sprites.png);
-	margin-left: 0px;
-	padding-right: 0px;
-}
-
-.thumbnail {
-	vertical-align: middle; 
-	padding: 0;
-	margin: 0;
-	margin-left: 8px; 
-	padding-right: 8px;
-	margin-right: 8px;
-	height: 16px;
-	width: 16px;
-	vertical-align:bottom;
-}
-
-/* less hit-area since we aren't worried about touch */
-@media all and (min-device-width: 1025px) {
-	.modelDecorationSprite { 	
-		padding: 0;
-		margin: 0;
-		margin-left: 2px;
-		padding-right: 2px;
-		margin-right: 2px;
-	}
-	
-	.thumbnail {
-		margin-left: 2px; 
-		padding-right: 2px;
-		margin-right: 2px;
-		max-height: 24px;
-		max-width: 48px;
-		vertical-align:bottom;
-	}
-	
-	.selectionCheckmarkSprite { 	
-		padding: 0;
-		padding-left: 2px;
-		padding-right: 2px;
-		margin-right: 2px;
-	}
-	
-	.checkColumn {
-		width: 22px;
-	}
-}
-
-.pane {
-   	margin: 0;
-    padding: 0;
-    background: #FFFFFF;
-    min-width: 300px;
-}
-
-.userEditBoxPrompt {
-	background: white;
-	color: black;
-}
-
-.auxPadding {
-	padding-left: 8px;
-	padding-top: 2px;
-    padding-bottom: 8px;
-}
- 
-.help {
-	font-weight: bold;
-	font-size: 1.2em;
-	padding-left: 8px;
-	padding-right: 8px;
-}
-
-.footer {
-	text-align: left;
-	width: 100%;
-	border: 0;
-	padding: 0;
-}
-
-.toolbarLabel {
-	padding-left: 8px;
-}
-
-.slideContainer {
-	height: auto;
-	float: right;
-	margin: 2px;
-	margin-top: 0;
-	margin-left: 4px;
-	display: none;
-	vertical-align: middle;
-	font-size: 11px;
-	z-index: 51;
-	color: #999;
-}
-
-.slideParameters {
-	border: 1px solid #bbb;
-	background-color: lightgrey;
-	border-radius: 5px;
-}
-
-.mainToolbar .slideContainer {
-	border-top: 0;
-	border-top-left-radius: 0;
-	border-top-right-radius: 0;
-	position: absolute;
-	top: -36px;
-	-webkit-transition: top 0.3s ease;
-	-moz-transition: top 0.3s ease;
-	-o-transition: top 0.3s ease;
-	transition: top 0.3s ease;
-}
-
-.mainToolbar .slideParameters {
-	border-top: 0;
-	border-top-left-radius: 0;
-	border-top-right-radius: 0;
-	position: absolute;
-}
-
-.slideContainerActive {
-	display: block;
-}
-
-.activeCommand {
-	background-color: #e3e3e3;
-	border: 1px solid #9a9a9a;
-}
-
-/* marker used by parameter collectors to identify commands */
-.commandMarker {
-}
-
-.bannerMenu {
-	margin: 0;
-	margin-left: 8px;
-	margin-right: 8px;
-	font-size: 7pt;
-	display: inline-block;
-	padding-top:0 !important;
-	vertical-align: baseline;
-}
-
-.bannerMenuSearchOptions {
-	margin-left: -20px;
-}
-
-.bannerButton {
-	border: 1px solid transparent;
-	text-align: center;
-	vertical-align: baseline;
-    cursor: pointer;
-    display: inline-block;
-    border-radius:3px;
-    margin: 2px;
-    padding: 2px;
-}
-
-.bannerButton:hover {
-	background-color: #e6e6e6;
-	border: 1px solid #808080;
-}
-
-.toolbarButton {
-	border: 0;
-	padding: 0;
-	height: 20px;
-}
-
-.keyAssistFloat {
-	color: white;
-	display: none;
-	background: rgba(51, 51, 51, 0.9);
-	position: fixed;
-	right: 44px;
-	top: 75px;
-	min-width: 250px;
-	padding: 5px;
-	z-index:100;
-	border-radius: 4px;
-}
-
-.keyAssistContents {
-	width: auto;
-	height: 400px;
-	margin-top: 8px;
-	margin-bottom: 1px;
-	overflow: hidden;
-}
-
-.keyAssistInput {
-	color: inherit;
-	background: #333;
-	width: 100%;
-	margin: 0;
-	padding-left: 0;
-	padding-right: 0;
-}
-
-.keyAssistList {
-	width: 100%;
-	border-collapse: collapse;
-	outline: none;
-}
-
-.keyAssistItem {
-}
-
-.keyAssistItem:hover {
-	color: black;
-	background: rgba(255, 255, 255, 0.3);
-}
-
-.keyAssistFloat h2 {
-	color: gold;
-}
-
-.keyAssistItem.selected {
-	color: black;
-	background: rgba(255, 255, 255, 0.6);
-}
-
-.keyAssistName {
-	text-align: left;
-	padding: 3px;
-	border-top-left-radius: 4px;
-	border-bottom-left-radius: 4px;
-}
-
-.keyAssistAccel {
-	/*font-family: Monaco;*/
-	font-size: 10pt;
-	font-weight: bold;
-	color: gold;
-	text-align: right;
-	padding: 3px;
-	border-top-right-radius: 4px;
-	border-bottom-right-radius: 4px;
-}
-
-.inputCompletionContainer {
-	border-radius:1px;
-	color: black;
-	display: block;
-	border:  1px solid #DDD;
-	background: #fefefe;
-	max-height: 300px;
-	max-width: 300px;
-	min-width: 150px;
-	position: absolute;
-	overflow-y: auto;
-	overflow-x: hidden;
-	padding: 2px;
-	box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
-	z-index:200;
-}
-
-.inputCompletionDismissButton {
-	background: transparent;
-	color: silver;
-    border-radius: 1px;
-	padding: 0;
-	font: 8pt Lucida Sans Unicode,Lucida Grande,Verdana,Arial,Helvetica,Myriad,Tahoma,clean,sans-serif;  /* to override user agent stylesheet */
-	vertical-align: middle;
-	min-height: 16px;
-	min-width: 16px;
-}
-
-.inputCompletionLILeftTD {
-	height: 19px;
-}
-
-.inputCompletionLIRightTD {
-	width: 19px;
-	height: 19px;
-}
-
-.inputCompletionUL {
-	list-style : none;
-	margin: 0;
-	padding: 0;
-}
-
-.inputCompletionLISelected {
-	background : #ffeecc;/*#0080ff;*/
-}
-
-.inputCompletionLICategory {
-	font-weight: bold;
-}
-
-.inputCompletionLINormal {
-	background : white;
-}
-
-#tree {
-	margin-right: 9em;
-	overflow-x: hidden;
-}
-
-#treeButtons br {
-	line-height: 0.5em;
-}
-
-#treeButtons {
-	margin: 0;
-	padding: 0;
-	float: right;
-	width: 9em;
-}
-
-#treeButtons .contentButton {
-	width: 8.5em;
-	margin: 0;
-	margin-bottom: 3px;
-	font-size: 1em;
-}
-
-.testResult {
-	background-color: #444444 !important;
-	color: white;
-}
-
-/* TODO these "item" classes should be removed. Check for users. */
-.folderItem {
-	background: url(../images/folder.png);
-}
-.fileItem {
-	background: url(../images/file.png);
-}
-.newItem {
-	background: url(../images/addcontent.png);
-}
-
-.treetable {
-	border-collapse: collapse;
-	border-spacing: 0;
-	width:100%;
-}
-
-.miniNavTreeTable {
-	border-spacing: 0;
-	width:100%;
-	padding-left:4px;
-}
-
-.secondaryColumn {
-	color: #666666;	
-	padding-right: 8px;
-	padding-top: 8px;
-	vertical-align:top;
-}
-
-.secondaryColumnRight {
-	color: #666666;	
-	padding-right: 8px;
-	padding-top: 8px;
-	vertical-align:top;
-	text-align: right;
-}
-
-.secondaryColumnLeft {
-	color: #666666;	
-	padding-right: 8px;
-	padding-left: 8px;
-	padding-top: 8px;
-	vertical-align:top;
-	text-align: left;
-}
-
-.primaryColumn {
-	color: #3087B3;
-	text-decoration: none;
-	vertical-align:top;
-}
-
-.checkColumn {
-	padding: 0;
-}
-
-.testNavTreetable {
-	min-width: 150px;
-}
-
-.testResultTreetable {
-	min-width: 600px;
-}
-
-.selectionModelContainer {
-	outline: none;
-	-webkit-touch-callout: none;
-	-webkit-user-select: none;
-	-khtml-user-select: none;
-	-moz-user-select: -moz-none; /*-moz-none allows override in children*/
-	-ms-user-select: none;
-	user-select: none;
-}
-
-input {
-	-moz-user-select: text;
-	text-indent: 0;
-	text-shadow: none;
-	border: solid 1px #bbb;
-	color: #333;
-	font-size: 9pt;
-	padding: 2px;
-	margin-left: 5px;
-}
-
-.treeIterationCursor {
-	border-radius:4px;
-}
-
-.treeIterationCursorRow {
-	background-color: #f3f6fe;
-}
-
-.treeIterationCursorRow_Dotted {
-	background-color: #f3f6fe;
-}
-
-.searchCmdGroupMargin {
-	margin-left: 16px;
-	margin-top: 2px;
-}
-
-.LoginWindowLeft {
-	padding-left: 0.5em;
-}
-
-.LoginWindowRight {
-	padding-right: 0.5em;
-}
-
-.LoginWindowComment {
-	font-size: 0.9em;
-	padding-left: 15px;
-}
-
-#outline #switchOutlineMenu {
-	float: right;
-}
-
-#outline #switchOutlineMenu .commandImage {
-	display: none;
-}
-
-#outline>ul {
-	padding-left: 0 !important;
-	clear: both;
-	margin: 4px 0 0 8px;
-}
-
-#outline ul {
-	padding-left: 14px;
-}
-
-#outline li {
-	padding-bottom: 2px;
-	list-style-type: none;
-	white-space: nowrap; /*wrapping makes indented list hard to read*/
-}
-
-.uploadContainer{
-	padding:20px;
-	font-weight:bold;
-}
-
-.dottedOutline{
-	border: #DDD 4px dashed;
-	border-radius: 2px;
-	padding:50px;
-	height:300px;
-	width: 300px;
-}
-
-.floatingSection{
-	color: #DDD;
-}
-
-.uploadInstruction{
-	font-size: 18pt;
-	color: #CCC;
-	padding: 0 0 25px;
-	text-align:center;
-}
-
-.tipInstruction{
-	font-size: 12pt;
-	color: #CCC;
-	padding: 0 0 100px;
-	text-align:center;
-}
-
-.uploadOptions {
-	font-size: 14pt;
-	color: #BBB;
-	padding: 0 0 100px;
-	text-align: center;
-	vertical-align: middle;
-}
-
-.uploadOptionsItem {
-	font-size: 12pt;
-	color: #BBB;
-	text-align: center;
-	vertical-align: middle;
-	margin: 0 8px !important;
-}
-
-/* don't try to fight the poor styling and alignment of file inputs.  The browser will defeat you.  Just make it look like its own reasonable island */
-/* the real solution is to overlay a styled button on top.  http://stackoverflow.com/questions/572768/styling-an-input-type-file-button/9546968  */
-.uploadChooser{
-	vertical-align: middle;
-	margin-right: 24px;
-	margin-bottom: 4px;
-	border: 1px solid #dedede;
-    border-radius:1px;
-}
-
-.targetSelector{
-
-}
-
-#folderNameparameterCollector{
-	color:#333;
-}
-
-#urlparameterCollector{
-	color:#333;
-}
-
-
-.setting-control {
-	display: inline-block;
-	width: 130px;
-	padding: 4px;
-	margin: 5px;
-	background-color: white;
-	border: 1px solid #CCC;
-	border-radius: 3px;
-	font-size: 12px;
-	color: #222;
-}
-
-.local .setting-label {
-	width: 150px;
-	text-align: right;
-	display: inline-block;
-}
-
-.delegatedUI {
-	position: absolute; 
-	min-width: 250px;
-	min-height: 100px;
-	/* width, height may be overridden by the provider */
-	width: 600px;
-	height: 400px;
-	z-index: 150;
-	border: 1px inset;
-}
-
-/* FOR NAVIGATION DROP DOWN */
-
-.centralNavigation {
-	margin-bottom:2px;
-	cursor:pointer;
-}
-
-.centralNavigation:hover{
-	color: #F58B0F;
-}
-
-.navigationLabel{
-	color:#ddd;
-	cursor:pointer;
-	display: inline;
-	padding-right: 3px;
-}
-
-.groupedContentDivider{
-	float: left;
-	width: 1px;
-	height: 160px;
-	margin-top: 10px;
-	margin-bottom: 10px;
-	border-left: dashed 1px #ddd;
-}
-
-.navigationBreadcrumb{
-	font-family: sans-serif;
-	padding-bottom:5px;
-}
-
-.currentLocation{
-	margin-left:auto;
-	margin-right:auto;
-}
-
-.modifiedFileMarker{
-	color:#333;
-	padding-left:5px;
-}
-
-.noFile {
-	padding: 10px;
-	vertical-align: middle;
-}
-
-.icon-inline {
-	display: inline-block;
-	vertical-align: middle;
-	margin: 0 2px 0 2px;
-}
-
-.projectNavColumn {
-    color: #666;
-    font-weight: bold;
-}
-
-.projectPrimaryNavColumn {
-	color: #000;
-}
-
-.projectNavColumn a{
-	color: #555;
-    font-weight: bold;
-}
-
-.projectPrimaryNavColumn a{
-	color: #555;
-    font-weight: bold;
-}
-
-.projectInformationNode{
-
-}
-
-.sectionWrapper, .sectionTable{
-	text-align: left;
-	border-collapse: collapse;
-	border-spacing: 0;
-	padding: 0;
-	margin-top: 30px;
-	overflow-y: hidden; /* prevent vertical scrollbar from showing during expand/collapse */
-}
-
-.mainpane .sectionTable .treetable, .mainpane .sectionWrapper .treetable, .mainpane .sectionTable .treetable .actionsColumn{
-	min-width: inherit;
-}
-
-.fixedMinWidthText {
-	overflow: hidden;
-	text-overflow: ellipsis;
-	display: block;
-	max-width: 300px;
-}
-
-.sectionTable {
-	margin-top: 0;
-	margin-left: 6%;
-	margin-right: 6%;
-	border: 1px solid;
-	border-bottom-left-radius: 3px;
-	border-bottom-right-radius: 3px;
-	border-color:#dadada;
-	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.1);
-	-webkit-transition: all 0.5s ease;
-	transition: all 0.5s ease;
-	-webkit-transform-origin: top;
-	-ms-transform-origin: top;
-	transform-origin: top;
-}
-
-/* sectionTable preceeded by a sectionWrapper */
-.sectionWrapper+.sectionTable {
-	margin-top: 2px;
-	border-top: none;
-}
-
-.sectionTable:last-child {
-	margin-bottom: 20px;
-}
-
-.sectionTable.sectionClosed {
-	height: 0;
-	-webkit-transform: scaleY(0);
-	-ms-transform: scaleY(0);
-	transform: scaleY(0);
-}
-
-.sectionWrapper{
-	border: 1px solid;
-	margin-left: 5%;
-	margin-right: 5%;
-	background: none repeat scroll 0 0 #f4f4f4;
-	vertical-align: middle;
-	font-weight: bold;
-	padding: 6px;
-	color: gray;
-	margin-bottom: 0;
-	border-color: #dadada;
-	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);
-	transition: all 0.5s ease;
-}
-
-.sectionWrapper.sectionClosed {
-	box-shadow: none;
-	opacity: 0.9;
-	background: none;
-}
-
-.sectionWrapper.sectionClosed:hover {
-	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);
-	opacity: 1;
-	transition: all 0.3s;
-}
-
-.sectionTable td {
-	border-bottom: 1px solid #dadada;
-	vertical-align: middle;
-	color: gray;
-}
-
-.sectionTable tr:last-child td{
-	border-bottom: 0;
-}
-
-.sectionTable div.lightTreeTableRow:last-child, .sectionTable div.lightTreeTableRow:last-child{
-	border-bottom: 0;
-}
-
-.orionMarkdown {
-	padding: 8px;
-	color: gray;
-}
-
-.orionMarkdown img {
-	max-width: 100%;
-}
-
-.orionMarkdown pre, .orionMarkdown code {
-	background-color: #fafafa;
-	border: 1px solid #ddd;
-	border-radius: 3px;
-}
-
-.orionMarkdown pre {
-	padding: 6px 10px;
-	overflow: auto;
-}
-
-.orionMarkdown code {
-	padding: 0 5px;
-	margin: 0 2px;
-}
-
-.orionMarkdown pre code {
-	background-color: transparent;
-    padding: 0;
-	border: 0;
-	margin: 0;
-}
-
-.orionProject input, .orionProject textarea{
-	border: 1px solid lightgrey;
-}
-
-.orionProject .discreetInput {
-	border: 1px solid transparent; /* prevent movement on hover */
-	color: gray;
-	font: 8pt Lucida Sans Unicode,Lucida Grande,Verdana,Arial,Helvetica,Myriad,Tahoma,clean,sans-serif;
-	width: 90%;
-	margin-left: 0;
-	min-height: 15px;
-	background-color: inherit;
-}
-
-.orionProject .discreetInput:hover, .orionProject .discreetInput:focus {
-	border: 1px solid lightgrey;
-	color: black;
-	background-color: white;
-}
-
-.discreetInputLabel {
-	font-weight: bold;
-	padding: 8px;
-}
-
-.orionMarkdown h1 {
-	position: relative;
-}
-
-.sectionTreeTable {
-	border-spacing: 0;
-	width:100%;
-}
-
-.sectionTreeTable td {
-	border-bottom: none !important;
-}
-
-.sectionTreeTableHeader{
-	background: none !important;
-}
-
-.lightSectionTreeTableRow {
-	background-color: #FFFFFF;
-}
-
-.darkSectionTreeTableRow {
-	background-color: #f5f7f9;
-}
+@import "./pages.css";
+@import "./controls.css";
 
-.lightTreeTableRow, .darkTreeTableRow {
-	border-bottom: 1px solid #dadada;
-}
diff --git a/bundles/org.eclipse.orion.client.ui/web/css/pages.css b/bundles/org.eclipse.orion.client.ui/web/css/pages.css
new file mode 100644
index 0000000..530d659
--- /dev/null
+++ b/bundles/org.eclipse.orion.client.ui/web/css/pages.css
@@ -0,0 +1,58 @@
+/*

+ * Provide document level styles. All the Orion specific styles should live in controls.css

+*/

+html {

+  cursor: default;

+  height: 100%;

+}

+

+html, body {

+	margin: 0;

+	padding: 0;

+	font: 9pt Arial,Helvetica,Myriad,Tahoma,clean,sans-serif, Lucida Sans Unicode,Lucida Grande,Verdana; 

+	min-width:700px;

+} 

+

+h1 {

+	font-size:1.5em;

+	font-weight: bold;

+	color: #6d6d6d;

+	line-height: 36px;

+	position:absolute;

+	top:0;

+	bottom:0;

+	margin:auto;

+}

+

+h2 {

+	font-size: 1.1em;

+	font-weight: bold;

+	color: #6d6d6d;

+	margin-top: 4px;

+	margin-bottom: 4px;

+}

+

+/** remove unwanted borders on img in IE **/

+img {

+	border: 0;

+}

+

+/**

+ * Remove unwanted button padding in Firefox

+ */ 

+button::-moz-focus-inner {

+    border: 0;

+    padding: 0;

+}

+

+input {

+	-moz-user-select: text;

+	text-indent: 0;

+	text-shadow: none;

+	border: solid 1px #bbb;

+	color: #333;

+	font-size: 9pt;

+	padding: 2px;

+	margin-left: 5px;

+}

+