.WordFoto .ant-drawer-header {
  border-bottom: none;
  padding: 2px;
  background: #000;
}
.WordFoto .ant-drawer-body {
  background: #000;
}
.WordFoto .btn-fun-icon {
  border-radius: 5px;
  width: 45px;
  height: 45px;
  margin-right: 12px;
  padding: 0px;
  font-size: 12px;
  color: #00c2eb;
  border: #00c2eb;
  background: #000;
}
.WordFoto .btn-fun-icon img {
  width: 24px;
  height: 24px;
}
.WordFoto .hour {
  background: #1890ff;
}
.WordFoto .nohour {
  background: white;
}
.WordFoto .img-big-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: calc(100vh - 53px);
}
.WordFoto .img-big-box .box-left {
  height: calc(100vh - 53px);
  overflow-y: auto;
  width: 280px;
  border-top: 1px solid #1784fc;
}
.WordFoto .img-big-box .box-left .left-img-box {
  width: 217px;
  height: 135px;
  border-radius: 15px;
  border: 1px solid #1784fc;
  margin: 20px auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 5px;
}
.WordFoto .img-big-box .box-left .left-img-box img {
  max-width: 100%;
  max-height: 100%;
}
.WordFoto .ViewerMain {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 100%;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
}
.WordFoto .ViewerMain .viewprt-grid .viewport-drop-target {
  opacity: 1;
  position: relative;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
}
.WordFoto .ViewerMain .viewprt-grid .viewport-container {
  float: left;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-top: 1px solid #f3f3f3;
  border-left: 1px solid #f3f3f3;
  overflow: hidden;
}
.WordFoto .ViewerMain .viewprt-grid .viewport-container .viewport-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
}
.WordFoto .ViewerMain .viewprt-grid .btn-rotateLeft {
  -ms-touch-action: none;
      touch-action: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAflBMVEUAAAASl9sSl9sSldwSltsRltsSltsSl9wSltwRltwSltsSltoRl9wRltwSltwUltwRltsSltsRltsSl9sRl9wSldoSltsSltsTltwSl9wTltsRl9wTltkSl90UmeASltsSltwSltoTl9wRldsRldkSldwRltgamcwAmcwSltuBawaTAAAAKXRSTlMAfylF8cDUu7GinZl2aVIz6+fckvjX0Kp8b2BLNSQZ4d+0iYc8Oi4KBUksFa4AAADPSURBVDjLrZLZjsIwDEWTNpm2dKF02GGGfTn//4OICpVAUvPCfbElH8fyjdX3pak+1LEf6mYl17dnuQ4kxbEPsDyUDMNA9AN6NwJMKRAqGgC5RKgFUPQSs3uEOuohdBsqGChRGcQicIK5CFwNqRJlGcnAL/x1f6D/fSB/ApFB+0DijEhpfKBh1uVFYOfYNXsdsG360jSB0tvB7VnyNmQFtXI1h41z7gsg9p7ELtv0UmVAGfAFzDTdJ2OgDhzlMKdT2jrrI4fMNuNJVq7VN3UD/t0WNl8plo0AAAAASUVORK5CYII=) 8 8, auto;
}
.WordFoto .ViewerMain .viewprt-grid .btn-rotateRight {
  -ms-touch-action: none;
      touch-action: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAe1BMVEUAAAASl9sSl9sSltsTltsSltsRldwRltsRltwSltsSltoRl9wSltwSltwRltsSltsRltsSltwSl9sSltwSld0Rl9wSltsSltwSldoSltsSltwSl9oSlNoRldsSl9wUmeASltsSl9sRltwTl9wTldoRltgamcwAmcwSlturY6PoAAAAKHRSTlMAfynTNLJGv6KdmXRr8Ovn3LySe1P48+DXqohORTsjGcW6ZmBgLgoFm9GXDAAAAMhJREFUOMutktkOgyAUBUGlWrfaajdbuy/z/19YYxNDBPHF88RlJhBOEDOnQrqFkAnjlE0Z773LaMo1MGoEfwqEVv7YASslwfdsPAaWnhjlCZCIce7lINocR7hYQtUtpJ0vIBKulNA4BcXu6xRW3Jz8ApspITZ3r1JqV6xNQZL1bz5SmEKB0oteWLpJ9MG3lBtok/GOFA76nA8uOQPP4Uaqfd49lMaRRNWnW79CLNUFObC918rPwN6cok8c2P91Gh22RRjVLZ4xP9wzFb5/ISdDAAAAAElFTkSuQmCC) 8 8, auto;
}
.WordFoto .ViewerMain .viewprt-grid .btn-scaleBig {
  -ms-touch-action: none;
      touch-action: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAh1BMVEUAAAARltsSltsSl9sSltsRldsSldsRltsRltsSltwRlt0Rl9sTlNwPl9sSltwSl9wSldsTltsRl9wRltwNldYSktsSltsSltwSltsRltwRltsRltsRl9sRldsQlNwSltsSltsTltsTltoSltoSl9sUmeAAqtUSltsSltsSldsRltwRldsSltvAwjz0AAAALHRSTlMAvpp+qmpB7cxxZiolINSfjV9NRxIO8t/ah3dXOjEVz8Syl2FUGQb65eOvk1wv0OoAAAEaSURBVDjLrZJXloMwDEVtaihpENIoaZOpd//rG4LHYCDDV+4HR0Lv6NmyxGt5nxfz/6ve9QSwPVu3p/UVHc6T+gzY22HqWo9omw7rgO9mKg4fknW/7sA561IL2Az8F8LkAEvz/PAZNVF8SdSvb3B7HW1ttVNB6Zs9F2zvKpIgFFe4t/MDKYaCN0i0YA6rpr+UEuqPVyebxlZRqNhCs1OCixZESrD2aVBZZFw0A2t0hgQCofliNhKswDMHXQ4FJ6haQdh6pIs/Yxd+RIccvp73wS428gQ4Gnkl27ybG067jq4P5KLHEfCdPMo2ZbMv45VJJR37IAdc0SfY6/qhNrvRTqqjOCylFXqVvii2mCIA4kmFDZGYJI7FK/gFIJwl4eyc724AAAAASUVORK5CYII=) 8 8, auto;
}
.WordFoto .ViewerMain .viewprt-grid .btn-scaleSmall {
  -ms-touch-action: none;
      touch-action: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAUVBMVEUAAAASltwRltwRltwSltwSltsTl90SltsRl9sSltwRltsSltsQk9sSltsSltsSltsSltwTl9wSlNsQldoRltgSltwTltsQl9cTlt8Tl90SlttpeyAxAAAAGnRSTlMAfXNk9ukouZHQW1VA1PHnvYk5MC7fayATs22fGrkAAAC2SURBVDjLvZLbEoMgDETlLlrr3bb7/x/aWVtnEBx487wkYTOBkFR3sqh6ML0b1XyttwZ/nvJKrynpzmtal+o8lpaeFfRj3QGYjqABUJ91CSCq14bx/ASa8GACzBLEChBJSRWEI2DPCfb8CgdN83rsvOlrDEFCD0/j8YN+B5MmdFFCeoXYOa4oPrLYZvGjSl9dGNanNG6I7MJ4pmdXjlW27NJKsNEcG9h6DhX1mtIAa5WlXUV1C19ehRLXVndnfQAAAABJRU5ErkJggg==) 8 8, auto;
}
.WordFoto .ViewerMain div {
  width: 100%;
  height: 100%;
}