.bloc
{
	position:relative;
	width:100%;
	margin-bottom:1rem;
}

.bloc .bg-one
{
	position:absolute;
	background-color:#000000;
	bottom:0;
	right:0;
	top:4px;
	left:4px;
	opacity:.2;
}


.bloc .bg-two
{
	position:absolute;
	background: white;
	top:0; left:0;
	bottom:4px; right:4px;
}

/** CARTOUCHE LABEL **/
.bloc .label
{
	position:absolute;
	background-color:#e639b7;
	padding-right:.8rem;
	padding-left:.8rem;
	color:#FFFFFF;
	font-family : 'Open Sans',sans-serif; text-transform:uppercase;font-weight: bold;
	font-size:1.4rem;
	top:-2px;
	left:0;
	/*height:3rem;*/
	height:auto;
	line-height:3rem;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width:95%;
}

/** CARTOUCHE TITRE **/
.bloc .title-container
{
	position:absolute;
	top:3rem; /** hauteur du cartouche titre **/
	left:0;
	z-index:11;
	width:100%;
	padding-right:8px; /** deux fois la marge **/
}

/** hauteur par défaut **/
/**.bloc .content {height:20rem;}**/

/** https://css-tricks.com/multi-line-padded-text/ **/
.padded-multiline
{
  	line-height: 160%;
  	padding: 2px 0;
  	width: 100%;
  	margin: 20px auto;
}

.padded-multiline span
{
  	background-color: #FFF;
  	color: #000;
  	display: inline;
  	padding-top: .5rem; /** auteur du fond des lignes **/
  	padding-bottom: .5rem;
  	padding-left:.5rem;
  	padding-right:.5rem;

  	/* Needs prefixing */
  	-webkit-box-decoration-break: clone;
  	box-decoration-break: clone;
}

h4.padded-multiline {line-height:2.5rem;margin:0;padding-top:0;}
h5.padded-multiline {margin-top:0px;margin:0;padding-top:0;}

/** contenu **/
.bloc .content
{
	position:relative;
	padding-bottom:8px;padding-left:4px;padding-right:8px;
}

/** fond du contenu **/
.bloc .content-bg { background-color:#8D8D8D; width:100%; height:100%; position:relative;overflow: hidden; text-align:center;}
/**.bloc .content-bg img {width:200%;height:auto;top:25%;left:25%;transform:translate(-25%,-25%);}**/
.bloc .content-bg img
{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:150%;height:auto;opacity:1;
	-webkit-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out;
}

.bloc .content-bg img:hover
{
	transform: translate(-50%,-50%) scale(1.2);
}


/** centrage de l'image **/
.bloc .img-container {position:relative;text-align:center;width:100%;}
.bloc .img-container img { width:100%;height:auto; }

/** contenu du bloc d'une template SMART PHONE**/
.bloc .content.template
{
	padding-left:2rem;
	padding-right:2rem;
	padding-top:3rem;
	padding-bottom:2rem;
}

/** carte google **/
.bloc .content.template .bloc.map { height:400px; }
.bloc .content.template .page-map { height:100%; }

/** DATE DANS UN BLOC **/
/*.bloc .date { position:absolute; bottom:4px; right:4px;}
.bloc .date ul {list-style: none; padding:0; margin:0; width:100%;}
.bloc .date li {float:right; display:inline-block; margin-left:10px; width:70px; height:75px; background-color:#FFFFFF;}
.bloc .date span {display:block; text-align:center; width:100%; padding:0;}*/

.date { position:absolute; bottom:4px; right:4px;}
.date ul {list-style: none; padding:0; margin:0; width:100%;}
.date li {float:right; display:inline-block; margin-left:10px; width:70px; height:75px; background-color:#FFFFFF;}
.date span {display:block; text-align:center; width:100%; padding:0;}



span.jour {font-family:'Zilla Slab'; font-size:3rem; margin-top:10px; line-height:2.8rem; margin-bottom:10px; font-weight:bold;margin-bottom:1rem;margin-top:0;}
span.annee {font-family:'Open Sans'; font-size:1.2rem; color:#999999; font-weight:bold; line-height:1.2rem;}
span.mois {font-family:'Open Sans'; font-size:1rem; line-height:1.2rem; margin-bottom:5px;}


/******* BLOC SHARE *********/
.bloc.share { /*height:70px;*/}
.bloc.share span.label {left:0;}
.bloc.share .content { padding-right:2rem;padding-left:2rem;padding-top:4rem;padding-bottom:2rem;}
.bloc.share ul {list-style:none; margin:0; padding:0; display:block;position:relative;}
.bloc.share li {display:inline-block;margin-right:1rem;}

/******* PAGE CHILDREN THUMBNAIL ***/
.bloc.page_chidren .content { padding-left:0; padding-bottom:4px;padding-right:4px;} /** on supprime les marges pour la photo **/

/** ne fonctionne pas **/
.bloc.page_children .img-container {max-height:80px;overflow:hidden;}
.bloc.page_children .img-container .img {width:200%;transform:translate(-50%,-50%);top:50%;left:50%;}



.bloc.thumbnail .content { padding-left:0; padding-bottom:4px;padding-right:4px;min-height:90px;}

/** BLOC MEME THEME BLOC **/
.bloc.theme .content { padding-top:4rem; padding-left:2rem; padding-right:2rem; padding-bottom:2rem;}
.bloc.theme ul {margin:0;list-style: none; padding:0;}
.bloc.theme ul li {border-bottom-style:solid;border-bottom-color:#EEEEEE;border-bottom-width:1px;padding-top:.5rem;padding-bottom:.5rem;}
.bloc.theme ul li:last-child {border-style: none;}

/** PHOTO - TEMPLATE **/
.bloc.page-image .content { padding-left:0; padding-bottom:4px;padding-right:4px;} /** on supprime les marge pour la photo **/
.bloc.page-image .content img {width:100%;display:block;}
.bloc.page-image .copyright { position:absolute;top:0px;left:0px;background-color:#FFFFFF; height:2.5rem;line-height:2.5rem; padding-left:.5rem; padding-right:.5rem;font-size:1rem;}

.bloc.page-image.active a:hover .bg-one {background-color:#FF0000;opacity:1;}
.bloc.page-image .bg-one {transition: all 1s ease-in-out;}


/** PERSONNE - TEMPLATE **/


/** BLOC DOWNLOAD **/
.bloc.download .content {min-height:150px;}

/** BLOC PERSONNE LINK **/
.bloc.personne_links .content { padding-top:4rem; padding-left:2rem; padding-right:2rem;padding-bottom:2rem;}
.bloc.personne_links .content p { word-wrap: break-word; }

/** BLOC FILM **/

.bloc.film .content
{
	height:200px;overflow:hidden;margin-right:8px;padding-right:0;
	position:static; /** aligne correctement la date éventuelle **/
}





.bloc.film span.sortie {text-transform:none;font-size:1.1rem;}
.bloc.film span.jour {margin-bottom:0;line-height:2.5rem;}



/** BLOC ARTICLE **/
.bloc.article .content {height:200px;overflow:hidden;margin-right:0px;}
/*.bloc.article .content img {height:100%;display:block;position:absolute;}*/

.bloc.article .content span.auteur {position:absolute;bottom:4px;right:0;background-color:#FFFFFF;padding-left:.4rem;display:inline-block;font-size:1.6rem; font-family:'Zilla Slab',serif;}


/** BLOC PAGE SMART PHONE **/
.bloc.page .content {height:200px;overflow:hidden;margin-right:8px;padding-right:0;}
.bloc.page .content img {height:100%;display:block;}
.bloc.page .content ul.tags {position:absolute; bottom:0; left:0; list-style: none;margin:0;padding:1rem;}
.bloc.page .content ul.tags li {float:left; margin-right:.5rem;}
.bloc.page .content ul.tags li a {color:#FFFFFF;}


/** BLOC STRUCTURE **/
.bloc.structure .content
{
	overflow:hidden;padding-top:4rem;position:relative;
	padding-right:2rem;padding-left:2rem;padding-bottom:0rem; /** padding-bottom ?? **/
}
.bloc.structure .content img {width:100%;padding-bottom:2rem;max-width:150px;height:auto;}
.bloc.structure .content p {margin:0;}
.bloc.structure .content p.nom {font-size:1.4rem;font-weight:bold;text-align:left;}
.bloc.structure .content p.adresse {font-size:1.2rem;}
.bloc.structure .content p.telephone {font-size:1.2rem;}
.bloc.structure .content p.email a {font-size:1.2rem;}

.bloc.vod .content {overflow:hidden;padding-top:4rem;position:relative;padding-right:2rem;padding-left:2rem;padding-bottom:2rem;}
.bloc.vod .content img {width:100%;padding-bottom:1rem;max-width:150px;height:auto;margin:auto;}
.bloc.vod .content a {display:block;}

/** BLOC PERSONNE **/
.bloc.personne .content { padding-top:3rem;position:relative; padding-bottom:2rem;}
.bloc.personne .content .avatar { width:100px;height:100px;margin-top:1rem;margin-bottom:.5rem;}
.bloc.personne .content p.nom {margin:0;text-align:center;}
.bloc.personne .content p.profession {font-size:1.4rem;}

/** BLOC EVENT **/
.bloc.event {overflow:hidden;margin-right:8px;min-height:200px;}
.bloc.event .content {min-height:20rem;width:100%;height:100%; height:2rem;}
.bloc.event img {margin:auto;}
.bloc.event .bg-content { background-color:#CCCCCC;}

/** BLOC PHOTO **/
.bloc.photo .content {height:200px;overflow:hidden;margin-right:0; text-align:center;}
.bloc.photo .content img {margin:auto;}

/** BLOC VIDEO **/
/*.bloc.video .content {overflow:hidden;margin-right:8px; text-align:center;}*/
/*.bloc.video .content img {height:100%;margin:auto;}*/
.bloc.video .play-icon {position:absolute;bottom:0px;right:-4px;height:5rem;width:5rem;background-color:#FFFFFF;}
.bloc.video .play-icon svg {width:auto;height:2.5rem;top:1.25rem;}
.bloc.video .svg-container {position: absolute; top: 50%;transform: translate(-50%,-50%);left:50%;}

/** BLOC EMBED **/
/*.bloc.embed {max-width:640px;}*/
.bloc.embed .content {min-height:120px;width:100%;}
.bloc.embed .play-icon {position:absolute;bottom:0px;right:-4px;height:5rem;width:5rem;background-color:#FFFFFF;}
.bloc.embed .play-icon svg {width:auto;height:2.5rem;top:1.25rem;}
.bloc.embed .svg-container {position: absolute; top: 50%;transform: translate(-50%,-50%);left:50%;}
.bloc.embed .content a {display:block;width:100%;height:100%;}
.bloc.embed .content-bg {height:180px;}

.line .bloc.embed .content-bg {height:100%;}

/** BLOC FILM_HEADER **/
.bloc.film_header .content { padding-left:2rem; padding-right:2rem;} /** pour que l'affiche soit alignée à la grille **/
.bloc.film_header .col-9 { padding-left:0rem; padding-top:4rem;}

/** BLOC DEPLIANT ACID **/
.bloc.depliant .content img {width:100%;height:auto;min-height:100px;display:block;}
.bloc.depliant .content {min-height:100px;}

/** BLOC FILM TEMPLATE **/
.bloc.film-accueil { padding-left:4rem; padding-right:4rem; padding-top:4rem; padding-bottom:2rem;}
.bloc.film-accueil .col-2-9 { padding-left:2rem; }
.bloc.film-info { padding-left:2rem; padding-right:2rem; padding-top:4rem; padding-bottom:2rem;}
.bloc.film-medias { padding-left:2rem; padding-right:2rem; padding-top:4rem; padding-bottom:2rem;}


/** BLOC SOCIAL **/
.bloc.social {height:570px;}
.bloc.social .content {padding-top:5rem;padding-left:2rem;padding-bottom:2rem;padding-right:2rem;}
.bloc.social .twitter-container
{
	overflow-x:hidden;
	overflow-y:scroll;
	height:500px; /** POURRAIT ETRE AUTOMATIQUE **/
	position:relative;
	padding-bottom:4rem;
	max-width:340px;
}

/** INSTAGRAM **/

#instagram .content {padding-bottom:6rem;}
#instagram .instagram-user {margin-bottom:1rem;}
#instagram .instagram-item-container
{
	overflow-x:hidden;overflow-y:scroll;
	height:100%;width:100%;max-width:340px;
}
#instagram .instagram-item
{
	width:100%;
	border-bottom-style:solid;border-bottom-color:#CCCCCC;border-bottom-width:1px;
	font-size:1.4rem;
	padding-bottom:2rem;
	margin-bottom:2rem;
	position:relative;
}

#instagram .instagram-item:last-child {border-style: none;}
.instagram-item .img-container {position:relative;width:100%;margin-bottom:1rem;}
.instagram-item .img-container img {display:block;padding-right:4px;padding-bottom:4px;top:0;left:0;}

/** BLOC LIEN **/
.bloc.link {margin-top:0rem;} /** il y a un style .link dans acid-film.css **/
.bloc.link .content {padding-top:0;margin-top:0;position:relative;min-height:100px;}
.bloc.link .img-container {overflow:hidden;width:100%;height:100%;margin:0;/*max-width:25rem;*/} /** max width pourquoi ? **/
.bloc.link .content a {margin:0;}
/*.bloc.link .content .content-bg {height:180px;} - 20171104*/
.bloc.link .content .content-bg {height:100%;min-height:180px;}

/** BLOC CATEGORIES **/
.bloc.categories .content { padding-top:4rem; padding-left:2rem; padding-right:2rem; padding-bottom:2rem;}
.bloc.categories ul {list-style:none;margin:0;padding:0;}
.bloc.categories ul li
{
	border-bottom-style:solid; border-bottom-color:#CCCCCC; border-bottom-width: 1px;
	display:block;
	padding-top:1rem;padding-bottom:1rem;
	line-height:1.2rem;
}

.bloc.categories ul li:last-child {border-style:none;}

/** BLOC LIBRE **/
.bloc.libre .text-libre {padding-left:2rem;padding-right:2rem;font-size:1.4rem;}
.bloc.libre .text-libre ul {margin-left:2rem;margin-top:1rem;margin-bottom:1rem;padding:0;}

/** TEMPLATE LINE **/
.page-line .page-image-container { padding-right:0;margin-top:.5rem; margin-bottom:0;} /* margin pour alignement sur un p */
.page-line .bloc.page-image {width:100%;max-width:100%;}
.page-line .page-texte p {margin:0;}




/*************************************************/
/*** DESKTOP
/*************************************************/

@media only screen and (min-width: 1024px)
{
	/** BLOC LIEN 1024 **/
	.bloc.link h5 {opacity:0;} /** pour effet de rollover **/

	/** BLOC EMBED 1024 **/
	.bloc.embed .title-container {opacity:0;} /** pour effet de rollover **/

	/** PAGE FILM **/
	.bloc.film_header .content { padding:0; } /** pour que l'affiche soit alignée à la grille **/
	.bloc.film_header .col-9 { padding-left:4rem; padding-top:2rem;}

	/** contenu du bloc d'une template 1024 **/
	.bloc .content.template
	{
		padding-left:4rem;
		padding-right:4rem;
		padding-top:5rem;
		padding-bottom:3rem;
	}

	/** largeur des images dans un bloc template **/
	.bloc.page-image {max-width:70%;}

}

@media only screen and (min-width:768px AND max-width: 1023px)
{
	.bloc.page-image {max-width:70%;}
	.bloc.film_header .col.col-3 { margin-left:0; }
}

@media only screen and (max-width: 767px)
{
	.bloc.page-image {max-width:none;}
	.bloc.film_header .col.col-3 { margin-left:0; }
	.bloc.film-accueil { padding-left:2rem; padding-right:2rem; padding-top:4rem; padding-bottom:2rem;}
	.bloc.film-accueil h2 {margin-bottom:2rem;}

	/** **/
	.page-line .page-texte {margin-bottom:1rem;}


}