@charset "utf-8";
/* CSS Document */
.filter_big_box{
	/*width: 50%;
	align-content: center;*/
	margin: auto;
  	width: 620px;
  	outline: dashed 1px black;
}

/* Creating a custom select box, from w3schools
/*the container must be positioned relative:*/
.custom-select {
	position:relative;
	font-family: Arial, Helvetica, sans-serif;
}

.custom-select select {
	display: none; /*hide original SELECT element:*/
}
/* pausing here, but this is clearly how to do it */

select{
	appearance: none;
	outline: none;
	overflow-y: auto;
	width:200px;
	color:black;
}

option:hover,
option:focus,
option:active,
option:checked{
	color: linear-gradient(black,black);
	background: linear-gradient(#CFD3EC, #B6BBDD);
}

.selector{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	color:darkblue;
}
.footer{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 23px;
	color:darkblue;
}

form {
	width:300px;
	position:relative;
	margin:auto;
	display:flex;
	justify-content: space-between;
	/*outline: dashed 1px;*/
}

input {
	position:relative;
	margin:auto;
	width:100%;
	padding:12px 0px;
}



.optionGroup {
    font-weight: bold;
	font-size: 11pt;
}
    
.optionChild {
    padding-left: 15px;
	font-size: 10pt;
}

.header-highlight {
	background-color:#D6D6D6;
}

.header-highlight:hover {
	background-color: #D6D6D6;
	cursor: pointer;
}

.header-cell:hover {
	background: linear-gradient(#CFD3EC, #B6BBDD);
}

.row-highlight{
	background-color:white;
}

.row-highlight:hover {
	background: linear-gradient(#CFD3EC, #B6BBDD);
	cursor: pointer;
}

.togglebutton{
	width: 220px;
	margin: auto;
	text-align:center;
	display: flex;
	justify-content: space-between;
}

.buttonON {
	background-color: #828EDA;
	border: none;
    color: white;
    width: 100px;	
    height: 30px;	
    text-align: center;
    font-size: 16px;
	border-radius: 8px 8px 8px 8px;
}

.buttonOFF {
	background-color: #041DB5;
	border: none;
    color: white;
    width: 100px;	
    height: 30px;	
    text-align: center;
    font-size: 16px;
	border-radius: 8px 8px 8px 8px;
	transition-duration: 0.4s;
	cursor: pointer;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

.buttonOFF:hover {
	background-color: #828EDA;
}