html{
margin:0;
padding:0;
}

body.container-fluid{
padding:0;
width:100vw;
height:100vh;
overflow:hidden;
}

img{
max-width:100%;
height:auto;
}

.hidden{
display:none;
}

#wallWrapper{
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
/* overflow:hidden; */
margin:auto;
padding:0;
transform-origin:center;
perspective:10000px;
}

.status{
position:relative;
float:left;
width:46%;
height:42%;
margin:2%;
perspective:600px;
transform:rotateY(0deg);
borderSpacing:0px;
}

.status.switchSlide{

}

.current,.next{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background-color: #fff;
backface-visibility:hidden;
z-index:9;
transition:transform .5s;
border:1px solid #ccc;
}

.status .current{
transform:rotateY(0);
}

.status.switchSlide .current{
transform:rotateY(180deg);
}

.status .next{
transform:rotateY(180deg);
}

.status.switchSlide .next{
transform:rotateY(360deg);
}

.status:nth-child(2n+1){
}

.user {
position: absolute;
background:rgba(255,255,255,.5);
z-index:1;
padding-top:10px;
padding-bottom:10px;
top: 0;
left: 0;
right: 0;
height: 3em;
}

.media{
text-align:center;
}

.content {
position: absolute;
width:100%;
top: calc(3em + 10px);
right: 0;
bottom: 0;
left: 0;
}

.message {
position:absolute;
top:0;
background:#f0f0f0;
height:100%;
}

.media {
right:0;
bottom:0;
position:absolute;
left:0;
top:0;
overflow:hidden;
}

img.mediaImg {
transform:translate(-50%,-50%);

left:50%;
top:50%;
position:absolute;
max-height:100%;
}





