/*

 

 Theme NAME: Theme perso

 Author: Thibaut Caroli

 

*/



body, html {

background: url(_/img/bkg-pattern.gif) #eee!important;

}



@font-face {

font-family: 'Langdon';

src: url('_/typo/langdon/langdon.eot');

src: url('_/typo/langdon/langdon.eot?#iefix') format('embedded-opentype'),

url('_/typo/langdon/langdon.woff') format('woff'),

url('_/typo/langdon/langdon.ttf') format('truetype'),

url('_/typo/langdon/langdon.svg#Langdon') format('svg');

font-weight: normal;

font-style: normal;

}



.left {float: left;}

.right {float: right;}

.clear {clear: both;}



.social a {

display: inline-block;

position: relative;

-webkit-transition: top 0.2s ease-out;

-moz-transition: top 0.2s ease-out;

-ms-transition: top 0.2s ease-out;

-o-transition: top 0.2s ease-out;

transition: top 0.2s ease-out;

}

.social a:hover {

top: -5px;

}

.social img {

border-radius: 3px;

}



.grosBt {
    text-decoration: none;
}

.grosBt p {

position: absolute;

z-index: 10;

left: 50%;

height: 50px;

border-radius: 3px;

padding-left: 15px;

font: 26px langdon;

text-transform: uppercase;

color: #53b657;

letter-spacing: 1px;

-webkit-font-smoothing: antialiased;

line-height: 55px;

background-image: url(_/img/fleche-bas.gif);

background-repeat: no-repeat;

background-color: #fff;

-webkit-transition: all 0.2s ease-out;

-moz-transition: all 0.2s ease-out;

-ms-transition: all 0.2s ease-out;

-o-transition: all 0.2s ease-out;

transition: all 0.2s ease-out;

}



.bt {
    color: #333!important;
    text-decoration: none;
    padding: 6px 12px 8px 28px;
    cursor: pointer;
    border-radius: 3px;
    display: inline-block;
    margin-top: 10px;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.btPlus {
    background: #eee url(_/img/flecheDroite.png) no-repeat 11px;
}
.btPlus:hover {
    padding: 6px 12px 8px 38px;
    background: #eee url(_/img/flecheDroite.png) no-repeat 16px;
}
.btDeplier {
    background: #eee url(_/img/flecheBas.png) no-repeat 7px;
    cursor: pointer;
    margin-bottom: 10px;
}
.btDeplier:hover {
    padding: 6px 12px 8px 38px;
    background: #eee url(_/img/flecheBas.png) no-repeat 12px;
}
.btDl {
    background: #eee url(_/img/flecheDl) no-repeat 7px 9px;
}
.btDl:hover {
	padding: 6px 12px 8px 38px;
	background: #eee url(_/img/flecheDl) no-repeat 13px 9px;
}



/*==================================================

						HEADER

===================================================*/
header {

position: fixed;

z-index: 9;

margin: 20px 0 0 20px;

}



header ul {

padding: 0;

margin: 0;

}

header nav ul a {

text-decoration: none;

color: #fff;

}

header nav ul a li {

  background: #195a76;

  font: 18px langdon, helvetica, arial, sans-serif;

  padding: 13px 0 10px 0;

  margin-bottom: 1px;

  text-transform: uppercase;

  text-align: center;

  letter-spacing: 1px;

  width: 150px;

  -webkit-font-smoothing: antialiased;

  -webkit-transition: background 0.2s ease-out;

  -moz-transition: background 0.2s ease-out;

  -ms-transition: background 0.2s ease-out;

  -o-transition: background 0.2s ease-out;

  transition: background 0.2s ease-out;

}

header nav ul a:hover li, .menuActif li {

background: url(_/img/bkg-pattern-vert.jpg) #53b657;

}

header nav ul a:first-child li, header nav ul a:first-child li img {

border-radius: 3px 3px 0 0;

}

.page header nav ul a:first-child li {

padding: 0;

background: none;

}

header nav ul a:last-child li {

border-radius: 0 0 3px 3px;

margin-bottom: 0px;

}



#mini-recensement {
	margin-top: 15px;
	margin-left: -5px;
}



#mini-petition {

width: 150;

margin-top: 18px;

text-align: center;

font-family: 'PT Sans';

color: #195a76;

position: relative;

-webkit-transition: left 0.2s ease-out;

-moz-transition: left 0.2s ease-out;

-ms-transition: left 0.2s ease-out;

-o-transition: left 0.2s ease-out;

transition: left 0.2s ease-out;

}

#mini-petition.hide {

left: -200px;

}

#mini-petition div:first-child {

margin-bottom: 1px;

padding: 10px 0;

background: #fff;

border-radius: 3px 3px 0 0;

}

#mini-petition div P {

line-height: 16px;

}

#mini-petition a {

text-decoration: none;

}

#mini-petition a p {

text-decoration: none;

font: 26px langdon;

-webkit-font-smoothing: antialiased;

text-transform: uppercase;

color: #53b657;

background: #fff;

padding: 15px 0 10px 0;

border-radius: 0 0 3px 3px;

-webkit-transition: all 0.2s ease-out;

-moz-transition: all 0.2s ease-out;

-ms-transition: all 0.2s ease-out;

-o-transition: all 0.2s ease-out;

transition: all 0.2s ease-out;

}

#mini-petition a p:hover {

background: #195a76;

color: #fff;

}



#cniid {

position: fixed;
right: -7px;
top: 94px;

}
#cniid img {
	width: 70%;
	height: auto;
}
#zerowaste {
	position: fixed;
	right: 20px;
	top: 20px;
	float: right;
}
#zerowaste img {
	border-radius: 3px;
}



#slider-wrap {

position: absolute;

z-index: 9;

bottom: 20px;

right: 20px;

color: #fff;

font: 13px 'PT Sans',sans-serif;

letter-spacing: 1px;

text-align: center;

}

#slider-wrap.hide {

right: -140px;

}

.slider {

margin-top: 5px;

width: 129px;

height: 75px;

overflow: hidden;

border-radius: 3px;

background: #fff;

}

.slider img {

border-radius: 3px;

}

#petition-wrap, #video-wrap, #content-wrap, #agir-wrap {
    height: 700px;
}


/*==================================================

					PETITION

===================================================*/

#petition-wrap {
    width: 100%;
    font-family: 'PT Sans', sans-serif;
    font-weight: 400;
    background: url(_/img/bkg-bois-luxe.jpg) center no-repeat;
    background-size: cover;
}

/*  DECOR */

#decor {
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 700px;
	overflow: hidden;
}
.decor {
	position: absolute;
	top: 50%;
	left: 50%;
}
.assiette {
	margin-left: -830px;
	margin-top: -540px;
}
.avocat {
	margin-left: 225px;
	margin-top: 170px;
}
.banane-cafe {
	margin-left: 380px;
	margin-top: -340px;
}
.epluchure {
	margin-left: -489px;
	margin-top: 200px;
}
.oeuf {
	margin-top: -279px;
	margin-left: -356px;
}
.pomme {
	margin-left: -490px;
}
.pain {
	margin-left: 85px;
	margin-top: 239px;
}
.fleur {
	margin-top: -590px;
	margin-left: 283px;
	-webkit-transform: rotate(0deg);
}


/*  ZONE PETITION */



#zone-petition {

position: absolute;

z-index: 2;

width:601px;

top: 50%;

left: 50%;

margin-left: -300px;

margin-top: -380px;

}

#zone-petition h1, #zone-petition h2 {

display: none;

}

#logo {
	margin-left: 45px;
}

.pour, .valorisons {
	width: 191px;
	margin: 0 auto;
	background-image: url(_/img/pour-valeur.png);
	background-repeat: no-repeat;
}

.pour {
	height: 119px;
	margin-top: -100px;
}

#zone-petition .social {

margin: -41px 0 6px 472px;

}
#partagez {
	position: absolute;
	top: 65px;
	left: 470px;
	opacity: 0;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
.social:hover #partagez, #partagez.animation {
     left: 497px;
     opacity: 1;
}

#petition {

width: 600px;

text-align: center;

font-family: 'PT Sans', sans-serif;

font-weight: 400;

background: #fff;

padding: 15px 20px 15px 20px;

box-shadow: 0px 0px 8px rgba(0,0,0,0.3);

border-radius: 3px;

}

#petition > p:last-child {

font-size: 12px;

margin-top: 12px;

}

.valorisons {

height: 116px;

background-position: 0px -125px;

margin-top: 10px;

}



/*  BT VOIR VIDEO */



#voir-video p {

bottom: 20px;

margin-left: -84px;

	width: 168px;

background-position: 169px 18px;

}

#voir-video p:hover {

margin-left: -103px;

	width: 206px;

}



/*==================================================



VIDEO



===================================================*/





/*  VIDEO WRAP */



#video-wrap {
    width: 100%;
    background: url(_/img/bkg-video.jpg) center no-repeat;
    background-size: cover;
}

#video-wrap #video {

width: 641px;

margin: 0 auto;

padding-top: 100px;

}

#video-wrap iframe {

box-shadow: 0 0 30px rgba(0,0,0,0.8);

}

#video .social {

margin: 0 0 17px 512px;

}



/*  BT COMPRENDRE */



#comprendre p {

margin-left: -74px;

	width: 158px;

background-position: 159px 18px;

}

#comprendre p:hover {

margin-left: -98px;

	width: 195px;

}



/*==================================================



  CONTENT



===================================================*/



#content-wrap {
	width: 100%;
}

#content {
	width: 880px;
	margin: 0 auto;
	padding-top: 120px;
	font-family: 'PT Sans', sans-serif;
	text-align: center;
}

#content div {
	width: 260px;
	float: left;
}

#content div:nth-child(-n+2) {
	margin-right: 50px;
}

#content div img {
	margin-bottom: 15px;
	width: 100%;
	height: auto;
}

#content div p {
	margin-bottom: 8px;
}

#content div h3.illu-title {
	font-weight: 700;
	font-size: 16px;
}

#content div a, #agir a {
	color: #53b657;
    background-color: #fff;
}

/*  BT COMMENT AGIR */

#comment-agir p {
	margin-left: -92px;
	width: 193px;
	background-position: 194px 18px;
}

#comment-agir p:hover {
	margin-left: -116px;
	width: 232px;
}

/*==================================================



AGIR



===================================================*/



#agir-wrap {
    width: 100%;
    background: url(_/img/bkg-pattern-vert.jpg);
}

#agir {

width: 904px;

margin: 0 auto;

padding-top: ¤0px;

font-family: 'PT Sans', sans-serif;

color: #fff;

text-align: center;

}

#agir a div {

width: 904px;

height: 484px;

background: url(_/img/recensement-ajouter.png) no-repeat;

}

#agir a div img {

-webkit-transition: opacity 0.2s ease-out;

-moz-transition: opacity 0.2s ease-out;

-ms-transition: opacity 0.2s ease-out;

-o-transition: opacity 0.2s ease-out;

transition: opacity 0.2s ease-out;

}

#agir a div img:hover {

opacity: 0;

}


#agir h2 {

display: none;

}

#agir p {
	width: 320px;
	margin: 20px 0 20px 292px;
}





/*  BT SIGNEZ */



#signez {

display: none;

}

#signez p {

position: relative;

top: 0;

left: 0;

width: 222px;

margin: 0 auto;

background: url(_/img/fleche-haut.gif) no-repeat 223px 18px #fff;

}

#signez p:hover {

width: 262px;

}



/*==================================================



PAGES



===================================================*/



#page-wrap {

position: absolute;

width: 755px;

left: 50%;

margin-left: -350px;

color: #333;

font-family: 'PT Sans';

}



#page-wrap > section {

width: 655px;

margin: 20px auto 50px 20px;

padding: 15px 30px 30px 30px;

background: #fff;

border-radius: 3px;

}

#page-wrap > section a {

color: #53b657;

}

#page-wrap > section h2 {

display: inline-block;

position: relative;

left: -80px;

padding: 5px 10px;

font-weight: 700;

font-size: 20px;

text-transform: uppercase;

-webkit-font-smoothing: antialiased;

letter-spacing: 1px;

color: #fff;

background: url(_/img/bkg-pattern-vert.jpg) #53b657;

border-radius: 3px;

}

#page-wrap p img, #page-wrap iframe {

position: relative;

left: -80px;

border-radius: 3px;

margin-bottom: 20px;

box-shadow: 0px 0px 8px rgba(0,0,0,0.3);

}



.sous-titre, div.saviez-vous em {

padding: 5px 8px;

border-radius: 3px;

font-style: normal;

display: inline-block;

margin-bottom: 15px;

}



/* SOUS TITRE */



.sous-titre {

margin-left: -80px;

background: #195a76;

color: #fff;

font-weight: 400;

}



/* SAVIEZ VOUS ? */



div.saviez-vous {
    padding: 20px 22px;
    background: url(_/img/bkg-pattern.gif) #eee;
    border-radius: 3px;
}

div.saviez-vous em {

background: #fff;


}

div.saviez-vous ul {

margin: 0;

}



/* CARTE */



ul.liste-cachee {
	display: none;
}



#map {
	width: 755px;
	height: 550px;
	position: relative;
	left: -80px;
	margin-top: 30px;
	background: url('../../../wp-admin/images/loading.gif') no-repeat center #fff;
	box-shadow: 0px 0px 8px rgba(0,0,0,0.3);
}

.infoGmap {
	width: 400px;
}

.map-agir {
	margin-bottom: 15px;
}



/* FORMULAIRE */

.important {
	display: none;
}

.verifBt {
	padding: 10px 12px;
	margin-top: 10px;
	color: #fff;
	border-radius: 3px;
	cursor: pointer;
	background: #195a76;
	text-align: center;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}

#confirm {
	color: #fff;
	padding: 10px 13px;
	background: #53b657;
	width: 755px;
	border-radius: 3px;
	margin: 30px 0 30px -80px;
	display: none;
	text-align: center;
	text-transform: uppercase;
}
#confirm.ok {
	display: block;
}

#recensement-initiative {
	width: 655px;
	padding: 15px 300px 40px 70px;
	margin: -15px 0 0 -30px;
	background: url(_/img/recensement-cadrage) no-repeat 350px center #53B657;
	color: #fff;
}

label, input, textarea, button {

display: inline-block;

border: none;

width: 100%;

}

label {

margin: 15px 0 5px 0;

}

label.error {

color: #000;

margin: 5px 0 0 0;

}

input, textarea {

padding: 8px 10px;

color: #195a76;

font-size: 14px;

}

fieldset {
	display: none;
}
.logged-in fieldset {
	display: block;
}
#miniMap + fieldset {
	display: block;
	position: fixed;
}

button {
	padding: 10px 12px;
	margin-top: 30px;
	color: #fff;
	border-radius: 3px;
	cursor: pointer;
	background: #195a76;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
button:hover, .verifBt:hover {
	background: #000;
}

button.enregistrement {
	background: #eee url('../../../wp-admin/images/loading.gif') no-repeat 10px 10px;
	color: #333;
}

#miniMap {
	display: none;
	margin-top: 10px;
	width: 100%;
	height: 200px;
	background: url('../../../wp-admin/images/loading.gif') no-repeat center #eee;
}





/* PETITION PAGE */



.petition-page {

width: 655px!important;

margin-left: 20px;

margin-bottom: 50px;

box-shadow: none!important;

border-radius: 0 0 3px 3px!important;

}

.soutien {

background: url(_/img/signez.png) no-repeat 158px 12px #53b657;

width: 655px;

height: 73px;

border-radius: 3px 3px 0 0;

margin-left: 20px;

}

.soutien p {
	display: none;
}

/* PARTENAIRES */

.page-id-1948 section img {
	box-shadow: none!important;
	border: 10px solid #fff;
	border-radius: 3px;
}

/*==================================================

						FOOTER

===================================================*/

footer {
	width: 655px;
	padding: 20px 0 50px 0;
	margin: 0 auto;
	color: #777;
	font: 14px 'PT Sans',sans-serif;
}
.page footer {
	margin: 0 0 0 20px;
}
footer > div.footer-section {
	width: 300px;
}
footer h3 {
	font-weight: 400;
	font-size: 14px;
	padding-bottom: 8px;
	border-bottom: 1px solid #777;
}
footer p, footer ul {
	margin-bottom: 8px;
}
footer ul {
	list-style: none;
	padding: 0;
	margin-top: 0px;
}
footer a {
	color: #777;
}

footer a:hover {
	color: #333;
}



/*==================================================

					MEDIA QUERIES

===================================================*/

@media screen and (max-height:630px) {
	.valorisons {
		display: none;
	}
}

@media screen and (max-height:660px) {
	#voir-video p {
		bottom: 0px;
		border-radius: 3px 3px 0 0;
	}
}

@media screen and (max-height:700px) {
	#comprendre, #comment-agir {
		display: none;
	}
	#zone-petition {
		top: 0;
		margin-top: -30px;
	}
    .pour {
		margin-top: -120px;
	}
	#partagez {
		top: 40px;
	}
}

@media screen and (max-width:1130px) {
	#page-wrap {
		position: absolute;
		width: 755px;
		left: 220px;
		margin-left: 0;
	}
	#content {
		width: 700px;
	}
	
	#content div {
		width: 220px;
	}
    #content div:nth-child(-n+2) {
        margin-right: 20px;
    }
}