@import url('http://fonts.googleapis.com/css?family=Coming+Soon');

h1, p {
	font-family: 'Coming Soon', cursive;
}

#album p {
	text-align: center;
	font-weight: bold;	
	
}

.thumbnail, .albumPhoto {
	width: 50px;
	height: 50px;
	background-size: auto 100%;
	background-repeat:no-repeat;
	background-position: center center;
	border: 1px solid black;
	box-shadow: 0px 0px 5px #369;
	margin: 5px 5px 0 0;
	display: inline-block; /* prevent column break inside a thumbnail */
}

.albumPhoto {
	width: 360px;
	height: 240px;
}

.albumPhoto a {
	display: block;
	width: 100%;
	height: 100%;
}

.selected {
	border: 1px solid #FFFF00;
	box-shadow: 0px 0px 5px #ff0;
}

#thumbnails {
	width: 190px;
	float: left;
	column-count: 3;
	-moz-column-count: 3;
	-webkit-column-count: 3;
	border: 1px solid #ccc;
	padding: 5px;
}

#instructions {
	width: 180px;
	margin-left: 225px;
}

#album {
	float: right;
}

#toggle {
	background:url(images/ui/left-arrow-icon.jpg) no-repeat top left;
	background-size: 50px 50px;
	-moz-transform: rotate(-10deg);
	-webkit-transform: rotate(-10deg);
	padding-top: 50px;
}

#thenClick {
	margin-top: 2em;
}

input[type=button] {
	background-color:#33FF33;
	border-radius: 100%;
	box-shadow: 0px 2px 2px #000;
	padding: 1em;
	font-size: 120%;
}