/**
 * main.css, Simply-Land.com
 * Feuille de style de toute la partie HTML du site
 *
 * @author Romain Vovard
 * @copyright Copyright (c) 2008-2009 Pinpin Team
 * @version 1.0
 */

/*** General ***/
div, h1, h2, h3, h4, h5, h6, a img, ul, li { margin: 0; padding: 0; border: 0; }
a { color: #FF58B3; text-decoration: underline; }
a:hover { text-decoration: none; }

h1 {}
h2 { margin-top: 10px; color: #00519C; font-size: 18pt; font-weight: bold; }
h3 { color: #FF58B3; font-size: 13pt; font-weight: bold; }
.ariane { margin: 0; color: #5BDEFF; font-size: 10pt; font-weight: bold; }
.ariane a { color: #5BDEFF; }
h4 {
    width: 610px;
    height: 25px;
    background-image: url(../medias/images/bg_h4_long.png);
    padding-left: 10px;
    color: #FFF;
    font-size: 12pt;
    margin-top: 50px;
    text-align: center;
    line-height: 18pt;
}

body {
    margin: 0;
    padding: 0;
    background: #304AF4 url(../medias/images/background_big.png) repeat-x scroll;
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
    text-align: center;
}

#page {
    margin: 0 auto;
    width: 790px;
    text-align: center;
}

.align_center {
    text-align:center;
}

/*** Menu ***/
#menu_general {
    clear: both;
    position: relative;
    margin: 10px auto 0 24%;
    list-style: none;
    height: 28px;
}

#menu_specific {
    float: right;
    margin: 40px 10px 10px auto;
    height: 23px;
}

#menu_general li, #menu_specific li {
    float: left;
    display: block;
    padding: 0;
    list-style: none;
}
#menu_general li { margin: 0 3px; }
#menu_specific li { margin: 0; }
#menu_general li a, #menu_specific li a { color: white; }
#menu_general li a {
    display: block;
    width: 139px;
    height: 28px;
    line-height: 28px;
    background-image: url(../medias/images/menu_gen_off.png);
    font-size: 14pt;
    font-weight: bold;
    text-decoration: none;
    margin: 0;
    padding: 0;
}

#menu_specific li a {
    display: block;
    margin: 0 5px 0 0;
    width: 117px;
    height: 23px;
    line-height: 23px;
    font-size: 13pt;
    text-decoration: none;
}
#menu_general li.active a { color: #5BDEFF; background-image: url(../medias/images/menu_gen_on.png); }
#menu_specific li.active a { color: #56CAFF; background-image: url(../medias/images/menu_spe_on.png); }
#menu_general li a:hover {
    background-image: url(../medias/images/menu_gen_on.png);
    color: #5BDEFF;
}
#menu_specific li a:hover {
    background-image: url(../medias/images/menu_spe_on.png);
    color: #56CAFF;
}

/*** Header ***/
#head {
    clear: both;
    width: 790px;
    height: 104px;
    background-image: url(../medias/images/bg_head.png);
}
#head img { float:left; margin: 30px auto auto 15px; }
#title {
    width: 790px;
    height: 100px;
    clear: both;
    background-image: url(../medias/images/bg_title.png);
    padding: 1px 0;
    text-align: left;
}
#title img { float:left; margin: 10px 5px auto 15px; }
p.connec_infos {
    color: white;
    float: right;
    text-align: right;
    margin: 3px 10px 0 auto;
    padding-bottom: 1px;
    width: 650px;
}
p.connec_infos a { color: white; }

/*** Contenu ***/
#main {
    width: 790px;
    background: #FFF;
}
#content {
    text-align: left;
    width: 690px;
    background: #FFF;
    margin: 0 50px 0 50px;
    padding: 1px 0;
    font: 11pt Arial, Helvetica, sans-serif;
    color: #0079CA;
}
#content ul, #content ol {
    margin: 3px auto 10px 30px;
    list-style-position: inside;
}

.list {
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
    font-size: 11pt;
    font-weight: bold;
    line-height: 1.8em;
}
.backtotop {
    padding-top: 10px;
    line-height: 40px;
    clear: both;
}
.backtotop img {
    float: left;
}

#content_footer {
    clear: both;
    width: 790px;
    height: 90px;
    background-image: url(../medias/images/bg_contfooter.png);
}

table.partners {
    width: 700px;
    text-align: center;
}
table.partners td {
    width: 230px;
}
table.partners img {
    margin: auto;
}

/*** Spécifique coin des parents ***/
div.hr {
    clear: both;
    width: 700px;
    border-top: 2px dashed #FF58C0;
    margin: 20px auto;
}

h4.pure {
    background-image: none;
    color: #304AF4;
    margin-bottom: 10px;
    text-align: left;
    margin-left: 30px;
}
h4.little {
    clear: both;
    width: 345px;
    height: 25px;
    background-image: url(../medias/images/bg_h4_col.png);
    color: #FFF;
    font-size: 12pt;
    margin: 10px 0 10px 30px;
}
h4.floatl { float: left; }

p.backtotop_right {
    margin: auto 0 auto auto;
    height: 46px;
    width: 120px;
    line-height: 46px;
}
p.backtotop_right img {
    float: left;
    margin: 0;
}
p.error {
    color: #FF7E00;
    font-weight: bold;
    border-top: 2px solid #FF7E00;
    border-bottom: 2px solid #FF7E00;
}
p.redalert {
    color: #FF006F;
    font-weight: bold;
}
form strong {
    color: #FF7E00;
    font-size: 11pt;
}

div.colcontainer { clear: both; }
div.colcontainer img { display: block; margin: 0 auto; }
div.support {
    clear: both;
    width: 207px;
    height: 1px;
    margin: 5px auto 5px auto;
}
p.eco {
    font-weight: bold;
    color: #FF58B3;
    text-align: center;
    margin: 7px 0;
}
.highlight { color: #FF58B3; }

div.col { width: 340px; float: left; }
div.col_left { margin: 0 30px 10px -10px; }
div.col_right { margin: 0 -10px 10px 0; }
div.col3 { width: 232px; float: left; }
div.col3_left { clear:both; margin: 0 10px 10px -20px; }
div.col3_middle { margin: 0 0 10px 0; }
div.col3_right { margin: 0 -20px 10px 10px; }
div.col4 {width: 170px; float: left; margin: 1px; margin-bottom:10px;}
div.col p, div.col3 p { margin: 10px 5px auto 15px; }
div.col h4, div.col3 h4 {
    width: 345px;
    height: 25px;
    background-image: url(../medias/images/bg_h4_col.png);
    color: #FFF;
    font-size: 12pt;
    margin: 20px 0 10px 0;
}
div.col h4.pure, div.col3 h4.pure {
    background-image: none;
    color: #00479B;
    margin-bottom: 10px;
}
div.col h4.pure span {line-height: 40px; float: left; margin-right: 10px;}

p.infos {
    clear: both;
    padding-top: 0px;
    line-height: 46px;
}

p.onelineform { float: left; margin: 1px auto 3px 20px; }
p.onelineform label { margin-right: 8px; float: left; }
div.onelineform {
    clear: both;
    width: 498px;
    height: 23px;
    margin: 10px;
    background-image: url(../medias/images/bg_timelimit.png);
}
div#form_timelimit {
    margin: 15px auto 10px 0;
    width: 500px;
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #00519C;
}
div#form_timelimit form {
    float: left;
    width: 500px;
}
div#form_timelimit input { display: block; }

/* Styles généraux pour les boîtes avec bordures arrondies */
div.round {
    width: 340px;
    margin: 15px auto 10px auto;
    background-color: transparent;
    background-repeat: repeat-y;
}
div.round_top, div.round_bottom {
    width: 340px;
    height: 20px;
    background-color: white;
    background-repeat: no-repeat;
    clear: both;
}
div.round h4 {
    margin: 0 auto;
}

div#sc.round { background-image: url(../medias/images/bg_parents_sc.png); }
div#sc div.round_top { background-image: url(../medias/images/bg_parents_sc_top.png); }
div#sc div.round_bottom { background-image: url(../medias/images/bg_parents_sc_bottom.png); }
div#sc img.illus { float: left; margin: 10px; }

div#cp.round { background-image: url(../medias/images/bg_parents_cp.png); }
div#cp div.round_top { background-image: url(../medias/images/bg_parents_cp_top.png); }
div#cp div.round_bottom { background-image: url(../medias/images/bg_parents_cp_bottom.png); }
div#cp img.illus { float: right; margin: -10px 10px 0px 10px; }

div#sendstory {
    width: 693px;
    margin: 15px auto 10px auto;
    background: transparent url(../medias/images/bg_sendstory.png) repeat-y;
}
div#sendstory div.round_top, div#sendstory div.round_bottom { width: 693px; height: 20px; }
div#sendstory div.round_top { background-image: url(../medias/images/bg_sendstory_top.png); }
div#sendstory div.round_bottom { background-image: url(../medias/images/bg_sendstory_bottom.png); }
div#sendstory div.explanations {
    width: 350px;
    float: left;
    margin-left: 10px;
}
div#sendstory form { float: right; margin-right: 20px; }
div#sendstory div.explanations h4 { margin-top: 0; width: 260px; }
div#sendstory form p { margin-top: 0; }
div#sendstory div.button input { margin: 0 10px 0 auto; }

p.goto {
    clear: both;
    line-height: 46px;
    font-weight: bold;
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
}
p.goto img { float: left; margin: 0;}

img.illus_left { float: left; margin:auto 20px auto 10px;}
img.illus_left_mr { float:left; margin-right:20px}
img.illus_right { float: right; }
img.illus_connec { margin: 20px auto 20px auto; display: block; }

div.col h4.medium {
    background-image: url(../medias/images/bg_h4_medium.png);
    width: 240px;
    height: 25px;
}

div.infos { text-align: center; }
div.infos p { font-size: 12pt; font-weight: normal; margin:1em;}

div#connec {
    margin: 15px auto 10px auto;
    width: 350px;
    background: transparent url(../medias/images/bg_connec.png) repeat-y;
}
div#connec_top {
    width: 350px;
    height: 20px;
    margin: 0;
    background: white url(../medias/images/bg_connec_top.png) no-repeat;
}
div#connec_bottom {
    width: 350px;
    height: 20px;
    margin: 0;
    background: white url(../medias/images/bg_connec_bottom.png) no-repeat;
}
div#connec label {
    margin: 0px 5px 5px 15px;
    font-size: 13pt;
    font-weight: bold;
}
div#connec input { margin-left: 20px; }

div#register {
    margin: 15px 0 10px 0;
    width: 694px;
    background: transparent url(../medias/images/bg_register.png) repeat-y;
}
div#register_top {
    width: 694px;
    height: 20px;
    margin: 0;
    background: white url(../medias/images/bg_register_top.png) no-repeat;
}
div#register_bottom {
    width: 694px;
    height: 20px;
    margin: 0;
    background: white url(../medias/images/bg_register_bottom.png) no-repeat;
    clear: both;
}
div#register p {
    margin: 0px 5px 17px 15px;
    font-size: 11pt;
}
div#register form p {
    margin: 0px 5px 5px 15px;
    font-size: 11pt;
}
div#register label { font-weight: bold; }
div#register form {
    width: 300px;
    float: left;
}
div#register p.goto { clear: none; }

div.recap_form {
    margin: 15px 0 10px 0;
    width: 540px;
    background: transparent url(../medias/images/bg_form.png) repeat-y;
}
div.recap_form_top {
    width: 540px;
    height: 20px;
    margin: 0;
    background: white url(../medias/images/bg_form_top.png) no-repeat;
}
div.recap_form p {
    margin: 0px 5px 5px 15px;
    font-size: 12pt;
}
div.recap_form div.button {
    margin: 0;
    padding-top: 20px;
    width: 540px;
    background: white url(../medias/images/bg_form_bottom.png) no-repeat;
    background-position: top;
}
div.recap_form label { float: left; }
div.recap_form input { display: block; }
div#form_pass input { margin: auto 70px auto auto; border: 0px; }
div#form_profile input, div#form_childnews input, div#form_subscribe_login input { margin: auto 30px auto auto; border: 0px; }
div#connec div.button input, div#form_pass div.button input, div#form_profile div.button input, div#form_childnews div.button input, div#form_subscribe_login div.button input { margin: 0 auto; }
div#form_newsletter {
    margin: 0 30px 10px 30px;
    font-weight: bold;
}

div.timestats {
    height: 450px;
}

table#children {
    width: 702px;
    text-align: center;
    margin: auto;
    border-collapse: collapse;
}
table#children td, th {
    width: 117px;
    padding: 3px 2px;
}
table#children th {
    font-size: 13pt;
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
    border-bottom: 2px solid #FF58C0;
}

div.avatar {
    width: 120px;
    height: 120px;
    margin: 0 20px 11px 55px;
    float: left;
}

/* Boutons de formulaire */
form div.button input {
    clear: both;
    display: block;
    margin: 0 auto;
    margin-left: auto;
}

/* Simply-Club : bienvenue */
div.center { text-align: center; }

/* Simply-Club : avantages */
div.col_illus img { margin: auto; }
div.col3 div.col_illus { height: 162px; }
div.col div.col_illus { height : 164px; }

/* Simply-Club : payment*/

#paymentBoxTop {width:700px; background-repeat:no-repeat; font-family:Lucida Sans,Lucida Grande,Lucida Sans Unicode,sans-serif; font-size:10pt;}
#explainBox {margin-left:5px; width:380px; height:300px; background-image:url(../medias/images/capitaine-explain.png); background-repeat:no-repeat; float:left;}
#paymentFormBox {width:300px; height:300px; float:left; background-repeat:no-repeat;}
#paymentFormBox strong {color:#000;}
#insidePaymentFormBox {width:300px;font-family:Arial,Helvetica,sans-serif;font-size:10px;background-color:#ffffff;color:#000}
#textExplainBox {width:215px; margin-top:15px; margin-left:15px; text-align:left; color: #00325F; }
#paymentButton {border:0px;margin:0px;padding:0px;width:55px;height:55px;background-image:url(../medias/images/btn-ok.png); background-repeat:no-repeat; background-color:#FFF;}
#paymentButton:hover {cursor:pointer;}
#paymentChose {width:700px; height:135px;}
.paymentFormInput {background-color:#e7e7e7;border:#000080 1px solid;color:#000080;cursor:text;font-family:Arial;font-size:10pt;font-weight:bold;letter-spacing:normal;width:70px;text-align:center;}
.paymentChoice:hover {background-color:#56CAFF;}

/* Coin parents : page témoignages */
div.stories {
    margin: 20px auto;
    font-size: 10pt;
    padding: 1px;
    background-repeat: no-repeat;
    font-family: 'Trebuchet MS', Arial, helvetica, sans-serif;
    font-weight: bold;
}
div.story1 { width: 666px; height: 137px; background-image: url(../medias/images/illus_stories1.png); color: #FFF; }
div.story2 { width: 639px; height: 144px; background-image: url(../medias/images/illus_stories2.png); color: #0065CA; }
div.story3 { width: 641px; height: 139px; background-image: url(../medias/images/illus_stories3.png); color: #FFF; }
div.story4 { width: 617px; height: 143px; background-image: url(../medias/images/illus_stories4.png); color: #FFF; }
div.story5 { width: 662px; height: 169px; background-image: url(../medias/images/illus_stories5.png); color: #FFFF00; }
div.story6 { width: 660px; height: 129px; background-image: url(../medias/images/illus_stories6.png); color: #0065CA; }
div.story1 p { margin: 5px 10px auto 120px; }
div.story2 p { margin: 10px 130px auto 15px; }
div.story3 p { margin: 10px 15px auto 120px; }
div.story4 p { margin: 5px 100px auto 18px; }
div.story5 p { margin: 10px 5px auto 120px; }
div.story6 p { margin: 10px 120px auto 15px; }

/*** Footer ***/
#footer {
    clear: both;
    padding-top: 0px;
    padding-bottom: 10px;
    color: #FFF;
    font-weight: bold;
    font-size: 10pt;
}
#footer a {
    color: #FFF;
}

.subinfo {
    font-size:10pt;
}

/*h4.little {
    clear: both;
    width: 345px;
    height: 25px;
    background-image: url(../medias/images/bg_h4_col.png);
    color: #FFF;
    font-size: 12pt;
    margin: 10px 0 10px 30px;
}*/