/* Mario Fanfani css style goes here */
	body {
	background: #000;
	color: #FFF;
	}
	body.page_sommaire {
	font-size: 17px;
}
	.probootstrap-header {
    padding-top: 32px;
    padding-bottom: 32px;
    width: 100%;
    z-index: 12;
    position: relative;
}
	.probootstrap-header{
	background: transparent;
		  }
	.probootstrap-logo{
	color: white;
	letter-spacing: 0.2em;
	font-size: 24px;
	white-space: nowrap;
		  }
	.probootstrap-main-nav li a{
	color: #a4abb6;
		  }
	.probootstrap-section {
    padding: 8px 16px;
		  }
	.vid {
	/*width: 100%;*/
	margin: auto;
	/*
	top: 0%;
	left: 4px;
	width: calc(100% - 8px);
		height: calc(100% - 8px);
	overflow: hidden;
	position: absolute;
	background: #000;*/
}
.pe-3 .probootstrap-photo-details {
  padding-right: 1.5rem !important;
}
.ps-3 .probootstrap-photo-details {
  padding-left: 1.5rem !important;
}
.image-fade {
	max-width: 540px;
	height: auto;
}
span.title {
	font-size: 20px;
    padding: 5px 10px;
	position: absolute;
	z-index: 996;
	bottom: 15px;
	right: 30px;
	text-align: left;
	line-height: 1.4em;
}
span.titleH {
	font-size: 18px;
	letter-spacing: 0.1em;
    padding: 5px 10px;
	position: absolute;
	z-index: 997;
	top: 15px;
	left: 30px;
	text-align: left;
	line-height: 1.4em;
}
.vid a {color: beige;}
.flexslider .slides img.portrait {
    height: 100%;
    -moz-user-select: none;
    width: auto;
    text-align: center;
}
.flexslider .slides img.paysage {
    height: auto;
    -moz-user-select: none;
    width: 100%;
    text-align: center;
}
.flexslider .slides img {width: auto; display: block; margin-left: auto; margin-right: auto;}
	.btn .btn-primary{border: 2px solid #5068A9;
	background: #5068A9;
	color: #fff;
	text-align: center;}
	.extra-text{display:block;float:left;clear:both;margin-top:30px;font-size:15px;color:rgba(255,255,255,.5);padding: 0 10px;}  
	.extra-text h5{color:#FFF;padding: 1em 0 0 2em;font-weight: bold;}
	.extra-text a, a{color:#FFF;}
	.extra-text p{padding: 0 0 0 2em;}
	textarea{width: 100%;max-height: 150px;}
	textarea, input{margin: 0.5em 0px;font-size: 0.9em;}
	legend{border-bottom: none;
    padding-top: 20px;}
	input.submit{text-align: center;
	background: #333;
	color: #FFF;
	border: none;
border-radius: 0px;}
	.img-bg {
	background-size: cover;
    background-position: center;
	min-height: 200px;
	}
	.taille0 {font-size: 1em;
	line-height: 1.4em;}
	.taille1 {font-size: 1.1em;
	line-height: 1.4em;}
	.taille2 {font-size: 1.2em;
	line-height: 1.4em;}
	.taille3 {font-size: 1.3em;
	line-height: 1.4em;}
	video {	max-width: 720px;}
	.probootstrap-gutter16 .col-md-6 video, .probootstrap-gutter16 .col-md-7 video, .probootstrap-gutter16 .col-md-8 video, .probootstrap-gutter16 .col-md-9 video {
	width: 100%;
	height: auto;
	/*top: 50%;
	transform: translateY(-50%);*/
	position: relative;
	/*opacity: 0.8;*/
		  }
	.probootstrap-gutter16 .col-md-3 video, .probootstrap-gutter16 .col-md-4 video, .probootstrap-gutter16 .col-md-5 video {
	max-width: 540px;
	height: auto;
	/*top: 50%;
	transform: translateY(-50%);*/
	position: relative;
		/*opacity: 0.8;*/
		  }
	.probootstrap-gutter16>div[class*=col-] {
    padding-right: 4px;
    padding-left: 4px;
	max-height: 340px;
}	
.chapo {font-weight: 600;}
.descriptif {border-bottom: 1px solid #CCC;border-top: 1px solid #CCC;padding: 15px 0;}
.page_rubrique h1{border-bottom: 1px solid #CCC; padding: 15px 0;}
.voiraussi{border-top: 1px solid #CCC;margin: 30px 0; padding: 30px 0px;}

/*NEON Accueil*/
.exp h3 {text-shadow: 0 0 5px #00f, 0 0 10px #00f, 0 0 20px #00f, 0 0 30px #00f, 0 0 40px #00f, 0 0 55px #00f, 0 0 75px #00f;color: #FFF}
#accueil p, #accueil h3.spip, #accueil h2.spip {
	display: inline;
	font-size: 1.1em;
}
/*OVER EFFETCT*/
.probootstrap-photo-details {
	display: block;
	cursor: pointer
}
.probootstrap-photo-details:active {
	display: none;
}
.vid, .div-image {
    /*display: none;
	opacity: 0;*/
	position: fixed;
    transition: opacity .55s ease-in-out;
    -moz-transition: opacity .55s ease-in-out;
    -webkit-transition: opacity .55s ease-in-out;
}
.probootstrap-photo-details:active .div-image, .probootstrap-photo-details:active .vid {
	/*display: block;
	position: relative;*/
	z-index: 99;
    opacity: 1.0;
    transition: opacity .55s ease-in-out;
    -moz-transition: opacity .55s ease-in-out;
    -webkit-transition: opacity .55s ease-in-out;
}
#p2 {
	/*position: absolute;
	top: -100px;*/
	left: 25%;z-index: 99;
}
#p2 .img-bg .probootstrap-photo-details{
	top: 80px;
}
#p2.img-bg {
	min-height: 100px !important;
}
/*Caption Text*/
ul.slides li {position: relative;}
.flex-caption {
    color: #fff;
    left:5px;
    position:absolute;
    bottom:45px;
    z-index:1;
	font-size: 0.8em;
}
.flex-desc {
    color: #CCC;
    left:5px;
    position:absolute;
    bottom:45px;
    z-index:1;
	font-size: 0.8em;
}
/*================================*/
/*=== Partie sur le Swipe Menu ===*/
/*================================*/
/* Menu burger */
#menu-burger {/*position:absolute; top:2.5em; right:3.5em; display:inline-block;*/float:right; position: relative; z-index: 99; cursor:pointer;margin-top: -6px;}
#menu-burger .bar1,
#menu-burger .bar2,
#menu-burger .bar3 {width:30px; height:5px; background-color:#F1F1F1; margin:6px 0; transition:0.4s;}
#menu-burger:hover {opacity:.75; transition:.5s;}
#menu-burger.clicked .bar1 {-webkit-transform:rotate(-45deg) translate(-9px, 6px); transform:rotate(-45deg) translate(-9px, 6px);}
#menu-burger.clicked .bar2 {opacity: 0;}
#menu-burger.clicked .bar3 {-webkit-transform:rotate(45deg) translate(-8px, -8px); transform:rotate(45deg) translate(-8px, -8px);}

/* Main menu (slide) */
#menu {position:fixed; z-index:9; right:-25%; top:auto; background:#000; padding:4em 2em; width:25%; min-height:100%; }
#menu ul li {list-style:none;}
#menu ul li a {display:block; color:#fff; text-decoration:none; font-weight:normal; transition:background .5s; padding:0 0 0 2em; text-align:left; margin-bottom:.5em;}
#menu ul li a:hover {color: slategrey; transition:background .5s;}
#menu.visible {animation:.5s slideRight ease-in forwards; transition-delay:0;}
#menu.invisible {animation:1s slideLeft ease-out forwards; transition-delay:0;}

/* Animations pour le menu slide */
@keyframes slideRight {
	from {right:-25%;}
	to {right:0%;}
}
@-webkit-keyframes slideRight {
	from {right:-25%;}
	to {right:0%;}
}
@keyframes slideLeft {
	from {right:0%;}
	to {right:-25%;}
}
@-webkit-keyframes slideLeft {
	from {right:0%;}
	to {right:-25%;}
}

/* Responsive design */
@media (max-width:1080px) {
	#menu {right:-33%; 
		width:33%;}
	/*#menu-burger.clicked {position:fixed;}*/
	#main-block,
	#second-block {padding:4em 2em;}

	/* Animations pour le menu slide */
	@keyframes slideRight {
		from {right:-33%;}
		to {right:0%;}
	}
	@-webkit-keyframes slideRight {
		from {right:-33%;}
		to {right:0%;}
	}
	@keyframes slideLeft {
		from {right:0%;}
		to {right:-33%;}
	}
	@-webkit-keyframes slideLeft {
		from {right:0%;}
		to {right:-33%;}
	}
}
@media (max-width:1024px) {
	#menu {right:-50%; 
		width:50%;}
	/*#menu-burger.clicked {position:fixed;}*/
	#main-block,
	#second-block {padding:4em 2em;}

	/* Animations pour le menu slide */
	@keyframes slideRight {
		from {right:-50%;}
		to {right:0%;}
	}
	@-webkit-keyframes slideRight {
		from {right:-50%;}
		to {right:0%;}
	}
	@keyframes slideLeft {
		from {right:0%;}
		to {right:-50%;}
	}
	@-webkit-keyframes slideLeft {
		from {right:0%;}
		to {right:-50%;}
	}
}
@media (max-width:600px) {
	#menu-burger {position:fixed;top:1em; right:2em; z-index:9999;}
	#menu {right:-100%; width:100%;}
	#second-block #google-maps {width:100%; margin-right:0;}
	#second-block #contact-form {width:100%; margin-top:2em;}

	/* Animations pour le menu slide */
	@keyframes slideRight {
		from {right:-100%;}
		to {right:0%;}
	}
	@-webkit-keyframes slideRight {
		from {right:-100%;}
		to {right:0%;}
	}
	@keyframes slideLeft {
		from {right:0%;}
		to {right:-100%;}
	}
	@-webkit-keyframes slideLeft {
		from {right:0%;}
		to {right:-100%;}
	}
}
/*Carousel Flex slider*/
.flexslider .flex-direction-nav a:before{
	position: relative;
}
.flexslider .flex-direction-nav a {
	border-radius: 0;
	border: 0;
}
@media (max-width:576px){
.img-sm-responsive, .img-xs-responsive {
    max-width: 100%;
    height: auto;
}
.probootstrap-gutter16 .col-md-3 video, .probootstrap-gutter16 .col-md-4 video, .probootstrap-gutter16 .col-md-5 video {
    max-width: 100%;
}
}
@media (max-width:480px){
	.flexslider{
		max-height: 360px
	}
	.hide-sm{
		display: none !important;
	}
	#p2 {
		position: relative;
	top: -150px;
	left: 0;
	z-index: 99;
	}
}
@media (min-width:1440px){
.probootstrap-gutter16 .col-md-5 video {
	width: 100%;
	height: auto;
		  }
}