@import "navigation.css";
@import "contact.css";

body
{
    margin:             0 auto;
    padding:            0;
    font-size:          80%;
    font-family:        verdana, arial, sans-serif;
    width:              800px;
    background:         #f4f4f4;
}

#header
{
    height:             266px;
    background:         transparent url(images/bandeau.jpg) left top no-repeat;
    border-right:       1px solid #a8ccdc;
    border-left:        1px solid #a8ccdc;
}

#header.junior
{
    height:             266px;
    background:         transparent url(images/bandeau_junior.jpg) left top no-repeat;
}

#header h1
{
    margin:             0;
    padding:            15px;
}

a
{
    color:              #145e86;
    text-decoration:    none;
}

a:hover
{
    text-decoration:    underline;
}

a.more {
    background:         transparent url(images/picto_link.png) left top no-repeat;
    padding-left:       16px;
    padding-top:        2px;
    font-style:         italic;
}

hr.diviseur {
    border:             none;
    border-top:         1px solid #ccc;
    margin:             0px auto;
    height:             0;
    width:              60%;
}

img.transparent
{
	behavior:	url("/design/pngbehavior.htc");
}

a img
{
    border:             none;
}

#wrapper
{
    margin:             0;
    padding:            0;
    background:         #fff url(images/navigation2.jpg) left top repeat-y;
    border-right:       1px solid #a8ccdc;
    border-left:        1px solid #a8ccdc;
}

/* deprecated */
div.information {
    margin-right:       20px;
    margin-bottom:      10px;
}

#content
{
    position:           relative;
    font-size:          85%;
    margin:             0;
    padding:            40px 10px 20px 25px;
    float:              left;
    width:              571px;
    min-height:         560px;
    background:         #fff url(images/content.jpg) left top no-repeat;

}

#wrapper div.gouttes
{
    background:         transparent url(images/fond_gouttes.jpg) right bottom no-repeat;
}

#content p
{
    text-align:         justify;
}

h2
{
    margin:             30px 0px 15px 0px;
    padding:            3px 0px 3px 24px;
    font-size:          120%;
    color:              #64a2c2;
    text-transform:     uppercase;
    background:         transparent url(images/goutte_titre.png) left top no-repeat;
}

h3 {
    margin:             8px 0px 0px 0px;
    padding:            3px 0px 3px 0px;
    font-size:          110%;
    color:              #64a2c2;
    font-style:         italic;

}


h4 {
    margin:             15px 0px 5px 0px;
    padding:            3px 0px 3px 0px;
    font-size:          100%;
    color:              #64a2c2;
    font-style:         italic;

}

strong {
    color:              #145e86;
}

strong.important {
    font-weight:        normal;
    color:              #951514;
}

ul {
    margin:             0;
    padding:            0;
    padding-left:       15px;
}

ul li {
    margin:             0;
    padding-top:        5px;
    color:              #888;
}

#info_box {
    margin-top:         70px;
    width:              150px;
    padding-left:       5px;
    float:              right;
    background-color:   #105576;
    color:              #92c0d7;
}

#info_box h2 {
    margin:             0;
    padding:            0;
    background:         none;
}

#recherche_resultats p {
    border-left:        1px solid red;
}



#pieddepage {
    margin:             0px 0px 0px 0px;
    padding:            0px 0px 10px 0px;
    clear:              both;
    width:              100%;
    border-top:         5px solid #a8ccdc;
    text-align:         center;
    background:         #a8ccdc;
    font-size:          80%;
    color:              #656565;
}

#pieddepage p {
    margin:             5px 0px 0px 0px;
    padding:            0;
}

#pieddepage span {
    margin-top:         0;
}

/*
----------------------------------------------------------------------
ZONE MISSION DE LA PAGE D'ACCUEIL.
ZONE EN SAVOIR PLUS
*/
#missions,
#savoir,
#outils
{
    clear:             right;
	margin:            0px 0px 40px 20px;
	padding:           0;
	float:             right;
	width:	           190px;
	padding-bottom:    28px
}

#missions ul,
#savoir ul,
#outils ul
{
    margin:             0;
    padding:            45px 0px 0px 5px;
	text-decoration :   none;
	list-style-type:    none;
	font-size:          100%;
}

#missions ul li,
#savoir ul li,
#outils ul li
{
    margin:             0;
    padding:            5px 4px 2px 24px;
}

#missions ul li a,
#savoir ul li a,
#outils ul li a
{
	color : #ffffff;
	text-decoration : none;
}

#missions ul li a:hover,
#savoir ul li a:hover,
#outils ul li a:hover
{
	text-decoration : underline;
}

#missions {
    background:         #991f22 url(images/missions_footer.png) left bottom no-repeat;
}

#missions ul {
    background:         transparent url(images/missions_header.png) left top no-repeat;
}

#missions ul li {
    background:         transparent url(images/missions_puce.png) left 9px no-repeat;
}

#savoir {
    background:         #145c7b url(images/savoir_footer.png) left bottom no-repeat;
}

#savoir ul {
    padding-top:        50px;
    background:         transparent url(images/savoir_header.png) left top no-repeat;
}

#savoir ul li {
    background:         transparent url(images/savoir_puce.png) left 9px no-repeat;
}

#outils {
    margin:             0px 0px 15px 20px;
    background:         #ffffff url(images/outils_footer.png) left bottom no-repeat;
}

#outils div {
    padding-top:        30px;
    background:         transparent url(images/outils_header.png) left top no-repeat;
}

#outils div p {
    margin:             0px 0px 5px 0px;
    padding:            0;
}

#outils div strong {
    padding-left:       15px;
}

#outils ul {
    margin:             0;
    padding:            0;
    border-left:        4px solid #a2cee7;
}
#outils ul li {
    padding:            0px 4px 7px 11px;
}

#outils ul li a
{
    color:              black;
}

/*
----------------------------------------------------------------------
FIL D'ARIANE
*/

#breadcrumb_navigation
{
    margin-top:         -25px;
    margin-left:        10px;
    margin-right:       10px;
    padding-bottom:     3px;

    border-bottom:      1px solid #ccc;
}


#content p.rebus {
    text-align:         center;
}

#content p.rebus img {
    margin-top:         15px;
}

#content div.rebus {
    margin:             auto;
    width:              430px;
    visibility:         hidden;
    text-align:         left;
}