/**************************************************
 * 		BALISES ET CLASSES GLOBALES 
 **************************************************/
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    box-sizing:         border-box;
}
body {
    font-size: 14px;
    font-family: 'Open Sans', sans-serif;
    text-rendering: optimizeLegibility;
    color: #000;
    line-height: 1.625em;
 	margin:0;
 	width:100%;
    font-weight:400;
   /* -webkit-text-stroke: 0.3px;*/
}
/** Titres **/
h1, h2, h3, h4, h5, h6{
    text-transform: none;
    margin: 0 0 .8125em;
    font-family: 'Open Sans', sans-serif;
    /*-webkit-text-stroke: 0.3px;*/
}
/** Liens **/
a,	
a:hover,
a:focus,
a:active {
    color:#009ADC;
    outline: none;
    text-decoration:none;
}
:focus,
:active {
    -moz-outline-style: none;
}
/** Liste **/
ul{
    margin:0; padding:0;
    list-style-type: none;
}
li{
    margin:0; padding:0;
}
/** Boutons **/
.button-primary,
.button-secondary,
.button-thirdary,
.button-primary:visited,
.button-secondary:visited,
.button-thirdary:visited{
    display:inline-block;
    padding:20px 25px;
    color:#FFF;
    font-weight:400;
    font-size: 20px;
    line-height:1;
    text-decoration:none;
    border:none;
    text-transform:normal;	
}
.button-primary:hover,
.button-primary:active,
.button-primary:focus,
.button-secondary:hover,
.button-secondary:active,
.button-secondary:focus,
.button-thirdary:hover,
.button-thirdary:active,
.button-thirdary:focus{
    color:#FFF;
    text-decoration:none;
}
.button-primary{
    background-color:#000;
}
.button-primary:hover,
.button-primary:active,
.button-primary:focus{
    background-color:#333;
}
.button-secondary{
    background-color:#333;
}
.button-secondary:hover,
.button-secondary:active,
.button-secondary:focus{
    background-color:#666;
}
.button-thirdary{
    background-color:#666;
}
.button-thirdary:hover,
.button-thirdary:active,
.button-thirdary:focus{
    background-color:#999;
}
/** Pagination**/
.pagination{
	width:100%;
	text-align:center;
}
.pagination > li{
	float:none;
	display:inline-block;
}
.pagination > li:first-child > a, .pagination > li:first-child > span {
    border-radius:0;
}
.pagination > li a{
    margin-right:10px;
    color:#333;
}
.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-radius:0;
    margin-right:0px;
}
.pagination > li > a, .pagination > li > span{
	background-color:#CCC;
    border-color:#CCC;
    color:#000;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus,
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus{
    background-color:#999;
    border-color:#999;
    color:#FFF;
}
.pagination > li > a.next,
.pagination > li > a.prev{
	position:relative;
	text-indent:-9999em;
	width:33px;
}
.pagination > li > a:after{
	position:absolute;
	margin-top:-19px;
	text-indent:0;
	font-size:12px;
	font-family : FontAwesome;
	display:block;
	color:#FFF;
}
.pagination > li > a.next:after{
	content : "\f054";
}
.pagination > li > a.prev:after{
	content : "\f053";
}
/** Affichage d'élement en liste*/
/*** Global ***/
.list-1-item-by-row,
.list-2-items-by-row,
.list-3-items-by-row,
.list-4-items-by-row{
	margin:0; padding:0;
    list-style-type: none;	
}
.list-1-item-by-row:before,
.list-1-item-by-row:after,
.list-2-items-by-row:before,
.list-2-items-by-row:after,
.list-3-items-by-row:before,
.list-3-items-by-row:after,
.list-4-items-by-row:before,
.list-4-items-by-row:after{
  display: table;
  content: " ";
}
.list-1-item-by-row:after,
.list-2-items-by-row:after,
.list-3-items-by-row:after,
.list-4-items-by-row:after{
  clear: both;
}
.list-1-items-by-row > li,
.list-2-items-by-row > li,
.list-3-items-by-row > li,
.list-4-items-by-row > li{
	margin:0; padding:0;
	float:left;
}
/*** 1 élément par ligne ***/
.list-1-items-by-row > li{
    width:100%;
    float:none;  
}	
/*** 2 éléments par ligne ***/
.list-2-items-by-row > li{
    width:50%;    
}
.list-2-items-by-row > li:nth-child(2n+1){
	clear:left;
}	
/*** 3 éléments par ligne ***/
.list-3-items-by-row > li{
    width:33.333333%;
}
.list-3-items-by-row > li:nth-child(3n+1){
    clear:left;
}
/*** 4 éléments par ligne ***/
.list-4-items-by-row > li{
    width:25%;
}
.list-4-items-by-row > li:nth-child(4n+1){
    clear:left;
}
/** Affichage en colonnes */
.half-columns,
.third-columns,
.quarter-columns{
	width:100%;
 	*zoom: 1;
}
.half-columns:before,
.half-columns:after,
.third-columns:before,
.third-columns:after,
.three-third-columns:before,
.three-third-columns:after,
.quarter-columns:before,
.quarter-columns:after {
  display: table;
  line-height: 0;
  content: "";
}
.half-columns:after,
.third-columns:after,
.three-third-columns:after,
.quarter-columns:after{
  clear: both;
}
.half-column,
.third-column,
.third-column-double,
.quarter-column,
.third-quarter-column{
	float:left; 
}
.half-column{
    width:50%;    
}
.half-column:nth-child(2n-1){
   padding-right:15px; 
}
.half-column:nth-child(2n){
   padding-left:15px; 
}
.half-column:nth-child(2n+1){
   clear:both; 
}
.third-column{
	width:32%;
	margin-right:1.3333333%;
}
.third-column-double{
	width:65%;
	margin-right:1.6666666%;
}
.quarter-column{
	width:24%;
	margin-right:1%;
}
.third-quarter-column{
	width:74%;
	margin-right:1%;
}
.half-columns div:nth-child(2n),
.third-columns div:nth-child(2n),
.three-third-columns div:nth-child(3n),
.quarter-columns div:nth-child(4n){
	margin-right:0;
}	
/** Classes */
.weight-light{
	font-weight:300;	
}
.weight-normal{
	font-weight:400;	
}
.weight-semi-bold{
	font-weight:600;	
}
.weight-bold{
	font-weight:700;	
}
.weight-extra-bold{
	font-weight:800;	
} 
/** 
 * Responsivité des vidéos 
 * @see http://demosthenes.info/blog/649/Responsive-Design-Create-Fluid-YouTube-and-Vimeo-Content
 */
object, embed, video, iframe {
	max-width:100%;
}
.video-container{ 
	position: relative; 
	padding-bottom: 56.25%; 
	padding-top: 30px; 
	height: 0; 
	overflow: hidden; 
}
.video-container iframe{ 
	position: absolute; 
	top: 0; left: 0; 
	width: 100%; height: 100%; 
}
/** 
 * Responsivité des svg
 * @see http://demosthenes.info/blog/744/Make-SVG-Responsive
 **/
.svg-container-relative{
	display: inline-block;
	position: relative;
	width: 100%;
	vertical-align: middle; 
	overflow: hidden; 
}
.svg-container-absolute{
	display: inline-block;
	position: relative;
	width: 100%;
	vertical-align: middle; 
	overflow: hidden; 
}