|  | @@ -24,7 +24,6 @@
 | 
	
		
			
				|  |  |    min-width: 150px;
 | 
	
		
			
				|  |  |    max-height: 150px;
 | 
	
		
			
				|  |  |    padding-right: 16px;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  .attachment-thumbnail {
 | 
	
		
			
				|  |  |    max-width: 150px;
 | 
	
	
		
			
				|  | @@ -81,7 +80,7 @@
 | 
	
		
			
				|  |  |    top: 0;
 | 
	
		
			
				|  |  |    left: 0;
 | 
	
		
			
				|  |  |    z-index: 9999 !important;
 | 
	
		
			
				|  |  | -  background: rgba(13,13,13,0.95);
 | 
	
		
			
				|  |  | +  background: rgba(13, 13, 13, 0.95);
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  #viewer-container {
 | 
	
		
			
				|  |  |    display: flex;
 | 
	
	
		
			
				|  | @@ -99,10 +98,12 @@
 | 
	
		
			
				|  |  |  #attachment-name {
 | 
	
		
			
				|  |  |    color: white;
 | 
	
		
			
				|  |  |    font-size: 1.5em;
 | 
	
		
			
				|  |  | -  max-width: calc(100% - 50px); /* Make sure the name does not overlap the close button */
 | 
	
		
			
				|  |  | +  max-width: calc(
 | 
	
		
			
				|  |  | +    100% - 50px
 | 
	
		
			
				|  |  | +  ); /* Make sure the name does not overlap the close button */
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  #viewer-close {
 | 
	
		
			
				|  |  | -  color:white;
 | 
	
		
			
				|  |  | +  color: white;
 | 
	
		
			
				|  |  |    cursor: pointer;
 | 
	
		
			
				|  |  |    font-size: 4em;
 | 
	
		
			
				|  |  |    top: 0;
 | 
	
	
		
			
				|  | @@ -111,7 +112,7 @@
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  .attachment-arrow {
 | 
	
		
			
				|  |  |    font-size: 4em;
 | 
	
		
			
				|  |  | -  color:white;
 | 
	
		
			
				|  |  | +  color: white;
 | 
	
		
			
				|  |  |    cursor: pointer;
 | 
	
		
			
				|  |  |    align-self: center;
 | 
	
		
			
				|  |  |    margin: 0 20px;
 | 
	
	
		
			
				|  | @@ -124,17 +125,16 @@
 | 
	
		
			
				|  |  |    height: calc(100% - 50px);
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  #image-viewer {
 | 
	
		
			
				|  |  | -  background:
 | 
	
		
			
				|  |  | -    repeating-conic-gradient(#808080 0% 25%, transparent 0% 50%)
 | 
	
		
			
				|  |  | -      50% / 20px 20px; /* Checkerboard background for transparent images */
 | 
	
		
			
				|  |  | -      max-width: 100%;
 | 
	
		
			
				|  |  | -      max-height: 100%;
 | 
	
		
			
				|  |  | +  background: repeating-conic-gradient(#808080 0% 25%, transparent 0% 50%) 50% /
 | 
	
		
			
				|  |  | +    20px 20px; /* Checkerboard background for transparent images */
 | 
	
		
			
				|  |  | +  max-width: 100%;
 | 
	
		
			
				|  |  | +  max-height: 100%;
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  #pdf-viewer {
 | 
	
		
			
				|  |  |    width: 40vw;
 | 
	
		
			
				|  |  |    height: 100%;
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  | -#txt-viewer{
 | 
	
		
			
				|  |  | +#txt-viewer {
 | 
	
		
			
				|  |  |    background-color: white;
 | 
	
		
			
				|  |  |    width: 40vw;
 | 
	
		
			
				|  |  |    height: 100%;
 | 
	
	
		
			
				|  | @@ -156,25 +156,29 @@
 | 
	
		
			
				|  |  |    #viewer-container {
 | 
	
		
			
				|  |  |      display: block;
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  | -  .attachment-arrow{
 | 
	
		
			
				|  |  | +  .attachment-arrow {
 | 
	
		
			
				|  |  |      position: absolute;
 | 
	
		
			
				|  |  |      bottom: 2.2em;
 | 
	
		
			
				|  |  |      font-size: 1.6em;
 | 
	
		
			
				|  |  |      padding: 16px;
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  | -  #prev-attachment{
 | 
	
		
			
				|  |  | +  #prev-attachment {
 | 
	
		
			
				|  |  |      left: 0;
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  | -  #next-attachment{
 | 
	
		
			
				|  |  | +  #next-attachment {
 | 
	
		
			
				|  |  |      right: 0;
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |    #pdf-viewer {
 | 
	
		
			
				|  |  |      width: 100%;
 | 
	
		
			
				|  |  | -    height: calc(100vh - 155px);  /* Full height - height of top and bottom bars */
 | 
	
		
			
				|  |  | +    height: calc(
 | 
	
		
			
				|  |  | +      100vh - 155px
 | 
	
		
			
				|  |  | +    ); /* Full height - height of top and bottom bars */
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |    #txt-viewer {
 | 
	
		
			
				|  |  |      width: 100%;
 | 
	
		
			
				|  |  | -    height: calc(100vh - 155px);  /* Full height - height of top and bottom bars */
 | 
	
		
			
				|  |  | +    height: calc(
 | 
	
		
			
				|  |  | +      100vh - 155px
 | 
	
		
			
				|  |  | +    ); /* Full height - height of top and bottom bars */
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |    #audio-viewer {
 | 
	
		
			
				|  |  |      margin-top: 20%;
 |