html, body {
	height: 100%;
    background-color: #008080;
    color: #333;

background: -moz-linear-gradient(top, #217f7f 0%, #006868 100%); [> FF3.6-15 <]
background: -webkit-linear-gradient(top, #217f7f 0%,#006868 100%); [> Chrome10-25,Safari5.1-6 <]
background: linear-gradient(to bottom, #217f7f 0%,#006868 100%); [> W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ <]
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#217f7f', endColorstr='#006868',GradientType=0 ); [> IE6-9 <]

/*background: -moz-radial-gradient(top left, ellipse cover, #008080 0%, #004444 100%); [> FF3.6-15 <]*/
/*background: -webkit-radial-gradient(top left, ellipse cover, #008080 0%,#004444 100%); [> Chrome10-25,Safari5.1-6 <]*/
/*background: radial-gradient(ellipse at top left, #008080 0%,#004444 100%); [> W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ <]*/
}

.box {
    margin-left: auto;
    margin-right: auto;
    margin-top: 1em;
    margin-bottom: 1em;
    box-shadow: 0.5em 0.5em rgba(0, 0, 0, 0.5), -0.1em -0.1em rgba(255, 255, 255, 0.5);
    border-top: 3px solid rgba(0, 0, 0, 0.1);
    border-left: 3px solid rgba(0, 0, 0, 0.1);
    padding: 1em;
	width: 75%;
}

#chartContainer {
	height: 50%;
    /*margin-left: auto;*/
    /*margin-right: auto;*/
    /*margin-top: 1em;*/
    /*margin-bottom:1em;*/
}

.info_container {
    /*margin-left: auto;*/
    /*margin-right: auto;*/
    /*margin-bottom: 1em;*/
    /*margin-top: 1em;*/
    /*padding: 1em;*/

}

#current_song {
    /*margin-right: auto;*/
    /*margin-left: auto;*/
    /*margin-top: 1em;*/
    /*margin-bottom: 1em;*/
}

table {
    width: 100%;
    border-collapse: collapse;
}

tr {
    margin: 2px;
    /*background-color: rgba(0, 128, 128, 0.5);*/

background: #cccccc; 
background: -moz-linear-gradient(top, #FFF 0%, #F0F0F0 15%, #F0F0F0 85%, #FFF 100%); 
background: -webkit-linear-gradient(top, #FFF 0%,#F0F0F0 15%,#F0F0F0 85%,#FFF 100%); 
background: linear-gradient(to bottom, #FFF 0%,#F0F0F0 15%,#F0F0F0 85%,#FFF 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#cccccc',GradientType=0 ); 

/*background: #e0e0e0; */
/*background: -moz-linear-gradient(top, #e0e0e0 0%, #cccccc 100%); */
/*background: -webkit-linear-gradient(top, #e0e0e0 0%,#cccccc 100%); */
/*background: linear-gradient(to bottom, #e0e0e0 0%,#cccccc 100%); */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e0e0', endColorstr='#cccccc',GradientType=0 ); */
}

/*.current_song tr:nth-child(even) {*/
    /*margin: 2px;*/
    /*[>background-color: red;<]*/

/*background: #e0e0e0; */
/*background: -moz-linear-gradient(top, #e0e0e0 0%, #cccccc 25%, #cccccc 75%, #e0e0e0 100%); */
/*background: -webkit-linear-gradient(top, #e0e0e0 0%,#cccccc 25%,#cccccc 75%,#e0e0e0 100%); */
/*background: linear-gradient(to bottom, #e0e0e0 0%,#cccccc 25%,#cccccc 75%,#e0e0e0 100%); */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e0e0', endColorstr='#e0e0e0',GradientType=0 ); */

/*[>background: #cccccc; <]*/
/*[>background: -moz-linear-gradient(top, #cccccc 0%, #e0e0e0 100%); <]*/
/*[>background: -webkit-linear-gradient(top, #cccccc 0%,#e0e0e0 100%); <]*/
/*[>background: linear-gradient(to bottom, #cccccc 0%,#e0e0e0 100%); <]*/
/*[>filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#e0e0e0',GradientType=0 ); <]*/
/*}*/

td {
    padding: 10px;
}

/*.current_song td:nth-child(1) {*/
    /*margin: 2px;*/
    /*background-color: blue;*/
/*}*/

.hidden {
    display: none;
}

div { 
    opacity: 0.99;
    background-color: white;
}

/* fix canvas container */
.canvasjs-chart-container {
    top: -1em;
    left: -1em;
}

a:visited {
    color: #008080;
}
a { 
    color: #008080;
}

h2 {
    font-family: Sans-Serif;
    margin: 0.15em;
    text-align: center;
}

#moreInfo {
    font-size: 1.25em;
    display: inline-block;
    margin: 0.5em auto;
    padding: 0.5em 3em;
    background-color: #008080;
    color: White;
    position: relative;
    right: 0;
    width: 50px;
    text-decoration: underline;
    box-shadow: 3px 3px #BBB;
}

#moreInfo:hover {
    box-shadow: 2px 2px #BBB;
    top: 1px;
    left: 1px;
}