:root {
  --elementDark: #408000;
  --elementLight: rgba(189, 255, 128,1.0);
  --elementLightSemi: rgba(189, 255, 128,0.5);  
  --backgroudLight: #f0fff0;
}

html { 
	width:100%; 
	height:100%; 
    font-family: Arial, sans-serif;
	background-color: var(--backgroudLight);
	border:0;
	padding:0;
	margin:0;
}

body {
	border:0;
	padding:0;
	margin:0;
}	

/* ============================ main index ======================== */
.lastpicturediv {
	position: relative;
	width: 100%;
	height:auto;
	margin-top:60px;
	display: flex;
	justify-content: center;	
}

.reference {
	position: relative;
	text-shadow: 0px 0px 30px #000000, 0px 0px 15px var(--elementDark), 0px 0px 5px #000000;
}

.lastpicture {
	height: auto;
	width: auto;
	max-width: 48vw;
	max-height: 96vh;
	margin-left: 1vw;
	margin-right: 1vw;		
}

.camplace {
  position: absolute;
  display: inline;		
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--elementLight);
  text-align: center;  
  font-size: 22px;  
  font-weight:bold;
  left: 5vw;  
  top: 5vh;  
}	

.message {
  position: absolute;
  display: inline;		
  border: 0;
  outline: 0;
  background: transparent;
  left: 10vw;  
  top: 1vh;    
  width: 80vw;
  text-align: center;  
  font-size: 16px;  
  font-weight:bold;
}

@media(orientation:portrait) {
	.lastpicturediv {
		position: relative;
		width: 100%;
		height:auto;
		display: grid;
	}
	
	.lastpicture {
		max-width: 98vw;
		max-height: 42vh;		
		margin-bottom: 4vh;				
	}

}