.viewer-container,
 .viewer-navbar{background-color:#000;overflow:hidden}
 .viewer-canvas,
 .viewer-container,
 .viewer-footer,
 .viewer-player{right:0;bottom:0;left:0}
 .viewer-button,
 .viewer-canvas,
 .viewer-container,
 .viewer-footer,
 .viewer-list,
 .viewer-navbar,
 .viewer-open,
 .viewer-title,
 .viewer-toolbar,
 .viewer-toolbar>li{overflow:hidden}
 .viewer-close:before,
 .viewer-flip-horizontal:before,
 .viewer-flip-vertical:before,
 .viewer-fullscreen-exit:before,
 .viewer-fullscreen:before,
 .viewer-next:before,
 .viewer-one-to-one:before,
 .viewer-play:before,
 .viewer-prev:before,
 .viewer-reset:before,
 .viewer-rotate-left:before,
 .viewer-rotate-right:before,
 .viewer-zoom-in:before,
 .viewer-zoom-out:before{
    font-size:0;
    line-height:0;
    display:block;
    width:100%;
    height:100%;
    color:transparent;
    /*background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARgAAAAUCAYAAABWOyJDAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAAQPSURBVHic7Zs/iFxVFMa/0U2UaJGksUgnIVhYxVhpjDbZCBmLdAYECxsRFBTUamcXUiSNncgKQbSxsxH8gzAP3FU2jY0kKKJNiiiIghFlccnP4p3nPCdv3p9778vsLOcHB2bfveeb7955c3jvvNkBIMdxnD64a94GHMfZu3iBcRynN7zAOI7TG15gHCeeNUkr8zaxG2lbYDYsdgMbktBsP03jdQwljSXdtBhLOmtjowC9Mg9L+knSlcD8TNKpSA9lBpK2JF2VdDSR5n5J64m0qli399hNFMUlpshQii5jbXTbHGviB0nLNeNDSd9VO4A2UdB2fp+x0eCnaXxWXGA2X0au/3HgN9P4LFCjIANOJdrLr0zzZ+BEpNYDwKbpnQMeAw4m8HjQtM6Z9qa917zPQwFr3M5KgA6J5rTJCdFZJj9/lyvGhsDvwFNVuV2MhhjrK6b9bFiE+j1r87eBl4HDwCF7/U/k+ofAX5b/EXBv5JoLMuILzf3Ap6Z3EzgdqHMCuF7hcQf4HDgeoHnccncqdK/TvSDWffFXI/exICY/xZyqc6XLWF1UFZna4gJ7q8BsRvgd2/xXpo6P+D9dfT7PpECtA3cnWPM0GXGFZh/wgWltA+cDNC7X+AP4GzjZQe+k5dRxuYPeiuXU7e1qwLpDz7dFjXKRaSwuMLvAlG8zZlG+YmiK1HoFqT7wP2z+4Q45TfEGcMt01xLoNZEBTwRqD4BLpnMLeC1A41UmVxsXgXeBayV/Wx20rpTyrpnWRft7p6O/FdqzGrDukPNtkaMoMo3FBdBSQMOnYBCReyf05s126fU9ytfX98+mY54Kxnp7S9K3kj6U9KYdG0h6UdLbkh7poFXMfUnSOyVvL0h6VtIXHbS6nOP+s/Zm9mvyXW1uuC9ohZ72E9uDmXWLJOB1GxsH+DxPftsB8B6wlGDN02TAkxG6+4D3TWsbeC5CS8CDFce+AW500LhhOW2020TRjK3b21HEmgti9m0RonxbdMZeVzV+/4tF3cBpP7E9mKHNL5q8h5g0eYsCMQz0epq8gQrwMXAgcs0FGXGFRcB9wCemF9PkbYqM/Bas7fxLwNeJPdTdpo4itQti8lPMqTpXuozVRVXPpbHI3KkNTB1NfkL81j2mvhDp91HgV9MKuRIqrykj3WPq4rHyL+axj8/qGPmTqi6F9YDlHOvJU6oYcTsh/TYSzWmTE6JT19CtLTJt32D6CmHe0eQn1O8z5AXgT4sx4Vcu0/EQecMydB8z0hUWkTd2t4CrwNEePqMBcAR4mrBbwyXLPWJa8zrXmmLEhNBmfpkuY2102xxrih+pb+ieAb6vGhuA97UcJ5KR8gZ77K+99xxeYBzH6Q3/Z0fHcXrDC4zjOL3hBcZxnN74F+zlvXFWXF9PAAAAAElFTkSuQmCC);
    background-repeat:no-repeat*/
}
.viewer-zoom-in:before{
    content:'Zoom In';
	background: url(viewer/fd.png) no-repeat center center;
	background-size: auto 24px;
}
.viewer-zoom-out:before{
    content:'Zoom Out';
	background: url(viewer/sx.png) no-repeat center center;
	background-size: auto 24px;
}
.viewer-one-to-one:before{
    content:'One to One';
    background: url(viewer/oneToOne.png) no-repeat center center;
    background-size: auto 18px;
}
.headBox{
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    padding: 5px 10px;
    background: rgba(0,0,0,0.2);
}
.viewer-reset.viewer-hide,
.viewer-rotate-left.viewer-hide,
.viewer-rotate-right.viewer-hide,
.viewer-prev.viewer-hide,
.viewer-next.viewer-hide,
.viewer-one-to-one.viewer-hide{
    display: block;
}
.viewer-prev.viewer-hide{
    width: 40px;
    height: 40px;
    position: fixed;
    left: 10px;
    top: 50%;
    margin-top: -20px;
    background-color: rgba(0,0,0,0.2);
}
.viewer-next.viewer-hide{
    width: 40px;
    height: 40px;
    position: fixed;
    right: 10px;
    top: 50%;
    margin-top: -20px;
    background-color: rgba(0,0,0,0.2);
}
.viewer-reset:before{
    content:'Reset';
    background: url(viewer/reset.png) no-repeat center center;
    background-size: auto 18px;
}
.viewer-prev:before{
    content:'Previous';
    background: url(viewer/prev.png) no-repeat center center;
    background-size: auto 18px;
}
.viewer-play:before{
    content:'Play';
	background: url(viewer/max.png) no-repeat center center;
	background-size: auto 28px;
}
.viewer-next:before{
    content:'Next';
    background: url(viewer/next.png) no-repeat center center;
    background-size: auto 18px;
}
.viewer-rotate-left:before{
    content:'Rotate Left';
    background: url(viewer/rotateLeft.png) no-repeat center center;
    background-size: auto 24px;
}
.viewer-rotate-right:before{
    content:'Rotate Right';
    background: url(viewer/rotateRight.png) no-repeat center center;
    background-size: auto 24px;
}
.viewer-flip-horizontal:before{
    content:'Flip Horizontal';
	background: url(viewer/hfz.png) no-repeat center center;
	background-size: auto 24px;
}
.viewer-flip-vertical:before{
    content:'Flip Vertical';
	background: url(viewer/sfz.png) no-repeat center center;
	background-size: auto 24px;
}
.viewer-fullscreen:before{
    content:'Enter Full Screen';
    background-position:-220px 0;
}
.viewer-fullscreen-exit:before{
    content:'Exit Full Screen';
    background-position:-240px 0;
}
.viewer-close:before{
    content:'Close';
    background: url(viewer/close.png) no-repeat center center;
    background-size: auto 17px;
}
.viewer-container{
    font-size:0;
    line-height:0;
    position:absolute;
    top:0;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    background-color:rgba(0,0,0,.9);
    direction:ltr!important;
    -ms-touch-action:none;
    touch-action:none;
    -webkit-tap-highlight-color:transparent;
    -webkit-touch-callout:none;
}
.viewer-container ::-moz-selection,
.viewer-container::-moz-selection{background-color:transparent}
.viewer-container ::selection,
.viewer-container::selection{background-color:transparent}
.viewer-container img{
    display:block;
    width:100%;
    min-width:0!important;
    max-width:none!important;
    height:auto;
    min-height:0!important;
    max-height:none!important
}
.viewer-player,
.viewer-tooltip{display:none;position:absolute}
.viewer-canvas{position:absolute;top:0}
.viewer-canvas>img{width:auto;max-width:90%!important;height:auto;margin:15px auto}
.viewer-footer{position:absolute;text-align:center}
.viewer-number{
    display: inline-block;
    overflow: hidden;
    line-height: 30px;
    font-size: 14px;
    color:#fff;
    margin-bottom: 20px;
    background: rgba(0,0,0,0.4);
    padding: 0px 10px;
    border-radius: 30px;
}
.viewer-number span,
.viewer-number i{
    padding: 0px 5px;
}
.viewer-navbar{
    background-color:rgba(0,0,0,.5);
}
.viewer-navbar-div{
    width: ;
    overflow: hidden;
    position: relative;
    margin: 0px auto;
}
.viewer-list{
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
    height:50px;
    margin:0;
    padding:10px 0;
}
.viewer-list>li{
    font-size:0;
    line-height:0;
    float:left;
    overflow:hidden;
    width:50px;
    height:50px;
    cursor:pointer;
    opacity:.5;
    color:transparent;
    filter:alpha(opacity=50);
    position: relative;
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 2px;
}
.viewer-list>li.viewer-active{
    border: 1px solid rgba(255,255,255,0.5);
}
/*.viewer-list>li:after{
    display: block;
    content: "";
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
}*/
.viewer-list>li img{
    display:block;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    margin: 0px !important;
}
.viewer-list>li{
    margin:0px 3px;
}
.viewer-list>.viewer-active{opacity:1;filter:alpha(opacity=100)}
.viewer-player{top:0;cursor:none;background-color:#000}
.viewer-player>img{position:absolute;top:0;left:0}
.viewer-toolbar{
    overflow: hidden;
    float: right;
}
.viewer-toolbar>li{
    float:left;
    width:30px;
    height:30px;
    cursor:pointer;
    border-radius:50%;
    /*background-color:#000;
    background-color:rgba(0,0,0,.2);*/
    margin: 0px 5px;
}
.viewer-toolbar>li:hover{/*background-color:#000;background-color:rgba(0,0,0,.8)*/}
.viewer-toolbar>li:before{margin:0px}
.viewer-toolbar>li+li{/*margin-left:1px*/}
.viewer-toolbar>.viewer-play{width:30px;height:30px;}
.viewer-tooltip{font-size:12px;line-height:20px;top:50%;left:50%;width:50px;height:20px;margin-top:-10px;margin-left:-25px;text-align:center;color:#fff;border-radius:10px;background-color:#000;background-color:rgba(0,0,0,.8)}
.viewer-title{
    float: left;
    font-size:14px;
    line-height:1;
    white-space:nowrap;
    text-overflow:ellipsis;
    opacity:.8;
    color:#fff;
    filter:alpha(opacity=80);
    overflow: hidden;
    line-height: 30px;
}
.viewer-title:hover{opacity:1;filter:alpha(opacity=100)}
.viewer-button{
    float: right;
    /*position:absolute;
    top:10px;
    right:10px;*/
    width:30px;
    height:30px;
    cursor:pointer;
    border-radius:50%;
    /*background-color:#000;
    background-color:rgba(0,0,0,.2);*/
    margin: 0px 5px;
    position: relative;
}
.viewer-button:before{
    position:absolute;
    bottom:0px;
    left:0px;
}
.viewer-fixed{position:fixed}
.viewer-show{display:block}
.viewer-hide{display:none}
.viewer-invisible{visibility:hidden}
.viewer-move{cursor:move;cursor:-webkit-grab;cursor:-moz-grab;cursor:grab}
.viewer-fade{opacity:0;filter:alpha(opacity=0)}
.viewer-in{opacity:1;filter:alpha(opacity=100)}
.viewer-transition{-webkit-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}
@media (max-width:767px){
    .viewer-hide-xs-down{display:none}
}
@media (max-width:991px){
    .viewer-hide-sm-down{display:none}
}
@media (max-width:1199px){
    .viewer-hide-md-down{display:none}
}
.aykj-prev{width: 50px;height: 50px;position: absolute;left: 5%;top: 50%;margin-top: -25px;background: url(viewer/prev.png) no-repeat center center / 10px;z-index: 5;cursor: pointer;border-radius: 50%;background-color: rgb(255 255 255 / 15%);}
.aykj-next{width: 50px;height: 50px;position: absolute;right: 5%;top: 50%;margin-top: -25px;background: url(viewer/next.png) no-repeat center center / 10px;z-index: 5;cursor: pointer;border-radius: 50%;background-color: rgb(255 255 255 / 15%);}
.aykj-prev:hover,.aykj-next:hover{background-color: rgb(255 255 255 / 30%);}

.aykj-viewer .viewer-one-to-one,.aykj-viewer .viewer-prev,.aykj-viewer .viewer-next,.aykj-viewer .viewer-flip-horizontal,.aykj-viewer .viewer-flip-vertical{display: none;}
.aykj-viewer .viewer-reset:before{background-image: url(viewer/oneToOne.png);}