.gg-container{
	color:#fff;
	--gap-length:10px;
	--row-height:200px;
	--column-width:220px;
}

.gg-container *[data-theme="dark"]{}

.gg-box{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(var(--column-width),1fr));
	grid-auto-rows:200px;
	grid-gap:10px;
	margin:20px 50px 50px;}

.gg-box img{object-fit:cover;cursor:pointer;width:100%;height:100%;background-color:rgba(240,240,240,0.9);}
.gg-box img:hover{opacity:.98}
#gg-screen{position:fixed;width:100%;height:100%;top:0;left:0;background-color:rgba(240,240,240,0.9);z-index:9999;text-align:center}#gg-screen 
.gg-image{height:100%;display:inline-flex;justify-content:center;align-items:center}#gg-screen 
.gg-image img{max-width:100%;max-height:100%;margin:0 auto}
.gg-btn{
	width:35px;
	height:35px;
	background-color:#000; 
	color: white;
	text-align:center;
	line-height:35px;
	cursor:pointer;
	-moz-transition:all .4s ease;
	-o-transition:all .4s ease;
	-webkit-transition:all .4s ease;
	transition:all .4s ease;
	font-size:20px;
	box-sizing:border-box;
	padding-left:2px;
	position:fixed;
	bottom:10px}
.gg-btn:hover{background-color: darkturquoise;}
.gg-close{top:10px;}
.gg-close,.gg-next{right:10px;}.gg-prev{right:50px;}
.gg-prev,.gg-next{bottom:10px;}

@media(min-width:478px){
.gg-box img:nth-child(2n):not(:last-of-type){grid-row-end:span 2}[data-layout="horizontal"] img:nth-child(2n):not(:last-of-type){grid-column-end:span 2;grid-row-end:span 1}[data-layout="square"] img:nth-child(2n):not(:last-of-type){grid-row-end:span 1;grid-column-end:span 1}}@media(max-width:768px){.gg-box{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));grid-auto-rows:calc(var(--row-height) - 15vh);margin:10px}}@media(max-width:450px){.gg-box{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}}
#last{}