body{
		background-color: #000000;
		color: #FFFFFF;
		margin:-5;
		padding:-5;
		font-size: 10pt;
	}
	
	a.menu{
		color: #FFFFFF;
		text-decoration: none;
		font-weight: Bold;
	}
	.button{
		height:50px;
		width:200px;
		border-radius: 12px;
		font-size: 14pt;
		font-weight: bold;
		font-family: "Verdana";
		padding: 8px 30px;    
		background-color: #000033;
		color: black;
		border: 2px solid #0000FF;
		box-shadow: 5px 9px #999;
		outline:none;
		color: #FFFFFF;
	}
	.button:hover {
		box-shadow: 5px 9px #999;
	}
	.button:active {
		box-shadow: 5px 5px #666;
		transform: translateY(4px);
	}

	#little{ 
		font-size:10px;
		font-weight: normal;
	}

	input.checkbox{
		vertical-align: middle;
		background: red;
		border-radius: 1px;
		box-sizing: border-box;
		box-sizing: content-box ;
		width: 30px;
		height: 30px;
		border-width: 0;
		transition: all .3s linear;
	}
	input.checkbox:checked{
		background-color: green;
	}
	input.checkbox:focus{
		outline: 0 none;
		box-shadow: none;
	}

	th {
		
		background-color: #000033;
		border: #0000FF 2px solid;
		color: #FFFFFF;
		font-size: 10pt;
		font-weight: bold;
		font-family: "Verdana";
		border-collapse: collapse;
		padding: 14px;
		cursor: pointer;
		border-radius: 10px 10px 0px 0px;
	}
	
	.red {
		background-color: #330000;
		border: #FF0000 2px solid;

	}
	.green {
		background-color: #003300;
		border: #00FF00 2px solid;
	}

	.orange {
		background-color: #ff9900;
		border: #ffcc00 2px solid;

	}
	.purple {
		background-color: #660066;
		border: #cc00cc 2px solid;

	}
	.yellow {
		background-color: #FFcc33;
		border: #FF9900 2px solid;

	}
	.teal {
		background-color: #33cccc;
		border: #003366 2px solid;

	}
	
		canvas{
		border: #0000FF 2px solid;
	}
	
	th#title {
		/*background-image: linear-gradient(red, purple, orange, teal, green, blue );*/
		background-image: linear-gradient(red, orange, purple, #000033 );
		background-color: #000033;
		border: #0000FF 0px solid;
		color: #FFFFFF;
		font-size: 14pt;
		font-weight: bold;
		font-family: "Verdana";
		border-collapse: collapse;
		padding: 14px;
		width: 101%;
	}
	

	
	td.table_lines {
	border-bottom: 1px #333333 solid;
	padding-top: 10;
	padding-bottom: 5;
	}
	
	#canvas1{
	border: #000033 2px solid;
	}
	
	/* Style all font awesome icons */
	.fa {
    font-size: 20px;
    width: 20px;
    text-align: center;
    text-decoration: none;
    border-radius: 50%;
	color: white;
	}

	/* Add a hover effect if you want */
	.fa:hover {
		opacity: 0.7;
	}

	
	/* menu button */
	.container {
    display: inline-block;
    cursor: pointer;
}

.bar1, .bar2, .bar3 {
    width: 35px;
    height: 5px;
    background-color: #FFF;
    margin: 6px 0;
    transition: 0.4s;
}

/* Rotate first bar */
.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px) ;
    transform: rotate(-45deg) translate(-9px, 6px) ;
}

/* Fade out the second bar */
.change .bar2 {
    opacity: 0;
}

/* Rotate last bar */
.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px) ;
    transform: rotate(45deg) translate(-8px, -8px) ;
}


/* The container <div> - needed to position the dropdown content */
#dropdown {

}

#menu {

	display: none;
	position:absolute; 
	top:40px; 
	right: 5px;
	text-align:right;
	width:120px;

}

div#red{
	background-color: #990000;
	width:105px;
	padding: 5px;
}
div#green{
	background-color: #003300;
	width:105px;
	padding: 5px;
}
div#blue{
	background-color: #000033;
	width:105px;
	padding: 5px;
}
div#yellow{
	background-color: #FFcc33;
	width:105px;
	padding: 5px;
}
div#orange{
	background-color: #ff9900;
	width:105px;
	padding: 5px;
}
div#purple{
	background-color: #660066;
	width:105px;
	padding: 5px;
}