@keyframes popUp{from{transform:translateY(-50%) scale(1)}to{transform:translateY(-50%) scale(1.5)}}
@keyframes fadeOutLeft{from{left:50%;opacity:1}to{left:40%;opacity:0}}
@keyframes fadeOutRight{from{left:50%;opacity:1}to{left:60%;opacity:0}}
@keyframes fadeInLeft{from{left:40%;opacity:0}to{left:50%;opacity:1}}
@keyframes fadeInRight{from{left:60%;opacity:0}to{left:50%;opacity:1}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.jbox-container .pop-up{-moz-animation-name:popUp;-o-animation-name:popUp;-webkit-animation-name:popUp;animation-name:popUp;-moz-animation-duration:150ms;-o-animation-duration:150ms;-webkit-animation-duration:150ms;animation-duration:150ms;-moz-animation-timing-function:ease-in-out;-o-animation-timing-function:ease-in-out;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-moz-animation-iteration-count:2;-o-animation-iteration-count:2;-webkit-animation-iteration-count:2;animation-iteration-count:2;-moz-animation-direction:alternate;-o-animation-direction:alternate;-webkit-animation-direction:alternate;animation-direction:alternate}
.jbox-container .fade-in,.jbox-container .fade-in-left,.jbox-container .fade-in-right,.jbox-container .fade-out-left,.jbox-container .fade-out-right{animation-timing-function:ease-in-out;animation-fill-mode:forwards;animation-iteration-count:1}
.jbox-container .fade-out-left{animation-name:fadeOutLeft;animation-duration:150ms}
.jbox-container .fade-out-right{animation-name:fadeOutRight;animation-duration:150ms}
.jbox-container .fade-in-right{animation-name:fadeInRight;animation-duration:150ms}
.jbox-container .fade-in-left{animation-name:fadeInLeft;animation-duration:150ms}
.jbox-container .fade-in{animation-name:fadeIn;animation-duration:0s}
.jbox-img{cursor:pointer}
.jbox-container{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.75);display:none;color:#fff;z-index:999;}
.jbox-container .img-alt-text{position:fixed;font-family:'Open Sans',sans-serif;text-shadow:0 0 10px rgba(0,0,0,.5);bottom:0;left:0;padding:15px;width:100%;text-align:center}

@media screen and (min-width:768px){
	.jbox-container .img-alt-text{text-align:left;top:0}
	}
@media screen and (min-width:992px){
	.jbox-container .img-alt-text{padding: 50px; float: left; width: 100%; text-align: center;font-size: 30px;}
	}

.jbox-container img{position:fixed;top:50%;left:50%;-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);-o-transform:translateX(-50%) translateY(-50%);-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);width:auto;max-height:100%;max-width:100%;border:2px solid #fff;z-index:11;box-shadow:5px 5px 50px rgba(0,0,0,.5)}
.jbox-container svg{position:fixed;top:50%;-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:12;height:20px;width:20px;cursor:pointer;fill:#fff;-moz-transition:all 150ms ease-in-out;-o-transition:all 150ms ease-in-out;-webkit-transition:all 150ms ease-in-out;transition:all 150ms ease-in-out}
.jbox-container .jbox-next{right:10px}
.jbox-container .jbox-prev{left:10px}

@media screen and (min-width:768px){
	.jbox-container img{max-height:85%;max-width:85%}
	.jbox-container svg:hover{-moz-transform:translateY(-50%) scale(1.5);-ms-transform:translateY(-50%) scale(1.5);-o-transform:translateY(-50%) scale(1.5);-webkit-transform:translateY(-50%) scale(1.5);transform:translateY(-50%) scale(1.5)}
	.jbox-container svg{font-size:65px;height:50px;width:50px}
	.jbox-container .jbox-next{right:25px}
	.jbox-container .jbox-prev{left:25px}
	}

.jbox-container .jbox-close{top:25px;right:25px;height:15px;width:15px;transform:translateY(0)}

@media screen and (min-width:768px){
	.jbox-container .jbox-close{top:120px;right:50px;height:25px;width:25px}
	}