﻿/*****************************************************************/
/*Styles communs aux pages "virales" : envoi à un ami et parrainage*/
/*****************************************************************/
.wrapper.parrainage {background:url(/Images/formV2/bg-wrapperIntern-transmettre.jpg) no-repeat; background-position:top right;}
#parrainage1{position:relative;width:485px; margin:0 0 0 80px;z-index:10;}
#parrainage1 h2{position:absolute; top:0; left:-20px;}
#parrainage1 h3{padding-top:70px; color:#68a5cc; font-size:1.1em; font-weight:bold;}
#parrainage1 p.intro{margin-bottom:5px;}
#parrainage1 fieldset{border:none;clear:both; margin-top:5px;}
#parrainage1 h4{display:inline; font-size:1.4em; color:#ee0062; margin:0;}
#parrainage1 .champs-obligatoires{color:#aeaeae; font-size:0.9em; margin:0 0 0 35px;}
#parrainage1 h5{clear:left; font-size:1em; font-weight:bold; margin:4px 0 4px 0;}

#parrainage1 fieldset p{clear:both; display:table; width:485px; margin:0 0 4px 0;}
#parrainage1 fieldset select{float:right; border:1px solid #abdff4; width:216px;}
#parrainage1 fieldset input{border:1px solid #abdff4; float:right; clear:right; width:350px;}
#parrainage1 fieldset label{float:left;}

#parrainage1 .mention{color:#aeaeae; font-size:0.9em;}
#parrainage1 .btn-annule, #parrainage1 .parrainage_etape1 .btn-annule{position:absolute; bottom:-35px; right:100px;}
#parrainage1 .btn-valide, #parrainage1 .parrainage_etape1 .btn-valide{position:absolute; bottom:-35px; right:0; border:none; width:auto;}

#parrainage1 #pictoFleur {position:absolute;left:-100px; top:206px; width:75px; height:97px; background: url(/Images/formV2/img-illustr-fleur.png) no-repeat left top;}
#parrainage1 #pictoOiseau {position:absolute;right:-70px; top:-5px; width:99px; height:94px;  background: url(/Images/formV2/img-illustr-oiseau.png) no-repeat left top;}

/*Etape 2 (page confirmation)*/
#parrainage1 .piedPage{position:absolute; top:213px; left:-60px; width:656px; height:268px; background: url(/Images/formV2/bg-bot-transmettre2.jpg) no-repeat left top;z-index:-1;}
#parrainage1 p.remercie{padding:144px 0 0 0; margin:0 0 10px 0; font-size:1.6em; font-weight:bold; color:#ee0062;}
#parrainage1 p a.l_retour{ padding-left:10px;margin:5px 0 0 0; background:url(/Images/pics/arrow-blue.gif) no-repeat left center; color:#0071b7;}

/*page parrainnage*/
#parrainage1 .parrainage_etape1 p {clear:both; display:table; width:400px; margin:0 0 4px 0;}
#parrainage1 .parrainage_etape1 input {border:1px solid #abdff4; float:right; clear:right; width:270px;}
#parrainage1 .TextBox-error, #parrainage1 .parrainage_etape1 .TextBox-error { border-color:#EE0062; }
#parrainage1 .Label-error, #parrainage1 .parrainage_etape1 .Label-error { color:#EE0062; }

/******************Sticker parrainage****************************/
#sticker_parrainage {position:absolute; top:150px; left:400px; background:url(/Images/formV2/bg-sticker-parrainage.png) no-repeat right top; width:267px; height:292px; text-align:center;}
#sticker_parrainage #sticker_conteneur {margin:70px auto 0 auto;width:180px;}                     
#sticker_parrainage .titre {margin-left:15px; color:#ffa200; font-size:1.2em; font-weight:bold;}
#sticker_parrainage .accroche {margin-left:15px; color:#005eaa; font-size:1.1em; font-weight:bold;} 
#sticker_parrainage .contenu {margin-left:15px; color:#005eaa;}
#sticker_parrainage .lien a {color:#aeaeae; font-size:.9em;}
/**************************************************************/
#popUp-mentions, #popUp-reglement, #popUp-reglement-parrainage {width:511px; height:410px; padding:20px; display:none; position:absolute; top:140px; left:50%; margin-left:-225px; color:#999999; background:url(/Images/V0/bg_popup.gif) no-repeat}
#popUp-mentions {z-index:98;}
#popUp-reglement, #popUp-reglement-parrainage {z-index:99;}
#popUp-mentions a.closeReglement, #popUp-reglement, #popUp-reglement-parrainage, a.closeReglement {display:block; position:absolute; top:10px; right:10px;}
#popUp-mentions h2, #popUp-reglement h2, #popUp-reglement-parrainage h2 { padding:15px 0; font-size:12px; text-align:center}
#popUp-mentions p, #popUp-reglement p, #popUp-reglement-parrainage p { padding-bottom:5px; font-size:11px;}
#popUp-mentions p a {color:#999999}
/*****************Styles de la page "Tunnel d'identification" : page transversale de login (Login)**********/
.wrapper.tunnel {background:url(/Images/adhesion/bg-wrapperIntern-tunnel.jpg) no-repeat; background-position:top right;}
#tunnel_ident{position:relative;width:612px; height:360px; padding-top:85px; margin:0 0 0 45px; background:url(/Images/adhesion/tunnel-background.gif) no-repeat left bottom;z-index:11;} 
#tunnel_ident * {margin-left:15px;}
#tunnel_ident h2 {margin:0;position:absolute; top:-25px; left:-40px;}
#tunnel_ident h3 {padding-top:10px; color:#68a5cc; font-size:1em; font-weight:bold;}
#tunnel_ident h4 {display:inline; width:200px;}
#tunnel_ident #identifie {position:absolute; bottom:260px;left:20px;}
#tunnel_ident #inscris {position:absolute;bottom:136px;left:20px;}
#tunnel_ident .champs-obligatoires{display:inline;float:left;margin:0 0 0 300px;color:#aeaeae; font-size:0.9em;}
#tunnel_ident em {margin:0 0 0 0; font-style:normal; font-weight:bold;}  
#tunnel_ident p {margin:0 0px 5px 20px;}
#tunnel_ident p.intro {margin:0 40px 5px 20px;}
#tunnel_ident .btn-valide{position:absolute; bottom:200px; right:50px; border:none; width:auto; }
#tunnel_ident .btn-adhere{position:absolute; bottom:18px; right:50px;}

#tunnel_ident a.l_retour{display:block; position:absolute; bottom:-20px; left:0; padding:0px 0 0 10px; background:url(/Images/pics/arrow-grey.gif) no-repeat left center; color:#606060;} 

#tunnel_ident #oiseau_deco{position:absolute; top:20px; right:0; width:172px;height:89px; background:url(/Images/adhesion/tunnel-illustr-oiseauBulles.png) no-repeat left top;}

#tunnel_ident fieldset{position:absolute; top:175px;left:0;border:none;} 
#tunnel_ident fieldset p{clear:both;float:left; display:table; width:370px; margin:0 0 4px 25px;}
#tunnel_ident fieldset p.erreurLogin {position:absolute; top:55px; left:130px; color:#EE0062;}
#tunnel_ident fieldset input{border:1px solid #abdff4;float:right; width:237px;}
#tunnel_ident fieldset label{float:left; width:100px; padding-top:2px; text-align:right;} 
#tunnel_ident #inscription_content{position:absolute;bottom:55px;left:0; width:580px;}
/***********************************************************************************/

/************************Styles de la page Moments Complices (home)************************/
.wrapper.complices1 {background:url(/Images/intern/complice/bg-complices_home.jpg) right 0 no-repeat;}
#moments_Comp_home {position:relative;}
#moments_Comp_home p{position:absolute; top:50px; left:50px; width:492px; color:#468dbb;}
#moments_Comp_home img{position:absolute; top:-15px; left:20px;}
#moments_Comp_home_flash{float:right;}
/**********************************************************************/
/**************************Styles de la page Berceuses*************************/
.wrapper.berceuses {background:url(/Images/intern/complice/bg-wrapper-berceuses.jpg) right 0 no-repeat;}
.wrapper.berceuses #subNav li a.l_retour{background:url(/Images/intern/complice/berceuse-picto-fleche.gif)  no-repeat left center;padding:0 0 0 10px; margin-left:120px; color:#c73d81;}
.wrapper.berceuses #subNav li a.l_transfert{background:url(/Images/intern/complice/berceuse-picto-mail.gif) no-repeat left center; padding:0 0 0 25px; margin-left:20px; color:#c73d81;}
/*******************************************************************/
/**************************Styles de la pages comptines*************************/
.wrapper.comptines {background:url(/Images/intern/complice/bg-wrapper-comptines.jpg) right 0 no-repeat;}
.wrapper.comptines #subNav li a.l_retour{background:url(/Images/intern/complice/comptines-picto-fleche.gif)  no-repeat left center;padding:0 0 0 10px; margin-left:120px; color:#ffa200;}
.wrapper.comptines #subNav li a.l_transfert{background:url(/Images/intern/complice/comptines-picto-mail.gif) no-repeat left center; padding:0 0 0 25px; margin-left:20px; color:#ffa200;}

/*******************************************************************/

/*********************Styles de la page histoires********************/
.wrapper.histoires {background:url(/Images/intern/complice/bg-wrapper-histoires.jpg) right center no-repeat;}
#moments_comp_histoires {position:relative; width:755px;}
#moments_comp_histoires #img_histoires h2{position:absolute; left:280px; top:-14px;}
#moments_comp_histoires #img_histoires p {position:absolute; left:150px; top:28px; width:450px; font-size:1.2em; font-weight:bold; color:#8cad14;} 
#moments_comp_histoires #img_histoires .illustration{position:absolute; top:22px; left:-13px;}

#moments_comp_histoires #en_scene{position:absolute;right:85px; top:348px; width:143px;line-height:1.1em;}
#moments_comp_histoires #en_scene h3{font-size:1.2em; color:#78950d;}
#moments_comp_histoires #en_scene a {padding-left:8px; color:#fcfdf7; text-decoration:none; background:url(/Images/pics/arrow-whiteOnGreen.gif) left center no-repeat;}
#moments_comp_histoires #en_scene a:hover{font-weight:bold;} 

#moments_comp_histoires #liste_histoires{position:absolute; right:50px; top:380px; width:248px; height:107px; padding:40px 0 0 50px; background:url(/Images/intern/complice/comp_histoires-bg-listeHist.png) no-repeat left top;}
#moments_comp_histoires #liste_histoires #overflow_histoires{overflow:auto;width:220px; height:70px;}
#moments_comp_histoires #liste_histoires li{margin:3px 0 3px 0;}
#moments_comp_histoires #liste_histoires a.fleche{display:block;padding-left:10px; width:180px; color:#98c115; text-decoration:none; background:url(/Images/pics/arrow-greenOnWhite.gif) left 4px no-repeat;}
#moments_comp_histoires #liste_histoires a.actif{font-weight:bold;}
#moments_comp_histoires #liste_histoires a.fleche:hover{font-weight:bold;}

#moments_comp_histoires #subNav li a.l_retour{display:block; height:20px; position:absolute; top:470px; left:20px; color:#9dba3d; padding-left:12px; background:url(/Images/intern/complice/arrow-greenOnBlue.gif) no-repeat left center;}
#moments_comp_histoires #subNav li a.l_imprime{display:block; height:20px;position:absolute; top:470px; left:85px; color:#9dba3d; padding-left:24px; background:url(/Images/intern/complice/picto-printer-greenOnBlue.gif) no-repeat left center;}
#moments_comp_histoires #subNav li a.l_transfert{display:block; height:20px;position:absolute; top:470px; left:175px; color:#9dba3d; padding-left:27px; background:url(/Images/intern/complice/picto-mail-greenOnBlue.gif) no-repeat left center;}
/*******************************************************************/

/**************Styles moments ludiques Home page*******************/
.wrapper.ludiques {background:url(/Images/intern/ludique/bg-wrapper-home-ludique.jpg) right center no-repeat;}
#home_ludique {position:relative; width:660px;}
#home_ludique h2{position:absolute; top:13px; left:101px;}
#home_ludique #introLudique{position:absolute; top:74px; left:86px; color:#468dbb;}

#home_ludique #titreJxMains{position:absolute; top:174px; left:148px; z-index:15;}
#home_ludique #titreJxMains a{display:block; width:250px; height:150px;}
#home_ludique #titreJxMains a:active{ outline:none;}
#home_ludique #introJxMains{position:absolute; top:265px; left:161px; width:165px; padding-left:10px; background:url(/Images/pics/arrow-whiteOnPink.gif) no-repeat left 3px; color:#fff; font-weight:bold; z-index:10;}

#home_ludique #titreJxEveil{position:absolute; top:385px; left:330px; z-index:15;}
#home_ludique #titreJxEveil a{text-align:center; display:block; width:350px; height:120px;}
#home_ludique #titreJxEveil a:active{ outline:none;}
#home_ludique #introJxEveil{position:absolute; top:450px; left:426px; width:184px; padding-left:10px; background:url(/Images/pics/arrow-whiteOnBlue.gif) no-repeat left 3px; color:#fff; font-weight:bold; z-index:10;}

/*******************************************************************/

/**************Styles moments ludiques Jeux de mains*******************/
.wrapper.jeuxMains {background:url(/Images/intern/ludique/bg-wrapper-ludiquesMains.jpg) right center no-repeat;}
#jeux_de_mains{position:relative; width:652px;}
#jeux_de_mains h2{position:absolute; top:0; left:30px;}
#jeux_de_mains #image_jeux_mains{position:absolute; top:56px; left:63px;}

#jeux_de_mains #listeJeuxMains{position:absolute; top:370px; right:-80px; width:248px; height:107px; padding:40px 0 0 50px; background:url(/Images/intern/ludique/bg-listeJeuxMains.png) no-repeat left top;}
#jeux_de_mains #listeJeuxMains #overflow_jeux_mains {overflow:auto;width:220px; height:70px;}
#jeux_de_mains #listeJeuxMains li{margin:3px 0 3px 0;}
#jeux_de_mains #listeJeuxMains a.fleche{display:block;padding-left:10px; width:180px; color:#60adcd; text-decoration:none;}
#jeux_de_mains #listeJeuxMains a.fleche:hover{font-weight:bold; background:url(/Images/pics/arrow-blueLight.gif) left 4px no-repeat;}
#jeux_de_mains #listeJeuxMains a.actif{font-weight:bold; background:url(/Images/pics/arrow-blueLight.gif) left 4px no-repeat;}

#jeux_de_mains a.contenu:hover{font-weight:bold;}
#jeux_de_mains #subNav li a.l_retour{display:block; height:20px; position:absolute; top:465px; left:70px; padding-left:10px; color:#60adcd; background:url(/Images/pics/arrow-blueLight.gif) no-repeat left center;}
#jeux_de_mains #subNav li a.l_imprime{display:block; height:20px;position:absolute; top:465px; left:150px; padding-left:22px; color:#60adcd; background:url(/Images/intern/ludique/picto-printer-blueLight.gif) no-repeat left center;}
#jeux_de_mains #subNav li a.l_transfert{display:block; height:20px;position:absolute; top:465px; left:240px; padding-left:25px; color:#60adcd; background:url(/Images/intern/ludique/picto-mail-blueLight.gif) no-repeat left center;}

/*******************************************************************/

/**************Styles moments ludiques Jeux d'éveil*******************/
.wrapper.jeuxEveil {background:url(/Images/intern/ludique/bg-wrapper-jeuxEveil.jpg) right center no-repeat;}
#jeuxdEveil{position:relative;width:670px;}
#jeuxdEveil h2{position:absolute; top:5px; left:94px; width:215px; z-index:10;}
#jeuxdEveil #fiche_eveil {position:absolute; top:60px; left:49px; z-index:5;width:666px;}
#jeuxdEveil #overflow_eveil{overflow:auto; width:666px; height:360px;}
#jeuxdEveil .btn-imprimer {display:block;position:absolute; top:100px; left:100px; z-index:20;}

#jeuxdEveil #liste_fichesEveil {position:absolute; top:400px; right:-120px; width:227px; height:96px; padding:35px 0 0 266px; background:url(/Images/intern/ludique/bg-listeJeuxEveil.png) no-repeat left top;z-index:15;}
#jeuxdEveil #overflow_fichesEveil {overflow:auto; width:160px; height:60px;}

#jeuxdEveil #liste_fichesEveil #overflow_fichesEveil ul li a.fleche{display:block; width:130px; padding-left:10px; color:#60adcd; text-decoration:none;}
#jeuxdEveil #liste_fichesEveil #overflow_fichesEveil ul li a.fleche:hover{font-weight:bold; background:url(/Images/intern/ludique/picto-arrow-blueLight.gif) no-repeat left center;}
#jeuxdEveil #liste_fichesEveil #overflow_fichesEveil ul li a.actif{font-weight:bold; background:url(/Images/intern/ludique/picto-arrow-blueLight.gif) no-repeat left center;}
#jeuxdEveil #liste_fichesEveil #overflow_fichesEveil ul li{margin:3px 0 3px 0;}

#jeuxdEveil #subNav li a.l_retour{color:#60adcd; display:block; height:20px; position:absolute; top:470px; left:40px; padding-left:10px; background:url(/Images/pics/arrow-blueLight.gif) no-repeat left center;}
#jeuxdEveil #subNav li a.l_imprime{color:#60adcd; display:block; height:20px;position:absolute; top:470px; left:95px; padding-left:22px; background:url(/Images/intern/ludique/picto-printer-blueLight.gif) no-repeat left center;}
#jeuxdEveil #subNav li a.l_transfert{color:#60adcd; display:block; height:20px;position:absolute; top:470px; left:180px; padding-left:25px; background:url(/Images/intern/ludique/picto-mail-blueLight.gif) no-repeat left center;}


/* definitions des images pour la box Emptybox */
.complices1 #emptyBox {background:url(/Images/intern/complice/comp-leftSection-visuel.png) right bottom no-repeat}
.berceuses #emptyBox {background:url(/Images/intern/complice/berceuse-leftSection-visuel.png) right bottom no-repeat}
.comptines #emptyBox {background:url(/Images/intern/complice/comptines-leftSection-visu.png) right bottom no-repeat}
.histoires #emptyBox {background:url(/Images/intern/complice/histoires-leftSection-visuel.png) right bottom no-repeat}
.ludiques #emptyBox {background:url(/Images/intern/ludique/jeuxMains-leftSection-visuel.png) right bottom no-repeat}   
.jeuxMains #emptyBox {background:url(/Images/intern/ludique/jeuxMains-leftSection-visuel.png) right bottom no-repeat}   
.jeuxEveil #emptyBox {background:url(/Images/intern/ludique/jeuxMains-leftSection-visuel.png) right bottom no-repeat}   


/*  Intégration sur la page gagnante */
#page_gagnant #overflow {overflow:auto; width:672px; height:421px;}