
.dpgSlider {
    position:relative;
}

.dpgSlider .contImgExt{
    position:relative;
    background:white;
    overflow:hidden;    
}

.dpgSlider .contImgInt{
    position:absolute;
    display:inline-flex;
    left:0px;
    transition:all .7s ease;

}

.dpgSlider .contImgInt .img{
    background-size:cover;
    background-position: center;
}

.dpgSlider .contBtn {
    position:
    absolute;
    height:100%;
    width:25%;
    text-align: center;
    transition: all .5s ease;
    cursor: pointer;
    font-size:1em;
    color: white;
    filter: drop-shadow(0px 2px 3px black);
    z-index: 2;
}


.dpgSlider .contBtnIzq{
 left:-10%;
 padding: 25% 15%;
}

.dpgSlider .contBtnDer{
 right:-10%;
 padding: 25% 15%;
}

.contBtnAcc {
 width: 100% !important;
 top: 0;
 left:0;
 height: 60% !important;
 color:#ffffff73;
 transition:.5s all ease;
 padding: 10% 0 0 0;
 z-index:1 !important;
}

.contBtn :is(i,svg){
 color:#ffffff9e;
 transition:.5s all ease;
 font-size:30px;
}

.contBtn:hover :is(i,svg){
 color:white;

}


.dpgSlider .infoCant{
    color:white;
    position: absolute;
    bottom:3px;
    right:10px;
    font-size:8px;
    text-shadow: black 2px 1px 3px;
    z-index: 0;
}



/*_____ hover ________*/

.dpgSlider .contBtn:hover {
    background:#0b0b0b14;
}

.dpgSlider .contImgExt:hover .contBtnIzq {
    left:0px;
    /* height: 300px; */
}

.dpgSlider .contImgExt:hover .contBtnDer {
    right:0px;
}

.dpgSlider .contImgExt:hover .contBtn {
    font-size:3em;
}

.dpgSlider .contBtnAcc:hover {
 font-size:50px;
 color:white;
}


/*_____ miniaturas ________*/

.dpgSlider .contMiniExt {
    margin-top:5px;
    width:100%;

    overflow:hidden;
    position:relative;
}

.dpgSlider .contMiniInt {
    display:inline-flex;
    position:absolute;
    
    transition: all .5s ease;
    
}

.dpgSlider .imgMini{
    background-size:cover;
    background-position: center;
    filter:grayscale() /* blur(2px)*/;
    border:10px white solid;
	transition: all .5s ease;
}

.dpgSlider .imgMini.activa {
    margin: 0px 10px;
    filter: none;
    border: 9px #5fdeed solid;
    transition: all .5s ease;
    
}



/* _______ FULL */



.contSliderFull {
 height:100vh;
 width:100vw;
 position:fixed;
 top:0;
 left:0;
 background-color:#000000ba;
 z-index:99;
 overflow:hidden;
}

.contSliderFull .img {
 background-size:contain  !important;
 background-repeat:no-repeat;
 background-color:black;
 height:80vh !important;
}

.contSliderFull :is(.contMiniExt, .imgMini){
 height:20vh !important;
}

.contSliderFull .imgMini {
 border-width: 8px !important;
}

