/**
* Slider classes
*
* @date 	26/04/2013
* @author splitfire - http://splitfire.fr
* @version 1.0
*http://symmetrycode.com/full-page-slider-html5-css3-js/
*
*/ 



.slider
{
	position:relative;
	overflow:hidden;
	
	#slider
	{
		display: none; // préchargement
		position: relative;
		background-color: #fff;
		@include box-shadow(0px 1px 5px rgba(0, 0, 0, 0.9));
	
		& > div
		{
			position: relative;
		}
	}
	// bouton "en savoir plus"
	#slider_btn
	{
		display: none; // préchargement
		position: absolute;
		top: 320px;
		left: 40px;
		z-index: 999; 
	}
	// navigation du slider (droite / gauche)
	.slidesjs-navigation
	{
		position: absolute;
		bottom: 22px;
		left: 40px;
		z-index: 999;	
		width: 0px;
		height: 0px;
		@include hide-text();
		-moz-transform: scale(.9999); // hack firefox for antialiasing

		&.slidesjs-previous
		{
			left: 40px;
			border-top: 8px solid rgba(255,0,0,0);
		    border-right: 14px solid white;
		    border-bottom: 8px solid rgba(255,0,0,0);
		    
		    &:hover
		    {
			    border-right-color: $toolbarActionColor;
		    }
		}
		&.slidesjs-next
		{
			left: 68px;
			border-top: 8px solid rgba(255,0,0,0);
		    border-left: 14px solid white;
		    border-bottom: 8px solid rgba(255,0,0,0);
		    
		    &:hover
		    {
			    border-left-color: $toolbarActionColor;
		    }
		}
	}
	// pagination du slider (puce)
	.slidesjs-pagination
	{
		position: absolute;
		bottom: 22px;
		left: 100px;
		//left: 40px; // sans navigation
		margin: 0;
		padding: 0;
		list-style: none;
		z-index: 999;
		
		& .slidesjs-pagination-item
		{
			float: left;
			margin-right: 16px;
			
			& a
			{
				display: block;
				width: 16px;
				height: 16px;
				background-color: white;
				@include hide-text();
				border-radius:50%;
			}
			& a.active, 
			& a:hover
			{
				background-color: $toolbarActionColor;
			}
		}
	}
	// Text du slider
	& .slider--text
	{
		position: absolute;
		left:40px;
		width:600px;
		
		& h2
		{
			color:white !important;
			text-shadow: 0 1px 2px #2C2C2C;
			font-size:3.2em; //50px
			font-weight:bold;
			margin: 37px 0; 
			white-space: nowrap;
			line-height: 1.1em;
		}
		& p
		{
			color:white; 
			text-shadow: 0 1px 2px #2C2C2C;
			font-size: 2em;  //25px
			margin-bottom: 0;
			white-space: nowrap;
			line-height: 1.2em;
		}	
	}
	& img
	{
		width: 100%;
	}
	@include mq($to:phone) { display: none; } 
}