1<style> 

2	#nosi-modal-home-load .close { 

3		right: 10px; 

4		font-size: 1.5rem; 

5		color: #000; 

6		opacity: 1; 

7		background-color: rgb(255 255 255 / 20%); 

8		border-radius: 50%; 

9		top: 10px; 

10		font-weight: 400;	 

11	} 

12 

13	 @media (max-width: 575.98px) { 

14		#nosi-modal-home-load.modal .modal-dialog { 

15			width: 85%; 

16			height: 90vh; 

17            /*max-width: 280px;*/ 

18		} 

19	} 

20 

21	@media (min-width: 576px) and (max-width: 767.98px) { 

22		#nosi-modal-home-load.modal .modal-dialog { 

23			width: 70%; 

24            /*max-width: 380px;*/ 

25		} 

26	} 

27 

28	@media (min-width: 768px) and (max-width: 991.98px) { 

29		#nosi-modal-home-load.modal .modal-dialog { 

30			width: 60%; 

31            /*max-width: 380px;*/ 

32		} 

33	} 

34 

35	@media (min-width: 992px) and (max-width: 1199.98px){ 

36		#nosi-modal-home-load.modal .modal-dialog { 

37			width: 50%; 

38		} 

39	} 

40	 

41	@media (min-width: 1200px) { 

42      #nosi-modal-home-load.modal .modal-dialog { 

43        /*max-width: 900px*/ 

44		width: 40%; 

45      } 

46} 

47</style> 

48 

49<#assign urlLink = ((modalDocuments.getData())?? && modalDocuments.getData() != "")?string(modalDocuments.getData(), linkTo.getData())  

50/> 

51 

52<div id="nosi-modal-home-load" class="modal pr-0 pt-0"> 

53	<div class="modal-dialog modal-dialog-centered mx-auto position-relative"> 

54		<div class="modal-content border-0 m-auto bg-transparent"> 

55			<div class="modal-body p-0 position-relative"> 

56				<button type="button"  

57                    class="close position-absolute d-none d-lg-block"  

58                    data-dismiss="modal">× 

59                </button> 

60 

61				<a href="${urlLink}" class="text-decoration-none" target="_blank"> 

62					<#if (imageLg.getData())?? && imageLg.getData() != ""> 

63						<img  

64                            class="img-fluid d-block d-lg-none mx-auto"  

65                            alt="${imageLg.getAttribute("alt")}"  

66                            src="${imageLg.getData()}"  

67                        />                         

68					</#if> 

69 

70					<#if (imageXs.getData())?? && imageXs.getData() != "">                         

71                        <img  

72                            class="img-fluid d-none d-lg-block mx-auto"  

73                            alt="${imageXs.getAttribute("alt")}"  

74                            src="${imageXs.getData()}"  

75                        />                         

76					</#if>					 

77				</a>				 

78			</div> 

79		</div> 

80	</div> 

81</div> 

82 

83 

84<script> 

85	$(document).ready(function () { 

86		$("#nosi-modal-home-load").modal('show'); 

87		$('body').removeClass('modal-open').addClass('pr-0'); 

88	});	 

89 

90</script>