@import url(http://fonts.googleapis.com/css?family=Codystar);
@import url(http://fonts.googleapis.com/css?family=Josefin+Sans:300,400,700);
@import url(http://fonts.googleapis.com/css?family=Poiret+One);
/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}
body{
	background-color:#EEEEED;
	max-width:1300px;
	margin:auto;
}
a{
	text-decoration:none;
	color:#000;
}
.clear{
	clear:both;
}
#haut{
	width:100%;
	position:relative;
}
.right{
	text-align:right;
}

/************************************ ENTREE*********************************/

#entree{
	width:768px;
	margin:50px auto;
}
#entree #haut{
	background:none;
	padding-bottom:0px;
}
#entree header{
	float:left;
	width:653px;
}
#entree  header p{
	font-family: 'Codystar', cursive;
	font-size:20px;
	color:#ED3F84;
	margin-top:30px;
	text-align:left;
}
#entree h1{
	background:url(../image/logo-pied-de-poule.png);
	width:216px;
	height:127px;
	margin:0 160px;
}
#contenu-entree{
	margin:100px auto 30px;
	width:640px;
	font-size:35px;
	text-align:center;
	padding-bottom:100px;
	background:url(../image/slash-rose.png) repeat-x bottom;
}
#entree-crea{
	padding-top:60px;
	float:left;
	width:247px;
	height:125px;
	background:url(../image/cadre-entree.png);
}
#entree-studio{
	padding-top:37px;
	float:right;
	width:247px;
	height:148px;
	background:url(../image/cadre-entree.png);
}
#entree-studio h2 span{
	display:block;
	font-family: 'Codystar', cursive;
	color:#ED3F84;
	font-size:15px;
}
#contenu-entree #entree-studio h3{
	margin-top:10px;
}
#contenu-entree h3{
		color:#666;
		font-size:25px;
		line-height:10px;
		padding-bottom:25px;
		background:url(../image/triangles.png) bottom center no-repeat;
}
#entree footer{
	text-align:center;
	font-size:21px;
	padding-bottom:20px;
	background:url(../image/triangles.png) bottom center no-repeat;
}
/************************************ GENERAL********************************/
#main{
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 300;
	margin:30px auto;
	width:90%;
}
#haut{
	background:url(../image/slash-rose.png) repeat-x bottom;
	padding-bottom:5px;
}
a.on{
	font-weight:700;
}
a.on span{ font-weight:400;}
#madein{
	width:20%;
	height:115px;
	float:left;
}
.made{
	float:left;
	width:115px;
	height:115px;
	background:url(../image/made-in-france.png);
}
#entree .made{
	background:url(../image/made-in-france-ssfond.png);
}
.made span{
	display:none;
}

header{
	float:left;
	width:60%;
	position:relative;
}
header p.macaron{
	position:absolute;
	top:-20px;;
	right:-10%;
}

h1{
	background:url(../image/logo-pied-de-poule.png);
	width:216px;
	height:127px;
	margin:0 auto;
}
h1 span{
	display:none;
}
#retour{
	float:right;
	width:auto;
	text-align:right;
}
p.retour-studio{
	background:url(../image/cadre-retour-studio.png) no-repeat;
	width:88px;
	height:52px;
	text-align:center;
	line-height:52px;
	font-size:22px;
}
#reseaux ul{
	text-align:right;
	margin-right:16px;
}
#reseaux ul li{
	display:inline-block;
	margin-left:8px;
}
#reseaux a{
	display:inline-block;
	height:20px;
	width:20px;
}

#reseaux span{
	display:none;
}
.letter{
	background:url(../image/letter.png) top;
	width:20px;
	height:14px;
}
.facebook, .pinterest{
	background:url(../image/facebook.png);
	width:20px;
	height:20px;
}
.pinterest{
	background:url(../image/pinterest.png);
}
header p, #concept h2{
	font-family: 'Codystar', cursive;
	font-size:20px;
	color:#ED3F84;
	margin-top:30px;
	text-align:center;
}
footer{
	font-size:16px;
	text-align:center;
	margin:20px 0;
}
/**********************ACCUEIL CREA******************/
#contenu{
	margin-top:20px;
	width:100%;
	height:100%;
}
.grande-image{
	position: relative;
	width:74.5%;
	padding-bottom:49.1%;
	float:left;
	left:0;
	margin:0% 2% 1% 0 ;
}
#events{
	position: relative;
	width:100%;
	padding-bottom:46.4%;
	float:left;
	left:0;
	margin:0% 2% 3% 0 ;
}
.archives{
	position: relative;
	width:49%;
	padding-bottom:23%;
	float:left;
	left:0;
	margin:1% 2% 3% 0% ;
}
#contenu .archives:nth-of-type(2n){
	margin-right:0px;
}
#accueil-haut .petite-image1, #accueil-haut .petite-image2{
	margin:1% 0;
}
#accueil-haut .petite-image1{
	margin:0 0 1% 0;
}
.petite-image1, .petite-image2, .petite-image3, .petite-image4, .petite-image5, .petite-image6{
	position: relative;
	width:23.5%;
	padding-bottom:23.5%;
	float:left;
	left:0;
	margin:1% 2% 1% 0;
}
.petite-image1{
	margin-top:0%;
}
#illu, .collections-vignettes{
	float:left;
	width:23.5%;
	padding-bottom:auto;
	margin:1% 2% 1% 0;
	font-family: 'Poiret One', cursive;
}
.petite-image{
	position:relative;
	width:100%;
	padding-bottom:100%;
	left:0;
}
p.catalogue{
	font-size:15px;
	text-transform:uppercase;
	padding-left:25px;
	background:url(../image/fleches-catalogue.png) 0px 7px no-repeat;
}
p.catalogue span{
	
	background:url(../image/pdf_catalogue.png) no-repeat 0 1px;
	display:inline-block;
	font-size:11px;
	width:27px;
	height:27px;
	padding-top:10px;
	padding-left:1px;
	text-align:center;
}
p.catalogue span a{
	color:#FFF;
}
 #france img, #illu img, .petite-image img, .petite-image1 img, .petite-image2 img, .petite-image3 img, .petite-image4 img, .petite-image5 img, .petite-image6 img{
	width:100%;
	height:auto;
	position:absolute;
	left:0;
	z-index:1;
}
#contenu img.active{
    z-index: 3;
}
#accueil-haut img, #accueil-bas img, #collection img, #events img, .archives img{
	width:100%;
	height:auto;
	position:absolute;
	left:0;
	z-index:1;
}
.last, #contenu .petite-image:nth-of-type(4), #contenu .petite-image:nth-of-type(8), #contenu .petite-image:nth-of-type(12), .collections-vignettes:nth-of-type(4), .collections-vignettes:nth-of-type(8), .collections-vignettes:nth-of-type(12), .collections-vignettes:nth-of-type(16), .collections-vignettes:nth-of-type(20), .collections-vignettes:nth-of-type(24){
	margin-right:0;
}
#fiche-texte h2, .collections-vignettes h2{
	color:#FF3B85;
	font-size:16px;
	margin:3px 0;
}
#concept h3, #fiche-texte h3, .collections-vignettes h3, #mentions h2{
	color:#333;
	font-size:17px;
	text-transform:uppercase;
}
#fiche-texte h3{
	margin-bottom:1%;
}
#fiche-texte h4{
	margin-bottom:5%;
	font-weight:700;
}
/************************************FICHE PRODUIT***************/
.fluid_container {
			margin: 0 0 20px 0;
			max-width: 1000px;
			width: 74.5%;
			position:relative;
		}
#contenu .camera_thumbs img{
	position:relative;
	width:31.2%;
	margin:0 1.95% 2% 0;
	border:0;
}
#contenu .camera_thumbs{
	width:102.5%;
	margin-top:3%;
}
#contenu .camera_thumbs_cont ul{
	max-width:100%;
	min-width:100%;
	text-align:left;
	padding:0;
}
#contenu .camera_thumbs_cont ul li{

	padding:0;
}
#contenu .camera_thumbs_cont{
	background:none;
}
#fiche-droite{
	width:23.5%;
	float:right;
}
#fiche-texte{
	background:#FFF;
	width:90%;
	padding:5% 5% 5% 5%;
	margin-bottom:7%;
	font-size:16px;
	line-height:18px;
	position:relative;
}
#fiche-texte p:last-of-type{
	display:inline;
}
#illu{
	position:relative;
	width:100%;
	padding-bottom:100%;
}
.slash-rose{
	color: #ED3F84;
	font-size:14px;
}
.anglais{
	color:#999;
	margin-top:2%;
}
.camera_wrap::after{
	clear:both;
}
.fluid_container .lien-eshop{
	width:70px;
	height:auto;
	position:absolute;
	z-index:30;
	top:0%;
	right:0%;
}
.lien-eshop img{
	width:100%;
	height:auto;
	
}
/**************************************OÙ NOUS TROUVER**************************/
#france{
	position: relative;
	width:100%;
	padding-bottom:89.5%;
	margin:1% 2% 3% 0 ;
}
#ou h2 span, #ouweb h2 span, #ouworld h2 span{
	display:none;
}

#ou p{
	margin-bottom:5px;
}
#liste-gauche{
	float:left;
	width:49%;
}
#liste-droite{
	float:right;
	width:49%;
}
.ville{
	display:block;
	color: #ED3F84;
	margin:20px 0 5px 0;
	text-transform:uppercase;
}
#ouweb{
	margin-left:40%;
	margin-bottom:30px;
}
#ouweb .espace{
	margin:10px 0 5px 1.5%;
}
#ouweb h2, #ouworld h2{
	width:172px;
	height:68px;
	background:url(../image/wente-web.png);
	margin-left:40%;
}
#shop{
	background:url(../image/cadre-shop-web.png) no-repeat;
	width:213px;
	height:56px;
	padding-top:15px;
	padding-left:1.5%;
	margin-bottom:30px;
	
}
#ouweb h3{
	color: #ED3F84;
	font-size:15px;
	margin-left: 1.5%;
	text-transform:uppercase;
}
#ouweb p{
	margin-left: 1.5%;
}
#ouworld h2{
	background:url(../image/wente-world.png);
	margin-left:64%;
}
#ouworld h3{
	font-family: 'Poiret One', cursive;
	font-size:20px;
	margin:20px 0 10px 0;
}
#ouworld p{
	margin-bottom:10px;
}
#ouworld h4{
	color: #ED3F84;
}
/************************************PRESS**********************************/
#press #fiche-texte{
	text-align:center;
	padding-bottom:30%;
}

#press #logo{
	position: relative;
	width:30%;
	padding-bottom:20%;
	left:0;
	margin:10% auto 5%;
}
#press #logo img{
	width:100%;
	height:auto;
	position:absolute;
	left:0;
	z-index:1;
}
#contenu #press h2{
	margin-bottom:5%;
}
#contenu #press .camera_thumbs img{
	position:relative;
	width:22.9%;
	margin:0 1.95% 2% 0;
	border:0;
}
#contenu #press .camera_thumbs{
	width:138%;
	margin-top:3%;
}
/***********************************HISTOIRE***********************************/
.histoire{
	margin-bottom:3%
}
.pointilles{
	border:dotted black 2px;
	padding:0 1% 1% 1%;
}
#contenu .histoire .portrait{
	width:33%;
	float:left;
	position:relative;
	margin-right:2%;

}
.portrait img{
	width:100%;
	height:auto;
	position:absolute;
	left:0;
	z-index:1;
}
#contenu .histoire .philo{
	margin:0 0 0 2%;
}
.histoire .texte{
	width:63%;
	float:right;
	background-color:#FFF;
	padding:1%;
	line-height:20px;
}
.histoire .textephilo{
	width:63%;
	float:left;
	background-color:#FFF;
	padding:1%;
	line-height:20px;
}
.histoire .texte .francais{
	margin-bottom:2%;
	background:url(../image/triangles.png) bottom no-repeat;
	padding-bottom:10px;
}
.histoire h2, #mentions h3{
	color: #ED3F84;
	margin:1.5% 0 0.5% 0;
	}
	#mentions a{
		color: #ED3F84;
	}
	#mentions h2{
		margin-top:20px;
	}
.histoire p{
	margin-bottom:2%;
}
.histoire .portrait p{
	margin-top:145%;
}
.histoire strong{
	font-size:20px;
}
/****************************************CONTACT*****************************/
#contact{
	text-align:center;
	padding:30px 0 15px 0;
	background:url(../image/triangles.png) center 15px no-repeat #FFF;
	
}
#textecontact{
	padding-bottom:20px;
	background:url(../image/triangles.png) center bottom no-repeat;
}
#textecontact .anglais{
	margin-top:0;
	font-size:14px;
}
#contact h2, #press h2{
	color: #ED3F84;
	margin:20px 0 5px 0;
	font-family: 'Codystar', cursive;
	font-size:17px;
	
}
#contact .mail{
	margin-top:20px;
}
#concept h4, #contact h3{
	margin-top:20px;
	font-weight:bold;
}
#contact #coordonnees{
	padding-bottom:20px;
	background:url(../image/triangles.png) center bottom no-repeat;
	margin-bottom:40px;
}
#contact #press{
	padding-bottom:20px;
	background:url(../image/triangles.png) center bottom no-repeat;
}
#concept h3{
	margin-top:5%;
}
#concept h4{
	margin-top:10px;
}
/***********************************MENTIONS LEGALES*************************/
/*************************************ADMIN**************************/
table{
	border:#333 2px dotted;
	width:100%;
	margin-top:1%;
}
td, tr, th{
	border:#333 2px dotted;
	padding:3px;
}
.modif span, .sup span{
	display:none;
}
 a.modif{
	background:url(../image/pencil.png) no-repeat;
	display:inline-block;
	width:16px;
	height:16px;
}
 a.sup{
	background:url(../image/delete.png) no-repeat;
	display:inline-block;
	width:16px;
	height:16px;
}
label{
	display:inline-block;
	width:100px;
	margin-top:20px;
}
input[type="submit"]{
	margin-top:20px;
}

/* iPads (portrait and landscape) ----------- */
@media only screen
and (max-width : 1024px) {

.collections-vignettes {
    width: 49%;
}
.last, #contenu .petite-image:nth-of-type(2), #contenu .petite-image:nth-of-type(4), #contenu .petite-image:nth-of-type(8), .collections-vignettes:nth-of-type(10), #contenu .petite-image:nth-of-type(12), #contenu .petite-image:nth-of-type(14), #contenu .petite-image:nth-of-type(16), #contenu .petite-image:nth-of-type(18), #contenu .petite-image:nth-of-type(20), #contenu .petite-image:nth-of-type(22), .collections-vignettes:nth-of-type(24), #contenu .petite-image:nth-of-type(26), #contenu .petite-image:nth-of-type(28), #contenu .petite-image:nth-of-type(30), .collections-vignettes:nth-of-type(2), .collections-vignettes:nth-of-type(4), .collections-vignettes:nth-of-type(6), .collections-vignettes:nth-of-type(8), .collections-vignettes:nth-of-type(10), .collections-vignettes:nth-of-type(12), .collections-vignettes:nth-of-type(14), .collections-vignettes:nth-of-type(16), .collections-vignettes:nth-of-type(18), .collections-vignettes:nth-of-type(20), .collections-vignettes:nth-of-type(22), .collections-vignettes:nth-of-type(24), .collections-vignettes:nth-of-type(26), .collections-vignettes:nth-of-type(28), .collections-vignettes:nth-of-type(30){
	margin-right:0;
}

.fluid_container {
}
#fiche-droite {
	background:#FFF;
}
#press #fiche-texte {
    padding-bottom: 20%;
    text-align: center;
}
#fiche-texte {
    margin-bottom: 0%;
}
header p.macaron img{
	width:70%;
	height:auto;
}
header p.macaron{
	top:20px;
}
}
@media only screen 
and (min-width : 320px) 
and (max-width : 480px)  {
	#contenu #press .camera_thumbs img{
	position:relative;
	width:31.2%;
	margin:0 1.95% 2% 0;
	border:0;
}
#contenu #press .camera_thumbs{
	width:102.5%;
	margin-top:3%;
}
#liste-gauche, #liste-droite{
	float:none;
	width:100%;
}
.collections-vignettes {
    width: 100%;
}
.fluid_container {
    width: 100%;
}
#fiche-droite {
    width: 100%;
	background:#FFF;
	margin-top:5%;
}
#illu{
	padding-bottom:30%;
	width:30%;
	left:5%;
}

#liste-gauche, #liste-droite{
	float:none;
	width:100%;
}
#fiche-texte {
    margin-bottom: 0%;
}
.histoire .texte, .histoire .textephilo {
    width: 98%;
	float:none;
}
#contenu .histoire .portrait {
    display:none;
}
#madein {
    float: none;
	margin: 5% 0;
	text-align:left;
}
#madein p{
	margin:auto;
}
header {
    float: none;
    width: 100%;
}
#retour {
    float: none;
	margin: 4% auto;
    text-align: center;
    width: auto;
}
#retour p{
	margin:auto;
}
#reseaux ul {
    margin-right: 0;
    text-align: center;
}
.collections-vignettes h3 {
	margin-bottom:5%;
}
.fluid_container .lien-eshop{
	width:100px;
	height:auto;
	
}
}

@media screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2), screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2){
	
	#contenu #press .camera_thumbs img{
	position:relative;
	width:31.2%;
	margin:0 1.95% 2% 0;
	border:0;
}
#contenu #press .camera_thumbs{
	width:102.5%;
	margin-top:3%;
}#liste-gauche, #liste-droite{
	float:none;
	width:100%;
}
.collections-vignettes {
    width: 100%;
}
.fluid_container {
    width: 100%;
}

#liste-gauche, #liste-droite{
	float:none;
	width:100%;
}
#fiche-droite {
    width: 100%;
	background:#FFF;
	margin-top:5%;
}
#illu{
	padding-bottom:30%;
	width:30%;
	left:5%;
}
#fiche-texte {
    margin-bottom: 0%;
	line-height:36px;
	font-size:30px;
}

#concept h3, #fiche-texte h3{
    font-size: 30px;
	margin-bottom:2%;
}
.histoire .texte, .histoire .textephilo {
    width: 98%;
	float:none;
}
#contenu .histoire .portrait {
    display:none;
}
#madein {
    float: none;
	margin: 5% 0;
	text-align:left;
}
#madein p{
	margin:auto;
}
header {
    float: none;
    width: 100%;
}
#retour {
    float: none;
	margin: 4% auto;
    text-align: center;
    width: auto;
}
#retour p{
	margin:auto;
}
#reseaux ul {
    margin-right: 0;
    text-align: center;
}
#concept h2, header p {
    font-size: 40px;
}
.collections-vignettes h3 {
    font-size: 30px;
	margin-bottom:5%;
}
#concept h4, #concept p{
	font-size:25px;
	margin-bottom:10px;
}
.fluid_container .lien-eshop{
	width:100px;
	height:auto;
	
}
}