/*
Educalcool planificateur style sheet
Copyright 2007 Inpix.ca / macharron@inpix.ca
Last edit: 2007-12-18
*/

.planif { background: url(../im/box_planif_0.gif) 3px 0 no-repeat!important; /*height: 90px!important;*/}
.planif.red { background: url(../im/box_planif_1.gif) 3px 0 no-repeat!important; /*height: 90px!important;*/}
.planif a { line-height: 1.3em;}


/* //////////////////////////////////////////////////////////////////////////
general */

#planificateur .frame strong { display: inline;}

#planificateur .content { width: 100%; overflow: hidden; background: url(../im/bg_content.gif) right 0 repeat-y; margin: 0 0 10px;}

#planificateur .questions { width: 209px; float: left; margin: 0 10px 0 0;}
#planificateur .question { background: #ceceb6 url(../im/question_t-l.gif) left 0 no-repeat; margin: 0 0 12px; padding: 10px 0 0;}
#planificateur .question.last { margin: 0;}
#planificateur .fieldset { background: url(../im/question_b-l.gif) 0 bottom no-repeat; padding: 0 10px 10px;}
#planificateur .fieldset h3 { text-transform: uppercase; font-weight: bold; font-size: 100%; margin: 0; color: #55383c;}
#planificateur .fieldset p { margin: 5px 0; line-height: 15px;}

#planificateur .i_text input, #planificateur .i_select select { background: #fff; height: 13px; border: 1px solid #396589; font-size: 100%;}
#planificateur .i_radio input { }
#planificateur .i_text input{ width: 130px;}
#planificateur .i_select select { width: 45px; height: 15px; font-size: 95%; text-align: left; padding: 0;}
#planificateur .i_select select.mid { width: 65px;}
#planificateur .i_select select.long { width: 145px;}

#planificateur input.small { width: 40px;}

/* sex and weight */
#planificateur .autoclear { width: 100%; overflow: hidden;}
#planificateur .autoclear p { float: left; margin: 0;}
#planificateur .label { width: 60px; padding: 10px 0 0; }
#planificateur .group { width: 120px;}
#planificateur .group span { display: block;}

/* question specific */
#planificateur .i_radio .group label { position: relative; top: -3px;}

#planificateur .poids .group span { display: block; margin: 3px 0;}
#planificateur .poids .label { padding: 14px 0 0; }


/* //////////////////////////////////////////////////////////////////////////
faq */

#planificateur .faq { width: 216px; float: left; background: #ceceb6 url(../im/question_t-r.gif) right 0 no-repeat; margin: 0;}
#planificateur .faq h4 { color:#55383C; padding: 8px 8px 15px; margin: 0;}
#planificateur .faq ul { margin: 0; padding: 0 10px 0 8px;}
#planificateur .faq ul li { list-style-type: disc; list-style-image: none; padding: 0 0 15px; margin: 0 0 0 14px;}


/* //////////////////////////////////////////////////////////////////////////
results */

#planificateur .results { background: #86a6de url(../im/result_t-l.gif) 0 0 no-repeat; margin: 0 0 10px; }
#planificateur .results div { background: url(../im/result_t-r.gif) right 0 no-repeat; padding: 10px 0 0; }
#planificateur .results p { background: url(../im/result_b-l.gif) 0 bottom no-repeat; padding: 0 0 10px 10px; margin: 0;}
#planificateur .results a { color: #445d83!important; background: #edeee7; padding: 3px 5px; font-weight: bold;}

#planificateur .taux { background: #1e4281 url(../im/taux_t-l.gif) 0 0 no-repeat; margin: 0 0 15px; color: #fff; font-weight: bold; visibility : hidden;}
#planificateur .taux div { background: url(../im/taux_t-r.gif) right 0 no-repeat; padding: 10px 0 0; }
#planificateur .taux p { background: url(../im/taux_b-l.gif) 0 bottom no-repeat; padding: 0 0 10px 10px; margin: 0; line-height: 1.3em;}
#planificateur .taux span { background: #fff; color: #1e4281; font-weight: normal; padding: 0 2px;}
#planificateur .phraseTx { visibility : hidden; font-weight : bold;}
#planificateur .phraseTx2 { visibility : hidden; }

#planificateur #graph { width: 435px; height: 305px; /*background: url(../im/graph.gif) 0 0 no-repeat;*/ margin: 0 0 10px;}
#planificateur .legende { background: url(../im/legende.gif) 0 center no-repeat; padding: 0 0 0 17px; margin: 0 0 60px 29px; color: #868686; font-size: 81%; visibility : hidden;}
