/* Large computers: from 1080-1400px*/

@media only screen and (max-width:20000px){
     .social-links-mobile{
        display: none;
    
    }
    .mobil{
        display:none;
    }
        
}
/* Large computers: from 1080-1400px*/

@media only screen and (max-width:1400px){
     .social-links-mobile{
        display: none;
    }
    .mobil{
        display:none;
    }
}

/* Small tablet to big tablet(portrait) and small computer: from 768-1079px*/

@media only screen and (max-width:1079px){
    
    .social-links-mobile{
        display: none;
    }
    .mobil{
        display:none;
    }
    
    .header-nubenegra{
    margin: 20px 0 0 0;
    }
    
    /*Margen bajo la cabecera, bajo la main-nav*/
    .box{
    margin-bottom: 10px; 
    }

    .btn-navega{
    width: 25%;
    margin: 0 0 0 0;
    }
    
    .disc-title-banner{
    padding: 0 0;
    }
    
    h1 {font-size: 120%;}
    h2 {font-size: 100%;}
    h3 {font-size: 100%;
    margin: 0 15%;
    }
    h4 {font-size: 100%;
    } 
    h5 {font-size: 75%;
    }
    
    .index-h2 {font-size: 100%;
    letter-spacing: 1px;}
    
    .text-english-grupo{
        margin: 0;
        
    }
    
    .artist-name,
    .artist-country{
    padding:6px 10px 0 10px;
    }
    .disc-title{
    padding: 2px 0 0 0;
    }    
    .disc-nav {
    padding:9px 5px 2px 5px;
    }

    .disc-nav ul {
    padding: 0;
    }

    .disc-nav li {
    margin: 0 5px;
    font-size: 75%;
    }

    .col-portada {
        width: 100%; 
        text-align: center;
        margin:40px 0;
    }

    .col-portada img{
        margin:0;  
    }
        
    .portada {
        display: inline-block;
        float: left;
        width: 50%;
        text-align: right;
        padding:0 10px 0 0;
        margin:0;

    }
    .portada img{
        padding:25px 0 25px 0px;
        background-color: #9d9d9d;
        border-radius: 3%;
    }
    .box-reproductor{
        display: inline-block;
        float: right;
        text-align: left;
        padding:0 0 0 10px;
        width: 50%;
        }    

    iframe{
        margin: 0;
        padding: 0 40% 0 0;
    }
    .col-discos { 
        width:20%;
        text-align: center;
        margin:35px 0;
    }
    .texto{
        width:100%;
        margin:0 0 10px 0;

    }
    .texto-grupo{
        width:60%;
        margin:0 0 10px 0;
        padding: 0;
    }
    .long-copy-grupo{
    margin:35px 0%;/*Margen a los lados del texto ppal. estaba en 30px*/
    font-size: 85%;
    }
    
   
    /*Margen a los lados del texto ppal. estaba en 30px*/
    .long-copy{
        margin:30px 20% 60px 20%;
        font-size: 85%;

    }
     /*Margen a los lados del texto ppal. estaba en 30px*/
    .long-copy:first-child{
        margin:0 20% 60px 20%;
        font-size: 85%;
    } 
    .texto-edito{
        width:50%;
        margin:0 0 10px 0;

    }
    .long-copy-edito{
        margin:30px 3% 60px 3%;
        font-size: 85%;

    }
    .h3-edito{
        margin: auto 3% auto 3%;
    }
    
    .col-caratula {
    padding: 0;
    display: inline-block;
    float: left;
    width: 25%;
    text-align: center;
    margin:30px auto;
    }

    .col-caratula img{
    margin:0 5% 20px 5%;
   
    }

    .caratula {
    
    }
    
  
    
    footer{
    padding: 15px 0;
        height: 185px
    }

    .navi-continent{
        width:100%;
        margin: 0;
    }
    .navi-continent ul{
        width:60%;
        margin:0 20%;
    }

    .continent{
        width: 30%;
        margin: 0 5% 0 0;    
    }
    .continent-z{
        width: 30%;
        margin: 0 0 0 0;   
    }
    .navi-continent img{
        width: 100%;
        height:auto;
    }
/*--------SLIDER---------------------*/
/*-----------------------------------*/
.slider{
    padding-bottom: 30px
}

.imagenes-navi{
        padding: 0 15%;
    }
.w3-button{
    padding: 10px 3%;
}

.s7{
    width: 11.8%;
}

    
body.cookiewarning {
	padding-bottom: 13em;
}

body.cookiewarning div.cookiewarning {
padding:0 1em;
}
 /*--------Catalogo discos---------------------*/
/*-----------------------------------*/
 .disco-cat img{
    width: 90%;     
}

.discos-vacio,
.discos-vacio-detras{
    display: inline-block;
    float:left;
    width: 10%;
    height: 5px;
} 
.disco-cat img{
margin:0 5% 20px 5%;
}

/*.col-artistas{
    padding: 0;
    display: inline-block;
    float: left;
    width: 80%;
    text-align: center;
    margin:10px 0px 120px 0px;
    }*/
.artistas-vacio,
.artistas-vacio-detras{
    display: inline-block;
    float:left;
    width: 10%;
    height: 20px;
} 

    
.pic {
  border-radius: 22px;
  height: 200px;
  width: 30%;
    margin:1% 1%;
    padding: 0;
}
.pic img{
  
  width: 280px;
}
    
    
  a.hovertext::after {
    font-weight: 600;
    font-size: 1em;
    left: -60px;
    bottom: 20px;
    /*padding: 0.5em 20px;*/
    padding: 20px 0 40px 0;
   
  }


}


/* PHONES smaller than the ipad and small tablets: from 481-767px*/

@media only screen and (max-width:767px),(max-device-width : 767px){
    .mobil{
        display:none;
    }
    
    .social-links-mobile{
        display: inline;
    }
    
    .header-icon{
    width: 100%;
    height:auto;
    margin:2px 0 0 0;
    padding: 0;
    text-align: center
}
    .header-icon img{
        width: 100%;
    }
    
    .icono-nn img{
    width: 10%;
    }
    
    
    .header-nubenegra{
    width: 80%;
    margin: 5px 10% 0 10%;
    }
    
    .header-nubenegra img{
    width: 100%;
    
    }
    
    /*----social mobile---*/
    
    .header-social{
        display:none;
    }
    .btn-social-mobile-left{
        margin-left: 5%;
        display: inline-block;
        float:left;
        width: 10%;
        height:auto;
    }
    
     .btn-social-mobile-left img{
        margin-top: 15%;
        width: 70%;
    }
    
    .btn-social-mobile-right{
        margin-right: 5%;
        display: inline-block;
        float:right;
        width: 10%;
        height:auto;
    }
    .btn-social-mobile-right img{
         margin-top: 15%;
         width: 70%;
    }
    
    
    .box{
    height: auto;
    margin-top: 10px;
    margin-bottom: 10px; /*Margen bajo la cabecera, bajo la main-nav*/
    padding: 0;
    }

    .main-navi-img{
        width:90%;
        margin:0 5%;
    }
    .vacio{
        width: 5%;
    }
    .vacio-detras{
        width: 5%;
    }

    .btn-navega{
    width: 25%;
    }
    

    h1 {font-size: 110%;}
    h2 {font-size: 80%;}
    h3 {font-size: 90%;
        margin: 0 15%;
        } 
    h4 {font-size: 90%;
        margin: 0 15%;
        } 
    h5 {font-size: 75%;
    line-height: 150%;
    padding: 0 3%;
    } 
    
    .titulo-artista{
    width:30%;
    }
    .artist-name,
    .artist-country{
    padding:7px 0 0 10px;
    text-align: left;
    }
    .disc-title{
    width:40%;  
    padding: 2px 0 0 0;
    }    
    .disc-nav {
    width:30%;
    padding:7px 10px 2px 0;
    }
    .disc-nav-btns{
        text-align: right;
    }

    .disc-nav ul {
    padding: 0;
    }

    .disc-nav li {
    margin: 0 0 0 5px;
    font-size: 65%;
    }

    .col-portada {
        margin:30px 0;
    }

    .col-portada img{
        width: 100%;
        height: auto;
            
    }
        
    .portada {
        width: 55%;
        text-align: left;
        padding: 0 7% 0;
        float:none;

    }
     .portada img {
        padding: 0;
        float:none;

    }
    .box-reproductor{
        text-align: right;
        padding:0 7% 0 7%;
        width: 100%;
        float:none;
    } 
    
    .iframe {
        padding: 0 0 0 0;/*not working*/
        float:none;
    } 
    iframe{
        margin: 10px 0;
        padding: 0 0 0 0;
    }


    .texto{
        margin:0 0 20px 0;

    }
    
   
    .long-copy{
        margin:20px 7% 40px 7%;/*Margen a los lados del texto ppal. estaba en 30px*/
        font-size: 85%;
    }
    
     .long-copy:first-child{
        margin:0 7% 40px 7%;/*Margen a los lados del texto ppal. estaba en 30px*/
        font-size: 85%;
        }   
    footer{
        padding: 20px 0;
        height: 250px;/*no estaba, por defecto 172px*/
        
        
    }
    .footer-nav li{
    margin: 10px 25px ;
}
    .footer-icon img{
        padding: 10px 0;
        width: 12%;
    }
    
    .footer-policies li{
    margin: 20px 50px;
    font-size:90%;
}
    footer p,
    blockquote{margin:0;
        padding: 5px 0;
}
    
    .nubenegra-text{
            width: 100%;
            padding:10px 10% 0 10%;
}
    

    p,
    blockquote{margin:0;
}
    
    .campo-input{
        width: 70%


} 
    .texto-edito{
            width: 100%;
            margin:0 0 10px 0;
        }
    .long-copy-edito{         
            margin:0px 7% 0 7%;
            font-size: 90%;

        }
    .h3-edito{
        margin: auto 7% 20px 7%;
        font-size: 90%;
    }

    .col-caratula{
        width: 94%;
        display: inline-block;
        float: left;
        padding: 0; 
        text-align: center;
        margin:20px 3%;
    }
    .col-caratula:first-child{
        margin-left: 3%;

        }

    .col-caratula img{
        width: 100%;
        padding: 0;
        margin: 0;

    }

    .caratula {
        width: 16.6%;
        display: inline-block;
        float: left;
        margin:0 0 0 0;
        padding: 0;

    }
    .mobil-no{
            display:none;
    }
    .edito-title{
            width:100%;
            margin: 0 ;

    }
    .titulo-edito{
            width:100%;
            margin:5px  auto 10px auto; 
    }



    .artist-country{
            text-align: center;

    }
    .texto-grupo{
            width:76%;
            margin:0;

    }

    .long-copy-grupo{
            margin:20px 8% 40px 3%;
            font-size: 85%;
    }

    .col-discos {
        margin:0;
        padding: 20px 0% 20px 6%;
    }

    .col-discos img{
        width: 100%;
        margin:0px 0 20px 0;
        padding: 0;

    }

.navi-continent{
    width:100%;
    margin: 0;
}
.navi-continent ul{
    width:96%;
    height:auto;
    margin:0 2%
}

.continent{
    width: 32%;
    margin: 0 2% 0 0;    
}
.continent-z{
    width: 32%;
    margin: 0 0 0 0;   
}
.navi-continent img{
    width: 100%;
    height:auto;
}
    .index-h1{
    margin-bottom: 25px;
    letter-spacing: 2px;
    font-size: 130%;
}
    
    /*--------SLIDER---------------------*/
/*-----------------------------------*/
.slider{
    padding-bottom: 30px
}
.Slider-Imagenes {
    width: 85%;
    /*border-radius: 3%;*/
}
    
.imagenes-navi,
.videos-header{  /*------- VIDEO ---*/
        padding: 0 7%;
    }

.w3-button{
    margin:0;
    padding: 8px 3%;
}

.s7{
    width: 11.5%;
}
.cookie{
        font-size: 80%
    }
    
body.cookiewarning {
	padding-bottom: 13em;
}

body.cookiewarning div.cookiewarning {
padding:0 1em;
}
/*--------Catalogo discos---------------------*/
/*-----------------------------------*/
 .disco-cat img{
    width: 90%;     
}

.discos-vacio,
.discos-vacio-detras{
    display: inline-block;
    float:left;
    width: 10%;
    height: 5px;
} 
.disco-cat img{
    margin:0 5% 5px 5%;
}  
       
.col-artistas {
    width: 96%;
    margin-bottom: 40px;
    margin-top:40px;
    }  

.artistas-vacio,
.artistas-vacio-detras{
    display: inline-block;
    float:left;
    width: 2%;
    height: 20px;
} 
 
.pic {
  border-radius: 15px;
  height: 20%;
  width: 46%;
    padding: 0;
    margin: 2%;
}
.pic img{
  width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
    
}    
  a.hovertext{
      left: 0px;
      text-align: center;
    }
  a.hovertext::after {
    font-weight: 600;
    font-size: 1em;
    text-align: center;
    opacity: 1.0;
    left: -15px;
    bottom: 0px;
    width: 100%;
    /*padding: 0.5em 20px;*/
    padding: 10px 15px 15px 15px;
      
}
    .sidepan img {
    margin:0;
  margin-left: 0px;
}
 
.sidepan img:hover {
    margin:0;
  margin-left: 0px;
}


}


/* SMALL PHONES: from 0-480px*/


@media only screen and (max-width:480px){
    .social-links-mobile{
        display: inline;
    }
    .mobil{
        display:inline;
        background:black;
        color:#fff;
        font-size:0.9em;
        font-weight: 600;
        width:80%;
        padding: 8px;
        margin:2px 10%;
        border-radius: 10px;
    }
    .mobil-no-p{display:none;
    }
    
    .span-3-of-3 {
		width: 100%; 
	}
	.span-2-of-3 {
		width: 100%; 
	}
	.span-1-of-3 {
		width: 100%;
	}
    .span-5-of-5 {
		width: 100%; 
	}
	.span-4-of-5 {
		width: 100%; 
	}
	.span-3-of-5 {
		width: 100%; 
	}
	.span-2-of-5 {
		width: 100%; 
	}
	.span-1-of-5 {
		width: 100%; 
	}

    .index-h2 {font-size: 70%;
    letter-spacing: 1px;
    margin: 30px 0; }
    
    .social-links-mobile{
            display: inline;
        }

    .header-icon{
        width: 100%;
        height:auto;
        margin:2px 0 0 0;
        padding: 0;
        text-align: center
    }
    .header-icon img{
        width: 100%;
        }

    .icono-nn img{
        width: 15%;
        }


    .header-nubenegra{
        width: 90%;
        margin: 5px 5% 0 5%;
        }

    .header-nubenegra img{
        width: 100%;
    }

    .main-navi{
        width: 95%; 
        margin: 0 2.5%;
        padding: 0;
    }
    .main-navi-img{
        width:100%;
            margin:0 0%;
        }
    .vacio{
            display: none;
        }
    .vacio-detras{
            display: none;
        }

    .artist-name,
    .artist-country{
        padding:10px 0 0 0;
        font-size: 110%;
        text-align: center;
        }

    .disc-title{

        padding: 10px 0 0 0;
        }    
    .disc-nav {
        padding:10px 0 5px 0;
        }
    .disc-nav-btns{
            text-align: center;
        }

    .disc-nav li {
        font-size: 80%;
        }

    .col-portada {
          text-align: center;
            margin:30px 0;
        }

    .col-portada img{
            text-align: center;
            width: 250px;
            height: auto;
        }

    .portada {
            width:100%;
            margin: 0;
            text-align: center;
            padding: 0 0 0 0;
        }
    .portada img{
            padding: 0;
        }
    .box-reproductor{
            float: left;
            text-align: center;
            padding:10px 0 0 0;
            width: 100%;
            }    
    .nubenegra-text{
            padding:10px 5% 0 5%;
        }
    .campo{
            padding:0 5%;
        }
    .campo-input{
            width: 94%;
            margin:3px 3%
        }

    .edito-title{
            padding: 0;    
        }

    .titulo-edito{
            width:100%;
            margin:5px  auto 6px auto; 
        }
    .texto-grupo{
            width:100%;
            margin:0;
        }

    .long-copy-grupo{
            margin:20px 7% 40px 7%;
       }

    .col-discos {
        margin:0;
        padding: 20px 7%;
    }

    .col-discos img{
        width: 100%;
        margin:0px 0 20px 0;
        padding: 0;
    }

    .portada-small{
        display: inline-block;
        float:left;
        width:30%;
        height:auto;
        margin: 0 5% 0 0;
        padding: 0; 
        }
    .portada-small:last-of-type{
        margin-right: 0;
        }
    .portada-small img{
            width:100%;
            height:auto;
            margin: 0;
        }
    .navi-continent{
    width:100%;
    margin: 0;
}
.navi-continent ul{
    width:86%;
    height:auto;
    margin:0 7%
}
    
    .index-h1{
    margin-bottom: 15px;
    letter-spacing: 1px;
    font-size: 90%;
    
}
    footer{
    height: 370px;
  
}
    .footer-navi{
    margin: 0;
    padding: 0;
}
    .footer-navi li{
    width: 100%;
    margin: 5px 0;
    padding: 15px;
    
}
    
    
/*--------SLIDER---------------------*/
/*-----------------------------------*/
.mobil-no-p {
        display:none;
    }
.slider{
    padding-bottom: 20px
}
.Slider-Imagenes {
    width: 95%;
    /*border-radius: 3%;*/
}
.imagenes-navi{
    padding: 0 34%;

    }
.w3-button{
    margin:0;
    margin-left:14%;
    padding:4px 10%;  
}

    
    .cookie_01{
        width: 100%;
        padding: 0 3%;
        margin: 10px 0 0 0;
    }
    .cookie_02{
        margin:0 0 10px 0 ;
        width: 100%;
        padding: 0 40%;
        text-align: center;
    }
    
    
body.cookiewarning {
	padding-bottom: 12em;
}

body.cookiewarning div.cookiewarning {
padding:0;
}
    
/*--------VIDEO LIGHTBOX---------------------*/
/*-----------------------------------*/
.videos-header {padding:0;}
.videos{
    padding-bottom: 250px;
    margin-bottom: 600px;
}


.s3{
    display: inline-block;
    float: left;
    width: 100%;
}

.s3 img{
    width:100%;
    padding: 5%;
    
}  
/*--------Catalogo discos---------------------*/
/*-----------------------------------*/

    .disco-cat {
    display: inline-block;
    float:left;
    width: 33%;
    height:auto;
    padding: 0;
    margin: 0;
}
    
.disco-cat img{
    width: 90%;     
}

.discos-vacio,
.discos-vacio-detras{
    display: inline-block;
    float:left;
    width: 10%;
    height: 5px;
} 
    .disco-cat img{
    margin:0 5% 10px 5%;
}
   .col-artistas {
    width: 96%;
    margin-bottom: 30px;
    margin-top:20px;
    }  
 
.artistas-vacio,
.artistas-vacio-detras{
    display: inline-block;
    float:left;
    width: 2%;
    height: 20px;
} 
 
.pic {
  border-radius: 15px;
  height: 20%;
  width: 46%;
    padding: 0;
    margin: 2%;
}
.pic img{
  width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
    
}    
  a.hovertext{
      left: 0px;
      text-align: center;
    }
  a.hovertext::after {
    font-weight: 500;
    font-size: 0.8em;
    text-align: center;
    opacity: 1.0;
    left: -15px;
    bottom: 0px;
    width: 100%;
    /*padding: 0.5em 20px;*/
    padding: 10px 15px 12px 15px;
      
}
.sidepan img {
    margin:0;
  margin-left: 0px;
}
 
.sidepan img:hover {
    margin:0;
  margin-left: 0px;
}
}