body 
{
	background-color:#EEE;
	color:#282B30;
}	

h1, h3
{
	text-align:center;
}

h1
{
	font-size:2em;
	margin:20px;
	font-weight:400;
}

h3
{
	font-size:1.2em;
	margin:5px;
}

h4
{
	font-size:1.1em;
	
}

/* ============================================================================== */

.gallery
{
	margin-top:20px;
	
}

.gallery .gallery-cell
{
	top: 50%;
	transform: translateY(-50%);
	
	margin-right:10px;
}

@media screen and (max-device-width: 600px) 
{
	.gallery .gallery-cell,
	.gallery .gallery-cell img
	{width:100%;}
	
	@media screen and (orientation: landscape)
	{
		.gallery .gallery-cell
		{width:50%;}		
	}
}


.lt-ie9 .gallery .gallery-cell
{
	top:auto;
	transform:none;	
}


/* ============================================================================== */
/* ===  http://codepen.io/desandro/pen/jEpxqJ === */
/* ============================================================================== */

.gallery-cell img 
{
  /* dim unselected */
  opacity: 0.7;
  -webkit-transform: scale(0.85);
          transform: scale(0.85);
	/*	  
  -webkit-filter: blur(5px);
          filter: blur(5px);
		  */
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s, transform 0.3s, -webkit-filter 0.3s, filter 0.3s;
          transition: opacity 0.3s, transform 0.3s, filter 0.3s;
}

/* brighten selected image */
.gallery-cell.is-selected img 
{
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-filter: none;
          filter: none;
}
