@charset "UTF-8";

/* CSS Document */
@import url(http://fonts.googleapis.com/css?family=Playfair+Display);
@import url(http://fonts.googleapis.com/css?family=Playfair+Display:400italic&subset=latin,latin-ext);
@import url(http://fonts.googleapis.com/css?family=Fjalla+One);
@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,100&subset=latin,latin-ext);

/* balises */

body {
	font-family: 'Roboto', sans-serif;
	font-weight:normal;
	font-size:0.95em;
	margin:0;
	background-color:rgb(235, 240, 236);
	
}
a img { border:0;
		display:run-in; }


.moringa a:link, a:visited{
	text-decoration:none; 
	color:rgb(0,0,0);
}

nav ul {
	padding-left:0;
    margin-left:0px;
	width: 100%;
	margin-top:15px;
} 
ul.keywords{
		margin:-12px 0 1px 0;
}
nav.one ul{
        margin:0 0 -4px 0;
}
 
nav ul.one li {
    display : inline-block;
	list-style : none;
	width: 10.8%;
	margin-right:4px;
	padding-left:-2px;
} 
nav a:hover,
nav a:focus {
	outline: none;
}

nav ul.one li a{
	font-family: 'Fjalla One', sans-serif;
	font-size:0.86em;
	color: rgb(255,255,255);
	text-decoration: none;
	text-transform: uppercase;
	display: inline-block;
	width: 10.8%;
	height: 24px;
	margin-top:-1px;
}



nav ul.one li:nth-child(1){
	background-color:rgb(0,148,164);
	margin-left:4px;
}
nav ul.one li:nth-child(2){
	background-color:rgb(163,99,100);
}
nav ul.one li:nth-child(3){
	background-color:rgb(96,201,119);
}
nav ul.one li:nth-child(4){
	background-color:rgb(0,130,174);
}
nav ul.one li:nth-child(5){
	background-color:rgb(160,129,101);
}
nav ul.one li:nth-child(6){
	background-color:rgb(11,178,150);
}
nav ul.one li:nth-child(7){
	background-color:rgb(135,123,133);
}
nav ul.one li:nth-child(8){
	background-color:rgb(68,197,193);
}
nav ul.one li a:hover{
	color: rgb(0,0,0);
}
nav ul.one li:hover{
	color: rgb(0,0,0);
	background-color: rgb(255,255,255);
	background-image: url(../img/fond-hover.png);
	background-repeat: repeat-x;

}


nav ul li {
    display : inline;
	list-style : none;
	margin-left:0;
} 

header {
	background-color: rgb(255,255,255);
	width: 100%;
	min-height: 93px;
}
h4 {
	width:96%;
	margin-left:1em;
	font-weight:normal;
	background-color:#d4d5d7;
    color:rgb(30,30,30);
    height:15px;
    border-radius: 12px; 
    padding:0 5px ;
    font-size:0.75em;
    white-space: nowrap;
}
section {
	padding-top:5px;
    background-color:rgb(235, 240, 236);	
	width:1300px;
	margin-top:120px;
	margin-left:-120px;
	min-height:800px;
	z-index:10;
	
}
article {
	
	width:900px;
	margin-left:120px;
}

article h3 {
	font-weight:normal;
	font-family: 'Roboto', sans-serif;
	font-weight:100;
	font-size:1.03em;
	padding-left: 165px;
	padding-top:0.8em;
	line-height:0.2em;
}
h3.premier {
	font-weight:400;
	line-height:40px;
	margin-top:-10px;
	margin-bottom:-30px;
	margin-left:-165px;
	 }
	
article h2 {
	font-family: 'Fjalla One', sans-serif;
	font-size:1.4em;
	font-weight:normal;
}

article ul .welcome li {
	list-style-image: url(../img/list-article.png);
	
}

/* ID */
#bandeau
       {
	   min-height:219px;
	   background-color:rgb(255,255,255)
	 
	   }
#port {
	width: 100%;
	height: 300px;
	margin-top:159px;	
	}

#nav{
	position: absolute;
	z-index: 20;
	width: 1000px;
	top: 92px;
	background-color: rgb(255,255,255);	
}

#nav.floatable {
			position: fixed;
			background-color: rgb(255,255,255);
			background-image: url(../img/bord-bleu-T.png);
	        background-repeat: repeat-x;
	        background-position: bottom;
			top: 0;
			left:0;
			padding-bottom:10px;
			-webkit-transition: width 1s ease-in-out;
            -moz-transition: width 1s ease-in-out;
            -o-transition: width 1s ease-in-out;
             transition: width 1s ease-in-out;
             width:100%;
			 -webkit-transition: padding-left 0.01s ease-in-out;
            -moz-transition: padding-left 0.01s ease-in-out;
            -o-transition: padding-left 0.01s ease-in-out;
             transition: padding-left 0.01s ease-in-out;
             padding-left:10%;
		}
#nav.floatable ul{
	width : 1000px;
}
/* classes */

.gris      {
	   background-color:rgb(235, 240, 236);
	   padding-left:7%;
	   }

.robo{
	font-family: 'Roboto', sans-serif;
}

.fondsecondg {
	background-color: rgb(255,255,255);
	background-image: url(../img/fondsecondg.png);
	background-repeat: repeat-x;
	background-position: top;	
	
}
.fondsecondp {
	background-color: rgb(255,255,255);
	background-image: url(../img/fondsecondp.png);
	background-repeat: repeat-x;
	background-position: top;	
}
.keywords a{
 	 background-color:#d4d5d7;
 	 color:rgb(0,0,0);
 	 height:15px;
	 border-radius: 12px; 
	 padding:0 10px ;
  	 text-decoration:none;
 	 font-size:0.75em;
 	 white-space: nowrap;
} 
.container {
	width : 1000px;
	margin-right:auto;
	margin-left:auto;
	padding-bottom:0.3em;
}
.containergris {
	width : 1600px;
	margin-right:auto;
	margin-left:auto;
	background-color:#f0f2f3;
	margin-top:300px;
}
.connexion {
	width : 810px;
	text-align:right;
	margin-top:3px;
	margin-left:auto;
	margin-right:auto;
	font-size:0.75em;
}
.connexion a {
	text-decoration: none;
	color:rgb(0,0,0);
}
.selectionne
{
	color: rgb(0,0,0);
	background-color: rgb(255,255,255);
	background-image: url(../img/fond-hover.png);
	background-repeat: repeat-x;
}
.selectionne a:link
{
	color: rgb(0,0,0);

}
.selectionne a:visited
{
	color: rgb(0,0,0);

}
ul.keywords li a:hover, ul.keywords li a.selected{
	color: black;
	text-decoration:underline;
	background-color:#fff;
}
.navmobile {
	width: 104%;
	height: 102%;
	position:relative;
}

.moringa {
    font-family: 'Playfair Display', serif;
	width : 1000px;
	color:rgb(0,0,0)
}
.moringa a:link {text-decoration:none;}
.moringa a:visited {text-decoration:none;}
.moringa h1{
    display:inline;
	font-size:3.4em;
	font-weight:normal;
}
.fondpara{
	background-image: url(../img/navfond.jpg), url(../img/navfond2.png);
	background-position: top center, 400px center;
	background-repeat: no-repeat, repeat-y;
	background-color:#fff;	
}
.para {
	position: relative;
	height: 300px;
	float: left;
	width: 100%;
	font-family: 'Fjalla One', sans-serif;
	overflow: hidden;	
}
.para ul {
	margin-left:-155px;
	margin-top:120px;
}
.para li {
	display:inline;
	padding-left:15%;
}
.para a{
	font-family: 'Roboto', sans-serif;
	padding:5px 15px;
	padding: 6px;
	height: 34px;
	width: 195px;
	color: #fff;
	background-color: #003d50;
	text-decoration: none;
	font-size: 1.3em;
	text-transform: uppercase;	
	z-index:5;
    position: relative;     /* relative, absolute, fixed */
    overflow: hidden;
}	
.key a{
	font-family: 'Fjalla One', sans-serif;
	position: absolute;
	width: 68px;
	height: 55px;
	background: #fff;
	border-radius: 50%;
	color: #003d50;
	font-size: 0.95em;
	text-align: center;
	padding-top: 22px;
	top: -39px;
	left: 16px;
}
.key11 {
	position:absolute;
    left: 40px;
	top: -80px;
	z-index:1;
	
}
.key12 {
	position:absolute;
    left: 160px;
	top: -37px;
    line-height:2.9em;
	z-index:0;
}
.key13 {
	position:absolute;
    left: 110px;
	top: 63px;
	z-index:6;

}
.key21 {
	position:absolute;
    left: 380px;
	top: -78px;
	z-index:1;
	line-height:2.9em;
}
.key22 {
	position:absolute;
    left: 355px;
	top: 55px;
	padding-top:13px;
	line-height:2.9em;
	z-index:0;
}
.key23 {
	position:absolute;
    left: 515px;
	top: -30px;
	z-index:6;
}
.key31 {
	position:absolute;
    left: 860px;
	top: 65px;
	z-index:6;
	line-height:2.9em;
}
.key32 {
	position:absolute;
    left: 770px;
	top: -70px;
	line-height:2.9em;
	z-index:6;

}
.key33 {
	position:absolute;
    left: 740px;
	top: 85px;
	line-height:2.9em;
	
}
.illust {
	float: left;
	width: 165px;
	height: 115px;
	overflow: hidden;
	margin-top: 1px;
	font-family: 'Fjalla One', sans-serif;
	font-size:13px;
	word-wrap: break-word;
	line-height:11px;
}
.logo {
	position:absolute;
	background-color:rgb(255,255,255);
	z-index:54;
	float: left;
	width: 95px;
	height: 177px;
	overflow: hidden;
	margin-left: -65px;
	margin-top: -59px;
	}
.playita {
	font-family: 'Playfair Display', serif;
	font-style: italic;
	}

ul.welcome{
	padding: 10px 0;
	font-size: 1.4em;
	font-style: italic; 	
	
}
ul.welcome li{
	font-family: 'Playfair Display',serif;
	display: block;
	float: left;
	width: 35%;
	padding-left: 15px;
	background-repeat: no-repeat;
	background-position: left;	
}
ul.welcome li a{
	text-decoration:none;
	color:rgb(0,0,0);
}

ul.welcome li:nth-child(1){
	background-image: url(../img/list-article1.png);
}
ul.welcome li:nth-child(2){
	background-image: url(../img/list-article3.png);
}
ul.welcome li:nth-child(3){
	background-image: url(../img/list-article2.png);
}
ul.welcome li:nth-child(4){
	background-image: url(../img/list-article4.png);
}

.actu {
padding-left:19%;
font-size:0.9em;
	
}
.textemarge {
	display:block;
	width:80%;
	margin-left:17%;
}
.deuxcoll {
	width:45%;
	margin-left:2%;
	float:left;
	text-align:left;
	font-family: 'Roboto', sans-serif;
	font-weight:normal;
	font-size:0.8em;
}
.deuxcoll h3{
	font-family: 'Fjalla One', sans-serif;
	padding-left:1px;
	font-size:1.4em;
	
}
h3.titrepage {
	font-family: 'Fjalla One', sans-serif;
	padding-left:1px;
	font-size:1.03em;
	padding-left: 1px;
	padding-top:0.8em;
	line-height:0.2em;
	
}
.masque {
	display:none;
}
.areseau {
	height:30px;
	background-color:rgba(209,211,212,0.7);
	padding:5px 10px;
	color:rgb(0,0,0);
	text-decoration:none;
	-webkit-border-radius: 15px 20px;
    border-radius: 15px; 
}

.areseau:hover {
	text-decoration:underline ;
	background-color:rgba(255,255,255,0.1);
}
.ancre{
	display:block;
	position:relative;
	top:-210px;
}

.ancredoc{
	position:relative;
	top:-320px;
	display:block;
}

.ancredocid{
	position:relative;
	top:-130px;
	display:block;
}

	/*formulaire */
	#monForm p
{
	margin: 2px 0;
}

/* fieldset , legend */
#monForm fieldset
{
	margin-bottom: 10px;
	border: #CCC 1px solid;
}

#monForm fieldset:hover
{
	background-color: #FFF;
}

#monForm fieldset legend
{
	padding: 0 10px;
	border-left: #CCC 1px solid;
	border-right: #CCC 1px solid;
	font-size: 1.2em;
	color: #999;
}

/* Label */
#Form label
{
	
	color:rgb(0,0,0);
	display: block;
	width: 29%;
	float: left;
	padding-right: 1%;
	text-align: right;
	letter-spacing: 1px;
}

#Form label:hover
{
	font-weight: bold;
}

#Form .form_label_nostyle
{
	background: none;
}

/* Input */
#Form input, #monForm textarea
{
	margin-left: 1%;
	width: 58%;
	border: #CCC 1px solid;
}


#Form input:hover, #Form select:hover, #Form input:focus, #Form texterea:focus
{
	border: #999 1px solid;
	background-color: #DDEEFF;
}



/* button submit */
#Form input[type="submit"]
{
	border: #DDEEFF 1px solid;
	width: 27%;
}

#Form input[type="submit"]:hover
{
	background-color:rgba(102,204,0,0.5) ;
	cursor: pointer;
}
input[required] {
  border-right: 8px solid #508058;		
}
/* page liens */

*:after,
*::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
nav a {

}
.cl-effect-9 a {
	margin: 0 20px;
	padding: 18px 20px;
	position: relative;
	display: inline-block;
	margin: 15px 25px;
	outline: none;
	color: #666;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 400;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	font-size: 1.15em;
}

.cl-effect-9 a::before,
.cl-effect-9 a::after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: #fff;
	content: '';
	opacity: 0.2;
	-webkit-transition: opacity 0.3s, height 0.3s;
	-moz-transition: opacity 0.3s, height 0.3s;
	transition: opacity 0.3s, height 0.3s;
}

.cl-effect-9 a::after {
	top: 100%;
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}

.cl-effect-9 a span:first-child {
	z-index: 2;
	display: block;
	font-weight: 300;
}

.cl-effect-9 a span:last-child {
	z-index: 1;
	display: block;
	width:88%;
	padding: 8px 0 0 0;
	color: rgba(0,0,0,0.4);
	text-shadow: none;
	text-transform: none;
	font-style: italic;
	font-size: 0.75em;
	font-family: Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	transform: translateY(-100%);
}

.cl-effect-9 a:hover::before,
.cl-effect-9 a:focus::before {
	height: 6px;
}

.cl-effect-9 a:hover::before,
.cl-effect-9 a:hover::after,
.cl-effect-9 a:focus::before,
.cl-effect-9 a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

.cl-effect-9 a:hover span:last-child,
.cl-effect-9 a:focus span:last-child {
	opacity: 1;
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	transform: translateY(0%);
}
.mixte{
	font-family: 'Fjalla One', sans-serif;
	display:inline-block;
	font-size:0.9em;
	width:30px;
	height:20px;
	padding:13px 5px;
	border-radius:50%;
	margin-left:-40px;
	text-align:center;
	
}
.mixactu{
	background-color:rgb(96,201,119);
	color:rgb(255,255,255);
	text-transform:capitalize;
}
.mixdoc{
	background-color: rgb(0,130,174);
	color: rgb(255,255,255);
	text-transform: capitalize;
}
.mixlien{
	background-color: rgb(135,123,133);
	color: rgb(255,255,255);
	text-transform: capitalize;
}
.mixbiblio{
	background-color: rgb(153,102,51);
	color: rgb(255,255,255);
	text-transform: capitalize;
}
.amixte{
    text-decoration : none;
	color:rgb(0,0,0);
	
}