/* Ecoute la Terre */
/* =============== */
/* FEUILLE de STYLE pour les ILLUSTRATIONS */ 

@charset "utf-8";

/*****************************/
/* Images sous les TITRES... */
/*****************************/

figure.image_sous_titre {
	display: inline-block;
	width: 605px;
	margin: 5px auto 15px auto;
	border-radius: 10px;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25);
	background-color:#DEEDC4;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
}

figure.image_sous_titre::after {
	display: block;
	position: absolute;
	height: 35px;
	width: 605px;
	bottom: -35px;
	left: 0;
	background-color: rgba(0, 0, 0, 0.35);
	border-top: 1px solid rgba(255, 255, 255, 0.50);
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	text-align: center;
	line-height: 35px;
	vertical-align: middle;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0.05em;
	color: rgba(255, 255, 255, 0.85);
	transition: all 0.25s ease 0s;
}

figure.image_sous_titre:hover::after {
	bottom: 0;
}

figure.image_sous_titre.diaporamas_agroglyphes { 
	background-image: url('../images/illustrations/titre_diaporamas_agroglyphes.jpg');
	height: 251px;
	background-position: center -70px;
}

figure.image_sous_titre.presentation_agroglyphes { 
	background-image: url('../images/illustrations/titre_presentation_agroglyphes.jpg');
	height: 252px;
	background-position: center -30px;
}

figure.image_sous_titre.oeuvres_non-humaines { 
	background-image: url('../images/illustrations/titre_oeuvres_non-humaines.jpg');
	height: 252px;
	background-position: center -190px;
}

figure.image_sous_titre.etres_intelligents { 
	background-image: url('../images/illustrations/titre_etres_intelligents.jpg');
	height: 252px;
	background-position: center -170px;
}

figure.image_sous_titre.auteurs_agroglyphes { 
	background-image: url('../images/illustrations/titre_auteurs_agroglyphes.jpg');
	height: 252px;
	background-position: center -120px;
}

figure.image_sous_titre.phenomenes_lumineux { 
	background-image: url('../images/illustrations/titre_phenomenes_lumineux.jpg');
	height: 252px;
	background-position: center -70px;
}

figure.image_sous_titre.sens_agroglyphes { 
	background-image: url('../images/illustrations/titre_sens_agroglyphes.jpg');
	height: 252px;
	background-position: center -60px;
}

figure.image_sous_titre.actualisation_2016 { 
	background-image: url('../images/illustrations/titre_actualisation_2016.jpg');
	height: 282px;
	background-position: center -65px;
}

figure.image_sous_titre.actualisation_2015 { 
	background-image: url('../images/illustrations/titre_actualisation_2015.jpg');
	height: 252px;
	background-position: center -75px;
}

figure.image_sous_titre.actualisation_2014 { 
	background-image: url('../images/illustrations/titre_actualisation_2014.jpg');
	height: 251px;
	background-position: center -150px;
}

figure.image_sous_titre.actualisation_2013 { 
	background-image: url('../images/illustrations/titre_actualisation_2013.jpg');
	height: 251px;
	background-position: center -55px;
}

figure.image_sous_titre.actualisation_2012 { 
	background-image: url('../images/illustrations/titre_actualisation_2012.jpg');
	height: 251px;
	background-position: center -55px;
}

figure.image_sous_titre.actualisation_2011 { 
	background-image: url('../images/illustrations/titre_actualisation_2011.jpg');
	height: 251px;
	background-position: center -150px;
}

figure.image_sous_titre.actualisation_2010 { 
	background-image: url('../images/illustrations/titre_actualisation_2010.jpg');
	height: 251px;
	background-position: center -150px;
}

figure.image_sous_titre.actualisation_2009 { 
	background-image: url('../images/illustrations/titre_actualisation_2009.jpg');
	height: 251px;
	background-position: center -150px;
}

figure.image_sous_titre.agroglyphes_lorraine { 
	background-image: url('../images/illustrations/titre_agroglyphes_lorraine.jpg');
	height: 251px;
	background-position: center -130px;
}

figure.image_sous_titre.diaporamas_agroglyphes.fr::after,
figure.image_sous_titre.presentation_agroglyphes.fr::after,
figure.image_sous_titre.oeuvres_non-humaines.fr::after,
figure.image_sous_titre.etres_intelligents.fr::after,
figure.image_sous_titre.auteurs_agroglyphes.fr::after,
figure.image_sous_titre.phenomenes_lumineux.fr::after,
figure.image_sous_titre.sens_agroglyphes.fr::after,
figure.image_sous_titre.actualisation_2016.fr::after { content: "Photo \00a9  Lucy Pringle"; }

figure.image_sous_titre.diaporamas_agroglyphes.es::after,
figure.image_sous_titre.presentation_agroglyphes.es::after,
figure.image_sous_titre.oeuvres_non-humaines.es::after,
figure.image_sous_titre.etres_intelligents.es::after,
figure.image_sous_titre.auteurs_agroglyphes.es::after,
figure.image_sous_titre.phenomenes_lumineux.es::after,
figure.image_sous_titre.sens_agroglyphes.es::after,
figure.image_sous_titre.actualisation_2016.es::after { content: "Foto \00a9  Lucy Pringle"; }

figure.image_sous_titre.diaporamas_agroglyphes.en::after,
figure.image_sous_titre.presentation_agroglyphes.en::after,
figure.image_sous_titre.oeuvres_non-humaines.en::after,
figure.image_sous_titre.etres_intelligents.en::after,
figure.image_sous_titre.auteurs_agroglyphes.enr::after,
figure.image_sous_titre.phenomenes_lumineux.en::after,
figure.image_sous_titre.sens_agroglyphes.en::after,
figure.image_sous_titre.actualisation_2016.en::after { content: "Photo \00a9  Lucy Pringle"; }

figure.image_sous_titre.actualisation_2015.fr::after { content: "Près de Stonehenge - 24 juin 2015 | Photo \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2015.es::after { content: "Cerca de Stonehenge - 24 de junio del 2015 | Foto \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2015.en::after { content: "Near Stonehenge - June 24, 2015 | Photo \00a9  Lucy Pringle"; }

figure.image_sous_titre.actualisation_2014.fr::after { content: "Gipsy Lane, Chilcomb Down (Hampshire) - 6 juin 2014 | Photo \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2014.es::after { content: "Gipsy Lane, Chilcomb Down (Hampshire) - 6 de junio del 2014 | Foto \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2014.en::after { content: "Gipsy Lane, Chilcomb Down (Hampshire) - June 6, 2014 | Photo \00a9  Lucy Pringle"; }

figure.image_sous_titre.actualisation_2013.fr::after { content: "Cooks  plantation, Beckhampton - 23 août 2013 | Photo \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2013.es::after { content: "Cooks  plantation, Beckhampton - 23 de agosto del 2013 | Foto \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2013.en::after { content: "Cooks  plantation, Beckhampton - August 23, 2013 | Photo \00a9  Lucy Pringle"; }

figure.image_sous_titre.actualisation_2012.fr::after { content: "Boreham Woods, Wiltshire - 5 juillet 2012 | Photo \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2012.es::after { content: "Boreham Woods, Wiltshire - 5 de julio del 2012 | Foto \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2012.en::after { content: "Boreham Woods, Wiltshire - July 5, 2012 | Photo \00a9  Lucy Pringle"; }

figure.image_sous_titre.actualisation_2011.fr::after { content: "Milk Hill - 11 juillet 2011 | Photo \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2011.es::after { content: "Milk Hill - 11 de julio del 2011 | Foto \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2011.en::after { content: "Milk Hill - July 11, 2011 | Photo \00a9  Lucy Pringle"; }

figure.image_sous_titre.actualisation_2010.fr::after { content: "Roundway Hill - 25 juillet 2010 | Photo \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2010.es::after { content: "Roundway Hill - 25 de julio del 2010 | Foto \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2010.en::after { content: "Roundway Hill - July 25, 2010 | Photo \00a9  Lucy Pringle"; }

figure.image_sous_titre.actualisation_2009.fr::after { content: "Martinsell Hill - 19 juillet 2009 | Photo \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2009.es::after { content: "Martinsell Hill - 19 de julio del 2009 | Foto \00a9  Lucy Pringle"; }
figure.image_sous_titre.actualisation_2009.en::after { content: "Martinsell Hill - July 19, 2009 | Photo \00a9  Lucy Pringle"; }

figure.image_sous_titre.agroglyphes_lorraine.fr::after { content: "Sarraltroff (2008) | Photo \00a9  Arnaud Thiry"; }
figure.image_sous_titre.agroglyphes_lorraine.es::after { content: "Sarraltroff (2008) - 6 de junio del 2014 | Foto \00a9  Arnaud Thiry"; }
figure.image_sous_titre.agroglyphes_lorraine.en::after { content: "Sarraltroff (2008)) - June 6, 2014 | Photo \00a9  Arnaud Thiry"; }

figure.image_sous_titre.programme_exploration_lunaire { 
	background-image: url('../images/illustrations/titre_programme_exploration_lunaire.jpg');
	height: 300px;
	background-position: center 0px;
}

figure.image_sous_titre.etude_chemtrails { 
	background-image: url('../images/illustrations/titre_etude_chemtrails.jpg');
	height: 350px;
	background-position: center -80px;
}

figure.image_sous_titre.enlevement_etres_humains_ovnis { 
	background-image: url('../images/illustrations/titre_enlevement_etres_humains_ovnis.jpg');
	height: 400px;
	background-position: center -10px;
}

figure.image_sous_titre.deni_officiel_ovnis { 
	background-image: url('../images/illustrations/titre_deni_officiel_ovnis.jpg');
	height: 338px;
	background-position: center 0px;
}
	

/*********************************************************/
/* ILLUSTRATION en bas de page... */
/*********************************************************/

.illustration_bas_page {
	width: 980px;
	margin: 35px auto 40px -45px;
	background-color: #DEEDC4;
	background-repeat: no-repeat;
	position: relative;
}

.illustration_bas_page::before,
.illustration_bas_page::after {
	content: "";
	position: absolute;
	left: 0;
	width: 100%; 
	height: 20px;
	z-index: -1;
	background-color: transparent;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.50);
}

.illustration_bas_page::before {
	top: 0;
	border-bottom-left-radius: 200px 20px;
	border-bottom-right-radius: 200px 20px;
}

.illustration_bas_page::after {
	bottom: 0;
	border-top-left-radius: 200px 20px;
	border-top-right-radius: 200px 20px;
}

.illustration_bas_page figure {
	position: relative;
}

.illustration_bas_page figure img {
	display: block;  /* Pour éviter les quelques pixels sous l'image... */
}

.illustration_bas_page figcaption {
	display: block;
	position: absolute;
	height: 35px;
	width: 980px;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.35);
	border-bottom: 1px solid rgba(255, 255, 255, 0.75);
	text-align: center;
	line-height: 35px;
	vertical-align: middle;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0.08em;
	color: rgba(255, 255, 255, 0.95);
	transition: all 1s ease 0s;
	opacity: 0;
}

.illustration_bas_page:hover figcaption {
	opacity: 1;
}


/******************************************************/
/* ILLUSTRATIONS courantes... */
/******************************************************/

figure.type_1 {
	display: inline-block;
	position: relative;
	margin: 10px auto 10px auto;
	line-height: 0;
}

figure.type_1:not(.type_legende_2),
figure.type_1.type_legende_2 img {
	background-color: #DEEDC4;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.25);
}

figure.type_1:not(.type_legende_2):not(.type_pastille_2) {
	overflow: hidden;  /* Pour masquer la légende en ::after lorsqu'elle est en bas... */
}

figure.type_1:not(.type_legende_2).bordure,
figure.type_1.type_legende_2.bordure img {
	border-bottom: 10px solid #96CB41;
}

figure.type_1 figcaption:not(.type_legende_2) {
	display: block;
	position: absolute;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.35);
	vertical-align: middle;
	text-align: center;
	font-size: 13px;
	line-height: 18px;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.90);
	padding: 5px 10px;
	border-top: 1px solid rgba(255, 255, 255, 0.50);
	transition: all 0.5s ease 0s;
	bottom: -100px;
}

figure.type_1 figcaption span.source {
	display: block;
	font-size: 11px;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.50);
}

figure.type_1:hover figcaption:not(.type_legende_2) {
	bottom: 0;
}

figure.type_1 figcaption.type_legende_2 {
	text-align: center;
	font-size: 13px;
	letter-spacing: 0.03em;
	line-height: 36px;
	font-weight: 400;
	color: #AAA;
}

div.images_horizontales figure { vertical-align: top; }

div.images_horizontales.etendu {
	width: 940px;
	position: relative;
	left: -310px;
}

.relative { position: relative; }

div.images_verticales.gauche, figure.gauche { float: left; margin-right: 30px; margin-bottom: 10px; }
div.images_verticales.droite, figure.droite { float: right; margin-left: 30px; margin-bottom: 10px; }
div.images_verticales.centre { display: inline-block; }
figure.type_1.marge,
div.images_verticales.marge {
	position: absolute;
	left: -260px;
	text-align: center;
}
figure.type_1.marge_200, div.images_verticales.marge_200 { left: -200px; }
figure.type_1.marge_210, div.images_verticales.marge_210 { left: -210px; }
figure.type_1.marge_220, div.images_verticales.marge_220 { left: -220px; }
figure.type_1.marge_230, div.images_verticales.marge_230 { left: -230px; }
figure.type_1.marge_240, div.images_verticales.marge_240 { left: -240px; }
figure.type_1.marge_250, div.images_verticales.marge_250 { left: -250px; }
figure.type_1.marge_270, div.images_verticales.marge_270 { left: -270px; }
figure.type_1.marge_280, div.images_verticales.marge_280 { left: -280px; }
figure.type_1.marge_290, div.images_verticales.marge_290 { left: -290px; }
figure.type_1.marge_300, div.images_verticales.marge_300 { left: -300px; }
figure.type_1.marge_310, div.images_verticales.marge_310 { left: -310px; }

div.images_verticales figure:not(:last-child) { margin-bottom: 0; }

div.images_verticales figure:not(:first-child) { margin-top: 0; }
div.images_verticales.espace_20 figure:not(:first-child) { margin-top: 14px; }
div.images_verticales.espace_30 figure:not(:first-child) { margin-top: 24px; }
div.images_verticales.espace_40 figure:not(:first-child) { margin-top: 34px; }

figure.zoom_lightbox {
	position: relative;
}

figure.pastille a::before {
	content: "";
	position: absolute;
	width: 40px;
	height: 40px;
	background-color: #96CB41;
	border-radius: 40px;
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.15);
	text-align: center;
	line-height: 39px;
	padding-left: 2px;
	font-size: 18px;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.90);
  text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.15);
	z-index: 2;
}

figure.pastille.type_pastille_1 a::before {
	top: 10px;
	right: 10px;
}

figure.pastille.type_pastille_2 a::before {
	top: -20px;
	right: -20px;
}

figure.pastille.type_pastille_2 {
	margin-top: 25px;
}

figure.pastille.p1  a::before { content:  "1"; }
figure.pastille.p2  a::before { content:  "2"; }
figure.pastille.p3  a::before { content:  "3"; }
figure.pastille.p4  a::before { content:  "4"; }
figure.pastille.p5  a::before { content:  "5"; }
figure.pastille.p6  a::before { content:  "6"; }
figure.pastille.p7  a::before { content:  "7"; }
figure.pastille.p8  a::before { content:  "8"; }
figure.pastille.p9  a::before { content:  "9"; }
figure.pastille.p10 a::before { content: "10"; }
figure.pastille.p11 a::before { content: "11"; }
figure.pastille.p12 a::before { content: "12"; }
figure.pastille.p13 a::before { content: "13"; }
figure.pastille.p14 a::before { content: "14"; }
figure.pastille.p15 a::before { content: "15"; }
figure.pastille.p16 a::before { content: "16"; }
figure.pastille.p17 a::before { content: "17"; }
figure.pastille.p18 a::before { content: "18"; }
figure.pastille.p19 a::before { content: "19"; }
figure.pastille.p20 a::before { content: "20"; }
figure.pastille.p21 a::before { content: "21"; }
figure.pastille.p22 a::before { content: "22"; }
figure.pastille.p23 a::before { content: "23"; }
figure.pastille.p24 a::before { content: "24"; }
figure.pastille.p25 a::before { content: "25"; }
figure.pastille.p26 a::before { content: "26"; }
figure.pastille.p27 a::before { content: "27"; }
figure.pastille.p28 a::before { content: "28"; }
figure.pastille.p29 a::before { content: "29"; }
figure.pastille.p30 a::before { content: "30"; }
figure.pastille.p31 a::before { content: "31"; }
figure.pastille.p32 a::before { content: "32"; }

figure.zoom_lightbox a::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.15);
	background-image: url('../images/icone_zoom.png');
	background-repeat: no-repeat;
	background-position: bottom -10px right 10px;
	transition: all 0.35s ease 0s;
	opacity: 0;
	z-index: 1;
}

figure.zoom_lightbox.type_legende_1 a::after { background-position: top -10px right 10px; }
figure.zoom_lightbox.type_legende_1.pastille a::after { background-position: top -10px right 60px; }

figure.zoom_lightbox.type_legende_2 a::after { height: calc(100% - 36px); }
figure.zoom_lightbox.type_legende_2.bordure a::after { height: calc(100% - 46px); }

figure.zoom_lightbox a:hover::after { background-position: bottom 10px right 10px; }
figure.zoom_lightbox.type_legende_1 a:hover::after { background-position: top 10px right 10px; }
figure.zoom_lightbox.type_legende_1.pastille a:hover::after { background-position: top 10px right 60px; }

figure.zoom_lightbox a:hover::after {
	opacity: 1;
}

figure > a {
	text-decoration: none;
}


/******************************************************/
/* Petites ILLUSTRATIONS... */
/******************************************************/

span.espace_10  { display: inline-block; width:  10px; }
span.espace_20  { display: inline-block; width:  20px; }
span.espace_30  { display: inline-block; width:  30px; }
span.espace_40  { display: inline-block; width:  40px; }
span.espace_50  { display: inline-block; width:  50px; }
span.espace_60  { display: inline-block; width:  60px; }
span.espace_70  { display: inline-block; width:  70px; }
span.espace_80  { display: inline-block; width:  80px; }
span.espace_90  { display: inline-block; width:  90px; }
span.espace_100 { display: inline-block; width: 100px; }

img.float-left {
	float: left;
	margin-right: 30px;
	margin-bottom: 20px;
}


/*****************************/
/* Vignettes des VIDÉOS... */
/*****************************/

figure.miniature_video {
	margin: 30px auto 40px auto;
	position: relative;
}

figure.miniature_video,
figure.miniature_video img,
figure.miniature_video a::before {
	border-radius: 10px;
}

figure.miniature_video a {
	display: inline-block;
	height: 281px;
	position: relative;
}

figure.miniature_video a::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.10);
	opacity: 0;
	transition: all 0.25s ease 0s;
}

figure.miniature_video a:hover::before {
	opacity: 1;
}

figure.miniature_video a::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('../images/flowplayer_video.png');
}

figure.miniature_video img {
	background-color: #DEEDC4;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25);
}

figure.miniature_video figcaption {
	color: #888;
	font-size: 14px;
	letter-spacing: 0.06em;
	padding-top: 3px;
}

/*****************************/
/* CAROUSELS... */
/*****************************/

.carousel {
	width: 497px;
	height: 120px;
	margin: 5px auto 5px auto;
}

.carousel img {
	border-radius: 2px;
}

.carousel .slick-prev::before, .carousel .slick-next::before {
	color: #96CB41;
	font-size: 24px;
}

.carousel .slick-prev, .carousel .slick-next {
	height: 24px;
	width: 24px;
}

.carousel .slick-prev { left: -31px; }
.carousel .slick-next { right: -26px; }

.carousel .slick-slide {
	width: 166px;
}

.legende_carousel {
	margin-bottom: 15px;
	font-size: 13px;
	color: #BBB;
}

/************************************/
/* Illustrations dans la SIDEBAR... */
/************************************/

aside .sidebar_photo {
	width: 270px;
	margin: 40px 20px 40px auto;
	position: relative;
}

aside.sidebar_photo_02 .sidebar_photo { margin-top: 0; }

aside .sidebar_photo img {
	border-radius: 10px;
	box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.35);
	display: block;  /* Pour éviter les quelques pixels sous l'image... */
}

aside .sidebar_photo figcaption {
	display: block;
	position: absolute;
	height: 35px;
	width: 270px;
	bottom: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.35);
	border-top: 1px solid rgba(255, 255, 255, 0.50);
	text-align: center;
	line-height: 35px;
	vertical-align: middle;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0.08em;
	color: rgba(255, 255, 255, 0.75);
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	transition: all 0.5s ease 0s;
	opacity: 0;
}

aside .sidebar_photo:hover figcaption {
	opacity: 1;
}