body {	font-family: "Century Gothic", Verdana;	font-size: 12px;	margin:0;	margin-right: auto;	margin-left: auto;	background-color:#7C7364;}

#page {	width: 1140px;	margin-right: auto;	margin-left: auto;}

#entete 		 	{ padding: 2%; text-align:center }
#rubriques  		{	min-height: 28px; background-color: #A5ACA3; margin: 5px 0; text-align:center;	padding:6px 0; box-sizing:border-box; font-family: "Century Gothic", Verdana ; font-size: 13px; 	text-transform:uppercase;	font-weight:100;	letter-spacing:0.2px;}
#rubriques a		 { display: inline-block; color: #262827; margin: 7px 15px; padding-left: 3px }
#rubriques a:hover 	{ color: #FFF; }
#rubriques a.choix 	{ color: #FFF; font-weight:bold;  }
#rubriques a.blanc 	 	{  color:#FFF }
#rubriques a.blanc:hover  	{	color:#CCC}

#sommaire {	float:left;	width: 200px;	text-align:center;	padding-top: 20px;}

#sommaire IMG {	margin-bottom: 20px;}

#contenu {	width: 1140px;	min-height: 500px; margin: 0 auto 50px auto;	color:#3F4C45;	-moz-box-shadow:0px 5px 20px #E3DEDE;	-webkit-box-shadow:0px 5px 20px #E3DEDE;	box-shadow:0px 5px 20px #E3DEDE;	background-color: #FFF;}

@media (max-width: 992px){
#page, #contenu 				{ width: 100%}
#entete 		 				{ min-height: inherit }
}

@media (max-width: 480px){
#entete 	img				 	{ width: 100%; height: auto }
#rubriques 						{ letter-spacing: 2px; margin: 5px }	
}


#contenu #titrepage 	{ margin-left: 100px; margin-top: 30px; background-image:url(images/fond-titre.png); background-repeat:no-repeat;  }
#contenu #titrepage H1	{ margin-left: 7px; padding-top: 7px; padding-bottom: 3px  }
#contenu #rubspage 		{	margin-left: 350px;	width: 550px;	margin-top: -14px}
#contenu #rubspage a	{ float: left; font-family: "Century Gothic", Verdana; font-size: 13px; background-color: #DFDFDF; color: #7C8E9C ; padding: 5px 20px; margin: 0 1px; cursor:pointer }
#contenu #rubspage a:hover	{ background-color: #7C8E9C; color: #DFDFDF}
#contenu #rubspage a.choix	{ background-color: #7C8E9C; color: #DFDFDF }
#contenu #rubspage a:active	{ background-color: #7C8E9C; color: #DFDFDF }

#ssrub  			{ float: right; width: 220px;	margin-left: 100px;	text-align: right;	padding: 5px;	margin-bottom: 20px;	border:1px dashed #465253; color: #685E51 }
#ssrub.choix		 { background-color:#333; color: #CCC }
#ssrub:hover 		{ color: #959C98; cursor: pointer}

#contenu #photos 	{	width: 980px;	height: 250px;	overflow:hidden }

#contenu #home-rubriques { min-height: 285px; }
#contenu #home-rubrique  {	float: left;	width: 350px;		/*border-top: 1px solid #DFDFDF;	border-bottom: 1px solid #DFDFDF;	border-right: 1px solid #DFDFDF;*/
	padding: 20px 10px 0 30px; margin: 0 50px}
#contenu #home-rubrique .fond {	background-image: url(images/fond-home-rub.png); background-repeat:no-repeat }
#contenu #home-rubrique .info {	min-height: 160px }
#contenu #home-rubrique  h1 { font-family: "Century Gothic", Verdana;	font-weight: 100;	font-size: 18px; color: #1F1F1F; text-transform:none;  border-bottom: 1px solid #E60606  }
#contenu #home-rubrique  h2 {	font-family: "Century Gothic", Verdana;	font-weight: 100;	font-size: 15px;	color: #7F7F7F;	text-transform:none;}

#contenu #edito 			{	background-color:#F1F1F2;	padding: 20px;	 }
#contenu #edito .texte 		{	width: 600px; margin: 25px auto 0 auto; font-family: "Century Gothic", Verdana;	font-weight: 100;	font-size: 14px;	color: #1F1F1F; text-align:center; line-height: 24px }

#home-rubrique #actus 			 	{ font-family: "Century Gothic", Verdana; padding: 10px; cursor:pointer}
#home-rubrique #actus:hover			{ background-color:#7C8E9C }
#home-rubrique #actus .actu-title 	{ text-transform: uppercase; font-size:14px  }
#home-rubrique #actus .actu-date 	{ float: right; font-size:10px;color:#9C5151  }
#home-rubrique #actus .actu-texte 	{ font-size: 12px;  }
#home-rubrique #actus .more		 	{ color: #7C8E9C; margin-top: 10px  }

.connexion-form							{ width: 500px; margin:  20px auto; padding-bottom: 20px; font-size: 14px;font-family: "Century Gothic", Verdana}
.connexion-form	 form					{ background-color: #A5ACA3; border: 1px solid #2F332E; padding: 2% 5%; -moz-box-shadow: 0px 5px 20px #3C3F3E; -webkit-box-shadow: 0px 5px 20px #3C3F3E; box-shadow: 0px 5px 20px #3C3F3E }
.connexion-form	.bandeau				{ width: 100%; text-align:center}
.connexion-form	.bandeau img			{ width: 100%; height: auto; padding: 4% 0; box-sizing:border-box}
.connexion-form	form					{ padding: 5%}
.connexion-form	form input				{ width: 100%; height: 40px; margin: 2% 0; text-align: center; letter-spacing: 2px; font-size:14px; box-sizing:border-box; font-family: "Century Gothic", Verdana}
.connexion-form	form input[type=submit]	{ height: 40px; background-color: #7C7364; color:#F0F1F2; border:0; -webkit-appearance: none; cursor: pointer }
.connexion-form	form input[type=submit]:hover	{ height: 40px; background-color: #5D606E; color: #F0F1F2; border: 0; -webkit-appearance: none }
.connexion-form	p						{ text-transform:uppercase; letter-spacing: 2px }
.connexion-form .connexion-contact		{ text-align:center; margin-top: 5%}
.connexion-form .connexion-contact a	{ color: #F0F1F2 }
.connexion-form .connexion-contact a:hover	{ color: #5D606E }
.connexion-form .connexion-contact img	{ padding: 5px }
.connexion-form .connexion-contact img:hover { opacity:0.8; filter:alpha(opacity=80); -moz-opacity:8 }

@media (max-width: 500px){
.connexion								{ min-height: 350px}
.connexion-form							{ width: 95% }
.connexion-form	.bandeau img			{ width: 100%; padding: 10% 1%}
}


#actus 						{ font-family: "Century Gothic", Verdana; min-height: 180px; padding: 20px; cursor:pointer }
#actus #titre 				{ font-weight: 100;	font-size: 20px;	text-transform: uppercase; letter-spacing: 3px; margin-bottom: 10px } 
#actus #actu  				{ display: inline-block; vertical-align:top; box-sizing:border-box; width: 31%; margin:1%; text-align:center  }
#actus #actu:hover			{ background-color:#E9E9EB }
#actus #actu .actu-title 	{ text-transform: uppercase; font-size:14px; padding: 8px 0; letter-spacing: 1px }
#actus #actu .actu-date 	{ float: right;   padding: 3px 10px; text-transform: uppercase; font-size:12px; background-color:#BDBDC1; color:#000  }

#actus #actu .actu-photo	{ width: auto; height: 200px; text-align:center; overflow:hidden  }
#actus #actu IMG			{ height: 200px;  border-bottom: 3px solid #7B7263  }

#actus #actu .actu-texte, #actus #actu .actu-texte p 	{ font-size: 13px; line-height: 14px;  padding: 8px 0  }
#actus #actu .more		 	{ color: #7C8E9C; margin-top: 10px  }

@media (max-width: 992px){
#actus #actu  				{ width: 45%;   }	
}
@media (max-width: 768px){
#actus #actu  				{ display: block; box-sizing:border-box; padding: 1% 2%; width: 90%; margin:1% 2%;  }
#actus #actu .actu-date 	{ float: none; text-align: right; letter-spacing: 2px  }
#actus #actu .actu-title 	{ text-align: center; letter-spacing: 2px}

#actus #actu .actu-photo	{ width: auto; height: 200px; text-align:center; overflow:hidden  }
#actus #actu IMG			{ height: 200px;  border-bottom: 3px solid #7B7263  }
}

#contenu a.navig		  		{ font-family: "Century Gothic", Verdana; padding: 0 10px; margin: 0 5px;background-color: #B2000D;	color: #F1F1F2}
#contenu a.navig2 	  			{ font-family: "Century Gothic", Verdana; padding: 0 10px; margin: 0 5px;border: 1px solid #B2000D; background-color: #F1F1F2; color: #B2000D}
#contenu a.navig:hover  		{  border: 1px solid #B2000D; background-color: #F1F1F2; color: #B2000D  }
#contenu a.navig2:hover  		{  background-color: #B2000D;	color: #F1F1F2  }

#actu 							{ padding-top: 40px; width: 700px; margin-left: 30px  }
#actu #detail .actu-title 		{ text-transform: uppercase; font-size:16px; line-height: 22px; margin-bottom: 10px  }
#actu #detail .actu-description 	{ text-transform: none; font-size:14px; line-height: 22px; margin-bottom: 10px; color:#B2000D  }
#actu #detail .actu-date 			{ float: right; text-transform: uppercase; font-size:12px;color:#9C5151  }
#actu #detail IMG		 			{ width: 175px  }
#actu #detail .actu-texte 		{ font-size: 14px; line-height: 20px; text-align:justify; width: 650px   }

#album 								{ width: 90%;	padding-bottom: 20px; box-sizing:border-box; margin: 1% auto }
#album #detail .album-title 		{ text-transform: uppercase; font-size:16px; line-height: 22px; margin-bottom: 10px  }
#album #detail .album-description 	{ text-transform: none; font-size:14px; line-height: 22px; margin-bottom: 10px; color:#B2000D  }
#album #detail .album-date 			{ float: right; text-transform: uppercase; font-size:12px;color:#9C5151  }
#album #detail .album-texte 		{ font-size: 14px; line-height: 20px; text-align:justify   }
#album #detail .album-texte img		{ float: left; margin: 10px 30px 10px 0 }
#album #detail .photos 				{ text-align:center}
#album #detail .photo  				{ display: inline-block; box-sizing:border-box; padding: 1%; cursor:pointer}
#album #detail .photo img			{ width: auto; height: 230px  }

@media (max-width: 768px){
#album 								{ width: 90%}
}

@media (max-width: 500px){
#album #detail .album-texte img		{ float: none; margin: 1% auto; width: 100%}
#album #detail .photo img			{ width: 90%; height: auto  }
}

#contenu #recette 			{	width: 400px;	line-height: 18px;	text-align:justify;	margin: 5px;	cursor:pointer}
#contenu #recette .titre {    margin: 0;    padding:10px 10px 7px 10px;   font-family: "Century Gothic", Verdana;	font-weight: 100;	font-size: 13px; line-height: 18px;	}
#contenu #recette .style1 {    background-color:#E9E9EB; color: #373839 }
#contenu #recette .style2 {    background-color:#F3F3F3; color: #6F7071 }
#contenu #recette .accordion-open {  background-color:#FFF; color: #7C8E9C; font-weight: bold; font-size: 13px }
/*#contenu #faq .accordion-open span {    display:block;    	float:right;    padding:10px; 	background:url(../images/minus.png) center center no-repeat;}
#contenu #faq .accordion-close span {    display:block;    	float:right;   padding:10px;    background:url(../images/plus.png) center center no-repeat;}*/
#contenu #recette .content {   margin: 0;    padding:0 30px 5px 30px; line-height: 22px; min-height: 140px }

#contenu #partenaires  	{	width: 830px;	padding: 20px 30px 35px 30px}
#contenu #partenaires TD	 {  border: 1px dotted #7C8E9C; padding: 10px; text-align:center }

#contenu #texte {	width: 500px;	padding: 20px 50px;	line-height:22px;	color:#3F4C45;	text-align:justify;	letter-spacing: 0.2px;	margin-top: 20px;}
#contenu #texte H1 {	font-family: "Century Gothic", Verdana;	font-weight: 100;	font-size: 18px;	text-transform: uppercase	}
#contenu #texte H2 { 	font-family: "Century Gothic", Verdana;	font-weight: 100;   font-size: 16px;	text-transform: uppercase 	}
#contenu #texte H3 {	font-family: "Century Gothic", Verdana;	font-weight: 100;	font-size: 14px;	text-transform: uppercase	}

#contenu #texte H4 {	font-family: "Century Gothic", Verdana;	font-weight: 100;	font-size: 18px	}
#contenu #texte H5 { 	font-family: "Century Gothic", Verdana;	font-weight: 100;   font-size: 16px }
#contenu #texte H6 {	font-family: "Century Gothic", Verdana;	font-weight: 100;	font-size: 14px	}

#contenu .titre1 { font-family: "Century Gothic", Verdana; font-size: 18px; text-transform:uppercase  }
#contenu .titre2 { font-family: "Century Gothic", Verdana; font-size: 16px; text-transform:uppercase  }
#contenu .titre3 {font-family: "Century Gothic", Verdana;	font-size: 14px; text-transform:uppercase}
#contenu .titre4 { font-family: "Century Gothic", Verdana; font-size: 18px; }
#contenu .titre5 { font-family: "Century Gothic", Verdana; font-size: 16px;   }
#contenu .titre6 {font-family: "Century Gothic", Verdana;	font-size: 14px; }

#contenu #texte .detail {  font-family: "Century Gothic", Verdana; font-size: 16px; color:#3F4C45; font-weight: bold; font-variant:small-caps }
#contenu p {	color:#323D37; font-size: 14px}
#contenu a		 	{ color: #7F7F7F}
#contenu a:hover 	{ color: #7C8E9C }
#contenu a:active 	{ color: #7C8E9C }

#contenu #more				{ font-family: "Century Gothic", Verdana; font-size: 12px; text-transform:uppercase; background-color: #7C8E9C; padding: 5px 0 }
#contenu #more a			{ color: #DFDFDF; padding: 5px 20px }
#contenu #more a:hover		{ background-color: #F9DE08; color: #7C8E9C; font-weight:bold }


#contenu #textedroite { width: 350px; padding: 75px 25px 0px 25px; font-size: 10px; line-height:180%; float: right;  }
#contenu #textedroite .titre { padding-top: 0px; font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height: 130%; font-weight: bold  }

#contenu #vignettes {	width:365px;	float: right;	margin-top: 100px;	margin-left: 15px;	line-height:130%;	margin-right: 15px;	background-color: #FFFFFF;}

#ssrub  			{	width: 110px;	margin-left: 10px;	text-align: center;	padding: 2px; margin-bottom: 20px;	border:1px dotted #465253}
#ssrub a		 	{ color: #685E51 }
#ssrub a:hover 		{ color: #959C98;	font-weight:bold}

#pages { width:320px;  padding: 3px; margin: 0px 0px 5px 1px; width: 347px; text-align:right }/*border:1px dotted #DDD;*/
#pages a { color: #CFC9C0 }
#pages a:hover { color: #959C98}
#pages a.choix { color: #685E51 }

#contenucommandes {	padding: 40px; }

#contact-mail {  font-family: "Century Gothic", Verdana; font-size:14px; margin-top: 10px; color:#7C8E9C; text-transform:none; background-color: #F3F3F3; border: 1px dotted #7C8E9C; padding: 15px;}
#contact-mail a 		{ color:#333; text-decoration:none }
#contact-mail a:hover 	{ color:#959C98; }
.myButtonLink 		{  display: block; background:url(http://www.kreatis.eu/images/enveloppes.png) no-repeat bottom; width: 50px; height: 44px }
.myButtonLink:hover {  font-weight: bold; font-style:italic; background-position: 0 0 }

#infos  {	width:950px;	padding: 10px 25px;	background-color: #7D7465;/*3F4C45*/	margin:auto;	line-height: 16px;	color: #EAEEEC;	font-size:11px;	clear:both;	min-height:50px}
#infos  P { color: #EAEEEC }
#infos  A { color: #323233; font-weight:bold }
#infos  A:hover { color: #F3EFEB }
#infos #prix { padding-top: 10px; font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif; font-size: 14px; color:#CFC9C0; font-weight: bold }

#pied {	width: 980px;	margin:15px auto 10px auto;	min-height: 50px;	font-family: "Century Gothic", "Arial Narrow", Arial;	font-size: 11px;	text-transform:uppercase;
	letter-spacing:1px;	word-spacing:1px;	color:#FFF; background-color:#7C8E9C; line-height: 18px}
#pied    A 			{ color:#FFF }
#pied    A:hover 	{ color:#CCC }
#pied #societe {	padding: 20px;		text-align:left}

#contact {	width:1000px;	background-color: #FFFFFF;	margin-right: auto;	margin-left: auto;	color: #4E5C54;}

#contact H1 {  font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color:#3D4A44; line-height:150% }
#contact H2 {  font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif; font-size: 13px; color:#3D4A44; line-height:150%  }

#contact .droite {	float: right;	/*background-color: #EDEDED;*/	padding: 20px;	width:445px;	text-align:left;}