/* style.css */

/* @font-face {

	

}*/

@import url('https://fonts.googleapis.com/css?family=PT+Sans');

* {
    box-sizing: border-box;
}

/* Create three equal columns that floats next to each other */
.column {
    	float: left;
    	width: 33%;
    	
    
}

/* Create two columns that floats next to each other */
.column2{

 	float: left;
    	width: 66%;
    	

}

.column4{

 	float: left;
    	width: 20%;
    	
    	

}

.column5{

 	float: left;
    	width: 20%;
    	
    	

}

.column7{
    
    float: left;
    width: 14%;
    
}

/* Clear floats after the columns */
.row:after {
    	content: "";
    	display: table;
    	clear: both;
}


.graph {

  	margin-left: auto;
  	margin-right: auto;
  	margin-bottom: 5%;
  	width: 80%;
  	border: 10px outset #b7dfd6;
  	padding: 1%;
	border-radius: 10px;
  	
}

body {

	margin-top: 1%;
	background-repeat:no-repeat;
   	background-size:cover;
   	background-color: #f6f6f6;
   	margin: 1%;

}

.bimage{

	background-image: url("images/background.jpg");
	overflow: hidden;

}

.backcolor {

	background-color: rgba(248, 248, 248, .8);

}

input {

	font-family: 'PT Sans', sans-serif;
	border: 1px solid #e0e0e0;
	font-size: 1vw;
	color: #595955;
	padding: .5%;
	border-radius: 10px;
	width: 20%;
	

}



textarea {

	font-family: 'PT Sans', sans-serif;
	border: 1px solid #595955;
	font-size: 1vw;
	color: #595955;
	width: 50%;
	border-radius: 5px;
	

}

p {

	color: #595955;
	font-size: 1vw;
	font-family: 'PT Sans', sans-serif;

}

.red {

	color: red;
	font-size: 1vw;
	font-family: 'PT Sans', sans-serif;
	font-weight: bold;

}

a {

	text-decoration: none;
	color: #595955;

}

ol {

	color: #595955;
	font-size: 1vw;
	font-family: 'PT Sans', sans-serif;

}

h1 {

	font-family: 'PT Sans', sans-serif;
	font-size: 2vw;
	color: #595955;	
	margin-top: 2%;
	padding: 2%;

}

h2 {
	font-family: 'PT Sans', sans-serif;
	font-size: 1.2vw;
	color: #595955;	

}


h3 {
	font-family: 'PT Sans', sans-serif;
	font-size: 1.2vw;
	color: #595955;	
	/*background-color: #404040;*/
	background-color: #e0e0e0;
	padding-top: 1%;
	padding-bottom: 1%;
	padding-left: 1%;
	margin-top: 3%;
	border: outset;
	border-radius: 5px;
	

}

h4 {
	font-family: 'PT Sans', sans-serif;
	font-size: 2vw;
	color: #595955;	
	text-align: center;
	/*background-color: #404040;*/
	/*background-color: #e0e0e0;*/
	padding: 1%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 3%;
	
	

}

h5 {
	font-family: 'PT Sans', sans-serif;
	font-size: 2vw;
	color: #595955;	
	margin: 0% !important;

}

.accordion {
	
	font-family: 'PT Sans', sans-serif;
    	background-color: #eee;
    	color: #595955;
    	cursor: pointer;
    	padding: 1%;
    	width: 98%;
    	border-radius: 5px;
    	border: outset;
    	text-align: left;
    	outline: none;
    	font-size: 1.2vw;
    	transition: 0.4s;
}

.active, .accordion:hover {
    background-color: #ccc; 
}

.accordion:after {
    content: '\002B'; /* Unicode character for "plus" sign (+) */
    float: right;
    margin-left: 5px;
}

.active:after {
    content: "\2212"; /* Unicode character for "minus" sign (-) */
}

.panel {
    padding: 0 1%;
    display: none;
    overflow: hidden;
}




hr {

	width: 100%;
	color: #595955;
	background-color: #595955;
	padding-top: .1%;
	margin-top: 1%;

	
	

}

.tab {

	padding-left: 5em;

}

.login {

    	margin: 0;
    	position: absolute;
    	top: 50%;
    	left: 50%;
    	transform: translate(-50%, -50%);
    	border: 2px dotted #595955;
    	padding: 5%;
    	width: 35%;
    	border-radius: 15px;

    	
}

.login input {

	font-family: 'PT Sans', sans-serif;
	border: 1px solid #e0e0e0;
	font-size: 1vw;
	color: #595955;
	padding: 2%;
	width: 100%;
	

}



.tcenter {

	text-align: center;

}

.tleft {

	text-align: left;

}

.tright {

	text-align: right;

}

.floatright {

	float: right;
	
	

}

.remember {

	font-family: 'PT Sans', sans-serif;
	color: #595955;
	font-size: .7vw;

}

.forgot {

	font-family: 'PT Sans', sans-serif;
	color: #595955;
	text-decoration: none;
	font-size: .7vw;
	
	

}


button {
  
  	display: inline-block;
  	border-radius: 4px;
  	background-color: #595955;
  	border: none;
  	color: #eaeaea;
  	font-size: 1vw;
  	padding: 5px;
  	width: 30%;
  	transition: all 0.5s;
  	cursor: pointer;
  	margin: 5px;
  	
}

button span {
  
  	cursor: pointer;
  	display: inline-block;
  	position: relative;
  	transition: 0.5s;
  	
}

button span:after {
  
  	content: '\00bb';
  	position: absolute;
  	opacity: 0;
  	top: 0;
  	right: -20px;
  	transition: 0.5s;
  	
}

button:hover span {
  	
  	padding-right: 25px;
  	
}

button:hover span:after {
  	
  	opacity: 1;
  	right: 0;
  	
}

button:hover {


	background-color: #e0e0e0;
	color: #595955;

}

.button5 {
  
  	display: inline-block;
  	border-radius: 5px;
  	background-color: #595955;
  	border: none;
  	color: #eaeaea;
  	font-size: 1vw;
  	padding: 5px;
  	width: 10%;
  	transition: all 0.5s;
  	cursor: pointer;
  	margin: 5px;
  	
}


table {

	width: 97%;
	font-family: 'PT Sans', sans-serif;
	color: #595955;
	border-collapse: collapse;
	margin-left: 1.5%;
	border-radius: 25px;
}

td {

	
	padding: .5%;
	
		

}

th {

	font-size: 1.5vw;
	text-align: left;
	border-bottom: 2px solid #595955;
	color: #595955;
	padding: .5%;
	cursor: pointer;

}

tr {

	padding-left: 2%;
	
	
}

tr:nth-child(even) {

	background-color: rgba(146, 146, 146,.4);
	
	
}

.leftround {


	border-radius: 5px 0px 0px 5px;

}

.rightround {


	border-radius: 0px 5px 5px 0px;

}

.adminlayout {


	margin-top: 3%;
	margin-left: 2%;

}

.adminlayout input {

	width: 30%;
	border: transparent;
	border-bottom: 1px solid #595955;
	padding: .7%;
	background-color: #eaeaea;
	margin-top: 1%;
	margin-bottom: 1%;
}

.adminlayout button{

	width: 10%;
	font-size: 1vw;

}


.buttonadmin {

	width: 70% !important;
	display: block;
	margin: auto;

}

.msgcard {
	margin: auto;
  	width: 80%;
  	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  	padding: 2%;
  	border-radius: 25px;
  	background-color: #ffffff;
}

.message {

	font-family: 'PT Sans', sans-serif;
	color: #595955;
	padding-left: 10%;
	padding-right: 5%;
	padding-bottom: 5%;


}

.msgtitle {

	
	color: #595955;
	/*background-color: #404040;*/
	font-weight: bold;
	margin-top: 5%;
	padding-bottom: 1%;
	font-size: 1.2vw;
	

}

.msgdate {

	
	color: #595955;
	float: right;
	font-size: .7vw;
	margin-right: 5%;

}

.msgtext {

	padding-left: 3%;
	padding-right: 2%;

}

select {

	font-family: 'PT Sans', sans-serif;
	color: #595955;
	margin-top: 1%;
	margin-bottom: 1%;
	font-size: 1vw;
	background-color: f6f6f6;
	border-radius: 10px;

}

select option {

	font-size: .8vw;
	background-color: f6f6f6;
	color: #595955;

}

.mainmenu {
	
	font-family: 'PT Sans', sans-serif;
	overflow: hidden;
  	position: -webkit-sticky; /* Safari */
    	position: sticky;
    	top: 0;
    	background-color: #b7dfd6;
    	border-bottom: 3px solid #595955;

    	

}

.mainmenu a {
    	
    	
    	
    	float: left;
  	color: #595955;
  	text-align: center;
  	padding: 14px 16px;
  	text-decoration: none;
  	font-size: 1vw;
  	border-left:1px solid #929292;
  	
  	
  	
  	
  	
}

.mainmenu a:hover {

	background-color: #ddd;
  	color: black;
}



.mainmenu-right {

	float: right;

}

ul {
    font-family: 'PT Sans', sans-serif;
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #b7dfd6;
}

li {
  float: left;
}


li a, .dropbtn {
  display: inline-block;
  color: #595955;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
  background-color: #b7dfd6;
}

li.dropdown {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
  display: block;
}

label {

	font-family: 'PT Sans', sans-serif;
	font-weight: bold;
	color: #595955;

}

.button2 {
  
  	display: inline-block;
  	border-radius: 4px;
  	background-color: #595955;
  	border: none;
  	color: #eaeaea;
  	font-size: 1.5vw;
  	padding: 10px;
  	width: 20%;
  	transition: all 0.5s;
  	cursor: pointer;
  	margin: 5px;
  	
}

.roundbutton {
  
  	display: inline-block;
  	border-radius: 4px;
  	background-color: #595955;
  	border: none;
  	color: #eaeaea;
  	font-size: 1vw;
  	padding: 5px;
  	width: 12%;
  	transition: all 0.5s;
  	cursor: pointer;
  	margin: 5px;
  	
}

.roundbutton:hover {


	background-color: #e0e0e0;
	color: #595955;

}

.active {
	
	background-color: #e0e0e0;
	color: #595955;

}

.doublewhite {

	border-style: none none none none;
	border-color: #595955;

}


.indent5 {

	text-indent: 5%;

}


.tooltip {

  
}

.tooltip .tooltiptext {
    visibility: hidden;
    background-color: #fff;
    color: #ff8640;
    text-align: center;
    margin: 1% 0% 0% 1%;
    
    padding: 1%;
    font-family: 'PT Sans', sans-serif;
  
  /* Position the tooltip */
    position: absolute;
    z-index: 1;
  
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}