/* Loader
----------------------------------*/
#sfx-loader 
{
	display: inline-block;
	max-width: 95%;
	background: transparent image-url("js/notification/black-75.png") repeat;
	border-radius: 12px;
	padding: 20px;
	cursor: pointer;
	z-index: 9990;

	& #sfx-loader-message 
	{
		font: bold 24px Helvetica, Arial, sans-serif;
		color: #FFF;
		text-shadow: 0 -1px 0 rgba(0, 0, 0, .5);
		text-align: center;
		& img
		{
			vertical-align: middle;
		}
		
		& span
		{
			vertical-align: middle;
			//padding-left: 12px;
		}
	}
}

/* Mini Loader
----------------------------------*/
.sfx-mini-loader
{
	/*display : table;
	height : 100%;
	margin : 0 auto;*/
	//position: absolute;
	//top:50%;
	//@include transform (translate(0, -50%));
    display: block;
   // height: 100%;
    left: 50%;
   // margin: 0 auto;
    position: absolute;
    top: 50%;
	@include transform (translate(-50%, -50%));

	& span
	{
		display: table-cell;
		vertical-align: middle;
		width: 32px;
		height: 32px;
		padding:80px 0 0 0;
		background: transparent image-url("js/loader/mini-loader.gif") no-repeat center center;
		text-transform: uppercase;
		color:#5F5F62;
	}    
    //Gestion du cas ou le menu est ouvert ou fermé.
    .menu-open & 
    {
		//taille du menu ouvert - taille du loader + on conserve un padding de 15px gauche et droite
		margin-left: ($menuOpen/2) - $paddingContent;
		@include mq($to: tablet) 
		{
			margin-left:0;	
		}
	}
	.menu-close & 
	{
		//taille du menu fermé - taille du loader + on conserve un padding de 15px gauche et droite
		margin-left: ($menuClose/2) - $paddingContent; 
		@include mq($to : tablet)
		{
			margin-left: 0;
		}
	}
	//558
}


/* Overlay
----------------------------------*/
#sfx-overlay
{
	position: fixed;
	z-index: 1007;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-image: image-url("js/loader/overlay_bg.png");
	background-repeat: repeat;
}


/* loder input
----------------*/

.sf-input--loading
{
	background-image:image-url('js/loader/input-loading.gif');
	background-position: 98% center;
	background-repeat: no-repeat;
}
.sf-input--success
{
	background-image:image-url('js/loader/input-success.png');
	background-position: 98% center;
	background-repeat: no-repeat;
}
.sf-input--error
{
	background-image:image-url('js/loader/input-error.png');
	background-position: 98% center;
	background-repeat: no-repeat;
}

/* loader el
--------------*/

.sf-el--loading
{
	display:inline-block;
	width:16px;
	height:16px;
	vertical-align: middle;	
	background-image:image-url('js/loader/input-loading.gif');
	background-position: 0 0;
	background-repeat: no-repeat;
}
.btn .sf-el--loading
{
	margin-left: 8px;
}