html {
  font-size: 10px;
}

@media only screen and (min-height: 1200px) {
  html {
    font-size: 12px;  
  }
}

@media only screen and (min-height: 1500px) {
  html {
    font-size: 14px;
  }
}

/* Remove default bullets */
ul, #myUL {
  list-style-type: none;
}

hr {
	border-color: #555555;
}

a {
	cursor: pointer;
}

/* Remove margins and padding from the parent ul */
.vntree {
  margin: 0;
  padding: 0;
}

/* Style the caret/arrow */
.caret {
  cursor: pointer; 
  /*user-select: none; */
  color: #cccccc;
  z-index: 10;
}

/* Create the caret/arrow with a unicode, and style it */
.caret::before {
  content: "\25B6";
  color: #cccccc;
  display: inline-block;
  margin-right: 0.6rem;
}

/* Rotate the caret/arrow icon when clicked on (using JavaScript) */
.caret-down::before {
  transform: rotate(90deg); 
}

/* Hide the nested list */
.nested {
  display: none;
}

/* Show the nested list when the user clicks on the caret/arrow (with JavaScript) */
.active {
  display: block;
}

.ulTitle {
	padding-left: 2rem;
}

.pageStart {
	padding-top: 2rem;
}

.splitleft {
  height: 100%;
  width: 70%;
  float: left;
  display: none;
}

.splitleft.active {
  height: 100%;
  width: 70%;
  float: left;
  display: block;
}

.splitright {
  height: 100%;
  width: 30%;
  float: left;
}

.mainpagelink {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 2rem;
  
}

.stats {
  display: none;
}

.stats.active {
  display:block;
}

body {
  background-color: #071523;
  height: auto !important;
  min-height: 100%;    
  box-sizing: border-box;
  overflow: visible;
  font-size: 1.6rem;
}

a {
  color: #65BBDD;
}

span {
  color: #bbbbbb;
}

.title {
    text-align: center;
    color: #dddddd;
    margin-bottom: 0.1rem;
	cursor:pointer;
}
.title a {
	color: inherit;
	text-decoration: inherit;
}

.subtitle {
    text-align: center;
    color: #dddddd;
    margin-bottom: 2rem;
}

.loading {
  text-align: left;
  color: #bbbbbb;
  margin-left: 5rem;
  margin-top: 2rem;
  animation-name: loading-anim;
  animation-duration: 4s;
  animation-iteration-count: infinite;
}

@keyframes loading-anim {
  0% {color: #333333;}
  25% {color: #bbbbbb;}
  50% {color: #333333;}
  75% {color: #bbbbbb;}
  100% {color: #333333;}
}

/* Style the tab */
.tab {
  overflow: hidden;
  border: 0.1rem solid #555555;
  background-color: #071523;
}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 1.4rem 1.6rem;
  transition: 0.3s;
  font-size: 1.7rem;
  color: #cccccc;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #1B4C7C;
  color: #cccccc;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #2667A8;
  color: #cccccc;
}

.tab button:disabled {
  pointer-events: none;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 0.6rem 1.2rem;
  border: 0.1rem solid #ccc;
  border-top: none;
}

.overlaytag {
	position: relative;
	left: 0%;
	padding-top: 0.5rem;
	top: 120%;
	color: gold;
	font-size: 1rem;
}

#contentSearchInput {
  display: block;
  float: left;
  margin-left: 2rem;
  margin-bottom: 0.5rem;
  background-color: #071523;
  color: #cccccc;
  border: 0.1rem solid #1B4C7C;
  
}
#searchInput {
  display: block;
  float: left;
  margin-top: 1rem;
  margin-left: 2rem;
  margin-bottom: 0.5rem;
  background-color: #071523;
  color: #cccccc;
  border: 0.1rem solid #1B4C7C;
  
}
#source {
  float: left;
  margin-top: 1rem;
  margin-left: 1rem;
  margin-right: 1rem;
}

.yearSelect {
  float: left;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  margin-right: 0.5rem;
}

#oldRedditCheckbox {
  float: left;
  margin-top: 1.3rem;
  margin-left: 1.5rem;
}

.checkboxcontent {
  float: left;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  margin-left: 0.2rem;
  text-align: center;
}

#searchContentTitle {
	display: block;
	font-size: large;
	color: #cccccc;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}
.reviewSearchButton{
  float: left;
  background-color: #071523;
  border: 0.1rem solid #1B4C7C;
  color: #cccccc;
  margin-top: -0.1rem;
  margin-left: 1rem;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.4rem;
}

.gold-highlight {
  color: #ceb763;
}

.standard-text {
  color: #bbbbbb;
}

.reportButton {
  color: darkred;
  cursor: pointer;
  margin-left: 0.5rem;
}

/* for update notices */
.updates{
  color: #1B4C7C;
}

.update-title {
  border-bottom: 0.1rem solid #65BBDD;
  display: block;
  padding: 0.5rem 0.5rem 0.5rem 0.5rem;
  color: #65BBDD;
}

.update-content {
  display: block;
  color: #bbbbbb;
  padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}

.update-entry{
  border: 0.1rem solid #1B4C7C;
  margin-right: 1rem;
  margin-bottom: 2rem;
}

/* Statistics*/

.dataTables_wrapper {
    height: auto !important;
    min-height: 100%;
    box-sizing: border-box;        
}

.dataTables_wrapper:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0;
    width: 0;    
}

#table-column {
  max-width: 20%;
}
table.dataTable thead th {
  color: #bbbbbb;
}

table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
  background-color:#071523;
  color: #bbbbbb;
}

table.dataTable.stripe tbody tr.even, table.dataTable.display tbody tr.even {
  background-color:#091B2C;
  color: #bbbbbb;
}

table.dataTable.display tbody tr.odd>.sorting_1, table.dataTable.order-column.stripe tbody tr.odd>.sorting_1 {
  background-color:#071523;
  color: #bbbbbb;
}

table.dataTable.display tbody tr.even>.sorting_1, table.dataTable.order-column.stripe tbody tr.even>.sorting_1 {
  background-color:#091B2C;
  color: #bbbbbb;
}

table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
  background-color:#071523;
  color: #bbbbbb;
}

table.dataTable.stripe tbody tr.even, table.dataTable.display tbody tr.even {
  background-color:#091B2C;
  color: #bbbbbb;
}

table.dataTable thead th, table.dataTable tfoot th {
  color: #65BBDD;
}

.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate {
  color: #bbbbbb;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #cccccc !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    color: #888888 !important;
}

table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
    border-top: 0px solid #1B4C7C;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #cccccc !important;
    border: 0px solid #1B4C7C;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #dcdcdc));
    background: -webkit-linear-gradient(top, #2667A8 0%, #dcdcdc 100%);
    background: -moz-linear-gradient(top, #2667A8 0%, #dcdcdc 100%);
    background: -ms-linear-gradient(top, #2667A8 0%, #dcdcdc 100%);
    background: -o-linear-gradient(top, #2667A8 0%, #dcdcdc 100%);
    background: linear-gradient(to bottom, #2667A8 0%, #dcdcdc 100%);
    background-image: linear-gradient(#2667A8 0%, #1B4C7C 100%);
    background-position-x: initial;
    background-position-y: initial;
    background-size: initial;
    background-repeat-x: initial;
    background-repeat-y: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: #2667A8;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current {
    border: 0px solid #1B4C7C;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button {
    border: 0px solid #1B4C7C;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: #cccccc !important;
    border: 0px solid #1B4C7C;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #dcdcdc));
    background: -webkit-linear-gradient(top, #2667A8 0%, #dcdcdc 100%);
    background: -moz-linear-gradient(top, #2667A8 0%, #dcdcdc 100%);
    background: -ms-linear-gradient(top, #2667A8 0%, #dcdcdc 100%);
    background: -o-linear-gradient(top, #2667A8 0%, #dcdcdc 100%);
    background: linear-gradient(to bottom, #2667A8 0%, #dcdcdc 100%);
    background-image: linear-gradient(#1B4C7C 0%, #071523 100%);
    background-position-x: initial;
    background-position-y: initial;
    background-size: initial;
    background-repeat-x: initial;
    background-repeat-y: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: #071523;
}

table.dataTable thead .sorting {
    background-image: url(../images/sort_both.png);
}

table.dataTable thead .sorting_asc {
    background-image: url(../images/sort_asc.png);
}

table.dataTable thead .sorting_desc {
    background-image: url(../images/sort_desc.png);
}

table.dataTable th.dt-left, table.dataTable td.dt-left {
    text-align: left; 
}

th {
    text-align: left
}

select {
    -webkit-appearance: menulist;
    box-sizing: border-box;
    align-items: center;
    white-space: pre;
    -webkit-rtl-ordering: logical;
    color: #bbbbbb;
    background-color: #071523;
    cursor: default;
    border-width: 0.1rem;
    border-style: solid;
    border-color: #1B4C7C;
    border-image: initial;
}

input[type='search']{
    -webkit-appearance: textfield;
    background-color: #071523;
    color: #bbbbbb;
    -webkit-rtl-ordering: logical;
    cursor: text;
    padding: 0.1rem;
    border-width: 0.1rem;
    border-style: solid;
    border-color: #1B4C7C;
    border-image: initial;
}

.leftindent {
  margin-left: 2rem;
}
#sortNames ,#sortDates{
  margin-bottom: -0.3rem;
}





/* ----- Recommendation styles ----- */

.imgbox {
  display: grid;
  height: 100%;
  min-width: 128rem;
  min-height: 72rem;
  position: relative;
  text-align: left;
  color: white;
}
.centeredimage {
  max-width: 100%;
  max-height: 100vh;
  min-width: 128rem;
  min-height: 72rem;
  height:auto;
  margin: auto;
}
.reddittoggle {
  position: absolute;
  padding: 2rem;
  top: 0%;
  left: 50%;
  transform: translateX(-24rem);
  width: 20rem;
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  text-align: center;
}
.reddittoggle:hover {
  background-color: rgba(101,187,209,1.0);
}
.toggletext{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  text-align: center;
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 2.5rem;
  white-space: nowrap;
  user-select: none;
}
.vndbtoggle {
  position: absolute;
  padding: 2rem;
  top: 0%;
  left: 50%;
  width: 20rem;
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  text-align: center;
}
.vndbtoggle:hover {
  background-color: rgba(101,187,209,1.0);
}
.toggled {
  background-color: rgba(101,187,209,0.7);
}
.speakerfield {
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translateX(-38rem);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 3.5rem;
  user-select: none;
}
.vntext {
  position: absolute;
  top: 78%;
  left: 50%;
  transform: translateX(-38rem);
  width: 100rem;
  z-index: 10;
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 3.3rem;
  user-select: none;
}
.vnchoiceinput{
  position: absolute;
  line-height: 3.2rem;
  font-size: 2.5rem;
  top: 23%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 38rem;
  border-color: blue;
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
}
.vnchoicetext{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  text-align: center;
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 3.6rem;
  white-space: nowrap;
  user-select: none;
}
.vndbfield{
  background-color: rgba(0,19,127,0.7);
  border-radius: 1rem;
  position: absolute;
  left: 50%;
  top: 30%;
  transform: translateX(-50%);
  width: 50rem;
  height: 10%;
}
.vndbfield:hover {
  background-color: rgba(0,255,255,0.7);
}
.vndbfield2{
  background-color: rgba(0,19,127,0.7);
  border-radius: 1rem;
  position: absolute;
  left: 50%;
  top: 45%;
  transform: translateX(-50%);
  width: 50rem;
  height: 10%;
}
.vndbfield2:hover {
  background-color: rgba(0,255,255,0.7);
}

.vndbfield3 {
  background-color: rgba(0,19,127,0.7);
  border-radius: 1rem;
  position: absolute;
  left: 50%;
  top: 57%;
  transform: translateX(-50%);
  width: 38rem;
  height: 10%;
  color: white;
  white-space: nowrap;
}

.vndbfield3 input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}
.vndbfield3 input:checked ~ .checkmark {
  background-color: #2196F3;
}

#english-checkbox-content{
  position: absolute;
  left: 15%;
  top: 30%;
  width: 3rem;
  height: 3rem;
  background-color: rgba(0,19,127,1);
  border: 0.1rem solid rgba(0,255,255,1);
  border-radius: 0.2rem;
  cursor:pointer;
}
/* Create the checkmark/indicator (hidden when not checked) */
#english-checkbox-content:after {
  content: "";
  position: absolute;
  display: none;
}
/* Show the checkmark when checked */
.vndbfield3 input:checked ~ #english-checkbox-content:after {
  display: block;
}
/* Style the checkmark/indicator */
.vndbfield3 #english-checkbox-content:after {
  left: 0.9rem;
  top: 0.1rem;
  width: 30%;
  height: 60%;
  border: solid white;
  border-width: 0 0.3rem 0.3rem 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


#english-checkbox-content-text {
  position: absolute;
  left: 30%;
  top: 32%;
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 2.1rem;
  user-select: none;
}

.freetitletext-left {
  position: absolute;
  padding: 2rem;
  border-radius: 1rem;
  top: 5rem;
  left: 50%;
  width: 10rem;
  transform: translateX(-48rem);
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 3rem;
  text-align: center;
  user-select: none;
}
.freetitletext-mid {
  position: absolute;
  padding: 2rem;
  border-radius: 1rem;
  top: 5rem;
  left: 50%;
  width: 16rem;
  transform: translateX(-10rem);
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 3rem;
  text-align: center;
  user-select: none;
}
.freetitletext-right {
  position: absolute;
  padding: 2rem;
  border-radius: 1rem;
  top: 5rem;
  left: 50%;
  width: 16rem;
  transform: translateX(32rem);
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 3rem;
  text-align: center;
  user-select: none;
}
.vnlistinput {
  position: absolute;
  line-height: 3rem;
  font-size: 2rem;
  top: 13rem;
  left: 50%;
  width: 36rem;
  transform: translateX(-59rem);
  border-color: blue;
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
}
.vnhatelistinput {
  position: absolute;
  line-height: 3rem;
  font-size: 2rem;
  top: 13rem;
  left: 50%;
  width: 36rem;
  transform: translateX(-18rem);
  border-color: blue;
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
}
.taginput {
  position: absolute;
  line-height: 3rem;
  font-size: 2rem;
  top: 13rem;
  left: 50%;
  width: 36rem;
  transform: translateX(23rem);
  border-color: blue;
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
}
.selection-left {
  position: absolute;
  width: 36rem;
  height: 28rem;
  top: 16rem;
  left: 50%;
  transform: translateX(-59rem);
  background-color: rgba(0,19,127,0.0);
  padding-inline-start: 0.4rem;
}
.selection-mid {
  position: absolute;
  width: 36rem;
  height: 28rem;
  top: 16rem;
  left: 50%;
  transform: translateX(-18rem);
  background-color: rgba(0,19,127,0.0);
  padding-inline-start: 0.4rem;
}
.selection-right {
  position: absolute;
  width: 36rem;
  height: 28rem;
  top: 16rem;
  left: 50%;
  transform: translateX(23rem);
  background-color: rgba(0,19,127,0.0);
  padding-inline-start: 0.4rem;
}
#tagAndOr {
	cursor: pointer;
}
.list-element {
  border: 0.1rem solid #ddd;
  margin-top: -0.1rem; /* Prevent double borders */
  background-color: rgba(0,19,127,0.7);
  padding: 0.2rem;
  padding-left: 0.4rem;
  left: 0%;
  text-decoration: none;
  font-size: 1.4rem;
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  display: block;
  position: relative;
}
.list-close {
  cursor: pointer;
  position: absolute;
  top: 50%;
  right: 0%;
  padding: 2% 4%;
  transform: translate(0%, -50%);
}
.thumbimg {
  cursor: pointer;
  position: absolute;
  top: 50%;
  right: 12%;
  transform: translate(0%, -50%);
  max-width: 10%;
  max-height: 70%;
}

.startsearchbutton{
  background-color: rgba(0,19,127,0.7);
  border-radius: 1rem;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 42rem;
  width: 46rem;
  height: 8%;
}
.startsearchbutton:hover {
  background-color: rgba(0,255,255,0.7);
}
.startsearchbuttontext{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  text-align: center
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 3.3rem;
  white-space: nowrap;
  user-select: none;
}

.rec-result-left {
  position: absolute;
  padding: 2rem;
  border-radius: 1rem;
  white-space: nowrap;
  width: 30rem;
  top: 5rem;
  left: 50%;
  transform: translateX(-63rem);
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 2.6rem;
  text-align: center;
  user-select: none;
}
.rec-result-mid {
  position: absolute;
  padding: 2rem;
  border-radius: 1rem;
  white-space: nowrap;
  width: 30rem;
  top: 5rem;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 2.6rem;
  text-align: center;
  user-select: none;
}
.rec-result-right {
  position: absolute;
  padding: 2rem;
  border-radius: 1rem;
  white-space: nowrap;
  width: 30rem;
  top: 5rem;
  left: 50%;
  transform: translateX(29rem);
  background-color: rgba(0,19,127,0.7);
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  font-size: 2.6rem;
  text-align: center;
  user-select: none;
}

.usertop10list{
  position: absolute;
  margin-left: 1rem;
  border-radius: 1rem;
  width: 31rem;
  height: 26rem;
  top: 13rem;
  left: 50%;
  transform: translateX(-63rem);
  background-color: rgba(0,19,127,0.7);
  padding-inline-start: 1rem;
}
.sumtop10list{
  position: absolute;
  border-radius: 1rem;
  width: 40rem;
  height: 26rem;
  top: 13rem;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(0,19,127,0.7);
  padding-inline-start: 1rem;
}
.avgtop10list {
  position: absolute;
  margin-left: 1rem;
  border-radius: 1rem;
  width: 31rem;
  height: 26rem;
  top: 13rem;
  left: 50%;
  transform: translateX(29rem);
  background-color: rgba(0,19,127,0.7);
  padding-inline-start: 1rem;
}
.top10listelement {
	white-space: nowrap;
	font-size: 1.8rem;
	padding-top: 0.2rem;
	padding-bottom: 0.2rem;
}
.top10listelement:hover {
	background-color: rgba(101,187,209,0.7);
}
.top10listelement a:hover {
	color: white;
}


/* ---------- Details page ---------- */
.hidden-spoiler {
	color: black; 
	background-color:black;
	cursor: pointer;
}
.revealed-spoiler {
	color: #bbbbbb;
	background-color:rgba(0,0,0,0);
}
.userActivityChart {
	width: 64rem;
	height: 32rem;
}

.detailsTitle {
	text-align: left;
	margin-left: 2rem;
	color: #dddddd;
	margin-bottom: 2rem;
	font-size: 3rem;
}

.detailsSubtitle {
	text-align: left;
	margin-left: 2rem;
	color: #dddddd;
	margin-bottom: 2rem;
	font-size: 2.5rem;
}

.detailsEntry {
	margin-bottom: 0.5rem;
	margin-top: 0.5rem;
}
.detailsCategory {
	text-align: left;
	padding-left: 2rem;
	font-weight: bold;
	color: #dddddd;
	font-size: 1.8rem;
}

.detailsValue {
	font-size: 1.8rem;
}

.comment {
	color: #bbbbbb;
	width: 100%;
	max-width: 100rem;
	padding-left: 2rem;
}

#fullChartToggle {
	margin-left: 2rem;
}

.graphtoggle  {
  cursor: pointer;
  padding: 0.5rem;
  width: 5rem;
  border: 0.1rem solid #ddd;
  color: white;
  text-shadow: 0.2rem 0.2rem 0.4rem #000000;
  text-align: center;
}
.graphtoggle:hover {
  background-color: rgba(101,187,209,1.0);
}