ul {
	list-style: none outside none;
    padding-left: 0;
}
.gallery li {
	display: block;
	float: left;
	margin-bottom: 2%;
	margin-right: 2%;
	border: 1px solid rgba(0,0,0,.66);
	cursor: pointer;
	padding: 0;
}
.gallery li a {
	padding:0;
}
.gallery li img {
	padding:0;
	margin-bottom: -5px;
}

@media only screen and (min-width:1825px) {
	body {
		background: url('../img/bg_01_wide.jpg') fixed repeat-y;
	}
	.gallery li {
		width: 17.625%;
	}
	#bg2 {
		background: url('../img/bg_02b_wide.png') fixed left top repeat-y;
	}
	#bg3 {
		background: url('../img/bg_03b_wide.png') fixed left bottom repeat-y;
	}
}

@media only screen and (min-width:1025px) and (max-width:1824px) {
	body {
		background: url('../img/bg_01_wide.jpg') fixed repeat-y;
	}
	.gallery li {
		width: 22.4%;
	}
	#bg2 {
		background: url('../img/bg_02b_wide.png') fixed left top repeat-y;
	}
	#bg3 {
		background: url('../img/bg_03b_wide.png') fixed left bottom repeat-y;
	}
}

@media only screen and (min-width:768px) and (max-width:1024px) {
	body {
		background: url('../img/bg_01_wide.jpg') fixed repeat-y;
	}
	.gallery li {
		width: 22.3%;
	}
	#bg2 {
		background: url('../img/bg_02b_wide.png') fixed left top repeat-y;
	}
	#bg3 {
		background: url('../img/bg_03b_wide.png') fixed left bottom repeat-y;
	}
}

@media only screen and (min-width:321px) and (max-width:767px) {
	body {
		background: url('../img/bg_01c_wide.jpg') repeat-y;
	}
	.gallery li {
		width: 22.4%;
	}
	#bg2 {
		background: url('../img/bg_02c_wide.png') left top repeat-y;
	}
	#bg3 {
		background: url('../img/bg_03c_wide.png') left bottom repeat-y;
	}
}

@media only screen and (max-width:320px) {
	body {
		background: url('../img/bg_01c_wide.jpg') repeat-y;
	}
	.gallery li {
		width: 22%;
	}
	#bg2 {
		background: url('../img/bg_02c_wide.png') left top repeat-y;
	}
	#bg3 {
		background: url('../img/bg_03c_wide.png') left bottom repeat-y;
	}
}
