@charset "utf-8";
/* CSS Document */

body {
	height: 		  	100%;
	margin: 		 	0 auto 0 auto;
	padding: 		 	0;
	text-align:      	left;
	font-family: 	  	Arial, Helvetica, sans-serif;
	font-size: 		  	12px;
	color:				#000;
	background:			url(http://www.translymat.fr/img/bg.jpg) center top #fff no-repeat;			 
}

img {
	display: 			inline;
	border:  			none;
}

a{
	text-decoration:	none;
}

ul{
	margin:				0;
	padding:			0;
}

.separation{
	width:				100%;
	height:				1px;	
	clear:				both;
	margin:				0 auto 0 auto;
} 

.orange{
	font-weight:		bold;
	color:				#F29400;	
}

#header{
	width:				980px;
	height:				165px;	
	margin:				0 auto;
}

#logo{
	width:				572px;
	height:				136px;	
	margin:				0 0 0 65px;
	padding-top:		10px;
	position:			relative;
}

#logo h1{
	position:			absolute;	
	color:				#7d8998;
	top:				120px;
	left:				143px;
	font-size:			22px;
	margin:				0;
}

#ctr{
	width:				980px;
	margin:				0 auto;	
}

#colR{
	width:				208px;	
	float:				left;
	background:			#a9a7a6;
}

.home{
	background:			#a9a7a6 url(http://www.translymat.fr/img/certifiee-iso.png) no-repeat bottom center !important;
}

#menu li{
	width:				208px;	
	height:				60px;
	display:			block;
	text-decoration:	none;
	list-style:			none;
	background:			url(http://www.translymat.fr/img/ico-menu.png) no-repeat 0 0 #505463;
	margin:				10px 0;
}

#menu li:hover, #menu li.active{
	background-color:	#f29400;
}

#menu li a{
	text-decoration:	none;
	font-size:			14px;
	color:				#fff;
	display:			block;
	font-weight:		bold;
	margin:				0 0 0 30px;
	padding-top:		11px;
}

#menu2 li a{
	padding-top:		20px;
}

#flotte{
	margin-top:			-10px;	
}

#colL{
	width:				772px;
	float:				left;
	padding-bottom:		25px;
}

#slider{
	width:				764px;
	height:				334px;
	background:			#fff;
	margin:				0 4px;
}

#imagePrincipale{
	width:				764px;
	height:				330px;
	background:			#A9A7A6;
	margin:				0;
	padding:			4px;
}

.slider-wrapper{
	width:				772px;
	height:				334px;
	background:			#fff;
	padding:			4px 0 0 0;	
}

#contenu{
	width:				772px;
	min-height:			100px;
	padding:			0;
	background:			#fff;
}

#carroussel{
	width:				772px;
	height:				106px;
	background:			url(http://www.translymat.fr/img/fd-carroussel.jpg) no-repeat 0 0 #fff;
}

.texte{
	width:				747px;
	padding:			10px 0 0 25px;
}

#texteHome{
	padding-top:		20px;	
}

.texte h2{
	color:				#f29400;
	font-size:			21px;
	margin:				10px 0 0 0;
}
#texteHome h2, #texteHome p.principal{
	width:				400px;
}

.texte h3{
	color:				#797d8e;
	font-size:			17px;
	margin:				10px 0 0 0;
}

.texte h3.slogan{
	font-size:			32px;
	width:				480px;
	margin:				0;
}

.texte h2.slogan2{
	font-size:			38px;
	width:				400px;
	margin:				0;
}

.texte h3.sloganCoktail{
	font-size:			32px;
	color:				#000;
	text-align:left;
}

.texte p.principal{
	font-size:			13px;
	text-align:			justify;
	padding-right:		45px;
}
.texte{
	text-align:			justify;
}

#texteHome p.principal{
	float:				left;
	padding-right:		0;
}

#coktail{
	float:				left;	
	margin:				-145px 0 0 70px;
}

.col3{
	width:				220px;	
	float:				left;
	margin:				20px 25px 0 0;
}

.col3 img{
	float:				left;
	margin:				0 10px 5px 0;
	border:				2px solid #f29400;
	-moz-box-shadow: 	0px 0px 2px 1px #888;
	-webkit-box-shadow: 0px 0px 2px 1px #888;
	box-shadow: 		0px 0px 2px 1px #888;
}

.col3 p{
	margin:				0;
	text-align:			justify;
	line-height:		14px;	
	font-size:			12px;
}

#ctrFooter{
	width:				100%;
	height:				90px;
	background:			#505463;
}

#footer{
	width:				980px;
	height:				90px;
	margin:				0 auto;
}

#footer ul{
	text-align:			center;
	padding-top:		10px;
}	

#footer li{
	display:			inline;
	list-style:			none;
	color:				#ccc;
}

#footer li a{
	color:				#ccc;	
	padding:			0 12px;
}

#footer li a:hover{
	color:				#fff;
}

#footer p{
	color:				#999;	
	text-align:			center;
}

#footer p a{
	color:				#fff;
}

#colImg{
	float:				right;
	width:				210px; 
	margin-right:		20px;
	margin-top:			10px;
	text-align:			left;
}

#colImg img{
	margin:				10px 10px 0 0;
	display:			inline;
}

#colImg2{
	float:				right;
	width:				100px; 
	text-align:			left;
	margin-top:			-45px;
	margin-right:		10px;
}

#colImg2 img{
	padding-bottom:		10px;	
}

#formulaire{
	width:				250px;
	float:				left;	
	margin-left:		25px;
	margin-right:		20px;
	margin-top:			20px;
}


#map{
	width:				410px;
	height:				200px; 
	float:				left;	
	margin-top:			20px;
	border:				4px #FFF solid;
	-moz-box-shadow: 	0px 0px 2px #000000;
	-webkit-box-shadow: 0px 0px 2px #000000;
	box-shadow:			0px 0px 2px #000000;

}

.labels {
   color: 				#222;
   background-color: 	white;
   font-family: 		"Lucida Grande", "Arial", sans-serif;
   font-size: 			11px;
   font-weight:			bold;
   text-align: 			center;
   width: 				250px;     
   padding:				5px;
   border: 				1px solid black;
   white-space:			nowrap;
}

input, textarea{
	margin-bottom: 		9px;
	width:				230px;
	height:				24px;
	font-size:			12px;
	text-transform:		uppercase;
	background-color:	#505463;
	padding-left:		10px;
	border:				0;
	color:				#CCC;
	-webkit-transition-property: background;
    -webkit-transition-duration: 0.5s;
	-webkit-transition-timing-function: ease-out;
	
	-moz-transition-property: background;
    -moz-transition-duration: 0.5s;
	-moz-transition-timing-function: ease-out;
	
	-ms-transition-property: background;
    -ms-transition-duration: 0.5s;
	-ms-transition-timing-function: ease-out;
	line-height:28px;
}

input:focus, textarea:focus{
	background-color: 	#c8c6c6;	
	color:				#666 !important;
}

#formsubmit{
	width:				240px;
	height:				26px;
	cursor:				pointer;
	padding-left:		0;
}

textarea{
	height:				150px;
	margin-top:			0;
	padding-top:		10px;
}

textarea#message {
    height: 405px;
    margin-top: 0;
    padding-top: 10px;
	width: 350px;
}

.produit{
	width:				300px;
	height:				265px;
	border:				4px solid #f29400;
	float: 				left;
	margin:				15px 25px;
	position:			relative;
	cursor:				pointer;
}

.produit h3{
	text-align:			center;	
	margin:				10px 0;
}

.descritpion {
	width:				280px;
	height:				266px;
	position:			absolute;
	display:			none;
	opacity:			0;
	background:			#f29400;
	padding:			0 10px;
}

.descritpion h3{
	color:				#fff;
	font-size:			70px;
	padding-top: 		40px;
}

.citationP{
	font-style:			italic;	
}

.citation{
	font-size:			25px;
	line-height:		12px;	
}

#marque{
	margin-right:		45px;	
}

#marque li{
	display:inline;	
	padding: 0 15px 0 8px;;
	background:url(http://www.translymat.fr/img/ico-liste.png) no-repeat 0 7px;
}

#ctrannonce{
	float:left;
	width:400px;	
}

#ctrform{
	float:left;
	width:320px;
}

.checkbox input{
	width:inherit;
	height:inherit;
}
.checkbox{
	text-align:left;	
}