/* Copyright (c) 2017, Xuan Linh Do & Finn Ole Koenecke */

/* This file is part of Interneural. */

/* Interneural is free software: you can redistribute it and/or modify */
/* it under the terms of the GNU General Public License as published by */
/* the Free Software Foundation, either version 3 of the License, or */
/* (at your option) any later version. */

/* Interneural is distributed in the hope that it will be useful, */
/* but WITHOUT ANY WARRANTY; without even the implied warranty of */
/* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the */
/* GNU General Public License for more details. */

/* You should have received a copy of the GNU General Public License */
/* along with Interneural.  If not, see <https://www.gnu.org/licenses/>. */

body {
  font-family: Verdana, 'Lucida Sans Unicode', sans-serif;
  text-decoration: none;
}

.chart div {
  font: 10px sans-serif;
  background-color: steelblue;
  text-align: right;
  padding: 3px;
  margin: 1px;
  color: white;
}

div {
  float: left;
}

.force_center {
  display: none;
}

.layer {
  float: left;
  clear: both;
}

#graph-config {
  width: 50%;
}

.header {
  background-color: #3077ab;
  border: none;
  color: white;
  padding: 10px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  width: 200px;
  float: left;
  clear: both;
}

.good-button {
  background-color: #42ab6c;
  border: none;
  color: white;
  padding: 10px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  width: 100%;
  float: left;
  clear: both;
  z-index: 0; /*button should be behind the list content (e.g. activation function)*/
  position:relative;
}
.good-button:hover {
  background-color: #98df8a;
}

.bad-button, .bad-button-big, .bad-button-small{
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  width: 100%;
  float: left;
  clear: both;
}

.bad-button-big{
  padding: 10px 32px;
}

.bad-button-small{
  height: 26px;
  display: inline-block;
  vertical-align: middle;
  line-height: 26px;
}


.iteration-slider {
  width: 100%;
}

#sidebar {
  width: 400px;
  float: left;
}

#sidebar-right {
  width: 200px;
  float: right;
}

#network-info {
  width: 200px;
  height: 150px;
}

.info-text {
  font-size: 14px;
  float: left;
  width: 200px;
}

.info-number {
  float: right;
  text-align: right;
}

#rgbOutputPreviewContainer{
  width: 90%;
  padding: 0% 5%;
  font-size: 14px;
}

.prevPosInput{
  width: 70%;
  font-size: 14px;
}

.prevPosLabel{
  width: 25%;
  text-align: right;
  font-size: 14px;
}

.posPrevContainer{
  margin: 0px 1px;
  width: 48%;
}

#rLabelValue, #gLabelValue, #bLabelValue{
  width: 22%;
  text-align: left;
}