
/* Catalogue Page 1 */
#catalogue1 { width: 1000px; position: relative; margin: 0 auto; padding-top: 20px; }
#cat1Left { float: left; background-image: url(../img/cat1/cadre_gauche.png); width: 467px; height: 334px; position: relative; }
#cat1Right { float: right; background-image: url(../img/cat1/cadre_droit.png); width: 467px; height: 334px; position: relative; }

#cat1Left .titre { position: absolute; top: 21px; left: 35px; color: #F37800; }
#cat1Left .puce { display: inline-block; width: 11px; height: 11px; background-image: url(../img/cat1/carre_orange.png); margin-right: 5px; }
#cat1Right .titre { position: absolute; top: 21px; left: 35px; color: #B2D725; }
#cat1Right .puce { display: inline-block; width: 11px; height: 11px; background-image: url(../img/cat1/carre_vert.png); margin-right: 5px; }
#cat1Left h1, #cat1Right h1 { display: inline; margin: 0; text-transform:uppercase; font-size: 16px; }
#cat1Left h2, #cat1Right h2 { display: inline; margin: 0; font-size: 14px; }

#catalogue1 table, #catalogue1 tbody { width: 100%; height: 250px; position: absolute; top: 54px; text-align: center; }
#catalogue1 td.diffusionAudio { width: 50%; color: #5F1F80; }
#catalogue1 td.diffusionVideo { width: 50%; color: #E10078; }

#catalogue1 .tarif { width: 172px; height: 22px; color: #E3001B; font-size: 12px; font-weight: bolder; margin: 0px auto; text-align: center; }
#catalogue1 .tarif div { padding-top: 3px; }
#catalogue1 #cat1Right .tarif { background-image: url(../img/cat1/cadre_inter_droite.png); }
#catalogue1 #cat1Left .tarif { background-image: url(../img/cat1/cadre_inter_gauche.png); }
#catalogue1 .tarif2 { color: #E3001B; font-weight: bolder; text-align: center; }
#catalogue1 span.cadeau { display: inline-block; width: 49px; height: 53px; background-image: url(../img/cat1/cadeau.png); margin-bottom: -15px; }
#catalogue1 label, #catalogue1 span.texte { color: #8E7652; }

#catalogue1 .produitRow td { text-align: left; padding: 10px; }

#catalogue1 .row1  { height: 40px; vertical-align: top; }
#catalogue1 .row2  { height: 40px; vertical-align: top; }
#catalogue1 .row3  { height: 60px; }
#catalogue1 .row4  { height: 130px; }

#catalogue1 .centre { text-align: center; }

#catalogue1 .musique { display: inline-block; width: 15px; height: 23px; background-image: url(../img/cat1/note_musique.png); margin-right: 5px; margin-bottom: -5px; }
#catalogue1 .player { display: inline-block; width: 22px; height: 22px; background-image: url(../img/cat1/player); margin-right: 5px; margin-bottom: -5px; }


#catalogue1 .boutonsWrapper { margin-top: 5px; padding-bottom: 20px; }
#catalogue1 .boutonsWrapper .left { width: 467px; height: 48px; float: left; position: relative; }
#catalogue1 .boutonsWrapper .right { width: 467px; height: 48px; float: right; position: relative; }
#catalogue1 .boutonsWrapper a { text-decoration: none; }
#catalogue1 .boutonsWrapper a.return { display: block; width: 108px; height: 20px; background-image: url(../img/buttons/btn3.png); position: absolute; right: 0px; bottom: 6px; }
#catalogue1 .boutonsWrapper a.return span { width: 110px; height: 20px; color: #FFFFFF; position: absolute; right: 0px; bottom: -2px; text-align: center; cursor: pointer; }
#catalogue1 .boutonsWrapper a.next { display: block; width: 152px; height: 48px; background-image: url(../img/buttons/btn2.png); position: absolute; left: 0px; bottom: 0px; }
#catalogue1 .boutonsWrapper a.next span { width: 110px; height: 20px; color: #FFFFFF; position: absolute; left: 40px; bottom: 4px; text-align: center; cursor: pointer; }
/**************************************************************************************************/

/* Catalogue Pages 2*/
#catalogue2 { width: 837px; margin: 0 auto; padding-top: 20px; padding-bottom: 20px; }
#catalogue2 .left { float: left; width: 632px; height: 410px; position: relative; }
#catalogue2 .baniereTop { position: absolute; width: 632px; height: 55px; }

#catalogue2 #tabsContainer { position: absolute; top: 62px; width: 632px; height: 32px; }
#catalogue2 .tab { position: absolute; height: 32px; font-size: 12px; }
#catalogue2 .tab .wrapper { position: relative; }
#catalogue2 .tab .wrapper a { display: block; height: 26px; width: 62px; text-decoration: none; margin: 3px auto; font-size: 12px; text-align: center; }

#catalogue2 #tab_1 { width: 111px; background-image: url(../img/cat2/onglet1.png); color: #BAB7E4; left: 0px; z-index: 7; }
#catalogue2 #tab_1 .wrapper { padding-top: 5px; }
#catalogue2 #tab_2 { width: 126px; background-image: url(../img/cat2/onglet2.png); color: #DF5902; left: 72px; z-index: 6; }
#catalogue2 #tab_3 { width: 129px; background-image: url(../img/cat2/onglet3.png); color: #CACAC8; left: 160px; z-index: 5; }
#catalogue2 #tab_4 { width: 130px; background-image: url(../img/cat2/onglet4.png); color: #A9BC1D; left: 250px; z-index: 4; }
#catalogue2 #tab_5 { width: 129px; background-image: url(../img/cat2/onglet5.png); color: #86C4F3; right: 163px; z-index: 3; }
#catalogue2 #tab_6 { width: 129px; background-image: url(../img/cat2/onglet6.png); color: #A0006E; right: 72px; z-index: 2; }
#catalogue2 #tab_7 { width: 109px; background-image: url(../img/cat2/onglet7.png); color: #639E04; right: 0px; z-index: 1; }
#catalogue2 #tab_7 .wrapper { padding-top: 5px; }

#catalogue2 #tab_1 a { color:#B8B6E3; }
#catalogue2 #tab_2 a { color:#DE5900; }
#catalogue2 #tab_3 a { color:#713729; }
#catalogue2 #tab_4 a { color:#ACC012; }
#catalogue2 #tab_5 a { color:#89C3EB; }
#catalogue2 #tab_6 a { color:#A80077; }
#catalogue2 #tab_7 a { color:#64A006; }


#catalogue2 .tabsContainer .activeTab { z-index: 50; background-color: black; }
#catalogue2 .tabsContainer .inctiveTab { z-index: 40; }
#catalogue2 #loading { display: none; position: absolute; width: 24px; height: 24px; left: 304px; top: 239px; background-image: url(../img/loading/ajax.gif); }

#catalogue2 #pageContainer { position: absolute; top: 94px; width: 632px; height: 315px; }
#catalogue2 #pageContainer .garde { background-image: url(../img/cat2/page-de-garde.png); width: 632px; height: 315px; position: relative; }
#catalogue2 #pageContainer .garde a { display: block; text-align: center; width: 117px; height: 90px; bottom: 2px; right: 5px; position: absolute; background: transparent url(../img/cat2/btn_etape_suivante.png) no-repeat; }
#catalogue2 #pageContainer .catPage1 { background-image: url(../img/cat2/page1.png); width: 632px; height: 315px; position: relative; }
#catalogue2 #pageContainer .catPage2 { background-image: url(../img/cat2/page2.png); width: 632px; height: 315px; position: relative; }
#catalogue2 #pageContainer .catPage3 { background-image: url(../img/cat2/page3.png); width: 632px; height: 315px; position: relative; }
#catalogue2 #pageContainer .catPage4 { background-image: url(../img/cat2/page4.png); width: 632px; height: 315px; position: relative; }
#catalogue2 #pageContainer .catPage5 { background-image: url(../img/cat2/page5.png); width: 632px; height: 315px; position: relative; }
#catalogue2 #pageContainer .catPage6 { background-image: url(../img/cat2/page6.png); width: 632px; height: 315px; position: relative; }
#catalogue2 #pageContainer .catPage7 { background-image: url(../img/cat2/page7.png); width: 632px; height: 315px; position: relative; }

#catalogue2 #pageContainer button { position: absolute; border: 0px; height: 20px; bottom: 8px; color: #FFF; padding-bottom: 2px; }
#catalogue2 #pageContainer .retour { left: 33px; background: transparent url(../img/cat2/btn_retour.png); width: 84px;  }
#catalogue2 #pageContainer .continuer { right: 4px; background: transparent url(../img/cat2/btn_continuer.png); width: 143px;  }

#catalogue2 #catContent { position: absolute; width: 521px; height: 235px; top: 25px; left: 61px; overflow: auto; margin: 0px; padding: 0px; padding-left: 5px; }
#catalogue2 #catContent li { margin: 0px; list-style-type: none; font-size: 11px; }
#catalogue2 #catContent li.produit { margin-top: 15px; margin-bottom: 5px; }
#catalogue2 #catContent li.sousProduit { margin-top: 5px; margin-bottom: 5px; }

#catalogue2 #catContent li.produit span.label { display: inline-block; width: 315px; }
#catalogue2 #catContent li.sousProduit span.label { display: inline-block; margin-left: 10px; width: 305px; }

#catalogue2 #catContent span.price { display: inline-block; width: 119px; text-align: right; font-weight: bold; margin-left: 5px; }
#catalogue2 #catContent span.price span { font-weight: normal; font-size: 0.8em; }
#catalogue2 #catContent span.cart { display: inline-block; width: 43px; height: 13px; margin-left: 1%; cursor: pointer; }
#catalogue2 #catContent span.add { background-image: url(../img/cart/btn_panier.png); }
#catalogue2 #catContent span.change { background-image: url(../img/cart/btn_modif.png); }

#catalogue2 #catContent li.mention { margin-top: 5px; margin-bottom: 5px; color: #AA0000; font-size: 9px;  }

#catalogue2 .catPage1 span.price { color:#B8B6E3; }
#catalogue2 .catPage2 span.price { color:#DE5900; }
#catalogue2 .catPage3 span.price { color:#713729; }
#catalogue2 .catPage4 span.price { color:#ACC012; }
#catalogue2 .catPage5 span.price { color:#89C3EB; }
#catalogue2 .catPage6 span.price { color:#A80077; }
#catalogue2 .catPage7 span.price { color:#64A006; }

#catalogue2 span.vert { color: #A9C500; font-weight: bold; }
#catalogue2 span.small { font-weight: normal; font-size: 8px; }
#catalogue2 span.orange { color: #F29400; font-weight: bold; }

#catalogue2 .baniereRight { float: right; width: 200px; }
#catalogue2 .mdnt { display: block; width: 200px; height: 176px; background-image: url(../img/cat2/mdnt.jpg); }
#catalogue2 .vignette1 { width: 200px; height: 114px; background-image: url(../img/vignettes/video.jpg); margin-top: 2px; }
#catalogue2 .vignette2 { width: 200px; height: 114px; background-image: url(../img/vignettes/diffusion.jpg); margin-top: 2px; }

/* Styles du panier (AJAX) */
#ajoutPanier { width: 416px; height: 253px; background-image: url(../img/cart/cadre.png); overflow: hidden; position: relative; }
#ajoutPanier h1 { color: #7D695A; font-size: 16px; margin: 8px; margin-left: 12px; }
#ajoutPanier h2 { color: #F1A119; font-size: 14px; margin: 10px; margin-left: 20px; }
#ajoutPanier p { color: #7D695A; font-size: 12px; margin: 8px; }
#ajoutPanier ul { margin: 5px 5px; height: 80px; overflow: auto; }
#ajoutPanier ul li { list-style-type: none; color: #7D695A; vertical-align: middle; }
#ajoutPanier ul li span, #ajoutPanier ul li label { vertical-align: middle; }

#ajoutPanier a.remove { color: #7D695A; margin-left: 10px; }
#ajoutPanier a.remove span { color: #E2001A; }

#ajoutPanier a.add { color: #7D695A; }
#ajoutPanier a.add span { color: #29B716; }

#ajoutPanier span.error { display: inline-block; width: 16px; height: 16px; background-image:url(../img/buttons/attention.png); margin-left: 10px; margin-bottom: 1px; }
#ajoutPanier span.unite { margin-left: 10px; }
#ajoutPanier span.remove { cursor: pointer; margin-left: 10px; }
#ajoutPanier span.remove span { color: #E2001A; }

#ajoutPanier #buttons { height: 50px; width: 250px; position: absolute; top: 200px; left: 103px; }
#ajoutPanier #buttons button { position: relative; display: block; height: 50px; width: 50px; background-color: transparent; background-repeat: no-repeat; background-position: 8px 0px; border: none; padding: 0px; cursor: pointer; }
#ajoutPanier #buttons button div { position: absolute; width: 100%; top: 5px; left: -4px; color: #7D695A; font-size: 12px; text-align: center; }
#ajoutPanier #buttons .submit { float: left; background-image:url(../img/cart/btn_valider.png); }
#ajoutPanier #buttons .close { float: right; background-image:url(../img/cart/btn_annuler.png); }
#ajoutPanier div.valider { height: 42px; background-image:url(../img/buttons/attention.png); color: #7D695A; }
#ajoutPanier div.annuler { height: 42px; background-image:url(../img/buttons/attention.png); color: #7D695A; }
/**************************************************************************************************/

/* Panier */
#viewCart { width: 900px; margin: 0 auto; padding-top: 20px; padding-bottom: 20px; }
#viewCart .vide {  }
#viewCart .remove { cursor: pointer; margin-left: 10px; }

/**************************************************************************************************/


/* Widget de quantité */
.quantite { display: inline-block; position: relative; background-image:url(../img/widget/petite_box.png); width: 38px; height: 27px; }
.quantite input { position: absolute; border: 0px; width: 22px; height: 19px; top: 4px; left: 3px; margin: 0px; padding: 0px; }
.quantite div.inc { position: absolute; width: 10px; height: 12px; top: 2px; left: 26px; }
.quantite div.dec { position: absolute; width: 10px; height: 12px; top: 14px; left: 26px; }
/**************************************************************************************************/

