#contenedor_interactivo{

    width: 590px;
    height: 100%;
   
    z-index: 0;
    display: flex;
    flex-direction: column;
    

}

#contenedor_puerta{

    width: 590px;
    height: 500x;
    /*border: 2px solid blue;*/
    z-index: 0;
    display: flex;
    flex-direction: column;


}

.producto{
    width: 100%;
    display: flex;
    flex-direction:row-reverse;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;

}

#canvas_puerta_3d{

    margin-top: 50px;
    height: 590px;
    

}


#video{
display: none;
}

.botonera{

    position: absolute;
    z-index: 20;
    width: 100%;
    display: flex;
    justify-content:center;
    align-items: center;
    row-gap: 50px;
    
    
}

.cont_boton{

width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;

}




.boton {
color:#fff;
background-color:#0993d8;
z-index: 20;
width: 150px;
height: 45px;
border-radius: 15px;
display: flex;
justify-content:center;
align-items: center;
cursor: pointer;
transition: all 0.5s;

}

.boton:hover {
    color:#fff;
    background-color:#007eff;
}

.active{
   /* border: solid 3px #757575;*/
}

.cont_redondo{

    width: 50%;
    height: 25px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 5px;
   
   

}

.boton_redondo{

    width: 20px;
    height: 20px;
    border-radius: 50%;
    cursor: pointer;
 
}

.bg-naranja{

background-color: #f87e17
}


.bg-gris_oscuro{

    background-color:#2d3135
}




.bg-celeste{


background-color:#107dd2
}

.bg-verde{

    background-color:#afbd20
}

@media (max-width: 1400px) {

#contenedor_interactivo{

        width: 400px;
        height: 100%;

        }


        #contenedor_puerta{

            width: 100%;
            height: 500x;

        }

        .boton{
            width: 120px ;
        }

 }

 @media (max-width: 992px) {

    #contenedor_interactivo{

        display: none;
    }

    .img-responsive{

        display: block; 
    }

 }

 .fade-out {
    opacity: 0;
    transition: opacity 0.8s;
}
.fade-in {
    opacity: 1;
    transition: opacity 0.8s;
}
.hidden {
    opacity: 0;
}