/**
* Company classes
*
* @author splitfire - http://splitfire.fr
* @version 1.0
*
*
* Module qui présente les compagnies
*
*/

//Container d'une compagnie
.company
{
	position: relative;
	display: inline-block;
	width: 150px;
	//overflow: hidden;
	border: solid 2px #CCCCCC;
	margin-right: 10px;
	margin-bottom: 10px;
	&:after
	{
		content: "";
		position: absolute;
		display: block;
		top:0;
		right:0;
		border-bottom: 60px solid transparent;
		border-left:  solid transparent;
		z-index: 2;
	}
}
//Le triangle haut/droit s'affiche en $dangerColor quand la compagnie n'est pas activée
.company_excluded:after
{
	border-right: 60px solid rgba($dangerColor, .85);
} 
//Le triangle haut/droit s'affiche en $successColor quand la compagnie est activée
.company_included:after
{
	border-right: 60px solid rgba($successColor, .85);
}



//Lien pour aciver/desactiver une compagnie
.company_action
{	
	display: block;
	position: relative;
	//Icone qui represente l'état de la compagnie : activer/Desactivé
	& .company_state
	{
		position:absolute;
		right: 3px;
		top: 16px;
		z-index: 5;	
		color: #fff;
		@include opacity(1);
	}
	& .company_action--state
	{
		display: none;
	}
	//Au hover sur le lien on affiche un aplat afin de préciser ce qu'on va faire.
	&:hover 
	{	
		& .company_action--state
		{
			position: absolute;
			display:table;
			width: 100%;
			height: 150px;
			top:0;
			left: 0;
			background-color: rgba(0,0,0,.85);
			color: #fff;
			z-index: 6;
		}
	}
	& .company_action--state_label
	{
		display: table-cell;
		vertical-align: middle;
		line-height: normal;
		& [class*="icon-"]
		{
			color: #fff;
			//@include px2em($px: $fontSize * 3, $base-font-size:$base-font-size, $em : true, $rem: true, $percent: false, $property : width) ; 
			//@include px2em($px: $fontSize * 3, $base-font-size:$base-font-size, $em : true, $rem: true, $percent: false, $property : height) ; 
			//@include px2em($px: $fontSize * 3, $base-font-size:$base-font-size, $em : true, $rem: true, $percent: false, $property : font-size) ;
			@include rem((
				width		:$fontSize * 3,
				height		:$fontSize * 3,
				font-size	:$fontSize * 3
			));
		}
	}
}

//Container du logo
.company_logo
{
	height: 150px;
	line-height: 150px;
	text-align: center;
	&  img
	{
		max-width: 100%;
		max-height: 100%;
		vertical-align: middle;
	}
}
//Footer d'info de la compagnie
.company_infos
{
	max-width: 100%;
	height: 35px;
	line-height: 35px;
	background-color: #F3F3F3;
	text-align: center;
	color: #000;
	word-break: break-word;
}