/* CSS Only Fallbacks - if you're a purist you can use 
 * these classes on your container divs to get an approximate 
 * focus effect when javascript isn't available
 *-----------------------------------------*/

/* Reset default positioning */
.focuspoint img {
	left: auto;
	top: auto;
}

/* Left top */
.focus-left-top img {
	left: 0;
	top: 0;
}

/* Left bottom */
.focus-left-bottom img {
	left: 0;
	bottom: 0;
}

/* Right top */
.focus-right-top img {
	right: 0;
	top: 0;
}

/* Right bottom */
.focus-right-bottom img {
	right: 0;
	bottom: 0;
}

/* Horizontally-centered images */
.focus-center-center .focuspoint-inner,
.focus-center-top .focuspoint-inner,
.focus-center-bottom .focuspoint-inner {
	height: 100%;
	width: 400%;
	margin: 0 0 0 -150%;
}
.focus-center-center img,
.focus-center-top img,
.focus-center-bottom img { 
	min-width: 25%;
	min-height: 100%;
	margin: auto;
	left: 0;
	right: 0;
}
.focus-center-bottom img { 
	bottom: 0;
	top: auto;
}
.focus-center-top img { 
	bottom: auto;
	top: 0;
}

/* Centered both axis */
.focus-center-center .focuspoint-inner {
	height: 400%;
	top: -150%;
	left: 0;
}
.focus-center-center img {
	min-height: 25%;
	bottom: 0;
	top: 0;
}

/* Vertically-centered images */
.focus-left-center .focuspoint-inner,
.focus-right-center .focuspoint-inner {
	height: 400%;
	width: 100%;
	top: -150%;
	left: 0;
}
.focus-left-center img,
.focus-right-center img {
	min-height: 25%;
	min-width: 100%;
	bottom: 0;
	top: 0;
	margin: auto;
}
.focus-left-center img {
	left: 0;
}
.focus-right-center img {
	right: 0;
}