canvas {
  border: 0px; }

html {
  background: #E2DA99; }

body {
  font-family: 'Roboto', sans-serif; }

#layers, #layers li ul {
  list-style: none;
  display: block;
  padding: 0;
  margin: 0;
  width: 100%; }

.layertype {
  color: #FFFFFF;
  background: #342800;
  border-bottom: 1px solid #2B2301;
  list-style: none;
  padding-left: 0em;
  text-indent: 0.4em;
  width: 100%; }

.activeOptionsPanel {
  display: initial;
  visibility: visible; }

.inactiveOptionsPanel {
  display: none;
  visibility: hidden; }

.activeLayer, .inactiveLayer {
  color: #342800;
  background: #73AFB6;
  display: block;
  visibility: visible;
  list-style: none;
  padding-left: 0em;
  text-indent: 2.1em;
  width: 100%; }

.activeLayer {
  color: #E2DA99; }

.inactiveLayer:hover {
  background: #5E9CA0;
  color: #2B2301; }

#layerOptions {
  background: #FFFFFF;
  color: #342800;
  padding: 4px;
  border-radius: 5px; }

.aligninput, .alignlabel {
  display: inline-block; }

.alignlabel {
  width: 75px; }

body {
  width: 90%;
  margin: 1em auto;
  font-size: 75%;
  line-height: 1.3rem;
  font-family: sans-serif;
  position: relative;
  *zoom: 1; }

#glcanvaswrap {
  resize: both;
  background: #00FF00;
  overflow: auto; }

body:before, body:after {
  content: ""; }

body:after {
  clear: both; }

p {
  margin-bottom: 1.3rem; }

.togglelabel {
  left: 0;
  width: 100%;
  padding: .25rem .65rem .25rem .65rem;
  box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), inset -1px -1px rgba(0, 0, 0, 0.1); }

.togglelabel:hover {
  background: rgba(0, 0, 0, 0.5); }

[for="read_more"] {
  clear: both; }

[for="read_more"] span:first-of-type {
  display: inline;
  visibility: visible; }

[for="read_more"] span:last-of-type {
  display: none;
  visibility: hidden; }

#read_more {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  visibility: hidden; }

#local_controlpanel {
  display: none;
  visibility: hidden; }

input[type=checkbox]:checked ~ [for="read_more"] span:first-of-type {
  display: none;
  visibility: hidden; }

input[type=checkbox]:checked ~ #controlpanel {
  display: none;
  visibility: hidden; }

input[type=checkbox]:checked ~ [for="read_more"] span:last-of-type {
  display: inline;
  visibility: visible; }

input[type=checkbox]:checked ~ #local_controlpanel {
  display: inline;
  visibility: visible; }

.video {
  height: 16px;
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0; }

.video img {
  height: 16px;
  border: 0;
  margin: 0; }

#videoBarWrap {
  float: left;
  width: 424px;
  height: 16px;
  padding: 0px 0px 0px 0px; }

#videoBar {
  background: #c2c2c2;
  width: 424px;
  border: 10 px;
  height: 8px;
  border-radius: 10px;
  position: absolute;
  margin: 4px 0px 4px 0px; }

#videoIndicator {
  background: #0000FF;
  width: 2px;
  margin: 2px 0px 2px 0px;
  height: 12px;
  border-radius: 1px;
  position: relative;
  display: inline-block;
  padding: 0;
  border: 0; }

#videoPlayButton, #videoStart, #videoEnd, #videoNext, #videoPrevious {
  float: left;
  margin: 0;
  padding: 0;
  border: 0;
  height: 16px;
  padding-left: 1px;
  padding-right: 1px; }

[data-tips] {
  position: relative;
  text-decoration: none; }

[data-tips]:after,
[data-tips]:before {
  position: absolute;
  z-index: 100;
  opacity: 0; }

[data-tips]:after {
  content: attr(data-tips);
  height: 25px;
  line-height: 25px;
  padding: 0 10px;
  font-size: 12px;
  text-align: center;
  color: #fff;
  background: #222;
  border-radius: 5px;
  text-shadow: 0 0 5px #000;
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  white-space: nowrap;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

[data-tips]:before {
  content: "";
  width: 0;
  height: 0;
  border-width: 0px;
  border-style: solid; }

[data-tips]:hover:after,
[data-tips]:hover:before {
  opacity: 1; }

/* Top tips */
[data-tips].top-tip:after,
[data-tips].top-tip:before {
  -webkit-transition: bottom 0.25s ease-in-out, opacity 0.25s ease-in-out;
  -moz-transition: bottom 0.25s ease-in-out, opacity 0.25s ease-in-out;
  transition: bottom 0.25s ease-in-out, opacity 0.25s ease-in-out;
  bottom: 90%;
  left: -9999px;
  margin-bottom: 12px; }

[data-tips].top-tip:before {
  border-color: #222 transparent transparent transparent;
  margin-bottom: 0; }

[data-tips].top-tip:hover:after,
[data-tips].top-tip:hover:before {
  bottom: 100%;
  left: 0; }

[data-tips].top-tip:hover:before {
  left: 15px; }

/* Bottom tip */
[data-tips].bottom-tip:after,
[data-tips].bottom-tip:before {
  -webkit-transition: top 0.25s ease-in-out, opacity 0.25s ease-in-out;
  -moz-transition: top 0.25s ease-in-out, opacity 0.25s ease-in-out;
  transition: top 0.25s ease-in-out, opacity 0.25s ease-in-out;
  top: 90%;
  left: -9999px;
  margin-top: 12px; }

[data-tips].bottom-tip:before {
  border-color: transparent transparent #222 transparent;
  margin-top: 0; }

[data-tips].bottom-tip:hover:after,
[data-tips].bottom-tip:hover:before {
  top: 100%;
  left: 0; }

[data-tips].bottom-tip:hover:before {
  left: 15px;
  font-size: small; }

/* Right tip */
[data-tips].right-tip:after,
[data-tips].right-tip:before {
  -webkit-transition: left 0.25s ease-in-out, opacity 0.25s ease-in-out;
  -moz-transition: left 0.25s ease-in-out, opacity 0.25s ease-in-out;
  transition: left 0.25s ease-in-out, opacity 0.25s ease-in-out;
  top: -9999px;
  left: 96%;
  margin-left: 12px; }

[data-tips].right-tip:before {
  border-color: transparent #222 transparent transparent;
  margin-left: 0; }

[data-tips].right-tip:hover:after,
[data-tips].right-tip:hover:before {
  left: 100%;
  top: 0; }

[data-tips].right-tip:hover:before {
  top: 7px; }

/* Left tip */
[data-tips].left-tip:after,
[data-tips].left-tip:before {
  -webkit-transition: right 0.25s ease-in-out, opacity 0.25s ease-in-out;
  -moz-transition: right 0.25s ease-in-out, opacity 0.25s ease-in-out;
  transition: right 0.25s ease-in-out, opacity 0.25s ease-in-out;
  top: -9999px;
  right: 96%;
  margin-right: 12px; }

[data-tips].left-tip:before {
  border-color: transparent transparent transparent #222;
  margin-right: 0; }

[data-tips].left-tip:hover:after,
[data-tips].left-tip:hover:before {
  right: 100%;
  top: 0; }

[data-tips].left-tip:hover:before {
  top: 7px; }

.tab-area {
  width: 340px;
  float: left; }

.tabinput {
  display: none; }

.tab-link {
  font-size: 10px;
  font-family: arial;
  cursor: pointer;
  color: #385446;
  font-weight: bold;
  text-decoration: none;
  display: block;
  float: left;
  width: 55px;
  padding: 3px 0;
  margin: 0px 2px 0px 0px;
  text-align: center;
  background: #73AFB6;
  border: 1px solid #bbb;
  border-radius: 8px 16px 0px 0px;
  border-left: 0;
  border-bottom: 0; }

.tab-link:hover {
  background: #5E9CA0; }

.tab-link:nth-of-type(1) {
  border-left: 1px solid #bbb; }

.tab {
  clear: both;
  background: #FFFFFF;
  padding: 4px 4px;
  border-radius: 5px;
  display: none;
  min-height: 180px;
  width: 340px; }

.target-fix {
  display: block;
  top: 0;
  left: 0;
  position: fixed; }

#tab-C:checked ~ label:nth-of-type(3),
#tab-B:checked ~ label:nth-of-type(2),
#tab-B:not(:checked) ~ #tab-C:not(:checked) ~ label:nth-of-type(1) {
  background: #73AFB6;
  color: #E2DA99; }

#tab-C:checked ~ label:nth-of-type(3):after,
#tab-B:checked ~ label:nth-of-type(2):after,
#tab-B:not(:checked) ~ #tab-C:not(:checked) ~ label:nth-of-type(1):after {
  position: absolute;
  content: "";
  margin: 5px 0 0 0;
  width: 55px;
  height: 0px;
  display: block;
  background: #73AFB6; }

/* Checked Tabs */
.tabs-checked input:nth-of-type(2):not(:checked) ~ input:nth-of-type(3):not(:checked) ~ .tab:nth-of-type(1),
.tabs-checked input:nth-of-type(2):checked ~ .tab:nth-of-type(2),
.tabs-checked input:nth-of-type(3):checked ~ .tab:nth-of-type(3) {
  display: block; }

/*# sourceMappingURL=webgl.css.map */