html {
/*  overflow: scroll;
  overflow-x: visible;
  overflow-y: visible;*/  
  max-width:99%;
  max-height:99%;
  overflow: auto;
  /* this will hide the scrollbar in mozilla based browsers */
  overflow: -moz-scrollbars-none;
  /* this will hide the scrollbar in internet explorers */
  -ms-overflow-style: none;
}

/* this will hide the scrollbar in webkit based browsers - safari, chrome, etc */
ul::-webkit-scrollbar { 
  width: 0 !important;
  display: none; 
}

body {
  margin: 0;
  padding: 0;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 300;
}

::-webkit-scrollbar {
  width: 0px; /* remove scrollbar space */
  background: transparent; /* optional: just make scrollbar invisible */
}
/* optional: show position indicator in red */
::-webkit-scrollbar-thumb {
  background: #FF0000;
}


#menuBar {
  width: 100%;
  height: 40px;
  background-color: #e0e0e0;
  border: 1px solid gray;
  
}

#logo {
  padding: 5px 0 0 20px;
  font-size: 120%;
  float: left;
}

#buttonDiv {
  float: right;
  padding: 5px 10px 0 0;
}

#runButton {
  font-size: 120%;
}

#toggles {
  width: 208px;
  height: 27px;
  margin: 0 auto;
  list-style: none;
  border: 1px solid gray;
  border-radius: 3px;
  padding:0;
  position:relative;
  top:5px;
}

#toggles li {
  float: left;
  border-right:1px solid grey;
  padding:5px 7px;

}
#toggles li.results {
  border-right:0 solid gray;
}

.clear {
  clear: both;
}

.codeContainer {
  height: 100%;
  width:50%;
  overflow: hidden;
  margin:0;
  padding:0;
  float: left;
  position:relative;
  box-sizing:border-box;
  border-right:1px solid white;
}
.codeContainer textarea {
  width:100%;
  height:100%;
  border:none;
  font-family:monospace;
  font-size:90%;
  box-sizing:border-box;
  padding:5px;
}
.codeLabel {
  position:absolute;
  right:10px;
  top:10px;
  border:1px solid #ddd;
  border-radius: 4px;
  padding:3px;
  background-color:#ececec;
  color:#aaa;
}
#CSSContainer,
#JSContainer {
  display:none;
}
#ResultsContainer {
  height:100%;
  width:50%;
}
#ResultsContainer iframe {
  height:100%;
  width:100%;
  /* margin:0; */
  padding:3px;
  position: relative;
  margin-left: -10px;
  border: none;

}
.selected {
  background-color: #aaa;
  color:#eee;
}
#HTMLContainer textarea,
#JSContainer textarea,
#CSSContainer textarea { 
  background-color:rgba(0,0,0,1.0);
  color:#efefef;
}
#ResultsContainer iframe { background-color:rgba(255,255,255,1.0);}
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}