/*.test-gallery {
  width: 100%;
  float: left;
}
.test-gallery figure {
	margin: 0 0 0 0;
	padding: 0 2% 0 0;
	display: block;
	min-height:340px;
  width: 30.33333%;
}
.test-gallery figure.col-sm-3 {width: 23.0%;}
.test-gallery figure img.image-gallery {
  width: 100%;
  height: auto;	
}*/
.reference div img.image-gallery {
margin:0 0 0 0;
padding:0 0 0 0;
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
/*.reference .col-lg-3.col-md-4.col-sm-6.col-xs-6 {height:320px;}*/
@media (min-width:480px) {.reference .col-lg-3.col-md-4.col-sm-6.col-xs-6 {height:470px;}}
@media (min-width:576px) {.reference .col-lg-3.col-md-4.col-sm-6.col-xs-6 {height:300px;}}
@media (min-width:768px) {.reference .col-lg-3.col-md-4.col-sm-6.col-xs-6 {height:300px;}}
@media (min-width:992px) {.reference .col-lg-3.col-md-4.col-sm-6.col-xs-6 {height:295px;}}
@media (min-width:1200px) {.reference .col-lg-3.col-md-4.col-sm-6.col-xs-6 {height:320px;}}
.reference .caption {text-align:left;padding: 10px 10px 20px;display:block;height: 105px;}

.badge-right { position: absolute; width: auto; right: 7%; top: 0; }
.badge-left { position: absolute; width: auto; left: -10px; top: -22px; }

/**THE SAME CSS IS USED IN ALL 3 DEMOS**/    
/**gallery margins**/  
@media only screen and (min-width: 768px) {
.zoom {
	-webkit-transition: all 0.35s ease-in-out;
	-moz-transition: all 0.35s ease-in-out;
	transition: all 0.35s ease-in-out;
	/*cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
	cursor: zoom-in;*/
}
.zoom:hover/* , .zoom:active, .zoom:focus */ {
	/**adjust scale to desired size, 
add browser prefixes**/
	-ms-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-webkit-transform: scale(1.5);
	-o-transform: scale(1.5);
	transform: scale(1.5);
	position: absolute;
	z-index: 100;
}
}
/**To keep upscaled images visible on mobile, 
increase left & right margins a bit**/  
@media only screen and (max-width: 767px) {
.test-gallery figure, .test-gallery figure.col-sm-3 {width:100%;margin-bottom:10px;/*min-height:740px;*/padding: 0 0 0 0;}

.badge-right { position: absolute; width: auto; right: 0; top: 0; }

/**TIP: Easy escape for touch screens,
give gallery's parent container a cursor: pointer.**/
.DivName {cursor: pointer}
}
figcaption span.onclick {cursor:pointer;color:blue;}
figcaption span.onclick:hover {text-decoration:underline;}