@charset "UTF-8";
@font-face {
font-family: 'mardian_demoregular';
    src: url('polices/mardiandemo-webfont.eot');
    src: url('polices/mardiandemo-webfont.eot?#iefix') format('embedded-opentype'),
         url('polices/mardiandemo-webfont.woff') format('woff'),
         url('polices/mardiandemo-webfont.ttf') format('truetype'),
         url('polices/mardiandemo-webfont.svg#mardian_demoregular') format('svg');
    font-weight: normal;
    font-style: normal;
	}
@font-face {
    font-family: 'before_the_rainregular';
    src: url('siteperso/polices/beforetherain_personal_use_demo-webfont.eot');
    src: url('polices/beforetherain_personal_use_demo-webfont.eot?#iefix') format('embedded-opentype'),
         url('polices/beforetherain_personal_use_demo-webfont.woff') format('woff'),
         url('polices/beforetherain_personal_use_demo-webfont.ttf') format('truetype'),
         url('polices/beforetherain_personal_use_demo-webfont.svg#before_the_rainregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
 article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
	display: block
}


html {
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%
}
body {
	background-color:#2A3D65;
	margin: 0;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 20px;
	color: #4D92F7;
	background: url(bg.jpg) fixed, #1E2D4C;
	/*background-repeat: no-repeat;*/
	/*padding-top: 65px;*/
	
    
}
header {
	padding: 90px 100px 30px 100px;
	margin-bottom: 30px;
	 background-color: rgba(0, 0, 0, 0.5);
	border-radius: 10px;
	box-shadow: 3px 4px 10px #000000;
	/*margin-right: 78px;*/
	
}
header h1 {
	font-size: 60px;
	line-height: 1;
	letter-spacing: 10px;
	font-family: 'before_the_rainregular';
	text-shadow:  1px 2px 3px #F8EAEA, 2px 4px 6px #000;
	margin-bottom: 80px;
	text-align:center;	
	}

a {
	color: #08c;
	text-decoration: none;
}
a:hover {
	color: #005580;
	text-decoration: underline;
}
.row {
	margin-left: auto;
    margin-right: auto;
	padding-left: 70px;
	width: 1100px;
}
.row:before, .row:after {
	display: table;
	line-height: 0;
	content: ""
}
.row:after {
	clear: both
}
[class*="span"] {
float:left;
min-height:1px;
margin-left:20px
}

.container {
	margin-right: auto;
	margin-left: auto;
    width: 1100px;
	
}
h1, h2, h3, h4, h5, h6 {
	margin: 10px 0;
	font-family: inherit;
	font-weight: bold;
	line-height: 1;
	color: inherit;
	text-rendering: optimizelegibility;
}
h1 {
	font-size: 36px;
	line-height: 40px;
	
}
h2 {
	font-size: 25px;
	line-height: 35px;
	border-bottom:#0CF 1px dotted;
	text-shadow: 1px 1px 1px blue;
	color: #F4F5F9;
}
h3 {
	font-size: 24px;
	line-height: 40px
}


.btn {
   border-top: 1px solid #96d1f8;
   background: #65a9d7;
   background:  linear-gradient(to bottom, #3e779d , #173AE9);
   -pie-background:        linear-gradient( #3e779d, #173AE9);
   /*behavior: url(PIE.php);*/
   padding: 5.5px 11px;
   border-radius: 8px;   
   box-shadow:  0px -0.1em 0.3em rgba(0, 0, 0, 0.15) inset;
   text-shadow: rgba(0,0,0,.9) 0 1px 0;
   color: white;
   font-size: 13px;
   font-family: Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   position:absolute;
   top: 300px;
   left: 55%;
   }

.btn:hover {
   text-decoration: none;
   border-top-color: #28597a;
   background:         linear-gradient(#28597a, #89CAF2);
   -pie-background:    linear-gradient(#28597a, #89CAF2);
   color: #ccc;
	/*behavior: url(PIE.php);*/
   }
.btn:active {
	border-top-color: #1b435e;
	background: #B0C7D5;
	outline: 0;
	box-shadow: inset 0 2px 5px rgba(0,0,0,0.50), 0 2px 7px rgba(0,0,0,0.35);
	/*behavior: url(PIE.php);*/
	color: #000;
   }
 


	
.span4 {
	width: 250px;
	height: 320px;
	padding: 8px 25px 35px 15px;
	background: #141922;
	margin-bottom: 25px;
	
	border-radius:15px;
	border:solid 5px #283345;
	position:relative;
}
.span4 p {
	color:#999;
}
ol {
color:#999;
margin-left: 30px;
}
.pages {
float:left;
margin-top: 2px;

}
/* ========================FOOTER=======================*/
footer {
	width: 100%;
	margin-top: 10px;
	-pie-background: linear-gradient( #1A1B1F 15%, #353940 100%);
	background: linear-gradient( #1A1B1F 15%, #353940 100%);
	/*behavior: url(PIE.php);*/
	position: relative;
	padding-top: 20px;
	text-decoration: none;
	text-align: left;
}
#footer-gauche {
	left: 15%;
	position: relative;
	width: 260px;
	margin-bottom: 10px;
	float: left;
}
#footer-centre {
	/*float: right;*/
	left: 38%;
	position: absolute;
	width: 260px;
}
#footer-droit{
	/*float: right;*/
	left: 60%;
	position: absolute;
	width: 260px;
}
#footer-image {
float: right;
margin-right: 80px;
width: 50px;
}
footer h4 {
	color: #6B4724;
	font-size: 16px;
	margin: 30px 0 10px 0;
	border-bottom: 1px solid ;
	text-transform: uppercase;
}
footer ul {
	list-style: none outside none;
	margin: 0;
	padding: 0;
	letter-spacing:2px;
	text-transform: uppercase;
	text-align: left;
}
footer li {
	float: left;
	margin: 0 0 10px;
	width: 225px;	
}
footer li a {
	
	color: rgb(168, 164, 171);
	font-family: Arial, Verdana, sans-serif;
	padding: 0 0 3px;
	font-size: 11px;
}

footer li a:hover {
	color:#FF00FF;
	text-decoration: none ;
}
#copyright {
	width: 100%;
	background-color: #003;
	color: #fff;
	clear: both;
	border-top: #CCC thin solid;
	padding-top: 5px;
	font-size: 12px;
	
}


.clearer {
	clear: both;
	overflow: hidden;
}

/*================ SLIDER =====================*/
*{        
        padding:0;
        margin:0;
        
      }

     
      #slider{
        border:7px grey solid;
        width:900px;
        height:340px;
        margin: auto;
        position:relative;
		border-radius: 10px;
      }
      #mask{
        width:100%;
        height:100%;
        position:absolute;
        overflow:hidden;
		
      }
      .fleche{
        position:absolute;
        top:145px;
        cursor:pointer;
      }
      #fleche_gauche{
        left:-24px;
      }
      #fleche_droite{
        right: -24px;
      }
      #image_container{
        position:absolute;
        width:1100%;
        height:100%;
        /* La transition sur tout les navigateurs */
           /* Chrome */ 
          -webkit-transition-property:all;
          -webkit-transition-duration:1s;

           /* Firefox */ 
          -moz-transition-property:all;
          -moz-transition-duration:1s;
          
           /* Opera */ 
          transition-property:all;
          transition-duration:1s;

      }
      
      /* Les différentes positions du slider */
      .image1 #image_container{
        left:0;
      }
      .image2 #image_container{
        left: -100%;
		
      }
      .image3 #image_container{
        left: -200%;
      }
      .image4 #image_container{
        left:-300%;
      }
	  .image5 #image_container{
        left:-400%;
      }
      .image6 #image_container{
        left:-500%;
      }
	  .image7 #image_container{
        left:-600%;
      }
	  .image8 #image_container{
        left:-700%;
      }
	  .image9 #image_container{
        left:-800%;
      }
	  .image10 #image_container{
        left:-900%;
      }
	  .image11 #image_container{
	  left: -1000%;
	  }
      
      /* Les images */
      #image_container li{
        float:left;
      }
 .imgIndex {
   margin: -50px;  
   }