/*main CSS*/
#pictureViewer{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.3);
    z-index: 10000;
}
#pictureViewer > .content{
    /*background-color: #fff;*/
    position: absolute;
    width: 60%;
    height: 60%;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
/*#pictureViewer .menu-bar{*/
/*    width: 100%;*/
/*}*/
/*#pictureViewer .menu-bar .handel{*/
/*    width: 40px;*/
/*    height: 40px;*/
/*    float: right;*/
/*    background-repeat: no-repeat;*/
/*    background-position: 50%;*/
/*    cursor: pointer;*/
/*}*/
/*#pictureViewer .menu-bar .handel:hover{*/
/*    background-color: #ff2e67;*/

/*    -webkit-transition: all .3s;*/
/*    -moz-transition: all .3s;*/
/*    -ms-transition: all .3s;*/
/*    -o-transition: all .3s;*/
/*    transition: all .3s;*/
/*}*/
#pictureViewer .menu-bar .handel.maximization{
    background-image: url(../images/icons/maximization_black.png);
    background-size: 14px;
}
#pictureViewer .menu-bar .handel.maximization:hover{
    background-image: url(../images/icons/maximization_white.png);
}
#pictureViewer .menu-bar .handel.miniaturization{
    background-size: 16px;
    background-image: url(../images/icons/miniaturization_black.png);
}
#pictureViewer .menu-bar .handel.miniaturization:hover{
    background-image: url(../images/icons/miniaturization_white.png);
}
#pictureViewer .menu-bar .handel.close-view{
    background-image: url(../images/close_white.png);
    background-size: 15px;
}
/*#pictureViewer .menu-bar .handel.close-view:hover{*/
/*    background-image: url(../images/close_white.png);*/
/*}*/
/*#pictureViewer .handel-prev,*/
/*#pictureViewer .handel-next{*/
/*    display: inline-block;*/
/*    width: 50px;*/
/*    height: 70px;*/
/*    position: relative;*/
/*    top: calc(50% - 80px);*/
/*    background-repeat: no-repeat;*/
/*    background-size: 25px;*/
/*    background-position: 50%;*/
/*    cursor: pointer;*/

/*    -webkit-transition: all .3s;*/
/*    -moz-transition: all .3s;*/
/*    -ms-transition: all .3s;*/
/*    -o-transition: all .3s;*/
/*    transition: all .3s;*/
/*}*/
#pictureViewer .handel-prev{
    background-image: url(../images/icons/prev_blank.png);
}
#pictureViewer .handel-next{
    background-image: url(../images/icons/next_blank.png);
}
/*#pictureViewer .handel-prev:hover,*/
/*#pictureViewer .handel-next:hover{*/
/*    background-color: #ff2e67;*/
/*}*/
#pictureViewer .handel-prev:hover{
    background-image: url(../images/icons/prev_white.png);
}
#pictureViewer .handel-next:hover{
    background-image: url(../images/icons/next_white.png);
}
#pictureViewer .picture-content{
    display: inline-block;
    width: 80%;
    height: 100%;
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
}
#pictureViewer .picture-content .cover{
    position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
/*#pictureViewer .counter{*/
/*    position: absolute;*/
/*    bottom: 0;*/
/*    height: 40px;*/
/*    line-height: 40px;*/
/*    width: 100%;*/
/*    text-align: center;*/
/*    color: #808080;*/
/*    font-size: 13px;*/
/*}*/
#pictureViewer .hide{
    display: none;
}
#pictureViewer .left{
    float: left;
}
#pictureViewer .right{
    float: right;
}
#pictureViewer .clear-flex{
    clear: both;
}
#pictureViewer img{
    max-width: 100%;
    max-height: 100%;
}