/************** Color variables **************/
:root {
	--bg-width: 3840px; /* changed by anna: correct 4K dimensions */
	--bg-height: 2160px;
	--bg-color: #5536dc;/*changed by anna*/
	--bg-color-pale: #8d8dff;
	--text-color: #3d3d3b;
	--text-underline-color : #7e7e7c;
	--form-bg-color: rgba(255, 255, 255, 0.75);}
	
/****************	Typography		*****************/
body {
	color: var(--text-color);}
.maj {
	text-transform: uppercase;}

/* Tombe modal */
.txtstyle1 {
    font-size: 5vmin;
    font-family: Garamond, serif;
	line-height: 6vmin;
	text-shadow: 0px 1px 0px  #bebcb4, 0px -1px 0px #5536dc;
	color: #7e7e7c;
	text-shadow: 0px 1px 0px  #bebcb4, 0px -1px 0px #3d3d3b;
}

/* Elem interactifs modal */
.txtstyle2 {
	color: #663b28;
	font-family: Consolas;
	font-size: clamp(11px, 3.5vmin, 54px);
	line-height: clamp(15px, 4vmin, 65px);
	/*text-shadow: 0 0 1.5vmin black;*/}
	
/**************** 	 Global layout & elements ****************/
body, .panzoom-parent, #zoomable, .cemetary_bg, main, main > * {
	overflow: hidden;}

body {
	background-color: var(--bg-color);
	margin: 0;}

.panzoom-parent {
	width: 100vw;
	height: 100vh;
	min-width: 100vw;
	min-height: 100vh;}
	
#zoomable {
	width: var(--bg-width);
	height: var(--bg-height);}
	
.cemetary_bg {
	background: url('../images/cemetary_bg.jpg') no-repeat 50% top;
	width: 100%;
	height: 100%;}
	
main .view-id-ddd {
	width: var(--bg-width);
	height: var(--bg-height);
	position: absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;}
	
#preload {
	display: none;
	visibility: hidden;}
	
video {
	max-width: 100%;}

/**************** 	 Tombes 	 ****************/
.tombe {
	position: absolute;
	width: 75px;
	height: 65px;
	background: url(../images/A01gr.png) no-repeat;
	background-size: cover;
	margin: 16px 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;}

.tombe.modele-a02, .tombe.modele-a02 .file { background-image: url(../images/A02gr.png);}
.tombe.modele-a03, .tombe.modele-a03 .file { background-image: url(../images/A03gr.png);}
.tombe.modele-a04, .tombe.modele-a04 .file { background-image: url(../images/A04gr.png);}
.tombe.modele-a05, .tombe.modele-a05 .file { background-image: url(../images/A05gr.png);}
.tombe.modele-a06, .tombe.modele-a06 .file { background-image: url(../images/A06gr.png);}
.tombe.modele-a07, .tombe.modele-a07 .file { background-image: url(../images/A07gr.png);}
.tombe.modele-a08, .tombe.modele-a08 .file { background-image: url(../images/A08gr.png);}
.tombe.modele-b01, .tombe.modele-b01 .file { background-image: url(../images/B01gr.png);}
.tombe.modele-b02, .tombe.modele-b02 .file { background-image: url(../images/B02gr.png);}
.tombe.modele-b03, .tombe.modele-b03 .file { background-image: url(../images/B03gr.png);}
.tombe.modele-b04, .tombe.modele-b04 .file { background-image: url(../images/B04gr.png);}
.tombe.modele-b05, .tombe.modele-b05 .file { background-image: url(../images/B05gr.png);}
.tombe.modele-b06, .tombe.modele-b06 .file { background-image: url(../images/B06gr.png);}
.tombe.modele-b07, .tombe.modele-b07 .file { background-image: url(../images/B07gr.png);}
.tombe.modele-c01, .tombe.modele-c01 .file { background-image: url(../images/C01gr.png);}
.tombe.modele-c02, .tombe.modele-c02 .file { background-image: url(../images/C02gr.png);}
.tombe.modele-c03, .tombe.modele-c03 .file { background-image: url(../images/C03gr.png);}
.tombe.modele-c04, .tombe.modele-c04 .file { background-image: url(../images/C04gr.png);}
.tombe.modele-c05, .tombe.modele-c05 .file { background-image: url(../images/C05gr.png);}
.tombe.modele-c06, .tombe.modele-c06 .file { background-image: url(../images/C06gr.png);}
.tombe.modele-c07, .tombe.modele-c07 .file { background-image: url(../images/C07gr.png);}
.tombe.modele-c08, .tombe.modele-c08 .file { background-image: url(../images/C08gr.png);}
.tombe.modele-d01, .tombe.modele-d01 .file { background-image: url(../images/D01gr.png);}
.tombe.modele-d02, .tombe.modele-d02 .file { background-image: url(../images/D02gr.png);}
.tombe.modele-d03, .tombe.modele-d03 .file { background-image: url(../images/D03gr.png);}

.epitaph-wrapper,
.trigger-modal {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;}
	
.tombe.sticky-On .trigger-modal:hover {
	cursor: pointer;}
	
/* File download link */
.tombe .file {
	position: relative;
	top: 48px;
	width: 75px;
	height: 50px;
	background: url(../images/A01gr.png) no-repeat;
	background-position: bottom;
	background-size: cover;}

.tombe .file a {
	position: absolute;
	top: 4px;
	right: 20px;
	bottom: 8px;
	left: 20px;}
	
/****************  Epitaph Modal  ****************/
.modal {
	display: none;
	visibility: hidden;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	overflow: auto;
	background-color: rgba(0, 0, 0, 0.7);
	z-index: 9999;}

.modal-window {
	position: relative;
	background-position: top center;
	background-size: contain;
	width: 70vmin;
	height: 52.5vmin;
	margin: 6vh auto;
	padding: 10vmin 13vmin;
	display: flex;
	justify-content: center;
	align-items: center;}
	
.modal-window.tombe-modal  {
	background: url("../images/epitaph_bg1.jpg") no-repeat;
	background-size: cover;}
.modal-window.tombe-modal.epi_bg2  {
	background-image: url("../images/epitaph_bg2.jpg");}
.modal-window.tombe-modal.epi_bg3  {
	background-image: url("../images/epitaph_bg3.jpg");}
.modal-window.tombe-modal.epi_bg4  {
	background-image: url("../images/epitaph_bg4.jpg");}
.modal-window.tombe-modal.epi_bg5  {
	background-image: url("../images/epitaph_bg5.jpg");}
.modal-window.tombe-modal.epi_bg6  {
	background-image: url("../images/epitaph_bg6.jpg");}
.modal-window.tombe-modal.epi_bg7  {
	background-image: url("../images/epitaph_bg7.jpg");}
.modal-window.tombe-modal.epi_bg8  {
	background-image: url("../images/epitaph_bg8.jpg");}
.modal-window.tombe-modal.epi_bg9  {
	background-image: url("../images/epitaph_bg9.jpg");}
.modal-window.tombe-modal.epi_bg10  {
	background-image: url("../images/epitaph_bg10.jpg");}

.modal-window.ei-modal {
	flex-direction: column;
	height: auto;
	padding: 0;
	width: 90vmin;
	max-width: 960px;}
	
.modal-window.ei-modal img {
	max-width: 100%;}
	
.modal-window.ei-modal .txt {
	margin-top: 15%; /* added by Anna */
	position: absolute;
	padding: 5vmin 11vmin;

}
	
/* .modal-window.ei-modal img {
	min-width: 20vw;
	min-height: 20vh;
	background: var(--text-underline-color);} */
	
.modal-window.ei-modal .close {
	color: var(--form-bg-color);}

.close {
	position: absolute;
	top: 0;
	right: 0;
	color: var(--bg-color);
	height: 30px;
	width: 30px;
	font-size: 30px;
	line-height: 30px;
	text-align: center;
	z-index: 10;}

.close:hover,
.close:focus {
	color: #000000;
	cursor: pointer;}

.modal.open {
	visibility: visible;
	display: flex;
	align-items: center;}
	
/***************	Autres éléments interactifs		************/
.eleminteractif {
	position: absolute;}

.eleminteractif:not(.animationauto):hover {
	cursor: pointer;}
	
.img-width-fit img {
	max-width: 100%;}
	
a.anchor-fit-parent {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;}
	
.toggle_btn {
	display: none;}
  
.toggle_clic_zone {
	user-select: none;}
	
.toggle_clic_zone:hover {
	cursor: pointer;}
		
.toberevealed_cntnt {
	opacity: 0;
	transition: all .25s ease-out;}

.toberevealed_cntnt a {
	display: none;
	position: absolute;}

.toggle_btn:checked ~ label .toberevealed_cntnt {
	opacity: 1;
	width: auto;}

.toggle_btn:checked ~ label .toberevealed_cntnt a {
	display: inline;}
	
.eleminteractif video {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;}
	
/**************** 	 Tooltip	  ****************/
.tt-link {
	z-index: 900;
	position: relative;}

.tt-link:hover {
	cursor: pointer;}

.tt-cntnt {
	display: none;
	position: absolute;}

.tt-link:hover .tt-cntnt {
	display: block;}

/**************** 	 Form and messages	  ****************/
form, article, .webform-access-denied {
    font-family: Consolas;
	background: var(--form-bg-color);
	padding: 3vh 3vw;
	max-width: 800px;
	position: absolute;
  left: 0;
  right: 0;
  top: 5vh;
  margin: auto;

}
	
/*************** Latest form entry highlighted **********/
.tombe .views-field-changed {
	display:none;
	visibility: hidden;}
	
.view-id-ddd .tombe:first-child .epitaph-wrapper {
	z-index: 5;}

.view-id-ddd .tombe:first-child::after {
	content:'';
	position: absolute;
	top: 0;
	right: 0;
	bottom: -10px;
	left: 0;
	background: radial-gradient(circle, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.5) 30%, rgba(255,255,255,0) 80%);
	border-radius: 50%;
	z-index: 1;}
 
 /**************** 	 Admin helpers	  ****************/
.path-everthing-map .eleminteractif {
	outline: 1px dashed white;}
	
 .red {
	color: red;}
 .green {
	color: green;}
	
.admin {
	display: none;
	visibility: hidden;}

.user-logged-in .admin {
	display: block;
	visibility: visible;}

.eleminteractif .admin {
	position: absolute;
	top: -1.25em;
	min-width: 300px;
	background: rgba(127,127,127,0.5);}

.eleminteractif .admin a {
	color: white;}
	
details.webform-submission-information {
	display: none;
	visibility: hidden;}
	
.path-frontpage .eleminteractif .admin {
	display: none;
	visibility: hidden;}
	
.tt-link.admin {
	font-size: 9px;
	border-radius: 50%;
	padding: 3px 4px;
	background: white;
	line-height: 0.75 !important;}
	
.Verrouillé .tt-link.admin {
	background: yellow;
	border: 1px solid orange;}
	
.tt-link.admin .tt-cntnt {
	background: white;
	padding: 5px 10px;
	width: 120px;
	top: 0;}
