.popup {
    z-index: 9;
    background-color: #f1f1f1;
    border: 1px solid #d3d3d3;
    text-align: center;
    position: fixed;
    top: 100px;
  }

  .close {
    z-index: 1000;
  }

  .close:hover {
    cursor: pointer;
  }

  .popup-header {
    padding: 2px 5px 2px 5px;
    cursor: move;
    z-index: 10;
    background-color: #fff;
    color: #790b06;
    text-align: right;
  }

  /*Resizeable*/

  .popup .resizer-right {
    width: 5px;
    height: 100%;
    position: absolute;
    right: 0;
    bottom: 0;
    cursor: e-resize;
    background: transparent;
      z-index: 10;
  }


  .popup .resizer-bottom {
    width: 100%;
    height: 5px;
  z-index: 10;
    position: absolute;
    right: 0;
    bottom: 0;
    cursor: n-resize;

    background: transparent;
  }

  .popup .resizer-both {
    width: 5px;
    height: 5px;
    background: transparent;
    z-index: 10;
    position: absolute;
    right: 0;
    bottom: 0;
    cursor: nw-resize;

  }


  .popup .resizer-both-left {
    width: 5px;
    height: 5px;
    background: transparent;
    z-index: 10;
    position: absolute;
    left: 0;
    bottom: 0;
    cursor: nw-resize;

  }

  .popup .resizer-left {
    width: 5px;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    cursor: e-resize;
    background: transparent;
  }

  /*NOSELECT*/

  .popup * {
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
  }

  .popup-body {
    width: 100%;
    height: 100%;
    overflow: auto;
    min-width: 100px;
    min-height: 100px;
  }

  .dragable-div-img {
    width: 100%;

    object-fit: cover;
  }

  .popup-header-close,
  .popup-header-close-ar {
    cursor: pointer;
    padding: 2px;
    font-size: large;
    font-weight: bold;
    color: #790b06;
  }


  .attachment-image-loading,
  .attachment-image-loading-ar {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #790b06;
    width: 20px;
    height: 20px;
    -webkit-animation: spin 2s linear infinite;
    /* Safari */
    animation: spin 2s linear infinite;
    float: left;
  }

  /* Safari */
  @-webkit-keyframes spin {
    0% {
      -webkit-transform: rotate(0deg);
    }

    100% {
      -webkit-transform: rotate(360deg);
    }
  }

  @keyframes spin {
    0% {
      transform: rotate(0deg);
    }

    100% {
      transform: rotate(360deg);
    }
  }

  .header-navigation,
  .header-navigation-ar {
    float: left;
    color: #790b06;
    padding-left: 10px;
    margin-right: 10px;
  }

  .header-navigation-left,
  .header-navigation-right,
  .header-navigation-left-ar,
  .header-navigation-right-ar {
    float: left;
    margin: 5px;
    font-weight: bolder;
    font-size: larger;
    color: #790b06;
    cursor: pointer;
  }

  .header-navigation-ar {
    float: right;
  }

  .header-navigation-left:hover,
  .header-navigation-right:hover,
  .popup-header-close:hover,
  .header-navigation-left-ar:hover,
  .header-navigation-right-ar:hover,
  .popup-header-close-ar:hover {

    color: #aaa;
  }


  .attachment-file {
       cursor: pointer;
    background-color: white;
    border: 1px solid #F1F0EE; 
    border-left: none;
    color: #701B1F;
    margin-left: 0px;
    padding: 5px;
    font-size: 14px;
    font-weight: 500;
    padding: 10px;
    font-weight: 700;
    font-family: "Dubai", sans-serif;
    font-size: 16px;
    font-weight: 500;
  }
  
.attachment-file-title{
     
   margin-top: 20px; 
    padding: 5px;
    font-size: 14px;
    padding: 10px;
    font-family: "Dubai", sans-serif;
    font-size: 16px;
  }

  .popup-header-close-ar {
    float: left !important;
  }

  .attachment-image-loading-ar,
  .header-navigation-left-ar,
  attachment-image-loading-ar {
    float: right !important;
  }


  .popup-body::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
 
/* Track */
  .popup-body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 0px;
    border-radius: 0px;
}
 
/* Handle */
  .popup-body::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0px;
    border-radius: 0px;
  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
  .popup-body::-webkit-scrollbar-thumb:window-inactive {
     
}

.document-viewer-body{
    max-height: 200px !important;
    overflow: auto !important;
}