.pageEvent{
	/*display:flex;
	justify-content: center;
	
	flex-direction: column;
	gap: 10px;*/
	display: grid;
	grid-auto-flow: row;
	width: 100%;
	height: 100%;
	align-content: start;
}

#imgsPrev{
	display: flex;
	flex-direction: row;
	/*flex-wrap: wrap;*/
	flex-wrap: no-wrap;
	gap: 10px;
	/*justify-content: center;*/
	margin-top: 15px;
	
	
}

.leftArrof{
	clip-path: polygon(100% 0, 0% 50%, 100% 100%, 50% 50%);
	
	
}

.rightArrow{
	clip-path: polygon(0% 0, 100% 50%, 0% 100%, 50% 50%);
	
}

.imgArrow:hover{
	
	transform:  scale(1.1,0.8);

}

.imgArrow{

	transition:all 0.2s linear;
	background-color: #759b88;
	width: 30px;
	flex-shrink: 0;
	flex-grow: 0;
	cursor: pointer;
	transform-origin: center;

	height: 100%;

}

#imgsPrev img
	{
		border-width: 4px;
			border-style: solid;
			border-color: white;
			cursor:pointer;
			box-shadow: 5px 5px 2px Gray ;
	}
	#imgsPrev img:hover
	{
		border-color:ForestGreen;
	}
#bigPics{
	padding: 5%;
	text-align: center;
}

#imgPrevContainer{
			
			display: grid;
			grid-auto-flow: column;
			width: 100%;
			grid-gap: 1rem;
		}

.hiddenScrool{

	overflow: hidden;
	 scroll-behavior: smooth;
	 position: relative;
	 /*scroll-snap-align: start;
	 scroll-snap-type: inline mandatory;*/
}

.imgArrowWrap:hover{
	filter: drop-shadow(0px 0px 5px #4d5c54);
}

.imgArrowWrap{
	 
	 flex-shrink: 0;
	flex-grow: 0;

}

#bigPics{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;

}

#loadingHide
{
	position: absolute;
	background-color: #FEF2DF;
	left: 50%;
	transform: translate(-50%);
	top: 0;
	width: 30px;
	height: 50px;
	z-index: 5;
}

#loadingCircle
{
	width:150px;
	height:150px;
	border-radius: 100%;
	display:flex;
	justify-content:center;
	align-items: center;
	background-color: #4d5c54;
	margin-top: 20px;
	position: relative;
	animation: rotation 2s infinite linear;

}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}


#imgBox
{
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 100%;
}

.loading{
	display: flex;
	justify-content: center;
	align-items: center;
}

@media only screen and (min-width: 1250px)
	{
		.pageEvent{
			/*flex-direction: row;*/
			grid-auto-flow: column;
		}

		.imgArrowWrap{
			display: none;
		}
		
		#imgPrevContainer
		{
			display: block;
		}
		#imgsPrev{
			flex-direction: column;
			flex-wrap: no-wrap;
			justify-content: start;

		}
	
	}

		



	
	
