/* The grid: Four equal columns that floats next to each other */

.gallery-container{
	width: 75%;/*was auto;*/
 /* height: 40em;*/
	margin: auto;
	display: flex;
	flex-direction:column;
	position: relative;
	background:#185999;
	justify-content: space-between;
	box-shadow: 0px 0px 25px #888888;   
	border: 8px solid rgb(255, 255, 255);
}

.row{
 /* width: 70em;*/
	display: flex;
	flex-wrap:wrap;
	flex-direction: row;
	align-items: stretch;
	justify-content: flex-start;
	padding: 2em;
}

.column {
	position:relative;
	width:250px; /*20%*/
  /*  object-fit: cover;*/
	margin:10px;
	text-align: left;
	box-shadow: 0px 0px 25px #888888;   
	border: 8px solid rgb(255, 255, 255);
}

.altslide
{
	display:flex;
	justify-content:center;
}

  /* Style the images inside the grid */
 .column img {
	opacity: 0.8; 
	width:100%;
	cursor: pointer; 
 }
  
 .column img:hover {
	opacity: 1;
}

#expandedimg
{
	clip-path: inset(0px -15px 0px -15px);
	max-width:100%;
/*	height:30em;*/
}
  /* Expanding image text */
#imgtext {
  /*  width:99.3%;    
    bottom:0px;
    padding-left: 0.5em;
    padding-right: 0.5em;
    padding-top: 1em;    
    padding-bottom: 1em;    */
	width:98%;
	padding:1%;
	bottom:0px;
	font-size: 14px;    
	position: absolute;
	color: rgb(10, 10, 10);
	background-color:rgb(243, 239, 239, 0.8);
}

.gall_link {
	position: absolute;
	width: 90%;
	left: 5%;
	height: 100%;
}

@media screen and (max-width: 880px) {
	#imgtext
	{
		position:relative;
	}
	.row
	{
		justify-content:space-evenly;
	}
}