
.demo-2 .sl-slider-wrapper {
	width: 1080px;
	height: 510px;
	overflow: hidden;
	position: relative;
	}

.demo-2 .sl-slider h2,
.demo-2 .sl-slider blockquote {
	padding: 120px 10px 10px 10px;
	width: 80%;
	color: #fff;
	text-align:left;
	margin: 0 auto;
	position: relative;
	z-index: 100;
	}
.demo-2 .sl-slider blockquote {
	font-size: 22px;
	font-family: "futura-pt-n4", "futura-pt",sans-serif;
	font-weight: 400;
	padding: 10px;
	text-shadow:#000 2px 2px 2px;
	margin-top:-30px;
	}
.demo-2 .sl-slider blockquote p{
	background-color:rgba(0, 0, 0, 0.5);
	padding: 20px;
	}
.demo-2 .sl-slider blockquote cite {
	font-family: "futura-pt-n4", "futura-pt",sans-serif;
	font-size: 27px;
	font-weight:400;
	font-style: italic;
	display: inline-block;
}
a {
	color:#fff;
	text-decoration: underline;
	}
a:hover{
	color: #d50034;
	} 
.demo-2 .bg-img {
	padding: 200px;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	position: absolute;
	top: -200px;
	left: -200px;
	width: 100%;
	height: 100%;
	background-position: center center;
	background-repeat: no-repeat;	}


/* Custom navigation dots */
.menu {
	width:230px;
	height:510px;
	}
.nav-dots {
    height: 510px;
    left: 0;
    position: absolute;
    top: 0;
    width: 230px;
    z-index: 100;
}
.nav-dots span {
	display: block;
	position:relative;
	width: 230px;
	height: 102px;
	cursor: pointer;
	}

.demo-2 .nav-dots span {
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-ms-transition: all 0.2s;
	-o-transition: all 0.2s;
	transition: all 0.2s;
}
.demo-2 .nav-dots span.boutons-1, 
.demo-2 .nav-dots span.boutons-1:link {
	background: url(../images/passion-bois-menu-mazot.jpg) no-repeat top left;
	}

.demo-2 .nav-dots span.boutons-1:hover {
	background: url(../images/passion-bois-menu-mazot.jpg) bottom left;
}

.demo-2 .nav-dots span.boutons-2,
.demo-2 .nav-dots span.boutons-2:link {
	background: url(../images/passion-bois-menu-amenage.jpg) top left;
}

.demo-2 .nav-dots span.boutons-2:hover {
	background: url(../images/passion-bois-menu-amenage.jpg) bottom left;
}
.demo-2 .nav-dots span.boutons-3,
.demo-2 .nav-dots span.boutons-3:link {
	background: url(../images/passion-bois-menu-engag.jpg) top left;
}

.demo-2 .nav-dots span.boutons-3:hover {
	background: url(../images/passion-bois-menu-engag.jpg) bottom left;
}
.demo-2 .nav-dots span.boutons-4,
.demo-2 .nav-dots span.boutons-4:link {
	background: url(../images/passion-bois-menu-actu.jpg) top left;
}

.demo-2 .nav-dots span.boutons-4:hover {
	background: url(../images/passion-bois-menu-actu.jpg) bottom left;
}
.demo-2 .nav-dots span.boutons-5,
.demo-2 .nav-dots span.boutons-5:link {
	background: url(../images/passion-bois-menu-contact.jpg) top left;
}

.demo-2 .nav-dots span.boutons-5:hover {
	background: url(../images/passion-bois-menu-contact.jpg) bottom left;
}
/* Content elements */

.demo-2 .bg-img-1 {
	background-image: url(../images/mazots-gites.jpg);
	}
.demo-2 .bg-img-2 {
	background-image: url(../images/amenagement-interieur.jpg);
	}
.demo-2 .bg-img-3 {
	background-image: url(../images/engagement.jpg);
	}
.demo-2 .bg-img-4 {
	background-image: url(../images/actualite.jpg);
	}
.demo-2 .bg-img-5 {
	background-image: url(../images/contact.jpg);
	}

/* Animations for content elements */

.sl-trans-elems .deco{
	-webkit-animation: roll 1s ease-out both, fadeIn 1s ease-out both;
	-moz-animation: roll 1s ease-out both, fadeIn 1s ease-out both;
	-o-animation: roll 1s ease-out both, fadeIn 1s ease-out both;
	-ms-animation: roll 1s ease-out both, fadeIn 1s ease-out both;
	animation: roll 1s ease-out both, fadeIn 1s ease-out both;
	}
.sl-trans-elems h2{
	-webkit-animation: moveUp 1s ease-in-out both;
	-moz-animation: moveUp 1s ease-in-out both;
	-o-animation: moveUp 1s ease-in-out both;
	-ms-animation: moveUp 1s ease-in-out both;
	animation: moveUp 1s ease-in-out both;
	}
.sl-trans-elems blockquote{
	-webkit-animation: fadeIn 0.5s linear 0.5s both;
	-moz-animation: fadeIn 0.5s linear 0.5s both;
	-o-animation: fadeIn 0.5s linear 0.5s both;
	-ms-animation: fadeIn 0.5s linear 0.5s both;
	animation: fadeIn 0.5s linear 0.5s both;
	}
.sl-trans-back-elems .deco{
	-webkit-animation: scaleDown 1s ease-in-out both;
	-moz-animation: scaleDown 1s ease-in-out both;
	-o-animation: scaleDown 1s ease-in-out both;
	-ms-animation: scaleDown 1s ease-in-out both;
	animation: scaleDown 1s ease-in-out both;
	}
.sl-trans-back-elems h2{
	-webkit-animation: fadeOut 1s ease-in-out both;
	-moz-animation: fadeOut 1s ease-in-out both;
	-o-animation: fadeOut 1s ease-in-out both;
	-ms-animation: fadeOut 1s ease-in-out both;
	animation: fadeOut 1s ease-in-out both;
	}
.sl-trans-back-elems blockquote{
	-webkit-animation: fadeOut 1s linear both;
	-moz-animation: fadeOut 1s linear both;
	-o-animation: fadeOut 1s linear both;
	-ms-animation: fadeOut 1s linear both;
	animation: fadeOut 1s linear both;
	}
@-webkit-keyframes roll{
	0% {-webkit-transform: translateX(500px) rotate(360deg);}
	100% {-webkit-transform: translateX(0px) rotate(0deg);}
}
@-moz-keyframes roll{
	0% {-moz-transform: translateX(500px) rotate(360deg); opacity: 0;}
	100% {-moz-transform: translateX(0px) rotate(0deg); opacity: 1;}
}
@-o-keyframes roll{
	0% {-o-transform: translateX(500px) rotate(360deg); opacity: 0;}
	100% {-o-transform: translateX(0px) rotate(0deg); opacity: 1;}
}
@-ms-keyframes roll{
	0% {-ms-transform: translateX(500px) rotate(360deg); opacity: 0;}
	100% {-ms-transform: translateX(0px) rotate(0deg); opacity: 1;}
}
@keyframes roll{
	0% {transform: translateX(500px) rotate(360deg); opacity: 0;}
	100% {transform: translateX(0px) rotate(0deg); opacity: 1;}
}
@-webkit-keyframes moveUp{
	0% {-webkit-transform: translateY(40px);}
	100% {-webkit-transform: translateY(0px);}
}
@-moz-keyframes moveUp{
	0% {-moz-transform: translateY(40px);}
	100% {-moz-transform: translateY(0px);}
}
@-o-keyframes moveUp{
	0% {-o-transform: translateY(40px);}
	100% {-o-transform: translateY(0px);}
}
@-ms-keyframes moveUp{
	0% {-ms-transform: translateY(40px);}
	100% {-ms-transform: translateY(0px);}
}
@keyframes moveUp{
	0% {transform: translateY(40px);}
	100% {transform: translateY(0px);}
}
@-webkit-keyframes fadeIn{
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-moz-keyframes fadeIn{
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-o-keyframes fadeIn{
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-ms-keyframes fadeIn{
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes fadeIn{
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-webkit-keyframes scaleDown{
	0% {-webkit-transform: scale(1);}
	100% {-webkit-transform: scale(0.5);}
}
@-moz-keyframes scaleDown{
	0% {-moz-transform: scale(1);}
	100% {-moz-transform: scale(0.5);}
}
@-o-keyframes scaleDown{
	0% {-o-transform: scale(1);}
	100% {-o-transform: scale(0.5);}
}
@-ms-keyframes scaleDown{
	0% {-ms-transform: scale(1);}
	100% {-ms-transform: scale(0.5);}
}
@keyframes scaleDown{
	0% {transform: scale(1);}
	100% {transform: scale(0.5);}
}
@-webkit-keyframes fadeOut{
	0% {opacity: 1;}
	100% {opacity: 0;}
}
@-moz-keyframes fadeOut{
	0% {opacity: 1;}
	100% {opacity: 0;}
}
@-o-keyframes fadeOut{
	0% {opacity: 1;}
	100% {opacity: 0;}
}
@-ms-keyframes fadeOut{
	0% {opacity: 1;}
	100% {opacity: 0;}
}
@keyframes fadeOut{
	0% {opacity: 1;}
	100% {opacity: 0;}
}


