/*
 * wswsCarouselImgImg - http://www.websky.fr
 * 
 * Créer un wsCarouselImg "light" facilement !
 *
 * Copyright (c) 2012 RICHARD Florian (http://www.websky.fr)
 * Licence Creative Commons Attribution - Pas d’Utilisation commercial 3.0 non transposé
 * http://creativecommons.org/licenses/by-nc/3.0/deed.fr
 *
 * Date: 2014-04-16
 *
 */

.wsCarouselImg
{
	position: relative;
	height:600px;
	width:100%;
}
.wsCarouselImg.useImgOnly
{
	height:auto;
}
.wsCarouselImg .hide
{
	visibility:hidden!important;
	opacity:0!important;
	filter:alpha(opacity=0)!important;
}
.wsCarouselImg > .thisImg
{
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	right:0;
	opacity:1;
	filter:alpha(opacity=100);
    -webkit-transition: opacity 2s ease 0s, filter 2s ease 0s, visibility 2s ease 0s;
    -moz-transition: opacity 2s ease 0s, filter 2s ease 0s, visibility 2s ease 0s;
    -o-transition: opacity 2s ease 0s, filter 2s ease 0s, visibility 2s ease 0s;
    transition: opacity 2s ease 0s, filter 2s ease 0s, visibility 2s ease 0s;
	background-position: center center;
    background-size: cover;
	visibility:visible;
}
.wsCarouselImg.useImgOnly > .thisImg
{
	position:relative;
	background-image:none!important;
}
.wsCarouselImg.useImgOnly > .thisImg.hide
{
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	right:0;
}
.wsCarouselImg > .thisImg > img
{
	width:100%;
	display:block;
	visibility:hidden;
	opacity:0;
	filter:alpha(opacity=0);
}
.wsCarouselImg.useImgOnly > .thisImg > img
{
	visibility:visible;
	opacity:1;
	filter:alpha(opacity=100);
}
.wsCarouselImg > .carouselBtn > div:before
{
	font-family: FontAwesome;
	color:#fff;
    -webkit-transition: color 0.6s ease 0s;
    -moz-transition: color 0.6s ease 0s;
    -o-transition: color 0.6s ease 0s;
    transition: color 0.6s ease 0s;
	vertical-align:middle;
}
.wsCarouselImg > .carouselBtn > div:hover:before
{
	color:#ccc;
}
.wsCarouselImg > .carouselBtn > .btnLeft
{
	position:absolute;
	top:50%;
	margin-top:-25px;
	left:10px;
	z-index:2;
	cursor:pointer;
	line-height:20px;
}
.wsCarouselImg > .carouselBtn > .btnLeft:before
{
	content: "\f104";
	font-size:50px;
}
.wsCarouselImg > .carouselBtn > .btnRight
{
	position:absolute;
	top:50%;
	margin-top:-25px;
	right:10px;
	z-index:2;
	cursor:pointer;
	line-height:20px;
}
.wsCarouselImg > .carouselBtn > .btnRight:before
{
	content: "\f105";
	font-size:50px;
}
.wsCarouselImg > .carouselBtn > .btnPlay
{
	position:absolute;
	bottom:10px;
	left:10px;
	z-index:2;
	cursor:pointer;
	line-height:20px;
}
.wsCarouselImg > .carouselBtn > .btnPlay:before
{
	content: "\f04b";
	font-size:20px;
}
.wsCarouselImg > .carouselBtn > .btnPause
{
	position:absolute;
	bottom:10px;
	left:10px;
	z-index:2;
	cursor:pointer;
	line-height:20px;
}
.wsCarouselImg > .carouselBtn > .btnPause:before
{
	content: "\f04c";
	font-size:20px;
}
.wsCarouselImg > .carouselNav
{
	position:absolute;
	bottom:10px;
	height:15px;
	width:100%;
	text-align:center;
	z-index:1;
}
.wsCarouselImg > .carouselNav > div
{
	height:12px;
	width:12px;
	-webkit-border-radius: 24px;
	-moz-border-radius: 24px;
	border-radius: 24px;
	background:#fff;
	display:inline-block;
    margin: 0 8px;
	cursor:pointer;
    -webkit-transition: opacity 0.6s ease 0s, filter 0.6s ease 0s;
    -moz-transition: opacity 0.6s ease 0s, filter 0.6s ease 0s;
    -o-transition: opacity 0.6s ease 0s, filter 0.6s ease 0s;
    transition: opacity 0.6s ease 0s, filter 0.6s ease 0s;
	opacity:0.4;
	filter:alpha(opacity=40);
}
.wsCarouselImg > .carouselNav > div:hover, .wsCarouselImg > .carouselNav > div.active
{
	opacity:1;
	filter:alpha(opacity=100);
}