#diskografi_ytterwrapper { padding-bottom:15px; }

#diskografi_wrapper { margin:8px 0px 0px 0px; text-align:center; position:relative; padding-bottom:35px; }



h3.diskografi { display:block; position:relative; margin: 20px 5px 7px 5px; font-size:80px; font-weight:700; text-align:center; text-transform:uppercase; padding: 50px 0 50px 0; background-color:#000; opacity:0.8; 
-moz-box-shadow: 0px 1px 5px 0px #111;
-webkit-box-shadow: 0px 1px 5px 0px #111;
box-shadow: 0px 1px 10px 0px #111;}

.diskografi_med { position:absolute; z-index:1; top:3px; left:25px; font-size:60px; color:#fff; padding:1px 7px; font-family: 'Shadows Into Light', cursive;  text-transform:uppercase; opacity:0.7;
  transform: rotate(-15deg);
  -ms-transform: rotate(-15deg); /* IE 9 */
  -webkit-transform: rotate(-15deg); /* Chrome, Safari, Opera */ }

.diskografi_skiva_wrapper {
vertical-align:top;
display:inline-block;
position:relative;
width: calc(33% - 0px);
padding:8px 8px 8px 8px;
}
.diskografi_skiva_wrapper a { color: #fff; }

img.diskografi_skiva {
-moz-box-shadow: 0px 1px 10px 0px #111;
-webkit-box-shadow: 0px 1px 10px 0px #111;
box-shadow: 0px 1px 10px 0px #111;
-webkit-box-sizing: content-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: content-box;    /* Firefox, other Gecko */
box-sizing: content-box;         /* Opera/IE 8+ */
}

.diskografi-skiva-namn { position:absolute; width:calc(100% - 16px); bottom:8px; font-size:24px; line-height:30px; font-weight:500; text-transform:uppercase;  text-align:center; padding:10px; 
background-color: rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0.7);
}

.diskografi_skiva_wrapper:hover { text-decoration: underline; }

.diskografi_skiva_wrapper:hover img.diskografi_skiva { margin: -8px -8px -8px -8px; }









@media screen and (min-width: 1650px) {
.diskografi_skiva_wrapper { width: calc(25% - 4px); }
}
@media screen and (min-width: 2200px) {
.diskografi_skiva_wrapper { width: calc(20% - 3px); }
}
@media screen and (min-width: 3200px) {
.diskografi_skiva_wrapper { width: calc(16.6% - 2px); }
}



@media screen and (max-width: 900px) {
.diskografi_skiva_wrapper { width: calc(50% - 6px); }
}

@media screen and (max-width: 599px) {
#diskografi_wrapper { margin:10px 0 0 0; padding-bottom:50px;  }
.diskografi_skiva_wrapper { padding:5px 3px 10px 3px; width: calc(100% - 20px); }
h3.diskografi { font-size:40px; padding: 30px 0 30px 0; margin: 5px 5px 10px 5px;  }
.diskografi_med { font-size:32px; top:8px; left:1px; }
img.diskografi_skiva { margin: 0px; }
.diskografi-skiva-namn { width:calc(100% - 6px); bottom:10px; font-size:22px; line-height:28px; }
}


@media screen and (max-width: 599px) and (orientation:landscape) {
.diskografi_skiva_wrapper { padding:10px; width: calc(50% - 10px); }
.diskografi-skiva-namn { width:calc(100% - 20px); }
}



























/* UNDERSIDOR */


#skiva_target { display:none; position:relative; top:-57px; }



#skiva_wrapper { background-color: rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0.87); margin:0 0 20px 0; text-align:center; padding: 0 0 60px 0;
-moz-box-shadow: 0px 1px 2px 0px #111;
-webkit-box-shadow: 0px 1px 2px 0px #111;
box-shadow: 0px 1px 2px 0px #111;
 }

 #skiva_innerwrapper { max-width: 1600px; margin:0 auto;  }
 
 
 

 
#skiva_wrapper_vanster { display:inline-block; width:45%; border:0px solid red; vertical-align:top; padding:60px 0 0 70px;}
img.skiva_skiva { width:100%; }
a.diskografi_skiva_knapp, a.diskografi_skiva_knapp_ensam { display:block; margin:10px auto 0 auto; padding:12px; font-size: 24px; font-weight:500; color:#fff; text-align:center; text-transform: uppercase;
    -ms-transform: skewX(-10deg); /* IE 9 */ -webkit-transform: skewX(-10deg); /* Safari */ transform: skewX(-10deg);
}



#skiva_wrapper_hoger{ display:inline-block; width:50%; border:0px solid blue; vertical-align:top; padding:60px 70px 0 40px; text-align:left;}
h1.skiva { font-size:40px; line-height:46px; font-weight:700; margin: 0 0 4px 0; text-align:left; text-transform:uppercase; color:#fff;}
h2.skiva { font-size:24px; line-height:28px; font-weight:400; margin: -1px 0 8px 0; text-align:left; text-transform:uppercase;}
h2.skiva:hover { text-decoration: underline; }
.skivbolag  { font-size:20px; font-weight:400;  color: #eee; text-align:left; text-transform:uppercase; margin: 8px 0 0 0;}

ol.latlista { font-size: 24px; line-height:28px; font-weight:500; text-align:left; text-transform:uppercase; margin:35px 0 0 35px; }
ol.latlista li { margin:7px 0 7px 0; }
.latlista_lat { color:#ddd; }






.skiva_medverkande { margin-top:34px; font-size:20px; font-weight:500; line-height:34px; text-align:left; color: #ddd;  }
.skiva_merinfo { margin-top:29px; font-size:18px; line-height:27px; text-align:left; color: #ddd; font-family: 'Cabin', sans-serif; }




a.diskografi_skiva_tilbaka { display:inline-block; margin:50px 0 0 0; padding:12px 30px; font-size: 24px; font-weight:500; color:#fff; text-align:center; text-transform: uppercase;
    -ms-transform: skewX(-10deg); /* IE 9 */ -webkit-transform: skewX(-10deg); /* Safari */ transform: skewX(-10deg);
}

@media all and (min-width: 600px) and (max-width: 1019px) {
#skiva_wrapper_vanster { width:45%; padding:60px 0 0 10px; }
#skiva_wrapper_hoger{ width:50%; padding:60px 10px 0 25px; }
}


@media all and (max-width: 599px) {
#skiva_target { display:block; }
#skiva_wrapper { margin:0px 0 10px 0; padding: 0 0 35px 0; }
#skiva_wrapper_vanster { width:100%; padding:0;  }
img.skiva_skiva {  }
a.diskografi_skiva_knapp { display:inline-block; width:47.3%; margin:10px 3px 0 3px; padding:11px 0px; font-size: 19px; }
a.diskografi_skiva_knapp_ensam { display:inline-block; width:97.3%; margin:10px 3px 0 3px; padding:11px 0px; font-size: 19px; }
#skiva_wrapper_hoger{ width:100%; padding:15px 10px 20px 20px; text-align:center; }
h1.skiva { font-size:34px; line-height:38px; margin: 18px 0 0 0; }
h2.skiva { font-size:20px; line-height:24px; margin: 4px 0 4px 0; }
.skivbolag  { font-size:16px; }
ol.latlista { font-size: 22px; line-height:26px; margin:35px 0 0 30px; }
.skiva_medverkande { font-size:18px; line-height:28px; }
.skiva_merinfo { margin-top:28px; font-size:16px; line-height:24px; }
a.diskografi_skiva_tilbaka { font-size: 19px; margin:45px auto 0 auto; }

}



@media screen and (min-width: 1600px) {
#skiva_wrapper_vanster { width:40%  }
}



























/* Menyn på diskografisidan */


.osynlig-checkbox-diskografimeny {
display: none;
} 

.diskografipil {
  cursor: pointer;
  display: inline-block;
  padding: 8px 30px 13px 5px;
  position: fixed;
  bottom: calc(100% - 125px);
  right: 10px;
  z-index:10;
  color: #fff;
    -ms-transform: skewX(-10deg); /* IE 9 */ -webkit-transform: skewX(-10deg); /* Safari */ transform: skewX(-10deg);
-moz-box-shadow: 0px 10px 30px 0px #222;
-webkit-box-shadow: 0px 10px 30px 0px #222;
box-shadow: 0px 10px 30px 0px #222;
}

 
.diskografipil .diskografipilstreck {
  background: #fff;
  display: block;
  height: 3px;
  position: relative;
  top:14px;
  left: calc(50% + 69px);
  width: 13px;

  transition: all .2s ease-out;
}

.diskografipil .diskografipilstreck:after {
  background: #fff;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  width: 100%;
  transform: rotate(90deg);
  -ms-transform: rotate(90deg); /* IE 9 */
  -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
  transition: all .2s ease-out;
}

 
.diskografipil .diskografipilstreck:after {
  top: 0px;
  left:0px;
}

.diskografipil .diskografimenyvalplus {
  text-align:center;
  font-size:24px;
  font-weight:500;
  text-transform:uppercase;
  padding:10px 20px;
 
}


.osynlig-checkbox-diskografimeny:checked ~ .diskografipil .diskografipilstreck:after {
  transform: rotate(0deg);
  -ms-transform: rotate(0deg); /* IE 9 */
  -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */

}


.osynlig-checkbox-diskografimeny:checked ~ .diskografipil {
  border-bottom: 0px;
} 

.osynlig-checkbox-diskografimeny:checked ~ #diskografimeny {
opacity:1;
pointer-events: auto;
} 


#diskografimeny {
  position: fixed; 
  top:70px;
  right:0;
  bottom:0;
  left:0;
  z-index:9;
  background-color: rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0.9); 
  padding-top:50px;
  padding-bottom: 100px;
  opacity:0.0;
  overflow: hidden;
  pointer-events: none;
  transition: all .1s ease-out;
  text-transform: none;
  overflow:scroll; 
}

#diskografimeny a {
  display: block;
  border-top: 0px solid #222;
  text-align:center;
  font-size:34px;
  padding:18px 40px;
  font-weight:700;
  color:#fff;
  text-transform:uppercase;
  
}





#Soloalbum, #Solo-Albums  { position:relative; top:-78px; }
#Peps-and-Blues-Quality, #Nature, #Wellander-och-Ronander, #Zkiffz, #Little-Mike-and-The-Sweet-Soul-Music-Band,
#Stockholm-All-Stars, #Low-Budget-Blues-Band
{ position:relative; top:-50px; }





@media screen and (min-width: 600px) and (max-width: 1019px) {
.diskografipil { padding: 13px 34px 17px 9px; bottom: 10px; right: 10px; }
.diskografipil .diskografipilstreck { top:17px; left: calc(50% + 80px); }
.diskografipil .diskografimenyvalplus { font-size:30px; }
#diskografimeny { top:104px; padding-top:0px; }
#diskografimeny a { font-size:40px; line-height:44px; padding:25px 40px; }


#Soloalbum, #Solo-Albums  { position:relative; top:-111px; }
#Peps-and-Blues-Quality, #Nature, #Wellander-och-Ronander, #Zkiffz, #Little-Mike-and-The-Sweet-Soul-Music-Band,
#Stockholm-All-Stars, #Low-Budget-Blues-Band
{ position:relative; top:-84px; }
}




@media screen and (max-width: 599px) {
.diskografipil { padding: 9px 27px 12px 0px; bottom:10px; right:10px;  }
.diskografipil .diskografipilstreck { top:11px; left: calc(50% + 55px); }
.diskografipil .diskografimenyvalplus { font-size:20px; }
#diskografimeny { top:57px; padding-top:5px; }
#diskografimeny a { font-size:24px; line-height:24px; padding:10px 0 11px 0; }


#Soloalbum, #Solo-Albums  { position:relative; top:-65px; }
#Peps-and-Blues-Quality, #Nature, #Wellander-och-Ronander, #Zkiffz, #Little-Mike-and-The-Sweet-Soul-Music-Band,
#Stockholm-All-Stars, #Low-Budget-Blues-Band
{ position:relative; top:-40px; }
}






@media screen and (min-width: 0px) and (max-width: 359px) {
#diskografimeny a { font-size:21px; line-height:22px; padding:9px 0 10px 0; }
}