/* CSS Document */

/************************************************
 * Composant VC : image roll
 ************************************************/

.KVC_composant_imageROll {background: no-repeat center center; background-size:cover; position:relative; display:block;}
.KVC_composant_imageROll .zoneTexte {z-index:10; position:absolute; text-align:left; bottom:10px; left:10px; color:#FFF;}
.KVC_composant_imageROll .imageRoll {z-index:5; width:100%; height:100%; position:absolute;background: no-repeat center center; background-size:cover;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -ms-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
  opacity:0;

}
.KVC_composant_imageROll:hover .imageRoll {opacity:1;}
.KVC_composant_imageROll .zoneTexte h2 {font-size:13px; font-weight:bold;}
.KVC_composant_imageROll .zoneTexte h4 {font-size:10px; font-weight:bold;}



/* **************************************
 * COMPOSANT KEBLOW VC :
 * type : générique 
 * nom : UIBT 
 * desc : 	bouton encadré, choix de la 
 *			couleur globale et roll
 ****************************************/ 
.KVC_composant.UIBT {display:inline-block;}
.KVC_composant.UIBT a {
	display:inline-block;
	font-size:20px; 
	font-weight:bold; 
	padding:10px 15px; 
	border:3px solid ; 
	border-color:#000;
	color:#000;
	text-align:center;
	
	transition: 200ms easeOut;	
	-webkit-transition: 200ms ease-out;
	transition-property:all;
	-webkit-transition-property:all;
}

.KVC_composant.UIBT a:after {
	content:"\2192";
	margin-left: 10px;
}
.KVC_composant.UIBT a.sml {
	padding:5px 12px; 
	border:2px solid ; 
	font-size:14px;
}
.KVC_composant.UIBT a.sml:after {
	font-size:15px;
}

.KVC_composant.UIBT a:hover {background-color:#000; color:#FFF;}




/***************************************** 
 * SLIDESHOW
 *****************************************/
.ksc-container-slideshow {
	width: 100%;
	overflow: hidden;
	position:relative;
}
.ksc-container-slideshow .ruban {
	position:absolute;
	height:100%;
}
.ksc-slide {
	height:100%;
	float:left;
	background:no-repeat center center;
	background-size:cover;
	position:relative;
}
.ksc-slide .contslide {
	display:table;
	width:100%;
	height:100%;
	margin:0 auto;
}

.ksc-slide .contslide .contalign{
	display:table-cell;
	color: #ffffff;
	text-align: center;
	text-shadow: 0 0 10px rgba(0,0,0, 0.3);
}


/* **************************************
 * COMPOSANT KEBLOW VC :
 * type : générique 
 * nom : multi-share 
 * desc : partages
 ****************************************/ 					

.KVC_composant.multi-share {
	text-align:right;
}
.KVC_composant.multi-share .wrap-share {
	width:auto;
	height:30px;
	overflow:hidden;
	position:relative;
	display:inline-block;
}

.KVC_composant.multi-share .wrap-share a {
	display:block;
	float:left;
	width:65px;
	height:100%;
	box-sizing:border-box;
	border-left:1px solid #B4B4B4;
	background: no-repeat center center; 
	background-size:auto 20px;
	text-indent:10000px;
}

.KVC_composant.multi-share .wrap-share a.tw {background-image:url(share-pictos/UI-twitter.svg);}
.KVC_composant.multi-share .wrap-share a.in {background-image:url(share-pictos/UI-linkedin.svg);}
.KVC_composant.multi-share .wrap-share a.ml {background-image:url(share-pictos/UI-mailto.svg);}
.KVC_composant.multi-share .wrap-share a.fb {background-image:url(share-pictos/UI-facebook.svg);}

.KVC_composant.multi-share .wrap-share a:last-child {border-right:1px solid #B4B4B4;}


/***************************************** 
 * TWITTER
 *****************************************/

.tweet {
	display:block;
	width:30%;
	margin:0 1.66%;
	float:left;
	background-color:rgba(66, 97, 95, 0.8);
	text-align:left;
	padding:35px;
	box-sizing:border-box;
	color:#fff;
}
.tweet span {
	display:inline-block;
}
.tweet span:first-child {
	background-color:#fa6545;
	padding:5px 10px;
	margin-bottom:15px;	
}

@media only screen and (max-width: 767px) {
	.tweet {
		display:block;
		width:90%;
		float:none;
		padding:35px;
		margin:20px 5%;
	}
}