/*================================================================================	*/
/*																										*/
/*	codes couleur :	53570b		> 	131a24															*/
/*						a1a838		> 	4a5666															*/
/*						f1f887		>	b9c5d6															*/
/*================================================================================	*/



/*================================================================================	*/
/*																										*/
/* Font Definition																					*/
/*																										*/
/*================================================================================	*/
@font-face{
	font-family: 	myBRLNSRFont;
	src:			url('../fonts/brlnsr.ttf');
}

@font-face{
	font-family: 	myBRLNSBFont;
	src:			url('../fonts/BRLNSB.TTF');
}

@font-face{
	font-family: 	myCENTURYFont;
	src:			url('../fonts/CENTURY.TTF');
}

@font-face{
	font-family: 	myJPHSLFont;
	src:			url('../fonts/JPHSL.TTF');
}
@font-face{
	font-family: 	myWREXHALT;
	src:			url('../fonts/wrexhalt.ttf');
}
@font-face{
	font-family: 	mySOUTHERNAIRE;
	src:			url('../fonts/SouthernAire.ttf');
}
@font-face{
	font-family: 	myARMALITE;
	src:			url('../fonts/armalite.ttf');
}
@font-face{
	font-family: 	myAGENCY;
	src:			url('../fonts/AgencyFB.ttf');
}
@font-face{
	font-family: 	myAGENCYBold;
	src:			url('../fonts/AgencyFB-Bold.ttf');
}

@font-face{
	font-family: 	myBeastWars;
	src:			url('../fonts/BeastWars.ttf');
}

/*================================================================================	*/
/*																										*/
/* General Definition																				*/
/*																										*/
/*================================================================================	*/
* {
    box-sizing: 			border-box;
}
body{
	background-image: 		url("../images/backGround.png");
	backGround-color:		#ccc;
}

h1{
	font-size:				30px;
	font-weight:			normal;
	color:					#131a24;
	//margin:					0 auto;
	//width:					25%;
	//padding:				4vw 2vw 2vw 2vw;
	background-color:		rgba(185, 197, 214, 0.8);
}
h2{
	font-size:				30px;
	font-weight:			bold;
	color:					#131a24;
	margin:					0 auto;
	width:					70%;
	padding:				2vw;
	background-color:		rgba(185, 197, 214, 0.8);
}

h3{
	font-size:				45px;
	width:					85%;
	margin:					10px auto 10px auto;
	//margin-left:			auto;
	//margin-right:			auto;
	//margin-bottom:				10px;
	//margin-left:			10px;
	padding:				10px;
	border-bottom:			3px #131a24 solid;
	text-shadow:			1px 1px red;
	background-color:		rgba(185, 197, 214, 0.8);
}

/*================================================================================	*/
/* index.php																							*/
/*================================================================================	*/
#dv_xtr_Container{
	display:				flex;
	flex-direction:			column;
	margin:					0 auto;
}
#dv_xtr_subContainer{
}
	#dv_xtr_Qui{
		//margin-top:			2vw;
		//padding-bottom:		0;
	}
#dv_xtr_Heading{
	display:			flex;
	flex-direction:		column;
}
	#dv_xtr_Titre{
		display:				flex;
		flex-direction:			row;
		justify-content:		center;
		margin:					0 auto;
		width: 					98%;
		background-color:		#b9c5d6;
//		border-bottom:			5px #131a24 solid; 
	}
			#dv_xtr_logoTitre{
				padding:			1vw;
				display: 			grid;
				width:				15%;
			}
				#dv_xtr_logoImage{
					margin: 			auto;
			}
			
			#dv_xtr_Center{
				display:			flex;
				flex-direction:		column;
				width:				70%;
			}
				#dv_xtr_Slogan{
					width:				100%;
					padding-top:		2vw;
				}
				#dv_xtr_textTitre{
					width:				100%;
					//padding:			1.2vw 1vw 1vw 1.5vw;
					padding-top:		0.5vw;
				}
				
		#dv_xtr_button{
			//display:			grid;
			padding:			1vw;
			width:				15%;
		}
			#dv_xtr_Dollar{
				cursor: 		-webkit-pointer; 
				cursor: 		pointer;
			}
		
	#dv_xtr_Menu{
		width: 					98%;
		margin:					0 auto;
		background-color:		#b9c5d6;
	//	padding:				10px;
		padding-left:			50vw;
		border-bottom:			5px #131a24 solid; 
	}
	#dv_xtr_Service{
	}
	#dv_xtr_textService{
		width:					98%;
		margin:					0 auto;
		padding:				20px;
		display:				flex;
		flex-direction:			row;
	}
		#dv_xtr_Logo{
			width:				33%;
			//border:				2px solid #131a24;
			margin-bottom:		6vw;
		}
		#dv_xtr_Impression{
			width:				33%;
			//border:				2px solid #131a24;
			margin-top:			3vw;
			margin-bottom:		3vw;	
		}
		#dv_xtr_Broderie{
			width:				33%;
			//border:				2px solid #131a24;
			margin-top:			6vw;
		}
	#dv_xtr_textService1{
		width:					98%;
		margin:					0 auto;
		padding:				20px;
		display:				flex;
		flex-direction:			row;
	}
		#dv_xtr_Flocage{
			width:				33%;
			//border:				2px solid #131a24;
			margin-bottom:		6vw;
		}
		#dv_xtr_Sticker{
			width:				33%;
			//border:				2px solid #131a24;
			margin-top:			3vw;
			margin-bottom:		3vw;	
		}
		
		
		
		
		
		
		
		
	#dv_xtr_Produit{
		padding:				10px;
//		border-bottom:			3px #131a24 solid; 
	}
	#sv_xtr_Galery{
		padding:				10px;
	}
	#dv_xtr_Realisation{
		//font-size:				2vw;
		//width:					85%;
		//margin:					0 auto;
		padding:				10px;
//		border-bottom:			3px #131a24 solid; 
	}	
	#dv_xtr_Cadre0{
		display:				flex;
		flex-direction:			row;
		width:					80%;
		margin:					0 auto;
		margin-top:				20px;
		//padding:				5Px;
		border:					3px solid #4a5666;
	}
		#dv_xtr_Cell010{
			width:						50%;
			color:						#131a24;
		}
		#dv_xtr_Cell010{
			width:						50%;
			background-color:			#4a5666;
		}
	#dv_xtr_Cadre0{
		display:				flex;
		flex-direction:			row;
		width:					80%;
		margin:					0 auto;
		margin-top:				20px;
		//padding:				5px;
		border:					3px solid #4a5666;
	}
		#dv_xtr_Cell020{
			width:						50%;
			background-color:			#4a5666;
		}
		#dv_xtr_Cell020{
			width:						50%;
			color:						#131a24;
		}
	#dv_xtr_Cadre0{
		display:				flex;
		flex-direction:			row;
		width:					80%;
		margin:					0 auto;
		margin-top:				20px;
		//padding:				5Px;
		border:					3px solid #4a5666;
	}
		#dv_xtr_Cell030{
			width:						50%;
			color:						#131a24;
		}
		#dv_xtr_Cell030{
			width:						50%;
			background-color:			#4a5666;
		}
	
	
		#dv_xtr_listCatalogue{
			width:				80%;
			margin-left:		10vw;
			
		}	

		#dv_xtr_docuCatalogue{
			width:				80%;
			margin-left:		10vw;
			
		}	
	
		#dv_xtr_resSoc{
			display:				flex;
			flex-direction:			row;
			justify-content:		flex-start;
//			justify-content:		space-around;
		}
	
	
	
	
	
	
	
	
	#dv_xtr_Contact{
		//padding:				10px;
		//border-bottom:			3px #131a24 solid; 
	}
	#dv_xtr_contactInfo{
		width:					98%;
		//border:					1px #00f solid; 
		display:				flex;
		flex-direction:			column;
		margin:					0 auto;
	}
		#dv_xtr_cadreContact{
			display:				flex;
			flex-direction:			row;
		}
			#dv_xtr_suivezNous{
				width:				40%;
			}
				#dv_xtr_Address{
						//width:				40%;
					}
						#dv_xtr_textAddress{
							text-align:			center;
							background-color:	rgba(185, 197, 214, 0.8);
							margin:				20px;
						}
			#dv_xtr_eMail{
				width:				60%;
			}
				#dv_xtr_eMailData{
					display:			flex;
					flex-direction:		column;
					background-color:	rgba(185, 197, 214, 0.8);
					margin:				20px;
					padding:			30px;
				}
		#dv_xtr_Map{
			padding:				5vw;
		}		













#sp_xtr_01{
	padding-left:			3vw;
}






/*================================================================================	*/
/* Class																								*/
/*================================================================================	*/
.cl_General{
	font-family:			myAGENCY;
//	font-family:			myBRLNSRFont;
	font-size:				20px;
	color:					#131a24;
}
.cl_Caste01{
	font-size:				30px;
	text-shadow:			2px 2px white;
	font-weight:			bold;
}
.cl_Caste02{
	font-size:				20px;
	text-shadow:			none;
	color:					#fff;
	backGround-color:		#4a5666;
	margin-left:			10px;
	margin-right:			10px;
	padding-left:			10px;
}
.cl_Caste02a{
	font-size:				30px;
	text-shadow:			none;
	color:					#fff;
}

.cl_Caste02b{
	font-size:				22px;
	text-shadow:			none;
}

.cl_Caste03{
	font-size:				30px;
	font-weight:			bold;
	color:					#131a24;
	margin:					0 auto;
	width:					70%;
	padding:				2vw;
	background-color:		rgba(185, 197, 214, 0.8);
}
.cl_Caste03a{
	font-size:				30px;
	font-weight:			bold;
	color:					#131a24;
	//margin:					0 auto;
	//width:					40%;
	padding:				0.2vw;
	background-color:		rgba(185, 197, 214, 0.8);
	cursor:					pointer;
	//border:		2px solid blue;
}

.cl_Caste04{
	font-size:				30px;
	font-weight:			bold;
	color:					#131a24;
	//margin:					0 auto;
	//width:					25%;
	//padding:				4vw 2vw 2vw 2vw;
	background-color:		rgba(185, 197, 214, 0.8);
}

.cl_Caste05{
	font-size:				90px;
	//padding-top:			2vw;
	//padding-left:			50vw;
	text-align:				center;
	font-family:			myBeastWars;
}
.cl_CasteX1{
	font-size:				45px;
	width:					85%;
	margin:					10px auto 10px auto;
	//margin-left:			auto;
	//margin-right:			auto;
	//margin-bottom:				10px;
	//margin-left:			10px;
	padding:				10px;
	border-bottom:			3px #131a24 solid;
	text-shadow:			1px 1px red;
	background-color:		rgba(185, 197, 214, 0.8);
}
.cl_CasteX2{
	font-size:				30px;
	width:					85%;
	margin:					0 auto;
	margin-top:				15px;
	padding:				10px;
	border-bottom:			3px #131a24 solid;
	text-shadow:			1px 1px red;
	text-align:				center;
	background-color:		rgba(185, 197, 214, 0.8);
}

.cl_centerImage{
	display:				block;
	margin-left:			auto;
	margin-right:			auto;
	//width:					100%;
	max-height: 			400px;
	max-width:				750px;
}
.cl_centerImage1{
	display:				block;
	margin-left:			auto;
	margin-right:			auto;
	width:					17vw;
}
.cl_centerImage2{
	display:				block;
	margin-left:			auto;
	margin-right:			auto;
}
.cl_centerImage3{
	display:				block;
	margin-left:			auto;
	margin-right:			auto;
	width:					10vw;
}
.cl_centerImage4{
	display:				block;
	margin-left:			auto;
	margin-right:			auto;
	//width:					100%;
	max-height: 			350px;
	max-width:				590px;
}
.cl_centerMap{
	display:				block;
	margin-left:			auto;
	margin-right:			auto;
	width:					70vw;
}

.cl_Cadre{
	display:				flex;
	flex-direction:			row;
	width:					80%;
	margin:					0 auto;
	margin-top:				20px;
	//padding:				5Px;
	border:					3px solid #4a5666;
}
.cl_CadreX{
	display:				flex;
	flex-direction:			row;
	width:					80%;
	margin:					0 auto;
	margin-top:				20px;
	//padding:				5Px;
//	border:					3px solid #4a5666;
}
.cl_CadreY{
	display:				flex;
	flex-direction:			column;
	width:					50%;
//	margin:					0 auto;
//	margin-top:				20px;
	//padding:				5Px;
	border:					1px solid #4a5666;
}
.cl_Background{
	backGround:				rgba(185, 197, 214, 0.8);
}
.cl_Image{
	width:						50%;
	color:						#131a24;
}
.cl_Text{
	width:						50%;
	background-color:			#4a5666;
	padding:					1vw 0 1vw 2vw;
}

.xContainer{
	position: 		relative;
	max-width: 		800px;
//	margin: 		0 auto;	
}


.xContainer .xContent{
	position: 		absolute;
	bottom: 		0;
	//background: 	rgb(0, 0, 0); 				/* Fallback color */
	background: 	rgba(185, 197, 214, 0.8); 	/* Black background with 0.5 opacity */
	color: 			#131a24;
	width: 			100%;
	padding: 		20px;	
}













.cl_Button01 {
   background: #131a24;
   background-image: -webkit-linear-gradient(top, #131a24, #b9c5d6);
   background-image: -moz-linear-gradient(top, #131a24, #b9c5d6);
   background-image: -ms-linear-gradient(top, #131a24, #b9c5d6);
   background-image: -o-linear-gradient(top, #131a24, #b9c5d6);
   background-image: -webkit-gradient(to bottom, #131a24, #b9c5d6);
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
//   height: 50px;
//   line-height: 50px;
   color: #FFFFFF;
//   font-family: Brush Script MT;
//   width: 200px;
   font-size: 25px;
//   font-weight: 100;
   padding: 10px;
//   -webkit-box-shadow: 1px 1px 20px 0 #000000;
//   -moz-box-shadow: 1px 1px 20px 0 #000000;
//   box-shadow: 1px 1px 20px 0 #000000;
   text-shadow: 1px 1px 20px #000000;
   text-decoration: none;
   display: inline-block;
   cursor: pointer;
   text-align: center;
   width:		150px;
}

.cl_Button01:hover {
	background: 				#4a5666;
	border: 					solid #4a5666 1px;
	-webkit-border-radius: 		10px;
	-moz-border-radius: 		10px;
	border-radius: 				10px;
	text-decoration: 			none;
}

/*================================================================================	*/
/* Media																								*/
/*================================================================================	*/
@media only screen and (max-width: 1024px) {
	#dv_xtr_Container{
		display:				none;
	}
}