@CHARSET "ISO-8859-1";
/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
    padding: 0;
    margin: 0;
}
a{
	text-decoration:none;
}
table {
    border-spacing: 0;
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-weight: normal;
    font-style: normal;
}
strong{
	font-weight: bold;
}
ol,ul {
    list-style: none;
    margin:0;
    padding:0;
}
caption,th {
    text-align: left;

}
h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    font-size: 100%;
    margin:0;
    padding:0;
    color:#444;
}
q:before,q:after {
    content:'';
}
abbr,acronym { border: 0;
}


/* Custom CSS
 * --------------------------------------- */
body {
  color: #ffffff;
  margin: 0 auto;
  font: 1em/1.3em Montserrat, Helvetica, sans-serif;
  background-color: #dad7e0;
}

	/* Style for our header texts
	* --------------------------------------- */
	h1{
		font-size: 2.4em;
		font-family: Agency FB;
		color: #fff;
		padding:0px;

	  margin: 40px 0;
	  line-height: 40px;
	  text-shadow: 0px 1px 1px #888;
	}
	h2{
		font-family: Agency FB;
		font-size: 18px;
		line-height: 22px;
		color: #301B53;
		padding:0px;
		margin-left: 15px;
	  /*text-shadow: 0px 1px 1px #888;*/
	}
	a {
	  text-decoration: none;
	  color: #eee;  
	  margin: 0 0;
	}	
	
.intro{
}
	.intro p{
		color: #fff;
	}

	/* Centered texts in each section
	* --------------------------------------- */
	.section{
		text-align:center;
	}

	.TitrePage{
		width:100%;
		height: 50px;
		background:#301B53;
		background: #000000;
		text-align:left;
		margin-top:21px;
	}
	.TitrePage p{
		color: #301B53;
	}
	/* Fixed header and footer.
	* --------------------------------------- */
	#header, #footer{
		width: 100%;
		background: #9FDFEA;
		background: #000000;
		color: #ffffff;
		margin : 0 0 0 0;
	}

	#header{
		position: absolute;
		top:0px;
		left:0px;
		height: 145px;
		z-index:5;
		padding-top:0px;
	}
	#header img{
		position: absolute;
		top:0px;
		left:0px;
		height: 100%;
		width:100%;
		z-index:5;
		padding-top:0px;
	}
	#header p{
		position: absolute;
		top:0px;
		left:0px;
		z-index:7;
		padding-top:20px;
		font-size: 48px;
		font-family: Agency FB;
		color: #fff;
		text-shadow: 0px 1px 1px #888;
		text-align:center;
	}
	#footer{
		position:fixed;
		display:block;
		bottom:0px;
		left:0px;
		height:50px; 
		padding-top:20px;
		font-size: 1.8em;
		font-family: Agency FB;
		text-shadow: 0px 1px 1px #888;
		font-weight: bold;
		color: #f8f8f8;
		text-align:center;
		z-index:7;
	}

	/* Bottom menu
	* --------------------------------------- */
	#infoMenu {
		bottom: 80px;
	}
	#infoMenu li a {
		color: #fff;
		z-index: 999;
	}
	
	.divlibelle {
	margin-top:-7px;
	}
	
	.divicone {
	   float:left;
	}
	.divicone img{
	height:150%;
	padding-left:2px;
	}
	.divtxticn {
		
	}
	.divtxticn h1{
		font-family: Agency FB;
		color: #fff;
		padding:0px;

	  margin: 0 0;
	  font-size: 22px;
	  line-height: 100%;
	  text-shadow: 0px 0px 0px #888;
	}
	.divtxticn h2{
		font-family: Agency FB;
		color: #fff;
		padding:0px;

	  margin: 0 0;
	  font-size: 16px;
	  line-height: 100%;
	  text-shadow: 0px 0px 0px #888;
	}



/* Hover Transition */
.container {
  padding-top: 10px;
  /*height: 100%;*/
  width: 100%;
  text-align: center;
  background-color: #dad7e0;
}

.wrapper {
  overflow: hidden;
  display: inline-block;
  position: relative;
  height: 190px;
  margin: 10px 10px 10px 10px;
  /*float:left;*/
}
 
.wrapper:hover .overlay {
    top: 90px;
}
 
.wrapper .overlay {
    top: 140px;
    display: block;
    position: absolute;
    height: 200px; /* hauteur rectangle */
    width: 100%;
    /*right: -100%;*/

    transition: .4s ease-out;
    -webkit-transition: .4s ease-out;
}
.wrapper .overlay .rectangle {
    position: absolute;
    top: 0;
}

.wrapper .overlay .rectangle {
      display: block;
      margin-left: 0px;
      width: 100%;
      height: 100%;
}
/* pf */
  .wrapper .overlay .rectangle {
    text-align: center;
    position: absolute;
    padding: 10px 0px;
    color: #ffffff;
      background-color: rgba(255,255,255,.95);
	background-color: #301b53;
		background-color: #000000;

    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    /* IE 5.5-7 */
    filter: alpha(opacity=100);
    /* Netscape */
    -moz-opacity: 1;
    /* Safari 1.x */
    -khtml-opacity: 1;
    /* Modern browsers */
    opacity: 1;

    transition: .2s ease-out;
    -webkit-transition: .2s ease-out;
  }
  
.wrapper .overlay .rectangle h3 {
  text-align: center;
  font-size: 20px;
  margin-bottom: 25px;
  font-weight: bold;
}  
	
.divicone  {
  height:30px;
}	
.wrapper .link {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    margin: 0;
 }

.wrapper img {
    vertical-align: bottom;
}

	
/* slides */
		#slideout {
			position: fixed;
			bottom: 0px;
			right: 0px;
			width: 150px;
			padding: 12px 0;
			text-align: center;
			background: #301B53;
			-webkit-transition-duration: 0.3s;
			-moz-transition-duration: 0.3s;
			-o-transition-duration: 0.3s;
			transition-duration: 0.3s;
			-webkit-border-radius: 0 5px 5px 0;
			-moz-border-radius: 0 5px 5px 0;
			border-radius: 5px 5px 0 0;
		}
		#slideout_inner {
			position: fixed;
			bottom: -180px;
			right: 0px;
			background: #301B70;
			width: 200px;
			padding: 25px;
			height: 130px;
			-webkit-transition-duration: 0.3s;
			-moz-transition-duration: 0.3s;
			-o-transition-duration: 0.3s;
			transition-duration: 0.3s;
			text-align: left;
			-webkit-border-radius: 0 0 5px 0;
			-moz-border-radius: 0 0 5px 0;
			border-radius: 5px 0 0 0;
		}
		#slideout_inner textarea {
			width: 190px;
			height: 100px;
			margin-bottom: 6px;
		}
		#slideout:hover {
		    
			bottom: 180px;
			background: #301B70;
		}
		#slideout:hover #slideout_inner {
		
			bottom: 0px;
		}