body { margin: 0; padding: 0;
font: sans-serif;
color: #333; background: transparent 
}

html > body { font-size: 14px; font-family: 'Muli', sans-serif; color: #ddd;}

html
{background: url(../pics/blacksandsun.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;		
}

html, body{
width: 100%;
height:100%;}




img { 
margin: 0;
padding: 0;
border:0;
}


a {
color: #cccccc;
text-decoration: none;
}
a:hover {
color: #c11;
}	
a name {
}



#NOW {
position:absolute;
top:-120px;
}
#LISTEN {
position:absolute;
top:-120px;
}
#WATCH {
position:absolute;
top:-120px;
}
#READ {
position:absolute;
top:-120px;
}
#CONTACT {
position:absolute;
top:-120px;
}


h1 {
color: #eeeeee;
font-size: 24px; font-family: 'Muli', sans-serif; color: #ddd;
font-weight: light;
margin:auto; 
top: 0;
}

h2 {
color: #888888;
font-weight: normal;
font-size: 10px; font-style: normal verdana, sans-serif;
}

h3 {
color: #888888;
font-size: 10px; font-family: 'Muli', sans-serif; color: #ddd;
font-weight: 400;
}


.content { 
font-size: 14px; font-family: 'Muli', sans-serif; color: #ddd;
font-weight: 400;
position: absolute; 
margin: auto;
padding:0;
top: 86px;
bottom:30px;
left:100px;
width: 800px;
z-index:5;
}

.maximago { 
font-size: 14px; font-family: 'Muli', sans-serif; color: #ddd;
font-weight: 400;
position: absolute; 
margin: auto;
padding:0;
top: 86px;
bottom:30px;
left:1000px;
height: calc(100% - 120px);
z-index:12;
}


.topicbox { 
position: relative;
background: rgba(0,0,0,0.5);
font-size: 14px; font-family: 'Muli', sans-serif; color: #ddd;
font-weight: 400;
top: 0px;
margin: auto;
padding: 12px;
width: 800px;
}


.minimini { 
font-size: 11px; 
}
		
			
			
.scbox {
opacity: 0.78;
transform:scale(1);
}
.scbox:hover {
opacity: 0.97;
}
.scbox:focus {
opacity: 0.97;
}		
			
			
#cd { 
position: absolute;
background: transparent;
margin: 0;
padding: 0;
}			
#cd:hover { 
-webkit-animation: roll 3s infinite; /* Chrome, Safari, Opera */ 
animation: roll 3s infinite;
transform:rotate(30deg);
}
/* Chrome, Safari, Opera */ 
@-webkit-keyframes roll {
    0%   {transform: rotate(0deg)}
    100% {transform: rotate(360deg)}
}
/* Standard syntax */
@keyframes roll {
    0%   {transform: rotate(0deg)}
    100% {transform: rotate(360deg)}
}


#logo { 
color: #fff;
float: center; 
background: transparent;
position: fixed; 
left: 110px;
top: 4px;
padding: 0px;
z-index: 12;
opacity:0.83;
}
#logo:hover + #header { 
background: rgba(120,120,120, 0.62);
}
#logo:hover ~ #header { 
background: rgba(120,120,120, 0.62);
}

#instores { 
color: #fff;
float: center; 
background: transparent;
position: fixed; 
left: 500px;
top: 4px;
padding: 0px;
z-index: 12;
opacity:0.83;
}
#instores:hover + #header { 
background: rgba(120,120,120, 0.62);
}
#instores:hover ~ #header { 
background: rgba(120,120,120, 0.62);
}



#spotifybutton { 
color: #fff; 
background: transparent;
position: fixed; 
left: 762px;
top: 4px;
padding: 0px;
z-index: 12;
opacity:0.62;
}
#spotifybutton:hover { 
opacity:0.87;
}


.icons {
color: white;
background: transparent;
width: 300px;
margin-left: auto;
margin-right: auto;
}

.icons img {
opacity: 0.5;
padding: 12px;
}
.icons img:hover {
opacity: 0.8;
}



#header { 
color: #fff;
float: center;
font: normal 14px verdana, sans-serif;
font-weight: 500;
letter-spacing: 0.062em;
background: rgba(120,120,120, 0.5);		
position: fixed; 
height:22px;
width: 100%;
padding-left:112px;
padding-top:58px;
opacity:0.98;
z-index:15;
}			
#header a {
color: #eee;
text-decoration: none;
}
#header a:hover {
color: #c11;
}	
#header:hover { 
background: rgba(120,120,120, 0.62);	
}

						
#headback { 
float: center;
background: url(../pics/blacksandsun.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;			
position: fixed; 
width: 100%;
margin:auto;
top: 0;
height: 92px; 
opacity: 1;
z-index:11;
}
			
#headblack { 
float: center;
background: #626262;
position: fixed;
margin:0; 
width:100%;
height:80px;
top: 0;
left:0px;
opacity: 0.5;
z-index:13;
}
			
#headblack:hover { 
opacity: 0.87;
}
			

.footbox { 
float: center;
background: url(../pics/blacksandsun.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;			
position: fixed;
margin:auto; 
width:100%;
height:42px;
bottom: 0;
opacity: 1.0;
z-index:10;
}
			
.footback { 
float: center;
background: #626262;
position: fixed;
margin:0; 
width:100%;
height:30px;
bottom: 0;
left:0px;
opacity: 0.5;
z-index:12;
}
			
.footer { 
color: #ccc;
background: transparent;
float: right;
font: normal 10px verdana, sans-serif;	
position: fixed; 
bottom: 8px;
right:62px;
opacity: 0.93;
z-index:13;
}
.footer a{ 
color: #eee;
}
.footer a:hover {
color: #c11;
}





/* remember REIHENFOLGE: 
a:link { background: thistle }
a:visited { background: lavender }
a:hover { background: pink } 
a:focus { background: aquamarine; color: black }
a:active { background: oldlace }
a:visited:hover{background:gray;color:white }
*/