/* RESET STYLES */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, textarea, select {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */

body {
	text-align: center;
	font-family: Arial;
	font-size: 14px;
	color: #333;
	background: #0c0c10 url(/images/bundle/fonds/pxstretch.jpg) center top repeat-x;
}


br.clear {clear: both;}

#wrapper {
	position:relative;
	width:1200px;
	margin:auto;
	background: transparent url(/images/bundle/fonds/header.jpg) center top no-repeat;
}

body#photoshop #wrapper {	background: transparent url(/images/bundle/fonds/bg_photoshop.jpg) center top no-repeat;}
body#after-effects #wrapper {	background: transparent url(/images/bundle/fonds/bg_after-effects.jpg) center top no-repeat;}
body#flash #wrapper {	background: transparent url(/images/bundle/fonds/bg_flash.jpg) center top no-repeat;}
body#cinema-4d #wrapper {	background: transparent url(/images/bundle/fonds/bg_cinema-4d.jpg) center top no-repeat;}



#header {
	position:relative;
	width:1200px;
	margin:auto;
}

#titre1 {
	position:relative;
	padding-top: 50px;
	width:1200px;
	height:123px;
	text-align: center;
}
#titre1 a {display: block; width: 690px; margin-left: 270px;}



#panier {border-top: 1px solid #333; width: 800px; margin-left: 200px;  padding: 20px 0 0 10px; }
#panier .price {float: left;}
#panier .bt-acheter a{float: left; margin-left: 20px;}


#footer-wrapper {
	background: transparent url(/images/bundle/fonds/fond2.png) center top repeat-x;	
	padding-bottom: 20px;
}
#footer {width: 1070px; margin: 0 auto;}
#footer .logiciel {float: left; width: 245px; margin-right: 30px; margin-top: 26px; text-align: left;}
#footer .logiciel h3 {color: #fff; text-transform: uppercase; font-size: 21px; margin-bottom: 13px;}

#footer .logiciel p.price {margin: 0 0 24px 0;}
#footer .logiciel p.price strong {color: #fff; }

#footer .logiciel p.text {color: #999; margin-top: 16px; font-size: 13px; line-height: 16px;}
#footer .logiciel p.text em {color: #ccc; }

#footer .mentions-legales {border-top: 3px solid #222; text-align: left; color: #444; margin-top: 46px; padding: 16px 0 0 0px; font-size: 12px;}


#compteur{
	position:relative;
	margin-left: 147px;
	margin-top: 64px;
	width: 700px;
	background: none;
		
}
.cellule_compteur, .countdown_section{
	float:left;
	background: transparent url(/images/bundle/compteur/compteur.png) 0 0 no-repeat;
	width:126px;
	height:130px;
	margin-right: 35px;
	overflow:hidden;
	display: block;
}

.chiffre_compteur, .countdown_amount{
	position:relative;
	text-align:center;
	margin-top:22px;
	height:83px;
	display: block;
}

.genre_compteur{
	display: block;
	position:relative;
	text-align:center;
	color: #ddd;
	font-family: Arial;
	font-weight: normal;
	font-size: 18px;
}


#content {
	clear: both;
	position:relative;
	width:1200px;
	margin: auto;
}

.presentation {
	padding: 21px 14px;
	color: #555;
	text-align: center;
	position: relative;
}



p.bt-acheter a {display: block; width: 242px; height: 48px; margin-left: 490px; text-indent: -1000px; overflow: hidden;}
p.bt-acheter a:hover {background: none; background-position: bottom left;}

p.bt-acheter a.photoshop {background-image: url(/images/bundle/boutons/acheter_photoshop.png);}
p.bt-acheter a.after-effects {background-image: url(/images/bundle/boutons/acheter_after-effects.png);}
p.bt-acheter a.flash {background-image: url(/images/bundle/boutons/acheter_flash.png);}
p.bt-acheter a.cinema-4d {background-image: url(/images/bundle/boutons/acheter_cinema-4d.png);}


.presentation .icones {margin: 59px 0 20px 0;}


body#photoshop .presentation .icones,
body#after-effects .presentation .icones,
body#flash .presentation .icones,
body#cinema-4d .presentation .icones {	margin-top: 11px;}




.presentation .icones a {display: block; float: left;}

.presentation .icones a.ps {margin: 0 2px 0 258px;}
.presentation .icones a.ae {margin: 58px 0 0 15px;}
.presentation .icones a.fl { margin: 31px 0 0 35px;}
.presentation .icones a.c4d {margin-left: 26px;}



.presentation .icones a.ps:hover { -moz-transform: rotate(-9deg);	 -webkit-transform: rotate(-9deg);	 transform: rotate(-9deg); }
.presentation .icones a.ae:hover { -moz-transform: rotate(21deg);	 -webkit-transform: rotate(21deg);	 transform: rotate(21deg); }
.presentation .icones a.fl:hover { -moz-transform: rotate(-14deg);	 -webkit-transform: rotate(-9deg);	 transform: rotate(-9deg); }
.presentation .icones a.c4d:hover { -moz-transform: rotate(26deg);	 -webkit-transform: rotate(-9deg);	 transform: rotate(-9deg); }


.presentation h2 span {visibility: hidden;}
.presentation p.description {text-align: center;}
.presentation p.description a span {visibility: hidden;}
.presentation p.description a {
	text-decoration: none;
	display: block;
	margin-top: 10px;
	margin-left: 2px;
	width: 264px;
	height: 46px;
	margin-left: 468px;
	background: transparent url(/images/bundle/boutons/bt_acheter.png) center top no-repeat;	
}
.presentation p.description a:hover {
	background: transparent url(/images/bundle/boutons/bt_acheter.png) center bottom no-repeat;	
}


#products {
	padding: 21px 13px;
	color: #343434;
	margin-top: 9px;
	margin-left: 200px;
}
#products h2 { color: #fff; font-size: 20px; line-height: 20px; text-align: left; border-bottom: 1px solid #444; padding-bottom: 15px; margin: 0 0 30px 0;}
#products h2 em { color: #ccc;}


#products .product {
	position: relative;
	clear: both;
	height: 170px; 
	text-align: left;
}

#products .product p.image {background: #111313; float: left; margin-right: 11px;  width: 278px; height: 155px;}
#products .product p.image IMG {width: 268px; height: 145px; border: 5px solid #222;}
#products .product h3 {margin-top: -4px}
#products .product h3 a {text-decoration: none; color: #fff; font-size: 26px;}
#products .product p.infos em {display: block; color: #888; line-height: 18px; font-size: 12px; }
#products .product p.infos strong {font-size: 18px; font-weight: normal; line-height: 22px;}
#products .product p.prix {margin-top: 10px;}
#products .product p.prix s,
#products .product p.prix span {
	display: block; float: left;
	width: 76px;
	height: 76px;
	line-height: 76px;
	text-align: center;
	font-size: 22px;
	text-decoration: none;
	color: #fff;
	position: relative;
}
#products .product p.prix span.offert {
	background: transparent url(/images/bundle/pastilles/pastillenouveauprixverte.png) center top no-repeat;		
}
#products .product p.prix s {
	background: none;
}

.product p.plus {
	display: block; float: left;
	width: 54px;
	height: 54px;
	background: transparent url(/images/bundle/images/plus_photoshop.png) center top no-repeat;		
	position: absolute;
	bottom: -18px;
	left: 112px;
	z-index: 10;
}




body#photoshop p.plus {	background: transparent url(/images/bundle/images/plus_photoshop.png) center top no-repeat;	}
body#after-effects p.plus {	background: transparent url(/images/bundle/images/plus_after-effects.png) center top no-repeat;	}
body#flash p.plus {	background: transparent url(/images/bundle/images/plus_flash.png) center top no-repeat;	}
body#cinema-4d p.plus {	background: transparent url(/images/bundle/images/plus_cinema-4d.png) center top no-repeat;	}







.presentation2 h2 {				float: none;}
.presentation2 p.description {	width: 580px; float: none; }
.presentation2 p.panier {		bottom: 51px; right: -20px;}
.presentation2 p.description a {	margin-top: 20px;}







/* Identification */

.signin {
	width: 250px;
	height: 150px;
	float: left;
	margin: 30px 0 0 30px;
}

.signin span {	
	display: none;
}
.signin input {	
	border: none;
	width: 177px;
	height: 16px;
	padding: 6px 14px;
	font-size: 1.1em;
}
.signin p.champ  { 
	display: block;
	margin: 6px 0;
}
.signin p.champ label { 
	display: block;
	width: 197px;
}

.signin .btAction {	
	padding: 4px 0 4px 45px;
	margin: 10px 0 0 0;
}
.signin p.oubli {
	padding-left: 45px;
}


.register {
	width: 320px;
	padding: 0 0px 0 40px;
	border-left: 1px solid #<?=$grisBleu;?>;
	height: 150px;
	float: left;
	margin: 30px 0 0 0px;
}

.register p.avantages {
	margin: 6px 0 10px 0;
	color: #<?=$gris?>;
	font-weight: normal !important;
	font-size: 12px;
	line-height: 1.2em;
	text-align: justify;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.register .btAction {
	padding: 4px 0 4px 45px;
	margin-top: 15px;
}





#content-credits {
	background: #000 url(/images/bundle/fonds/_fond2.png) center top repeat-x;		
	padding: 25px 0 0 25px;

}

#formCartes {
	background: #000 url(/images/bundle/fonds/_fond2.png) center top repeat-x;		
	padding: 25px 0 0 25px;
	text-align:left;
	color: #999;
	margin: 0 0 0 220px;
	width: 777px;
}
#formCartes p span { display: block; float: left; margin-top: 5px; margin-left: 25px; width: 260px;  margin-right: 48px; padding-bottom: 20px; font-size: 11px; line-height: 15px; }
#formCartes input {clear: both;}
#formCartes img { margin: 0 15px; cursor: pointer;}
#formCartes strong {color: #ccc;}
#formCartes h4 {margin-left: -15px; clear: both; magin-bottom: 20px;}
#formCartes p.prix-total {text-align: right; margin: 0 20px; color: #555; margin-top: -5px; font-size: 16px; padding-bottom: 3px;}
#formCartes p.prix-detail { border: 1px solid #333; border-width: 1px 0 1px 0; margin: 0 20px 0 0; color: #999; font-size: 16px; padding: 8px 2px 0 2px;height: 24px;}
#formCartes p.prix-detail span { display: block; float: left; font-size: 16px;  width: 300px; margin: 0;}
#formCartes p.prix-detail em { display: block; float: right; text-align: right; font-size: 16px;  width: 200px;}