a {
  color: #3030a0;
}
.sourcecode {
  width:280px;
  height:200px;
  margin-left:10px;
  font-size:12px;
  background-color:#e0e0e0;
  font-family: Consolas, monospace;
}

.sourcebutton {
  margin:4px;
  vertical-align:top;
}

h2 {
  padding-left:14px;
}

.app-panels > * {
  width: 320px;
  background-color: #eaeaea;
  box-shadow: -4px -4px 4px rgba(0,0,0,0.3);
}

.menu-button {
  clear:none;
  float:left;
  margin:10px !important;
  width:150px;
}

.rowline {
  width:200px;
  color:black;
}

@media all and (max-width: 600px) {
  .app-panels > * {
    min-width: 100%;
    max-width: 100%;
  }
}

.onyx-sample-tools {
  padding-bottom:10px;
}
.onyx-sample-tools > * {
  margin: 3px;
}

.r2ui-terminal {
  color: black;
  editable: false;
}

.r2ui-label {
  color:black;
}

.r2ui-input {
color: black;
  margin-top:8px;
  background-color: #909090;
  width: 90%;
  display: inline-block;
}

/* TODO: :hover change mouse pointer */
.moreless:hover {
  background-color:#d0d0d0;
  cursor:pointer;
}

.moreless {
  background-color:#a0a0a0;
  width:90%;
  height:24px;
  padding-left:10px;
  border:0px;
}

.r2panel {
  color: black !important;
  background-color:#b0b0b0;
/*  padding-left:8px; */
}

.colorbar {
 padding: 0px;
 border-spacing:0px;
 spacing: 0px;
 border: 0px;
 height: 16px;
 background-color: black;
 width: 380px; 
 max-width:100%;
 margin:0px;
}

.colorbar_item {
  max-width:100%;
  width:100%;
  border:0px;
  spacing:0px;
  padding:0px;
}
.topbox {
  position:absolute;
  left: 70px;
  padding:0px;
  margin:0px;
  top:0px;
  display:inline;
}

.top {
  display:inline-block;
  position:relative;
vertical-align:top;
  padding:10px;
  margin:1px;
margin-top:0px;
}

pre {
  font-size:13px; 
}