@charset "utf-8";



@media only screen 

and (max-width : 1024px)

{  
#container{
			width:1009px;
	      }
#slogan{
	    
		 left:72%;
		 
	     width:59%;
		 height:100px;
	   }
#menu_Uti{
	     left:70%;
		}
#menu a 
{
        
        width : 144px; 
		
}

#menu li ul 
{ 
	  width : 144px;    

}
}



@media only screen 

and (max-width : 768px)

{  

 #textePied2 h2 {
	         margin-top:6px;
 }
}




@media only screen 

and (max-width : 640px)
{
	#logo{
	  position:absolute;
	  top:0%;
	  left:0%;
	  width:1009px;
      height:129px;
	  background:url(../image/logoMobile.png) #fff;
	  }
	#menu_Uti{
	        position:absolute;
	        top:0px;
			right:0px;
			font-family :none;
			font-weight:none;
		    color:transparent;
			font-size:none;
	     }
  #menu_Uti li{ display:none;
                margin:0px;
               }
			   
#menu_Uti a{text-decoration:none;}

#menu_Uti a:visited{
					text-decoration:none;
					color:tranpsarent;
                   }
				   
#lienFace{margin-top:0px;}

#lienFace{margin-top:0px;}



#menu, #menu ul {
        padding : 0; 
        margin : 0; 
        list-style : none; 

        text-align : center; 
}
#menu 
{
     
        font-family : arial narrow,arial;
        font-size :0px; 
		
}
#menu a 
{
        display : block; 
        padding : 0px; 
        background :transparent; 
		color :transparent; 
        text-decoration : none; 
        width : 0px; 
		height:auto;
}
#menu li      
{ 
        float : left; 
       
      
}


#menu li ul 
{ 
        position: absolute; 
   
        left: -999em; 
		color: #fff; 
        background: #78af30; 
		width : 0px; 
		padding :0px; 
		
}
html>body #menu li ul li                
{
        border-top : 0px solid transparent; 
}
#menu li ul ul 
{
        margin    : 0px; 
        
        border-left     : 0px solid #fff ;     
}

html>body #menu li ul ul                
{
        border-left     : 0px solid transparent ; 
}
#menu a:hover   
{
        color:transparent; 
        background:transparent; 
}

@import url(http://fonts.googleapis.com/css?family=Raleway:400,200);
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a {

  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  font-size: 22px;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#cssmenu {
 position: absolute;
  left: 0px;
  top: 0px;
  width: 1009px;
  font-family: arial narrow,arial;
  color: #ffffff;
}
#cssmenu ul ul {
  display: none;
}
#cssmenu > ul > li.active > ul {
  display: block;
}
.align-right {
  float: right;
}
#cssmenu > ul > li > a {
  padding: 64px 22px;
  cursor: pointer;
  z-index: 2;
 
  text-decoration: none;
  color: #78af30;
  background:transparent;
  -webkit-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
}
#cssmenu > ul > li > a:hover {
  color: #78af30;
}
#cssmenu ul > li.has-sub > a:after {
  position: absolute;
  right: 22px;
  top: 23px;
  z-index: 5;
  display: block;
  height: 2px;
  width: 16px;
  background: #78af30;

  content: "";
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
#cssmenu ul > li.has-sub > a:before {
  position: absolute;
  right: 22px;
  top: 23px;
  display: block;
  width: 16px;
  height:2px;
  background: #78af30;
  content: "";
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
#cssmenu ul > li.has-sub.open > a:after{
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#cssmenu ul > li.has-sub.open > a:before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
#cssmenu ul ul li a {
  padding: 24px 22px;
  cursor: pointer;
  z-index: 2;
  font-size: 22px;

  text-decoration: none;
  color: #fff;
  background: #78af30;
    border-top:1px solid #fff;
  -webkit-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
}
#cssmenu ul ul ul li a {
  padding-left: 32px;
}
#cssmenu ul ul li a:hover {
  color: #ffffff;
}
#cssmenu ul ul > li.has-sub > a:after {
  top: 20px;
  right: 22px;
  background: #fff;
}
#cssmenu ul ul > li.has-sub > a:before {
  top: 20px;
  right: 22px;
  background: #fff;
}




#slogan{
	    position:absolute;
		top:400px;
        left:0%;
		background:url(../image/sloganMobile.png) no-repeat;
	    width:1009px;
		height:131px;
	   }
#titre{ 
       margin:40px 5%;
	   
	  }	   

	      
#titre a{ text-decoration:none;
          font-family:arial regular,arial;
		  color:#000;
		  margin:7px 1px; 
		  
        }
#titre a:hover{ text-decoration:none;
          font-family:arial regular,arial;
		  color:#FF9900;
		  margin:7px 1px; 
        }
#titre a:visited{ text-decoration:none;
          font-family:arial regular,arial;
		  color:#000;
		  margin:7px 1px; 
        }
	#titre a:nth-child(2) { font-size:0px;
	                  }		  



#container{
		   margin:0px;
		   width:1009px;
		   height:auto;
		   -webkit-transition: width 1s; 
           transition: width 1s;
	      }
		  
#wrapper {
			width:1009px;
			margin-top:50px;
			-webkit-transition: width 1s; 
            transition: width 1s;
		 }
.carousel,
.carousel div {
				position: absolute;
				top:0%;
				width: 1009px;
				
				-webkit-transition: width 1s; 
                transition: width 1s;
				}
.carousel img{
			  width:1009px;
              border:0px;
			  
			  -webkit-transition: width 1s; 
              transition: width 1s;
			 }


			

		  
.para{
	  margin-top:10px;
	  text-align:left;
	  font-family:calibri;
	  color:#000;
	  font-size:20px;
     }
.para iframe{margin:10px 5px;}	 
	 
.para img{ margin:1%;}

.para2{
	  margin-top:10px;
	  text-align:left;
	  font-family:calibri;
	  color:#000;
	  font-size:14px;
      }
		
.para2 img{
	      margin:1%;
          }

footer{
		height:100%;
		background-color:#78af30;
		text-align:left;
		color:#fff;
		font-family:arial narrow,arial;
		padding-top:10px;
		font-size:20px;
      }

footer article{	
				width:50%;
				height:200px;
				display:block;
				margin:5% 35%;
			  }
		 
footer h2{ margin-top:10px;}
			 
footer p{ 
	      margin:17px 0;
		  font-size:16px;
		  line-height:20px;
	    }
		
footer a ,li{ 
			text-decoration:none;
			list-style-type:none;
            }
			
footer a:visited{ color:#fff;}

#textePied h2 { 
               margin:0px;
               margin-bottom:20px;
	          }

#textePied p { 
				margin:0px;
				margin-bottom:20px;
	         }

#copyright{
			background-color:#78af30;
			text-align:center;
			color:#fff;
			font-size:16px;
			font-family:arial narrow,arial;
			padding:20px 0px;
		  }
}
/*@media only screen 

and (max-width : 640px)
{



}*/
/*@media only screen 

and (max-width : 600px)
{



}*/
/*@media only screen 

and (max-width :568px)
{


}
*/
@media only screen 

and (max-width :480px)
{
#logo{
	  position:absolute;
	  top:0%;
	  left:0%;
	  width:1009px;
      height:129px;
	  background:url(../image/logoMobile.png) #fff;
	  }


#slogan{
	    position:absolute;
		top:400px;
        left:0%;
		background:url(../image/sloganMobile.png) no-repeat;
	    width:1009px;
		height:131px;
	   }				 

}
/*@media only screen 

and (max-width :414px)
{


}*/

/*@media only screen 

and (max-width : 384px)
{



}*/
/*@media only screen 

and (max-width : 375px)
{




}*/
/*@media only screen 

and (max-width : 320px)
{

	
}
*/


