body { 
margin:0;
padding:0;
text-align:center;
}

body { 
color:#fff; 
background-color:#353535; 
background-image:url("../images/skyline.jpg");
background-repeat:repeat-x;
background-position:5px 0;
text-align:justify; 
font-family: Arial, Helvetica, sans-serif; 
font-size:80%; 
}

p  { 
padding:0.5em; 
padding-right:1em;
margin: 0; 
font-size: 1em; 
}

.wide p {
color:#fff;
}

a {
color:#fff;
}

a:visited {
color:#cde;
}

a:hover {
color:#da6517;
}

a img {
border:none;
}

h1 { 
font-size:14pt;
font-style:italic;
position:absolute;
top:-65px;
left:250px;
}

h2 { 
padding:0.5em; 
margin:0; 
font-size:1.2em; 
font-weight:bold; 
background:url("../images/h2-heading.jpg") top left no-repeat;
background-position:0 -2px;
}

h3 {
margin:0;
font-size:0.9em;
font-weight:bold;
color:#fff;
}

ul {
margin-right:1em;
}

.clear {
clear:both;
}

.wrapper { 
min-width:400px; 
position:relative;
}

.wrapper {  
margin: 0 -1px; 
}
/* this is a border with marginal compensation to stop scroll bars */



/* Setup (This all looks neater when it isn't put on display!) */

.wrapper {
width: 750px;               /* total width */
margin:auto;
background-image:url("../images/head.jpg");
background-repeat:no-repeat;
padding-top:180px;
}      

.outer {
border-left-width: 180px;  /* left column width */
border-left-color: transparent;   /* left column colour */
	
border-right-width: 160px; /* right column width */
border-right-color: transparent;  /* right column colour */
	
background-color: transparent; /* center column colour */
background-image:url("../images/left-bg.jpg");
background-repeat:repeat-y;
background-position:-180px;
}

.left {
width: 180px;              /* left column width */
margin-left: -180px;       /* _negative_ left column width */
}

.right {
width: 180px;              /* right column width */
margin-right: -180px;      /* _negative_ right column width */
}



/* ---------------------------- Main code --------------------------- */

.outer { 
width:auto; 
border-left-style:solid; 
border-right-style:solid; 
}

.inner { 
margin:0;
width:100%; 
}

.left { 
float:left; 
position:relative; 
z-index:10; 
}

.right { 
float:left; 
position:relative; 
z-index: 11; 
color:#fff;
text-align:center;
}

.center { 
float:left; 
width:390px; 
position:relative; 
z-index:12; 
padding:0;
}

.content {
padding:0 10px;
}

.wide { 
width:100%; 
position:relative;
z-index:13; 
}


/* Mozilla code */
.outer > .inner { border-bottom: none; }
.left { margin-right: 1px; }
.right { margin-left: 1px; }
.center { margin: 0 -3px 0 -2px; }



/* ------------------------ logo formatting --------------------------- */ 

#logo {
text-align:center;
margin:0 100px 20px 0;
}


/* ----------------------- navigation ---------------------------------- */

#navcontainer {
margin: 0 auto;
padding:0 0 30px 10px;
font-size: 13px;
text-align: center;
}

ul#navlist {
text-align: left;
list-style: none;
padding: 0 0 0 20px;
margin: 0 auto;
}

ul#navlist li {
display: block;
margin: 0;
padding: 0;
}

ul#navlist li a {
display: block;
width: 100%;
padding: 0.3em 0 0.3em 2em;
color: #fff;
text-decoration: none;
background-image:url("../images/padlock-grey.gif");
background-repeat:no-repeat;
background-position:5px 3px;
}


ul#navlist li a:hover, ul#navlist li a:hover {
color: #da6517;
border-color: #aaab9c #fff #fff #ccc;
background-image:url("../images/padlock.gif");
background-repeat:no-repeat;
background-position:5px 3px;
}

#navcontainer>ul#navlist li a { width: auto; }

*html body .wrapper .outer .inner .left #navcontainer ul#navlist li a { width: 123px; }

ul#navlist li#active a {
background: #edeeef;
color: #c30;
}

#home ul#navlist li a.home,
#journee ul#navlist li a.journee,
#nuit ul#navlist li a.nuit,
#entrainement ul#navlist li a.entrainement,
#resources ul#navlist li a.resources
{
color: #da6517;
font-weight:bold;
background-image:url("../images/padlock.gif");
}


/* ------------------------ Lists formatting ----------------------- */ 

ul { 
list-style-type:none;
padding:0 5px;
margin:0;
}

ul li {
margin-bottom:10px;
}

ul li a {
color:#fff;
}

ul li a:hover {
color:#da6517;
}

/* ------------------------ footer formatting ---------------------- */ 

.footer a {
color:#fff;
}

.footer a:hover {
color:#cde;
}

.footer {
background:url("../images/footer.jpg") top left repeat-x #353535;
height:156px;
padding:0 0 0 160px;
}

.footer div {
padding-top:20px;
}

.footer #address {
padding:0 0 0 20px;
float:left;
position:relative;
width:370px;
}



/* ------------------- contact form formatting ---------------------- */ 

.footer #contactform {
float:left;
padding:0;
position:relative;
}

.footer #contactform label.error {
background-image:url("../images/error.gif");
background-repeat:no-repeat;
padding-left:15px;
background-position:0 3px;
}

.footer #contactform input.error, 
footer #contactform textarea.error {
border:2px solid #da6517;
}

/* ------------------------ Video player formatting ----------------- */

#player {
text-align:center;
margin-left:50px;
margin:auto;
background:url("../images/video-player-bg.jpg") center center no-repeat #353535;
height:300px;
padding-top:35px;
}

#player p {
width:85%;
margin:auto;
}