style.css

body {
  margin: 0px;
}

#top-bar {
  border-top: solid 1px #e5e5e5;
  border-bottom: solid 1px #e5e5e5;
  background-color: #f5f5f5;
  min-height: 50px;
  max-height: 50px;
  margin-bottom: 20px;
}

#top-bar .btn {
  outline: none;
}

#create-button {
  position: absolute;
  left: 10px;
  top: 10px;
  display: inline-block;
}

#right-buttons {
  position: absolute;
  right: 10px;
  top: 10px;
  display: inline-block;
}

#main-view {
  position: relative;
}

#editor-placeholder {
  border-left: solid 1px #eee;
  background-color: white;
  border-top: solid 1px #eee;
  border-bottom: solid 1px #eee;
}

#editor-placeholder div {
  text-align: center;
  vertical-align: middle;
  font-size: 30px;
  color: #ddd;
}

#editor-pane, #editor-placeholder {
  position: absolute;
  top: 0px;
  left: 205px;
}

#editor {
  border-top: solid 1px #eee;
  border-left: solid 1px #eee;
  border-bottom: solid 1px #eee;
}

#editor-image {
  border-top: solid 1px #eee;
  border-left: solid 1px #eee;
  border-bottom: solid 1px #eee;
  position: absolute;
  background-color: white;
}

#edited-image {
  position: absolute;
}

#run-button {
  margin-left: 10px;
}

.close-buffer-button {
  display: inline-block;
  padding: 5px;
  font-size: 15px;
  color: black;
  opacity: 0.4;
}

.close-buffer-button:hover {
  opacity: 1.0;
}

#bottom-line-nav-tabs {
  position: absolute;
  top: 31px;
  height: 1px;
  width: 100%;
  background-color: #eee;
  z-index: 10;
}

#tabs {
  position: absolute;
  top: 0px;
  height: 0px;
  z-index: 100;
  width: auto;
  max-height: 33px;
  min-height: 33px;
  margin-bottom: 0px;
  overflow: hidden;
  border-bottom: none;
}

.nav-tabs li.active a {
  border-bottom: solid 1px white;
}

.nav-tabs li a {
  padding-top: 0px;
  padding-bottom: 0px;
  /*font-weight: bold;*/
  font-size: 13px;
  color: #777;
}

.nav-tabs li.active a {
  color: #333;
}

#files-listview-container {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 200px;
}

#files-listview {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 200px;
  outline: none;
}

#files-listview-actions {
  border-top: solid 1px #eee;
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 200px;
  padding: 5px;
}

.file-item {
  padding-left: 20px;
  font-size: 13px;
  line-height: 25px;
  vertical-align: middle;
}

.file-item .caret {
  margin-top: 10px;
  opacity: 0.0;
}

.file-item:hover .caret {
  opacity: 1.0;
}

.file-item img {
  float: left;
  margin-top: 4px;
  margin-right: 3px;  
}

.file-item div {
  float: right;
}

.file-item div a {
  padding-top: 10px;
  padding-left: 5px;
  padding-right: 5px;  
}

.file-item-text {
  display: inline-block;
  max-width: 143px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#project-selector {
 position: absolute;
 left: 20px;
 top: 7px;
 display: inline-block;
 max-width: 180px;
 font-size: 14px;
}

#project-selector #main-project-button {
  border: none;
  -webkit-box-shadow: none;
  outline: none;
  text-decoration: none;
  width: 180px;
  display: inline-block;
}

#project-selector a #project-name {
  color: #333;
}

#project-selector a:hover #project-name {
  color: #888;
}

#project-selector a:hover .caret {
  border-top: 4px solid #888;
}

#project-selector a .caret {
  position: relative;
  margin-top: 8px;
}

#project-name {
  font-weight: bold;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
  max-width: 160px;
  display: inline-block;
}

.menu-checkmark:before {
  display: inline-block;
  position: relative;
  font-size: 14px;
  margin-left: -20px;
  padding-right: 5px;
  top: 4px;
  width: 16px;
  height: 16px;
  content: url(img/check.png);
}

#new-project-name {
  width: 400px;
}

#new-file-name {
  width: 400px;
}

#create-button .btn {
  background-color: #dd4b39;
  background-image: none;
  border-radius: 2px;
  border: solid 1px #da4638;
  font-size: 11px;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  height: 22px;
}

#run-button {
  background-color: #4d90fe;
  background-image: none;
  border-radius: 2px;
  border: solid 1px #3076e7;
  font-size: 11px;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  height: 32px;
}

#export-button {
  background-color: #f1f1f1;
  background-image: none;
  border-radius: 2px;
  border: solid 1px #c9c9c9;
  font-size: 11px;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  height: 32px;
}

.dropdown-menu {
  border-radius: 2px;
  border: solid 1px #cbcbcb;
  padding-top: 20px;
  padding-bottom: 10px;
}

.dropdown-menu li {
  height: 40px;
}

.dropdown-menu li a {
  padding-left: 30px;
  padding-right: 30px;
}

.dropdown-menu li a:hover {
  color: black;
  background-image: none;
  background-color: #eee;
}

.CodeMirror-selected { background: #d9d9d9; }
.CodeMirror-focused .CodeMirror-selected { background: #ccc; }

.modal-backdrop {
  background-color: white;
}