@charset "utf-8";

@-ms-viewport { width:device-width; }
@media only screen and (min-device-width:800px) { html { overflow:hidden; } }
html { height:100%; }
body { height:100%; overflow:hidden; margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#000000; }

.outer {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:999999;
	width:100%;
	height:100%;
	background-color:#000;
	display: none;
}
.embed-responsive {
    position: absolute;
    left: 0; right: 0;
    top: 50%;
    margin-top: -28.1%;
    /* video height / video width */
    padding-bottom: 56.2%;
    height: 0;
    overflow: hidden;
}
#picture-middle {
	margin-top: 0;
	top: 0;
	height: 100%;
	padding-bottom: 0;
	bgcolor: #f00;
}
.embed-responsive iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	border: none;
	text-align: center;
}
.embed-responsive img.ri
{
	position: absolute;
	max-width: 80%;
	max-height: 80%;
	top: 10%;
	left: 10%;
	border-radius: 3px;
	box-shadow: 0 3px 6px rgba(0,0,0,0.9);
}
.embed-responsive img.ri:empty
{
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
@media screen and (orientation: portrait) {
  .embed-responsive img.ri { max-width: 90%; }
}

@media screen and (orientation: landscape) {
  .embed-responsive img.ri { max-height: 90%; }
}
.close {
	position: absolute;
	z-index:999999;
	top: 15px;
	right: 15px;
}