﻿body 
{
	background-attachment: fixed;
	background-color: #fff;
	background-position: top center;
	background-repeat: no-repeat;
	margin: 0;
	padding: 0;
	background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
}
	
/*
This next definition doesn't allow the background to get any smaller
than a predefined size (640x426px in this case). Change the values
here to match your background image size. The configuration in the
flexi-background javascript file should also match these values.
*/
	
@media only all and (max-width: 1600px) and (max-height: 1200px)
{
	body
	{
		background-size: 1600px 1200px;
		-moz-background-size: 1600px 1200px;
		-webkit-background-size: 1600px 1200px;
	}
}
	
/*
The next 2 definitions are for support in iOS devices.
Since they don't recoginze the 'cover' keyword for background-size
we need to simulate it with percentages and orientation
*/
	
@media only screen and (orientation: portrait) and (device-width: 320px), (device-width: 768px)
{
	body
	{
		-webkit-background-size: auto 100%;
	}
}
	
@media only screen and (orientation: landscape) and (device-width: 320px), (device-width: 768px)
{
	body
	{
		-webkit-background-size: 100% auto;
	}
}

/*For IE 10/11 fixes background twitching issue */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    html {
        overflow: hidden;
        height: 100%;
    }

    body {
        overflow: auto;
        height: 100%;
    }
}
	
img#bgExpander
{
	display: none;
	position: absolute;
	z-index: 1;
	-ms-interpolation-mode: bicubic;
}
	
.wide img#bgExpander, .tall img#bgExpander
{
	display: block;
}
	
.wide img#bgExpander
{
	height: auto;
	width: 100%;
}
	
.tall img#bgExpander
{
	height: 100%;
	width: auto;
}