#main-cont {
	background-color: #a7bd37;
  margin-right: auto;
  margin-left: auto;
	width: 99%;
}

#row2 {
	background-color: #a7bd37;
	color: #555;
	width: 100%;
	display: grid;
	gap: 10px;
	grid-template-columns: auto auto;	
}


.refItem {
	transition: all 300ms linear 0s;
	overflow: hidden;
	cursor: pointer;
	position: relative;
	width: 100%;
}

.refItem img {
	max-width: 100%;
	max-height: 100%;
  display: block;
	-webkit-transition:all 400ms linear 0s;
  -moz-transition:all 400ms linear 0s;
  -o-transition:all 400ms linear 0s;
	transition: all 400ms linear 0s;
}

.colorPlate {
	-webkit-transition:all 400ms linear 0s;
  -moz-transition:all 400ms linear 0s;
  -o-transition:all 400ms linear 0s;
	transition: all 400ms linear 0s;
  background-color: rgba(167,189,55,0.85);
	pacity: 1;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	opacity: 0;

}

.txt-wrap {
	position: absolute;
	top: calc(3.5vw);
  /*! left: 50%; */
  width: 100%;
	height: 100%;
	color: #fff;
	-webkit-transition:all 200ms linear 0.1s;
  -moz-transition:all 200ms linear 0.1s;
  -o-transition:all 200ms linear 0.1s;
	transition: all 200ms ease-in 0.1s;
	opacity: 0;
	display: block;
	top: 2em;
}

.txt {
	width: 100%;
	font-size: 1em;
	text-align: center;
	line-height: 1.5em;
}

.txt.winner {
	font-size: 1.2em;
	margin-bottom: 0.5em;
}

.txt.title {
	font-size: 1.3em;
	margin-bottom: 0.5em;
}


.refItem:hover > img {
  transform: scale(1.1, 1.1);
}

.refItem:hover  > .txt-wrap, 
.refItem:hover > .colorPlate {
	opacity: 1;
} 


@media only screen and ( min-width: 750px ) {

	#row2 {
      grid-template-columns: auto auto auto;	
	}

}

@media only screen and ( min-width: 1050px ) {
	#row2 {
			grid-template-columns: auto auto auto auto;	
	}

}
@media only screen and ( min-width: 1250px ) {
}