

/* ==========================================================================
/* =======--  A F P E N  --======================================================
   ========================================================================== */

@font-face {
	font-family: 'Aller';
	font-style: normal;
	font-weight: normal;
	src: local('Aller'), url('../fonts/Aller_Rg.woff') format('woff');
}
@font-face {
	font-family: 'Aller Bold';
	font-style: normal;
	font-weight: normal;
	src: local('Aller Bold'), url('../fonts/Aller_Bd.woff') format('woff');
}
@font-face {
	font-family: 'Aller Display';
	font-style: normal;
	font-weight: normal;
	src: local('Aller Display'), url('../fonts/AllerDisplay.woff') format('woff');
}

@font-face {
	font-family: 'Aller Light';
	font-style: normal;
	font-weight: normal;
	src: local('Aller Light'), url('../fonts/Aller_Lt.woff') format('woff');
}



/* =======-- Général --================================================================================*/

h2.statut a, h2.statut a:visited {
	color: white !important;
}
h2.statut a:hover {
	color: #333 !important;
}
					
*,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

a img, img { border: none;}

strong { font-weight: bold; }
em { font-style: italic; }
abbr, acronym { border-bottom: 1px dotted; cursor: help; }
small { font-size: 0.90em; color: inherit; }
dfn { font-weight: bold; color: #666; }
del { text-decoration: line-through; }
ins { color: red !important; text-decoration: none; }
sup, sub { font-size: .8em; font-variant: normal; }

ul { list-style: inside none outside; }
ul li{ color: white; }

::selection, ::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

.none {
	display: none;
}
.opacity {
	opacity: 1;
}	
.opacityMoy {
	opacity: 0.5;
}	
.opacityNone {
	opacity: 0;
}	

.clear {
	clear: both !important;
}
.sc, sc {
	font-variant: small-caps;
}
.maj {
	text-transform: uppercase;
}
.min {
	text-transform: capitalize !important;
}
.cap {
	text-transform: lowercase;
}
.cap:first-letter {
	text-transform: uppercase !important;
}
.light {
	font-weight: lighter;
}
.normal {
	font-weight: normal !important;
	font-style: normal !important;
	font-variant: normal !important;
	font-size: inherit !important;
	text-transform: none !important;
	font-family: 'Open Sans',Helvetica,arial,"sans sérif" !important;
}
.pasderetrait {
	margin: 0 !important;
	padding: 0 !important;
}
.justify {
	text-align: justify;
}
.italique {
	font-style: italic;
}
.moitie {
	width: 43%;
}
.blanc { color: white; }
.gris { color: #7F7F7F !important; }
.noir { color: #333; }
.beige { color: #AAA998; }
.orange { color: #F29022; }
.bleu { color: #A0D9FF; }
.bleu2 { color: #45629B; }
.texte { color: #575756; }

.bgblanc {background-color : white;}
.bggris {background-color : #DDDDDD;}
.bgnoir { background: #333; color: #EEE; }
.bgbeige { background: #f1eee2; }


.border {
	border-bottom: 2px solid #CCC;
}
.souligne {
	text-decoration: underline;
}

p {
	margin: 10px 0 15px 0;
}
.off { line-height: 16px; }

hr {
  height: 15px; border: none; clear: both;
  border-top: 1px dashed #DDD; margin:40px auto; 
}

.block { display: block; }
.bgnone { background: none !important; }
.absolute { position: absolute }
.relative { position: relative; }

.none { display: none;}
.nettoyeur { clear: both; height: 0; margin: 0; padding: 0; border: 0; line-height: 1px; font-size: 1px; }
.invisible { position: absolute; top: -3000em; height: 1%; display: none; }

ul { margin-left: 0px;}
ul ul { margin-left: 20px;}

.deux_colonnes {
  padding: 1em;
  -moz-column-count: 2;
  -moz-column-gap: 1em;
  -webkit-column-count: 2;
  -webkit-column-gap: 1em;
  column-count: 2;
  column-gap: 1em;
}
.trois_colonnes {
  padding: 1em;
  -moz-column-count: 3;
  -moz-column-gap: 1em;
  -webkit-column-count: 3;
  -webkit-column-gap: 1em;
  column-count: 3;
  column-gap: 1em;
}

.rad3 { border-radius: 3px; }
.rad10 { border-radius: 10px; }
.rond { border-radius: 50%; }

.overvisible {
	overflow: visible;
}


.droite {
	text-align: right;
}
.gauche {
	text-align: gauche;
}
.right {
	float: right;
}
.left {
	float: left;
}
.ecartDate, .date {
	text-transform: capitalize;
}

.clear {
	clear: both;	
}

.cartouche {
	margin-top: 20px;
}

a:hover {
	text-decoration: none;
}


.gras {
	font-family: 'Aller Bold';
}

.noir {
	color: black;
}

.light {
	font-weight: lighter;
	font-family: 'Aller Light';

}

.justify {
	text-align: justify;
}


.Tout_petit_texte {
	font-size: 11px;
}
.Petit_texte {
	font-size: 13px;
}
.Gros_texte {
	font-size: 18px;
}

.mt10 {
	margin-top: 10px;
}

.center {
	text-align: center;
}






/* =======-- AFPEN --================================================================================*/
a, a:visited, :focus {
    transition: all 0.35s;
    -moz-transition: all 0.35s;
    -webkit-transition: all 0.35s;
    -o-transition: all 0.35s;
}

a, a.spip_out, a.spip_in { 
	text-decoration: none; 
	color: #3F4E5E;
}
a:hover { 
	text-decoration: none;
}

/* Titraille / Intertitres */
h1,h2,h3,h4,h5,h6 { 
	font-weight: normal; 
	text-align: left;
	color: #3F4E5E;
	font-family:'Aller' !important;
}

html body div.navbar {
	background-image: linear-gradient(to bottom, #FFF 0px, #FFF 100%);
    background-repeat: repeat-x;
    height: 70px;
    margin: 0;
    padding: 0;
}


html body {
	font-family:'Aller';
	font-weight:normal;
}

/* carroussel */
html body div.caroussel {
	margin-top: 70px;
}
html body div.caroussel a {
	color: #D6EEF8
}


h2 {
    margin: 0;     
    color: #666;
    font-size:26px;      
}

/* Menu secondaire */
.menu_second {
	border-bottom: 1px dotted #CCC;
	margin-bottom: 10px;
}
.menu_second a:before {
	font-family: FontAwesome;
	content: "";
	margin-right: 5px;
}
.menu_second a {
	margin: 0 10px;
}
.menu_second a:hover {
	color: #222 !important;
}


div.nouveaux {
	height: 235px;
}
div.nouveaux div#myCarouselNew {
	height: 200px;
}
div.nouveaux div#myCarouselNew .item{
    height: 200px !important;
}
.myCarousel_fond {
	background: #DDD url('../img/fond_afpen.jpg') no-repeat;
}
div.nouveaux div#myCarouselNew div.carousel-inner {
    height: 200px !important;
}

.item{
    background-color: #333;    
    text-align: center;
    height: 280px !important;
}
.carousel{
    /*margin-top: 20px;*/
}
.bs-example{
	/*margin: 0 20px 20px 20px;*/
}


div.central h1 {
	text-transform: uppercase;
	color: #F18643;
	border-bottom: 2px solid black;
	font-size: 26px;
	
}
div.central h2 {
	color: #5889C7;
	font-size: 17px;	
	margin-bottom: 10px;
}


div.central .nouveau {
	text-transform: uppercase;
	margin-bottom: 30px;

}
div.central .nouveau span {
	color: white;
	background-color: #F18643;
	padding: 5px;
}
div.nouveaux h2 {
	text-align : center;
	margin-bottom: 30px;
}

.orange {
	color: #F18643 !important;	
}

.bleue {
	color: #5889C7 !important;	
}

.forange {
	background-color: #F18643 !important;	
}

.fbleue {
	background-color: #5889C7 !important;	
}


div.navbar-header {
	min-width: 100%;
	min-height: 70px;
}


ul#menuhaut {
	list-style-type : none; 
}
div.menu-header .col-md-10 {  /* liste Menu */
	margin-top: 15px;
}
ul#menuhaut li { 
	display : inline;
	padding : 0 0.5em; /* Pour espacer les boutons entre eux */
	line-height: 25px;
}
ul#menuhaut li a { 
	padding : 5px; /* Pour espacer les boutons entre eux */
	margin: 0 5px;
	text-transform: uppercase;
	font-family:'Aller';
	color: #EEE !important;
	background: #6E89A6;
	border-radius: 3px;
}
ul#menuhaut li a:hover { 
	color: white !important;
	background: #3F4E5E;
}

body.article div.central,
body.rubrique div.central {
	  margin-top: 30px;
}
div.central hr {
	margin-bottom: 0px;
}


/*
* Colonne
*/
div.colonne {
	border-left: 1px solid lightgrey;
	padding: 20px 5px 10px 5px;
	background-color: #5B8FCD;
	margin-top: 25px;
}
div.colonne h2 {
	font-family:'Aller' !important;
	font-size: 16px;
	color: white;
	text-transform: uppercase;
	border-bottom: 1px dotted lightgrey;
}
h2 .fa-arrow-circle-down {
	color: #273756;
	font-size: 150%;
}
div.colonne h2 .fa-fw {
	width: auto;
	text-align: left;
	margin-right: 10px;
}
.fa:before {
}

/* Recherche */
.input-group-addon .fa:before { 
	position: inherit;
	left: inherit;
}
input#recherche {
	height: 29px;
	background: #EEEEEE;
	border: none;
	margin-left: 1px;
	padding-left: 10px;
}
div.colonne h2:hover {
	color: #273756;
	cursor: pointer;
}
.ssmenu_colonne {
	padding-left: 10px;
	margin-bottom: 20px;
}
.ssmenu_colonne a {
	color: #EEE !important;
}
.ssmenu_colonne a:hover {
	color: #273756 !important;
}

div.colonne div.LeChiffre {
	color: #F18643;
	font-size: 40px;
	font-weight: bold;
	font-family: 'Aller Bold';
	margin: 0;
	padding: 0;
}
div.colonne .texte {
	margin: 0;
	padding: 0;
}

div.colonne a {
	color: #AAA;
}

div.colonne a:hover {
	color: #5889C7;
}

div.pub ul {
	list-style-type: none;
	text-align: center;
}


  
    
.colonne {
	display: none;
	border-right: 1px solid lightgrey;
}

div.colonne-header {
	display: block !important;
	height: 20px;
    padding: 8px 15px;
    width: 65px;
}

div.colonne-header button.colonne-toggle {
	border: 1px solid lightgrey;
	border-radius: 4px;
	padding: 8px 10px;
	color: black;
	background: #6E89A6;
	float: left;
}

div.colonne-header button.colonne-toggle span.icon-bar {
  display: block !important;
  width: 22px;
  height: 2px;
  border-radius: 1px;
  background-color: white;
}


div.colonne-header:hover  button.colonne-toggle {
	background-color: black;
}

div.colonne-header button.colonne-toggle:hover span.icon-bar {
  display: block !important;
  width: 22px;
  height: 2px;
  border-radius: 1px;
  background-color: white;
}
div.colonne-header button.colonne-toggle:hover .icon-bar + .icon-bar {
  margin: 4px 0 0 0;
  padding: 0;
}

div.navbar-collapse {
	background-color: white;
	margin-top: -50px;
	border-top: 0;
	border-bottom: 1px solid lightgrey;
}
div.navbar {
	border-bottom: 1px solid lightgrey;
}




div.navbar-fixed-top {
	background: white;
	border-bottom: 1px dotted #BBB;
}
div.navbar-fixed-top button.menu-toggle {
	border: 1px solid lightgrey;
	border-radius: 4px;
	padding: 8px 10px;
	color: black;
	background: #6E89A6;
}

div.navbar-fixed-top button.menu-toggle span.icon-bar {
  display: block !important;
  width: 22px;
  height: 2px;
  border-radius: 1px;
  background-color: #ccc;
}


div.navbar-fixed-top:hover  button.menu-toggle {
	background-color: #555;
}

div.navbar-fixed-top button.menu-toggle:hover span.icon-bar {
  display: block !important;
  width: 22px;
  height: 2px;
  border-radius: 1px;
  background-color: white;
}
div.navbar-fixed-top button.menu-toggle:hover .icon-bar + .icon-bar {
  margin: 4px 0 0 0;
  padding: 0;
}



div.carousel-inner {
    height: 200px;
}

div.carousel-caption {
	padding-bottom: 90px;
	z-index: 100;
	text-shadow: none;;
}
div.carousel-caption h3 {
	padding: 3px;
	color: white;
	text-align: center;
}
#myCarouselNew div.carousel-caption h3 {
	color: #333;
}

ol.carousel-indicators {
    bottom: -10px;
    z-index: 100;
}


#myCarouselNew .carousel-caption {
	bottom: -70px;
}




/* ====== Sommaire ===================================*/
.suite {
	letter-spacing: 1px;
	font-size: 12px;
	padding: 2px 10px;
	font-style: italic;
	background: #EEE;
	color: #777777;
	display: inline-block;
	margin-bottom: 5px;
}
:hover.suite {
	background: #777777;
	color: #EEE;
}
.logo_art img {
	width: 100%;
}



/* ====== Rubrique ===================================*/
ul.liste_rub {
	margin-left: 20px;
}
ul.liste_rub li a {
	display: inline-block;
	text-transform: uppercase;
	padding-right: 15px;
	line-height: 20px;
	margin-bottom: 10px;
}
ul.liste_rub li a img {
	margin-right: 10px;
}
ul.liste_rub li a:hover {
	background: #EEE;
	color: #333;
}
ul.liste_rub li a:hover img {
	margin-right: 15px;
}








@media only screen and (min-width:1000px) { 

	  button.menu-toggle {
		  display: none !important;
	  }
	  .colonne {
	    display: block !important;
	    border-right: 0 !important;
	  }
	  div.colonne-header, div.colonne-header button {
	  	  display: none;
	  }
	  div.navbar-collapse {
	  	margin-top: 0px !important;
	  	border: 0 !important;
	  }
	  
	  ul#menuhaut {
		  display: inline !important;
	  }
	  
	  div.navbar-fixed-top {
		z-index: 1000;
		background-color: white;
		height: 110px;
		margin-bottom: 10px;
	  }
	
	  div.navbar-fixed-top div.menu-header {
		  display: inline !important;
	  }
	  
	  div.navbar-fixed-top div.container {
	  }
	  
	  
	  
	  div.menu-header {
		background-color: white; 
		margin-top: 0px !important; 
		position: relative !important; 
		z-index:10;
		width: 100%;
	}

	button.menu-toggle {
		 float: right;
	  }


  
  }
  
  
  
  
  
  
  
/* =======-- MOBILEs --================================================================================*/
  
  
  
@media only screen and (max-width:1000px) { 


	  button.menu-toggle {
		  display: none !important;
	  }

	div.menu-header .col-md-2 {
		float: left; 
		width: 16.6667%;
	}
	div.menu-header .col-md-10 {
		float: left; 
		width: 83.3333%;
	}
	div.colonne-header {
		height: 50px;
	}

	.logo_art img {
		width: 230px;
		margin: 0 0 10px 20px;
		float: right;
	}
	body.article .logo_art img {
		margin: 70px 0 10px 20px;
	}



}


@media only screen and (max-width:400px) { 
 	
 	body {
	 	padding-top: 0;
 	}
 	.menu_second {
	 	display: none
 	}
	  button.menu-toggle {
		  display: block !important;
	  }
	  div.navbar-fixed-top {
		position: relative;
		height: 80px;
	  }
	  .menu-header br.clear {
		  display: none;
	  }
	  .menu-header .Tout_petit_texte {
		  font-size: 10px;
	  }

	.navbar-fixed-top div.sousmenu {
		display: none !important;
		left: 0;
		width: 100%;
	}
	
	a.logo {
		padding-top: 15px !important;
	}
	.menu-toggle {
		z-index: 10;
		position: fixed;
		right: 10px;
		top: 10px;
	}
	div.menu-header div {
		float: none !important;
		width: 100% !important;
		padding: 0;
	}
	div.menu-header .col-md-10 {  /* liste Menu */
		margin-top: 10px;
		background: #6E89A6;
	}
	div.menu-header .droite {
		text-align: left;
	}
	ul#menuhaut li { 
		display : inherit;
		padding : 0 0.5em; /* Pour espacer les boutons entre eux */
		line-height: 25px;
	}
	ul#menuhaut li a { 
		display: block;
		margin: 0;
		text-transform: uppercase;
		color: #FFF !important;
		border-radius: 0;
		background: none;
	}

	html body div.caroussel {
		margin-top: 20px;
	}
	html body div.caroussel h3 {
		font-size: 17px;
	}
	
	.logo_art img {
		float: none;
		margin-left: 0;
	}
	
	
}
 
 
 
 
 p img.puce {
 	margin-left: 20px;
 }
 
 
 div.cartouche {
 	background-color: #E5F0FC;
 }
 
 div.accueil_contenu div.even,  div.actus div.even {
 	background-color: #E5F0FC;
 	margin: 10px 0;
 	padding: 5px;
 }
 
 div.accueil_contenu div.odd, div.actus div.odd {
 	background-color: #EEEEEE;
 	margin: 10px 0;
	padding: 5px;

 }
 
div.full_article {
 	background-color: #E5F0FC;
 }
 
 
 div.spip-admin-float {
 	left:15%;
  	width:50% !important;
  	z-index: 1000;
 }
 
 
 
 
 
/************
* Forum
*/


li.forum {
	color: black;
	list-style-type: none;
}

li.forum div.forum-chapo {
	background: none repeat scroll 0 0 #E5F0FC;
    border-radius: 3px;
    color: #eee !important;
    font-family: "Aller";
    margin: 0 5px;
    padding: 2px;
}

li.forum a[title=Répondre] {
	background: none repeat scroll 0 0 #6e89a6;
    border-radius: 3px;
    color: #eee !important;
    font-family: "Aller";
    margin: 0 5px;
    padding: 5px;
    text-transform: uppercase;
}

a[title="Commenter cet article"] {
	background: none repeat scroll 0 0 #6e89a6;
    border-radius: 3px;
    color: #eee !important;
    font-family: "Aller";
    margin: 3px 5px;
    padding: 5px;
    text-transform: uppercase;
}


.formulaire_forum label, .formulaire_forum input, .formulaire_forum textarea {
	color: black !important;
}

fieldset ul li strong, fieldset ul li span, fieldset ul li div, fieldset ul li p {
	color: black !important;
}

span.erreur_message {
	color: red !important;
}


/************
* Statut
*/

div.statut {
	margin: 10px 0;
}
div.statut a {
	padding: 20px 5px;
	text-transform: uppercase;
	font-family: "Aller";
	color: #EEE !important;
	background: #6E89A6 none repeat scroll 0% 0%;
	border-radius: 3px;
	display: block;
	text-align: center;
	font-size: 20px;
	
}
div.statut a:hover {
   color: #FFF !important;
    background: #3F4E5E none repeat scroll 0% 0%;
}

