
.gallery-item {
	cursor: pointer;
	transition: 0.3s;
	width:100%;
}

#gallery-modal * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

#gallery-modal {
	display: none;
	z-index: 1000;
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	justify-content: center;
	align-items: center;
	min-height: 100vh;
	overflow: hidden;
	background-color: rgb(0,0,0); /* Fallback */
	background-color: rgba(0,0,0,0.9);
}

.gallery-modal-container {
	height: 100vh;
	max-height: 700px;
	width: 100vw;
	max-width: 700px;
	display: flex;
	background-size: 150px 150px;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center;
}

#gallery-modal-close {
	z-index: 1001;
	position: absolute;
	top: 15px;
	right: 35px;
	color: #f5f5f5;
	font-family: Roboto;
	font-size: 40px;
	font-weight: bold;
	transition: 0.3s;
	opacity: 1;
	filter: drop-shadow(0px 0px 2.5px #000000);
}

#gallery-modal-close:focus ,
#gallery-modal-close:hover {
	color: #ffffff;
	text-decoration: none;
	cursor: pointer;
	opacity: 0.6;
}

#gallery-modal-iframe {
	display:block;
	width: 100%;
	height: 100%;
}

.gallery-modal-container, #gallery-modal-caption {  
	-webkit-animation-name: gallery-zoom;
	-webkit-animation-duration: 0.6s;
	animation-name: gallery-zoom;
	animation-duration: 0.6s;
}

@-webkit-keyframes gallery-zoom {
  from {-webkit-transform:scale(0)} 
  to {-webkit-transform:scale(1)}
}

@keyframes gallery-zoom {
  from {transform:scale(0)} 
  to {transform:scale(1)}
}
