body {
	background:#888888;
	color:#ffffff;
	font-family: 'Montserrat', Arial, serif; 
	font-size:1rem;
	margin: 0;
	padding: 0;
	}
	
.clear {

	float: none;
	clear: both;
	margin: 0;
	padding: 0;
	border: none;
	font-size:1px;
}	

.flex-container {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 1rem;
}

.flex-item {
  width: auto;
flex: 1 1 calc(33% - 20px)%;
  min-width: 250px;
  background-color: #444;
  color: #fff;
  padding: 1rem;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
box-sizing:border-box;
}

#header {
		padding-top:10px;
		padding-left:10px;
		background:#555555;
		border-bottom:solid 2px #cccccc;
		padding-bottom:10px;
		
	}
	
a {
	color:#ffffaa;
}	

a#logout {
	float:right;
	text-decoration:none;
	color:#ffffff;
	margin-top:-25px;
	margin-right:100px;
	
}

#logout:hover {
	text-decoration:underline;
	color#FFFFaa;
}
	
	
h1 {
	text-transform:uppercase;
	font-weight: 700; 
    text-shadow: -2px 2px #333333;
}


.searchLabel{
background:#99999f;
 font-weight:700;
color:#ffffff;
text-shadow: -1px 1px #666666;
font-size: 1rem;
border:solid 1px #333333;
text-align:right;
}

.submit {
	margin-left:80px;
	-moz-border-radius:6px; /* Firefox */
    -webkit-border-radius: 6px; /* Safari, Chrome */
    -khtml-border-radius: 6px; /* KHTML */
    border-radius: 6px; /* CSS3 */
	color:#ffffee;
	background:#777777;
	border:solid 2px #eeeeee;
	font-weight:bold;
	padding:3px;
	
}

.submit:hover {
	color:#ffffff;
	background:#555555;
	border:solid 2px #ffffff;
	
}

#searchbar {
	background:#99999f;
	border-bottom:solid 2px #666666;
	padding-top:8px;
	padding-bottom:8px;
}

.search {
	font-size:10pt;
	background:#777777;
	border:solid 1px #ffffff;
	margin-bottom:2px;
	padding:2px;
	color:#ffffaa;
	  -moz-border-radius:6px; /* Firefox */
    -webkit-border-radius: 6px; /* Safari, Chrome */
    -khtml-border-radius: 6px; /* KHTML */
    border-radius: 6px; /* CSS3 */
}

.login {
	font-size:10pt;
	background:#666666;
	border:solid 1px #ffffff;
	margin-bottom:2px;
	padding:2px;
	color:#ffffaa;
	  -moz-border-radius:6px; /* Firefox */
    -webkit-border-radius: 6px; /* Safari, Chrome */
    -khtml-border-radius: 6px; /* KHTML */
    border-radius: 6px; /* CSS3 */
}

.albumtitle {
	
font-weight:bold;
margin-left:11px;
font-size:11pt;
    text-shadow: -1px 1px #222222;
	color:#EEEEEE;
}

#results {
	margin:5px;

}
ul.resultlist {
	width:100%;
    text-align:left;
    display:inline-block;
border-bottom:solid 1px #555555;
margin-bottom:10px;
background:#999999;
}

.resultlist li {
	text-align:left;
background:#656565;
border:solid 1px #ffffff;
display: inline-block;
vertical-align: top;
width:400px;
font-weight:200;
font-size:10px;
float:left;
margin-right:10px;
margin-bottom:10px;
position:relative;       
box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.resultlist img {
float:left;
margin:5px;
border:solid 1px #333333;
}


.resultlist li:before, .resultlist li:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:50%;
    bottom:0;
    left:10px;
    right:10px;
    border-radius:100px / 10px;
}


.playerbox {
	display:inline-block;
	background:#333333;
	border:Solid 2px #bbbbbb;
	text-align:center;
	width:250px;
	padding:5px;
	margin-top:10px;
	float:Center;
	
}

.aplayer {
	border:solid 1px #dddddd;
	cursor:pointer;
}
audio {
	width:250px;
}

.composer, .artist, .album{
	text-decoration:underline;
	cursor:pointer;
}

.checktrack, .copybox {
	padding:1px;
	margin-left:10px;
	cursor:pointer;
	display:inline-block;
	border:Solid 1px #ffffff;
}

.trackbox {
	display:none;
}

.checktrackresults {
	display: none;
	border: solid 1px #ffffff;
	position: absolute;
	background: #ffffff;
	color: #000000;
	padding: 10px;
	top: 50px;
	left: 100px;
	z-index:1000;
filter: drop-shadow(-9px 12px 10px #000000);
}

.closediv {
	cursor:pointer;
	font-weight:bold;
	color:#A00;
}

.checktrackresults a {
	color:#0000cc;
}
label, .label {
        text-align:right;
        font-weight:700;
        display:inline-block;
        width:92px;
        text-shadow: -1px 1px #666666;
        margin-right:4px;
}

.label {
	color:#ffffff;
        font-family: 'Montserrat', Arial, serif;
	margin-right: 1px;
}

.copydata {
	display:none;
	visibility:hidden;
}