/* Définition des polices personnalisées */
@font-face
{
    font-family: 'SF_Arch_Rival';
    src: url('index/polices/SF_Arch_Rival_Extended-webfont.eot');
    src: url('index/polices/SF_Arch_Rival_Extended-webfont.eot?#iefix') format('embedded-opentype'),
         url('index/polices/SF_Arch_Rival_Extended-webfont.woff') format('woff'),
         url('index/polices/SF_Arch_Rival_Extended-webfont.ttf') format('truetype'),
         url('index/polices/SF_Arch_Rival_Extended-webfont.svg#SF_Arch_Rival') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Eléments principaux de la page */
body
{
    background: url('index/images/fond4.jpg') fixed;
    font-family: 'Trebuchet MS', Arial, sans-serif;
    color: #181818;
}

h1, header h1, section h1, footer h1, nav a
{
    font-family: 'Trebuchet MS', Arial, sans-serif;
	font-weight: normal;
    text-transform: uppercase;
}

h2, header h2, section h2
{
    font-family: 'Trebuchet MS', Arial, sans-serif;
	font-weight: bold;
}

footer h2
{
    font-family: 'Trebuchet MS', Arial, sans-serif;
	font-weight: bold;
	text-align: left;
	margin: 5px 0px 5px 0px
}

#bloc_page
{
    width: 90%;
    margin: auto;
}

/* Traitement de l'entête */
header
{
    text-align: center;
	border: 0px #888888 solid;
    border-radius: 10px 10px 10px 10px;
	background: url('index/images/fond_jaune.png');
 }
/* bannière */
#bandeau
{
	vertical-align: top;
	height: 150px;
	border: 3px #888888 solid;
    border-radius: 10px 10px 0px 0px;
}

#logoG, #titrepage, #logoD
{
	display: inline-block;
}

#logoG
{
    width: 16%;
	max-height: 150px;
	max-width: 150px;
    border-radius: 10px;
	float: left;
	left: 0;
}

#titrepage
{
	position: relative;
    width: 66%;
	height: 100%;
    border-radius: 10px;
	background: url('index/images/ban_002.png') repeat;
}

#titretexte
{
    position: absolute;
    bottom: 0;
    width: 100%;
    font-family: 'Trebuchet MS', Arial, sans-serif;
    font-size: 2em;
    font-weight: normal;
	text-transform: uppercase;
	background-color: rgb(25,25,88); /* Pour les anciens navigateurs */
    background-color: rgba(25,25,88,0.8);
    color: yellow;
	border-radius: 10px;
}

#logoD
{
    width: 16%;
	max-height: 150px;
	max-width: 150px;
    border-radius: 10px;
	float: right;
	right: 0;
}

/* Menu */
nav
{
    text-align : center;
	margin : auto;
	height : 30px;
	border-right : 3px #888888 solid;
	border-left : 3px #888888 solid;
}

nav #menu
{
	display: inline-block;
}

nav, nav ul
{
    padding : 0;
    margin : 0;
    list-style : none;
    line-height : 30px;
}

nav ul
{
    list-style-type: none;
}

nav li 
{ 
	float : left; 
	border-right : 1px solid #fff;
}

nav a
{
	display : block;
	padding : 0;
	background: url(index/images/degradeblue.jpg) repeat-x top left;        
	color : white;
	text-decoration : none;
	width : 145px;
	font-size : 0.8em;
	border-radius: 5px;
}

nav li ul
{ 
	position: absolute;
	width: 145px;
	left: -999em;
}

nav li ul li 
{
	border-top: 1px solid #fff;
}

nav li ul ul 
{
        margin: -31px 0 0 145px ;
        border-left: 1px solid #fff ;
}

nav a:hover     
{
        color: #fff;
        background: url(index/images/degradeblack.jpg) repeat-x top left;        
        
}

nav li:hover ul ul, nav li.sfhover ul ul
{
        left: -999em;
}

nav li:hover ul, nav li li:hover ul, nav li.sfhover ul, nav li li.sfhover ul 
{
        left: auto;
        min-height: 0;
}

#accueil
{
	vertical-align: top;
	border: 3px #888888 solid;
    border-radius: 0px 0px 10px 10px;
}

@media all and (max-width: 856px)
{
    #bandeau
       {
	    height: 120px;
	}
	nav
	{
		height : 60px;
	}

	#titretexte
	{
		font-size: 1em;
	}
}

@media all and (max-width: 532px)
{
    #bandeau
       {
	    height: 75px;
	}
	nav
	{
		height : 90px;
	}
	#titretexte
	{
		font-size: 0.6em;
	}
	
}


/* Partie section */
section
{
	margin-top: 40px;
	background: url('index/images/fond_jaune.png');
    border: 3px #888888 solid;
    border-radius: 10px 10px 10px 10px;
}

article, aside
{
    display: inline-block;
    vertical-align: top;
	padding : 2%;
	text-align: justify;
}

article
{
    width: 58%;
    border-right: 3px #888888 solid;
	margin-right: 2%;
}


header img
{
    border-right: 3px #888888 solid;
    border-bottom: 3px #888888 solid;
    border-radius: 10px 10px 10px 10px;
}

article img, aside img
{
    border-right: 3px #888888 solid;
    border-bottom: 3px #888888 solid;
    border-radius: 10px 10px 10px 10px;
	float : left;
	margin-right: 10px;
}

aside
{
    position: relative;
    width: 29%;
}

@media all and (max-width: 682px)
{
	article, aside
	{
		display: block;
	}

	article
	{
		width: auto;
		margin-right: 0px;
		border-right: none;
	}

	aside
	{
		width: auto;
		float : none;
	}
}

label
{
	display: block;
	width: 150px;
	float: left;
}

/* Partie footer */
footer
{
	margin-top: 40px;
	padding-left: 20px;
    border: 3px #888888 solid;
    border-radius: 10px 10px 10px 10px;
	background: url('index/images/fond_jaune.png');
	text-align: center;
	
 }

footer img
{
    margin: 5px 15px 5px 15px;
	border: 3px #888888 solid;
    border-radius: 10px 10px 10px 10px;
}

#sponsor1, #sponsor2, #sponsor3, #sponsor4
{
	display: inline-block;
	vertical-align: bottom;
}

#copyright
{
	margin-top: 5px;
	margin-right: 10px;
	text-align: center;
	font-size: 0.75em;
}

.imgRS
{
    width: 100%;
	max-width: 50px;
	text-align: center;
}

.img90
{
    width: 100%;
	max-width: 90px;
	text-align: center;
}

.bouton_rouge
{
    height: 25px;
    right: 5px;
    bottom: 5px;
    background: url('index/images/fond_degraderouge.png') repeat-x;
    border: 1px solid #760001;
    border-radius: 5px;
    font-size: 1.2em;
    text-align: center;
    padding: 3px 8px 0px 8px;
    color: white;
    text-decoration: none;
}

.bouton_rouge img
{
    border: 0;
}


/* Correctifs pour les vieilles versions d'Internet Explorer */

/* Pour activer un positionnement type inline-block sur les vieilles versions d'IE */

.old_ie #titrepage, .old_ie #titretexte, .old_ie #logoG, .old_ie #logoD, .old_ie nav #menu, .old_ie nav li, .old_ie nav ul li, .old_ie article, .old_ie aside, .old_ie #sponsor1, .old_ie #sponsor2, .old_ie #sponsor3, .old_ie #sponsor4
{
    display: inline;
}

/* Quelques ajustements pour les vieilles versions d'IE */

.old_ie #titrepage
{
	position: relative;
	margin-left: 0px;
	margin-right: 0px;
	left: 0px;
    width: 75%;
}

.old_ie #titretexte
{
	position: relative;
	background: navy;
}

.old_ie #logoD
{
	display: none;
}

.old_ie section h2, .ie8 section h2
{
    font-size: 1.1em;
}