@charset "UTF-8";

/* Layout (global rules for all sizes) */

body { margin: 0; padding: 0;}

.page {
	max-width: 980px;
	margin: 0px auto ;
	position: relative;
	background-color:#FFFFFF;
}

header a.logo {
	display: block;
	position: absolute;
	background-position: 0px 0px;
	background-repeat: no-repeat;
}

#promo-remi {float:left; display:inline-block; }

nav{
	width: 100%;
	display: block;
	position: absolute;
	background-color: #000000;
}

/* Layout Large Screens (default for older browsers) */

header {
	height: 275px;
	background: url(../images/banner_large.jpg) no-repeat right 0px;
	background-size: 980px 275px;
}

header a.logo {
	width: 879px;
	height: 159px;
	top: 60px;
	right: 10px;
	background-image: url(../images/logo_large.png) ;
	background-size: 879px 159px;
}

article {
	padding: 100px 20px 10px 20px;
	overflow: auto;
}

article img{
	margin-left: 10px;
	margin-right: 20px;
	margin-top: 10px;
	float: left;
	width: 20%;
}

.promo_container { padding: 0px 0px 150px 20px;}
.promo_container .promo {
	width: 50%;
	float: left;
	background-position: 0px 3px;
	padding-top: 10px;
}

.promo_container .promo .content {
	padding: 150px 20px 20px 0px;
	background-position: top;
	}





nav { top: 275px; }
nav a { margin: 12px 0px 10px 20px;}

@media screen and (max-width:990px){
	footer { padding-left: 20px; }
}

@media
	only screen and (-webkit-min-device-pixel-ratio: 2),
	only screen and (min--moz-device-pixel-ratio: 2),
	only screen and (-o-min-device-pixel-ratio: 2/1),
	only screen and (min-device-pixel-ratio: 2),
	only screen and (min-resolution: 192dpi),
	only screen and (min-resolution: 2dppx)
{

	header { background-image: url(../images/banner_large_2x.jpg); }
	header a.logo {	background-image: url(../images/logo_large_2x.png) ; }
}