/*
	www.case-france.com copyright CASE France 2022
*/

body {
	width: 90%;
	margin: auto;
	padding:0;
	color:#505050;
	background-color:white;
}

#page {
	opacity: .3;
}

.header {
	width:100%;
	background-color:white;
	margin-top:5px;
    padding:0px;
 	height:20%;
}

.lineheader {
	margin-left:10px;
	padding:10px;
}

.footer {
	font-style:oblique;
	font-size:.8em;
	text-align:center;
	padding:4px;
	margin:0px;
}

div.sticky {
  position: -webkit-sticky;
  position: sticky;
  width:100%;
  top: 0px;
  margin:0px;
  padding: 0px;
  z-index: 1;
}

#TopBar {
	margin: auto;
	padding-top: 0px;
	width: 100%;
	height: auto;
	text-align:center;
	color:white;
	background-color: white;
	/*background-color: #505050;*/
	border: 0px solid #73AD21;
}

.topnav {
	width:100%;
	background-color: white;
	color:silver;
	border: thin;
	border-color:black;
	border-top-style: ridge;
	border-bottom-style:ridge;
}

.topnavItem{
 	width:20%;
	display:inline-block;
	margin:10px;
	padding:10px;
}

.active {
	display: block;
	text-align:center;
  	padding: 0px;
  	margin: 0px;
    background-color: #4CAF50;
}

.Box1 {
	background-color:#F5F5DC;
	display: Block;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.Box2 {
	width:95%;
	position:relative;
	/*background-color:#F8F8FF;*/
	/*background-color:white;*/
	/*background-image:url('img/FondBleuRelief.png'); */
	/*background-repeat:no-repeat;*/
	/*opacity: 1;*/
	
	background: -webkit-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -moz-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -ms-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -o-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);

	display: Block;
	color: #808080;
	border: thin;
	border-radius:25px 0 25px 0;
	margin: auto;
	padding: 0px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.5);
}

.MenuLine{
	 display:none;
}

.ulTopmenu{
 	width:auto;
	list-style-type: none;
    margin: auto;
    padding: 5px;
    overflow: hidden;
    background-color: #505050;
}

.Topmenu{
	display: inline-block;
	margin:auto;
	padding:5px;
	width:150px;
	height:auto;
	color:white;
}

.aTopmenu{
	display: block;
    color:#4CAF50;
    text-align: center;
    font-style:normal;
    font-weight:normal;
    padding: 0px;
    margin:0px;
    text-decoration: none;
    font-size: 16px;
    font-family:Calibri;
}

.MenuLine{
	 display:none;
	 width:100%;
	 display:block;
	 margin:auto;
	 padding:0px;
	 height:auto;
	 border-bottom:medium;
	 border-bottom-style:none;
	 background-color:#e4e2e2;
}

.aTopmenu:hover:not(.active){
	display: block;
	color:white;
	cursor:pointer;
}

.dropdown {
    position: relative;
    display: inline-block;
    width:240px;
    margin:3px;
    padding:3px;
    background-color: #e4e2e2;
}

.dropbtn {
    display: inline-block;
    position:relative;
    width:250px;
    color: gray;
    padding: 1px;
    margin: 1px;
    font-size: 14px;
    border: none;
    cursor: pointer;
    background-color: #e4e2e2;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color:  #f9f9f9;
    top: 30px;
    color:gray;
    margin:auto;
    padding:3px;
    width: 245px;
    text-align:center;
    font-size: 10px;
    font-family:Calibri, Arial, Helvetica, sans-serif;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 8px;
    margin:0px;
    text-decoration: none;
    font-size: 14px;
    display: block;
    min-width:240px;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
     color: silver;
}

.ombreblack{
	text-shadow: 2px 2px 2px black;	
}

.ombre{
	text-shadow: 2px 2px 2px lightgray;	
}

.exigences{
	 margin-left:100px;
	 margin-bottom:20px;
}

/* Responsive Columns */
@media only screen and (max-width: 900px){
    .responsive {
        width: 100%;
        height:100%;
    }
}

@media only screen and (max-width: 600px){
    .responsive {
      width: 100%;
      height:100%;
    }
}

.TableDesMatieres{
	margin-top: 0px;
	padding: 0px;
	width: 100%;
	height:auto;
	background-color: #505050;
}

div.Tdm01{
	display:inline-block;
	margin: 5px;
	padding: 10px;
	width: auto;
	height:auto;
}

p.solid {
	font-family: Calibri, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size:16px;
	margin:0px;
	padding:4px;
	color:#00AA00;
	border-bottom-color:silver;
	border-bottom-style: ridge;
	border-bottom-width:1px;
}

P.solution {
 font-family: Calibri, Arial, Helvetica, sans-serif;
 font-size:26px;
}

h2 {
	font-size:1.5em;
	text-align:center;
	padding-top: 0.5em;
	font-family: Calibri, Arial, Verdana, sans-serif;
	color:gray;
}

h1 {
	text-align:center;
	font-size: 2.0em;
	font-family: Calibri, Arial, Verdana, sans-serif;
	color:gray;
}

h3 {
	font-family: Calibri, "Times New Roman", Times, serif;
	font-size: 1.0em;
	margin:5px;
	color:gray;
}

p {
	color:gray;
	font-family: Calibri, "Times New Roman", Times, sans-serif;
	font-size: 1.1em;
}

#casefrance {
	font-family:"Times New Roman", Times, serif;
	font-style:italic;
	font-size: 34px;
	font-weight:bold;
	text-shadow: 2px 2px 2px lightgray;
	text-align:center;
	margin:0px;
	padding:10px;
}

.envision {
 	font-family:"Times New Roman";
 	font-size:1.8em;
 	font-style:italic;
}

.envisionbox {
	margin-left:165px;
	margin-bottom:20px;
	display:inline-block;
}


figure { 
	display: inline-block;
	font-family:"Times New Roman";
}

a {
	text-decoration: none;
	border-bottom: 0px solid #bc9d88;
	color:gray;
}

a:hover,
a:focus {
	/*border-bottom: 1px dashed #bc9d88;*/
}

.sread {
	position: absolute;
	left:-9999px;
}

.cursive {
	font-family: "Times New Roman", cursive;
}

.center {
	text-align: center;
}

#slideshow {
	position: relative;
	width: 700px;
	height: 420px;
	padding: 0px;
	border: 1px solid #ddd;
	margin: 0 auto 3em;
	background: #FFF;
	background: -webkit-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -moz-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -ms-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -o-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	
	-webkit-border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	border-radius: 10px 10px 10px 10px;
	
	-webkit-box-shadow: 0 0 10px rgba(0,0,0, 0.2);
	-moz-box-shadow: 0 0 10px rgba(0,0,0, 0.2);
	box-shadow: 0 0 10px rgba(0,0,0, 0.2);
}

#slideshow .commands {
	position: absolute;
	top: 45%;
	padding: 5px 13px;
	font-family: 'Amaranth', Arial, Verdana, sans-serif;
	font-size: 1.3em;
	color: #aaa;
	text-decoration:none;
	background-color: #eee;
	text-shadow: 0 0 1px #aaa;
	
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 10%;
	
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
	background-image: linear-gradient(#fff,#ddd);
	border-bottom-style: none;
	border-bottom-color: inherit;
	border-bottom-width: 0;
	z-index:200;
}

#slideshow .commands:after {
	position: absolute;
	bottom: 65px; left:-18px;
	content: attr(title);
	width: 55px;
	padding: 10px;
	background: #fff;
	font-family: Georgia, Times, serif;
	font-size: 12px;
	text-align:center;
	text-shadow: 0 0 0;
	opacity: 0;
	
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	
	-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
	-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
	box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
	
	-webkit-transition: opacity 0.7s, bottom 0.7s;
	-moz-transition: opacity 0.7s, bottom 0.7s;
	transition: opacity 0.7s, bottom 0.7s;
}

#slideshow .commands:before {
	position: absolute;
	bottom: 55px; left: 13px;
	content: " ";
	width: 1px; height: 1px;
	border-top: 10px solid #fff;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	z-index:100;
	opacity: 0;
	
	-webkit-transition: opacity 0.7s, bottom 0.7s;
	-moz-transition: opacity 0.7s, bottom 0.7s;
	transition: opacity 0.7s, bottom 0.7s;
}

#slideshow .commands:hover:before {
	bottom: 35px;
	opacity: 1;
}

#slideshow .commands:hover:after {
	bottom: 45px;
	opacity: 1;
}

#slideshow .commands:focus { 
	outline: 0;
	-webkit-transform: translate(1px, 2px);
	-moz-transform: translate(1px, 2px);
	-ms-transform: translate(1px, 2px);
	-o-transform: translate(1px, 2px);
	transform: translate(1px, 2px);
}

#slideshow .commands:active {
	-webkit-transform: translate(0, 1px);
	-moz-transform: translate(0, 1px);
	-ms-transform: translate(0, 1px);
	-o-transform: translate(0, 1px);
	transform: translate(0, 1px);
}

#slideshow .prev {
	left: -10px;
}

#slideshow .next {
	right: -10px;
}

#slideshow .prev,
#slideshow .next {
	display:none;
}

#slideshow .commands1 {
	display: block;
}

/* play/pause commands */
.play_commands {
	position: absolute;
	width: 22px; height: 22px;
	top: 25px; right: 25px;
	z-index: 10;
	text-indent: -9999px;
	border:0 none;
	opacity: 0;

	-webkit-transition: opacity 1s, right 1s;
	-moz-transition: opacity 1s, right 1s;
	transition: opacity 1s, right 1s;
}

.play { right: 55px; cursor: default; }

.pause:hover { border:0 none; }

.play_commands:focus { outline:0; }

#slideshow:hover .pause,
#sl_play:target ~ #slideshow:hover .pause,
.play_commands:focus {
	opacity: 1;
}

.sl_command:target ~ #slideshow:hover .pause,
#sl_pause:target ~ #slideshow:hover .pause {
	opacity: 0;
}

.pause:after,
.pause:before {
	position: absolute;
	display: block;
	content: " ";
	top:0;
	width:38%;
	height: 22px;
	background: #fff;
	background: rgba(255,255,255,0.5);
}

.pause:after {
	right:0;
}

.pause:before {
	left:0;
}

.play {
	width: 1px; 
	height: 1px; 
	border-top: 10px solid transparent; 
	border-left: 20px solid #fff; 
	border-left: 20px solid rgba(255,255,255,0.5); 
	border-bottom: 10px solid transparent;
	opacity: 0;
}

.play:hover,
.play:focus {
	border-bottom: 10px solid transparent;
}

#slideshow .container {
	position:relative;
	width: 700px;
	height: 420px;
	overflow: hidden;
	border-radius: 8px;
	-webkit-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	-moz-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/* timeline base */
#slideshow .container:after {
	position:absolute;
	bottom: 0; left:0;
	content: " ";
	background: #999;
	width: 100%;
	height: 1px;
}

@-webkit-keyframes slider {
	0%, 11%, 100%	{ left: 0 }
	12%, 22%		{ left: -100% }
	23%, 33%		{ left: -200% }
	34%, 44%		{ left: -300% }
	45%, 55%		{ left: -400% }
	56%, 66%		{ left: -500% }
	67%, 77%		{ left: -600% }
	78%, 88%		{ left: -700% }
	89%, 98%		{ left: -800% }
}
@-moz-keyframes slider {
	00%, 11%, 100%	{ left: 0 }
	12%, 22%		{ left: -100% }
	23%, 33%		{ left: -200% }
	34%, 44%		{ left: -300% }
	45%, 55%		{ left: -400% }
	56%, 66%		{ left: -500% }
	67%, 77%		{ left: -600% }
	78%, 88%		{ left: -700% }
	89%, 98%		{ left: -800% }

}
@keyframes slider {
	0%, 11%, 100%	{ left: 0 }
	12%, 22%		{ left: -100% }
	23%, 33%		{ left: -200% }
	34%, 44%		{ left: -300% }
	45%, 55%		{ left: -400% }
	56%, 66%		{ left: -500% }
	67%, 77%		{ left: -600% }
	78%, 88%		{ left: -700% }
	89%, 98%		{ left: -800% }
}

#slideshow .slider {
	position: absolute;
	left:0; top:0;
	width: 900%;
	height: 420px;
	
	-webkit-animation: slider 78s infinite;
	-moz-animation: slider 78s infinite;
	animation: slider 78s infinite;
}

.opaque {
	opacity: 0.9;
}

.sl_i:target ~ #slideshow .slider {
	-webkit-transition: left 1s;
	-moz-transition: left 1s;
	transition: left 1s;
}

.sl_command:target ~ #slideshow .slider {
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	transition: opacity 1s;
}

#slideshow .c_slider {
	position: absolute;
	left:0; top:0;
	width: 900%;
	height: 420px;
	background: url(img/CartographieIT.png) 0 0 no-repeat, url(img/Travail-collaboratif700_420.jpg) 700px 0 no-repeat, url(img/Sandbox700_420.jpg) 1400px 0 no-repeat, url(img/AnalyseImpact3700_420.jpg) 2100px 0 no-repeat, url(img/Approbationt700_420.jpg) 2800px 0 no-repeat, url(img/GestionVersion700_420.jpg) 3500px 0 no-repeat, url(img/RemainderManagement700_420.jpg) 4200px 0 no-repeat, url(img/Analyse-donnees700_420.jpg ) 4900px 0 no-repeat, url(img/Rapport700_420.jpg ) 5600px 0 no-repeat;
}

#slideshow .c_sliderProcess {
	position: absolute;
	left:0; top:0;
	width: 900%;
	height: 420px;
	background: url(img/ProcessusEntreprises700-420.jpg) 0 0 no-repeat, url(img/Travail-collaboratif700_420.jpg) 700px 0 no-repeat, url(img/Sandbox700_420.jpg) 1400px 0 no-repeat, url(img/AnalyseImpact3700_420.jpg) 2100px 0 no-repeat, url(img/Approbationt700_420.jpg) 2800px 0 no-repeat, url(img/GestionVersion700_420.jpg) 3500px 0 no-repeat, url(img/RemainderManagement700_420.jpg) 4200px 0 no-repeat, url(img/Analyse-donnees700_420.jpg ) 4900px 0 no-repeat, url(img/Rapport700_420.jpg ) 5600px 0 no-repeat;
}


.sl_i:target ~ #slideshow .c_slider {
	-webkit-transition: background 1s;
	-moz-transition: background 1s;
	transition: background 1s;
}

#slideshow figure {
	position:relative;
	padding:0; margin:0;
}

@-webkit-keyframes figurer {
	0%, 11%, 22%, 33%, 44%, 55%, 66%, 77%, 88%, 100%	{ -webkit-box-shadow: 0 0 65px rgba(0,0,0, 0) inset; box-shadow: 0 0 65px rgba(0,0,0, 0) inset; }
	2%, 10%, 21%, 32%, 43%, 54%, 65%, 76%, 87%, 98%		{ -webkit-box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset;	box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset; }
}
@-moz-keyframes figurer {
	0%, 11%, 22%, 33%, 44%, 55%, 66%, 77%, 88%, 100%	{ -moz-box-shadow: 0 0 65px rgba(0,0,0, 0) inset; box-shadow: 0 0 65px rgba(0,0,0, 0) inset;	}
	2%, 10%, 21%, 32%, 43%, 54%, 65%, 76%, 87%, 98%		{ -moz-box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset;	box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset; }
}
@keyframes figurer {
	0%, 11%, 22%, 33%, 44%, 55%, 66%, 77%, 88%, 100%	{ -moz-box-shadow: 0 0 65px rgba(0,0,0, 0) inset; box-shadow: 0 0 65px rgba(0,0,0, 0) inset;	}
	2%, 10%, 21%, 32%, 43%, 54%, 65%, 76%, 87%, 98%		{ -moz-box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset;	box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset; }
}

@-webkit-keyframes figcaptionner {
	0%, 11%, 22%, 33%, 44%, 55%, 66%, 77%, 88%, 100%	{ bottom: -130px;	}
	2%, 10%, 21%, 32%, 43%, 54%, 65%, 76%, 87%, 98%		{ bottom: 5px;		}
}
@-moz-keyframes figcaptionner {
	0%, 11%, 22%, 33%, 44%, 55%, 66%, 77%, 88%, 100%	{ bottom: -130px;	}
	2%, 10%, 21%, 32%, 43%, 54%, 65%, 76%, 87%, 98%		{ bottom: 5px;		}
}
@keyframes figcaptionner {
	0%, 11%, 22%, 33%, 44%, 55%, 66%, 77%, 88%, 100%	{ bottom: -150px;	}
	5%, 10%, 21%, 32%, 43%, 54%, 65%, 76%, 87%, 98%		{ bottom: 5px;		}
}

#slideshow figcaption {
	position:absolute;
	padding: 20px 20px; margin:0;
	left:0; right:0; bottom: 5px;
	text-align:center;
	letter-spacing: 0.05em;
	word-spacing: 0.05em;
	font-family: "Times New Roman" ;
	background: rgba(255,255,255,1);
	border-top: 1px solid rgb(225,225,225);
	color: #555;
	text-shadow: 1px 1px 1px rgba(192,192,192,0.5);
	font-size:1.5em;
	
	-webkit-animation: figcaptionner 78s infinite;
	-moz-animation: figcaptionner 78s infinite;
	animation: figcaptionner 78s infinite;
}

figcaption ul{
 	margin:0px;
 	padding:0px;
}

figcaption li{
 	margin:0px;
 	padding:0px;
 	list-style-type:none;
}

@-webkit-keyframes timeliner {
	0%, 11%, 22%, 33%, 44%, 55%, 66%, 77%, 88%, 100%	{ width: 0; }
	10%, 21%, 32%, 43%, 54%, 65%, 76%, 87%, 98%			{ width: 700px;	}
}
@-moz-keyframes timeliner {
	0%, 11%, 22%, 33%, 44%, 55%, 66%, 77%, 88%, 100%	{ width: 0;	}
	10%, 21%, 32%, 43%, 54%, 65%, 76%, 87%, 98%			{ width: 700px;	}
}
@keyframes timeliner {
	0%, 11%, 22%, 33%, 44%, 55%, 66%, 77%, 88%, 100%	{ width: 0;	}
	10%, 21%, 32%, 43%, 54%, 65%, 76%, 87%, 98%			{ width: 700px;	}
}

#timeline {
	position: absolute;
	background: #999;
	bottom: 5px;
	left: 1px;
	height: 2px;
	background: rgba(153,153,102,.8);
	width: 0;
	
	-webkit-animation: timeliner 78s infinite;
	-moz-animation: timeliner 78s infinite;
	animation: timeliner 78s infinite;
}

/* dots styles */
.dots_commands  {
	position: relative;
	top: 32px;
	padding:0; margin:0;
	text-align:center;
}

.dots_commands li {
	display:inline;
	padding:0; margin:0;
	list-style:none;
}

.dots_commands a {
	position: relative;
	display:inline-block;
	height:8px; width: 8px;
	margin: 0 5px;
	text-indent: -9999px;
	background: #fff;
	border-bottom:0;
	
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
	box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
	
	z-index:25;
}

.dots_commands li + li a {
	z-index:10;
}

@-moz-keyframes dotser {
	0%, 100% 	{ opacity: 1; left: 0; 		}
	
	9.5%		{ opacity: 1; left: 0;		}
	10%			{ opacity: 0; left: 0;		}
	10.5%		{ opacity: 0; left: 18px;	}
	20%			{ opacity: 1; left: 18px;	}
	
	20.5%		{ opacity: 1; left: 18px;	}
	21%			{ opacity: 0; left: 18px;	}
	21.5%		{ opacity: 0; left: 36px;	}
	30%			{ opacity: 1; left: 36px;	}
	
	30.5%		{ opacity: 1; left: 36px;	}
	31%			{ opacity: 0; left: 36px;	}
	31.5%		{ opacity: 0; left: 54px;	}
	42%			{ opacity: 1; left: 54px;	}
	
	42.5%		{ opacity: 1; left: 54px;	}
	43%			{ opacity: 0; left: 54px;	}
	43.5%		{ opacity: 0; left: 72px;	}
	53%			{ opacity: 1; left: 72px;	}

	53.5%		{ opacity: 1; left: 72px;	}
	54%			{ opacity: 0; left: 72px;	}
	54.5%		{ opacity: 0; left: 90px;	}
	64%			{ opacity: 1; left: 90px;	}

	64.5%		{ opacity: 1; left: 90px;	}
	65%			{ opacity: 0; left: 90px;	}
	65.5%		{ opacity: 0; left: 108px;	}
	75%			{ opacity: 1; left: 108px;	}

	75.5%		{ opacity: 1; left: 108px;	}
	76%			{ opacity: 0; left: 108px;	}
	76.5%		{ opacity: 0; left: 126px;	}
	86%			{ opacity: 1; left: 126px;	}

	86.5%		{ opacity: 1; left: 126px;	}
	87%			{ opacity: 0; left: 126px;	}
	87.5%		{ opacity: 0; left: 144px;	}
	97%			{ opacity: 1; left: 144px;	}
	
	97.5%		{ opacity: 1; left: 144px;	}
	99%			{ opacity: 0; left: 144px;	}
	100%		{ opacity: 0; left: 0; }	
}

@-webkit-keyframes dotser {
	0%, 100% 	{ opacity: 1; left: 0; 		}
	
	9.5%		{ opacity: 1; left: 0;		}
	10%			{ opacity: 0; left: 0;		}
	10.5%		{ opacity: 0; left: 18px;	}
	20%			{ opacity: 1; left: 18px;	}
	
	20.5%		{ opacity: 1; left: 18px;	}
	21%			{ opacity: 0; left: 18px;	}
	21.5%		{ opacity: 0; left: 36px;	}
	30%			{ opacity: 1; left: 36px;	}
	
	30.5%		{ opacity: 1; left: 36px;	}
	31%			{ opacity: 0; left: 36px;	}
	31.5%		{ opacity: 0; left: 54px;	}
	42%			{ opacity: 1; left: 54px;	}
	
	42.5%		{ opacity: 1; left: 54px;	}
	43%			{ opacity: 0; left: 54px;	}
	43.5%		{ opacity: 0; left: 72px;	}
	53%			{ opacity: 1; left: 72px;	}

	53.5%		{ opacity: 1; left: 72px;	}
	54%			{ opacity: 0; left: 72px;	}
	54.5%		{ opacity: 0; left: 90px;	}
	64%			{ opacity: 1; left: 90px;	}

	64.5%		{ opacity: 1; left: 90px;	}
	65%			{ opacity: 0; left: 90px;	}
	65.5%		{ opacity: 0; left: 108px;	}
	75%			{ opacity: 1; left: 108px;	}

	75.5%		{ opacity: 1; left: 108px;	}
	76%			{ opacity: 0; left: 108px;	}
	76.5%		{ opacity: 0; left: 126px;	}
	86%			{ opacity: 1; left: 126px;	}

	86.5%		{ opacity: 1; left: 126px;	}
	87%			{ opacity: 0; left: 126px;	}
	87.5%		{ opacity: 0; left: 144px;	}
	97%			{ opacity: 1; left: 144px;	}
	
	97.5%		{ opacity: 1; left: 144px;	}
	99%			{ opacity: 0; left: 144px;	}
	100%		{ opacity: 0; left: 0; }	
}

@keyframes dotser {
	0%, 100% 	{ opacity: 1; left: 0; 		}
	
	9.5%		{ opacity: 1; left: 0;		}
	10%			{ opacity: 0; left: 0;		}
	10.5%		{ opacity: 0; left: 18px;	}
	20%			{ opacity: 1; left: 18px;	}
	
	20.5%		{ opacity: 1; left: 18px;	}
	21%			{ opacity: 0; left: 18px;	}
	21.5%		{ opacity: 0; left: 36px;	}
	30%			{ opacity: 1; left: 36px;	}
	
	30.5%		{ opacity: 1; left: 36px;	}
	31%			{ opacity: 0; left: 36px;	}
	31.5%		{ opacity: 0; left: 54px;	}
	42%			{ opacity: 1; left: 54px;	}
	
	42.5%		{ opacity: 1; left: 54px;	}
	43%			{ opacity: 0; left: 54px;	}
	43.5%		{ opacity: 0; left: 72px;	}
	53%			{ opacity: 1; left: 72px;	}

	53.5%		{ opacity: 1; left: 72px;	}
	54%			{ opacity: 0; left: 72px;	}
	54.5%		{ opacity: 0; left: 90px;	}
	64%			{ opacity: 1; left: 90px;	}

	64.5%		{ opacity: 1; left: 90px;	}
	65%			{ opacity: 0; left: 90px;	}
	65.5%		{ opacity: 0; left: 108px;	}
	75%			{ opacity: 1; left: 108px;	}

	75.5%		{ opacity: 1; left: 108px;	}
	76%			{ opacity: 0; left: 108px;	}
	76.5%		{ opacity: 0; left: 126px;	}
	86%			{ opacity: 1; left: 126px;	}

	86.5%		{ opacity: 1; left: 126px;	}
	87%			{ opacity: 0; left: 126px;	}
	87.5%		{ opacity: 0; left: 144px;	}
	97%			{ opacity: 1; left: 144px;	}
	
	97.5%		{ opacity: 1; left: 144px;	}
	99%			{ opacity: 0; left: 144px;	}
	100%		{ opacity: 0; left: 0; }	
}

.dots_commands li:first-child a:after,
.dots_commands li:first-child a:before {
	position: absolute;
	top: 0; left: 0;
	content: " ";
	width: 8px; height: 8px;
	background: #bd9b83;
	z-index:20;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
	box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
}

.dots_commands li:first-child a:after {
	-webkit-animation: dotser 78s infinite; /* webkit can't animate pseudo-element =_= :L: */
	-moz-animation: dotser 78s infinite; /* thanks moz ! :D */
	animation: dotser 78s infinite;
}

.dots_commands li:first-child a:before {
	display:none;
}


/* need a stop ! */

/* actions when target ! */
.sl_command { display: none; }

.sl_command:target ~ #slideshow .slider,
.sl_command:target ~ #slideshow figure:after,
.sl_command:target ~ #slideshow figcaption,
.sl_command:target ~ #slideshow #timeline,
.sl_command:target ~ #slideshow .dots_commands li:first-child a:after {
	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	animation-play-state: paused;
}

.sl_command { display: none; }

#sl_play:target ~ #slideshow .slider,
#sl_play:target ~ #slideshow figure:after,
#sl_play:target ~ #slideshow figcaption,
#sl_play:target ~ #slideshow #timeline,
#sl_play:target ~ #slideshow .dots_commands li:first-child a:after {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	animation-play-state: running;
}

.sl_command:target ~ #slideshow .pause 	{ opacity:0; }
.sl_command:target ~ #slideshow .play 	{ opacity:1; right: 25px; cursor: pointer; }
#sl_play:target ~ #slideshow .pause 	{ opacity:0; }
#sl_play:target ~ #slideshow .play 		{ opacity:0; right: 55px; cursor: default;}

.sl_i:target ~ #slideshow .slider									{ visibility: hidden }
.sl_i:target ~ #slideshow .slider figcaption						{ visibility: hidden }
.sl_i:target ~ #slideshow .dots_commands li:first-child a:after		{ display:none; }
.sl_i:target ~ #slideshow .dots_commands li:first-child a:before	{ display:block; }}

#sl_i1:target ~ #slideshow .commands								{ display: none; }
#sl_i1:target ~ #slideshow .commands1								{ display: block; }
#sl_i1:target ~ #slideshow .c_slider								{ background-position: 0 0, 700px 0, 1400px 0, 2100px 0, 2800px 0, 3500px 0, 4200px 0, 4900px 0, 5600px 0; }
#sl_i1:target ~ #slideshow .dots_commands li:first-child a:before	{ left:0; }

#sl_i2:target ~ #slideshow .commands								{ display: none; }
#sl_i2:target ~ #slideshow .commands2								{ display: block; }
#sl_i2:target ~ #slideshow .c_slider								{ background-position: -700px 0, 0 0, 700px 0, 1400px 0, 2100px 0, 2800px 0, 3500px 0, 4200px 0, 4900px 0; }
#sl_i2:target ~ #slideshow .dots_commands li:first-child a:before	{ left:18px; }

#sl_i3:target ~ #slideshow .commands								{ display: none; }
#sl_i3:target ~ #slideshow .commands3								{ display: block; }
#sl_i3:target ~ #slideshow .c_slider								{ background-position: -1400px 0, -700px 0, 0 0, 700px 0, 1400px 0, 2100px 0, 2800px 0, 3500px 0, 4200px 0; }
#sl_i3:target ~ #slideshow .dots_commands li:first-child a:before	{ left:36px; }

#sl_i4:target ~ #slideshow .commands								{ display: none; }
#sl_i4:target ~ #slideshow .commands4								{ display: block; }
#sl_i4:target ~ #slideshow .c_slider								{ background-position: -2100px 0, -1400px 0, -700px 0, 0 0, 700px 0, 1400px 0, 2100px 0, 2800px 0, 3500px 0; }
#sl_i4:target ~ #slideshow .dots_commands li:first-child a:before	{ left:54px; }

#sl_i5:target ~ #slideshow .commands								{ display: none; }
#sl_i5:target ~ #slideshow .commands5								{ display: block; }
#sl_i5:target ~ #slideshow .c_slider								{ background-position: -2800px 0, -2100px 0, -1400px 0, -700px 0, 0 0, 700px 0, 1400px 0, 2100px 0, 2800px 0; }
#sl_i5:target ~ #slideshow .dots_commands li:first-child a:before	{ left:72px; }

#sl_i6:target ~ #slideshow .commands								{ display: none; }
#sl_i6:target ~ #slideshow .commands6								{ display: block; }
#sl_i6:target ~ #slideshow .c_slider								{ background-position: -3500px 0, -2800px 0, -2100px 0, -1400px 0, -700px 0, 0 0, 700px 0, 1400px 0, 2100px 0; }
#sl_i6:target ~ #slideshow .dots_commands li:first-child a:before	{ left:90px; }

#sl_i7:target ~ #slideshow .commands								{ display: none; }
#sl_i7:target ~ #slideshow .commands7								{ display: block; }
#sl_i7:target ~ #slideshow .c_slider								{ background-position: -4200px 0, -3500px 0, -2800px 0, -2100px 0, -1400px 0, -700px 0, 0 0, 700px 0, 1400px 0; }
#sl_i7:target ~ #slideshow .dots_commands li:first-child a:before	{ left:108px; }

#sl_i8:target ~ #slideshow .commands								{ display: none; }
#sl_i8:target ~ #slideshow .commands8								{ display: block; }
#sl_i8:target ~ #slideshow .c_slider								{ background-position: -4900px 0, -4200px 0, -3500px 0, -2800px 0, -2100px 0, -1400px 0, -700px 0, 0 0, 700px 0; }
#sl_i8:target ~ #slideshow .dots_commands li:first-child a:before	{ left:126px; }

#sl_i9:target ~ #slideshow .commands								{ display: none; }
#sl_i9:target ~ #slideshow .commands9								{ display: block; }
#sl_i9:target ~ #slideshow .c_slider								{ background-position: -5600px 0, -4900px 0, -4200px 0, -3500px 0, -2800px 0, -2100px 0, -1400px 0, -700px 0, 0 0; }
#sl_i9:target ~ #slideshow .dots_commands li:first-child a:before	{ left:144px; }

.plus {
	 font-family:"Times New Roman";
	 font-size: 90%;
	 display:block;
	 padding:5px;
	 background-color:white;
	 font-style:italic;
	 color:maroon;
	 box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	 border-radius:5px 5px 5px 5px;
}

.highlight {
 	font-family:"Times New Roman";
	/* font-size: 1.00em;*/
	 font-size:  12px;

	 font-style:italic;
	 color:maroon;
}

.highlight: hover {
	background-color:aqua;
 	border:medium;
	border-style:solid;
	border-color:black;

}

.plus:hover {
	 cursor:pointer;
	 color:gray;
	 /*text-shadow: 1px 1px 1px gray;*/
}

.moins {
	 display:block;
	 width:100px;
	 border:0px;
	 margin:5px;
	 padding:0;
	 border-style:solid;
	 border-radius: 15px;
	 font-family:Arial, Helvetica, sans-serif;
	 font-size: 1.5em;
	 text-align:center;
	 color:gray;
	 float:right:
}

.moins:hover {
	 color: silver; /*white;*/
	  cursor:pointer;
}

.fermer {
	 display:block;
	 width:100%;
	 border:0px;
	 margin:5px;
	 border-style:solid;
	 border-radius: 15px;
	 font-family:Arial, Helvetica, sans-serif;
	 font-size: 1.5em;
	 text-align:right;
	 color:gray;
}

.fermer:hover {
	  cursor:pointer;
	 color:silver;
}

.resume{
	font-family: "Times New Roman";
	font-size: 1.0em;
	text-align:center;
	font-style:italic;
	padding:10px;	
}

div p{
	color:gray;
	font-family: Calibri, "Times New Roman", Times, sans-serif;
	font-size: 1.1em;
}

li p{
	font-family: Calibri, Arial Times, serif;
	font-size:1em;
	margin:10px;
	font-style:italic;
}

a{
	color:maroon;
}

li a:hover{
	 color:red;
}

li a{
	font-family: "Times New Roman", Times, serif;
	font-style:italic;
	margin:10px;
}

p a{
	 color:maroon;
}

p a:hover{
	 color:red;
}

.icone{
	display: inline-block;
	text-decoration:none;
	border-radius: 8px;
	-webkit-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	-moz-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.icone:hover {
   -webkit-box-shadow: 6px 6px 1px rgba(0,0,0, 0.2);
	-moz-box-shadow: 6px 6px 1px rgba(0,0,0, 0.2);
	box-shadow: 6px 6px 1px rgba(0,0,0, 0.2);
}

@keyframes doneeperso {
 	from {top : -0px;}
 	to {top : 30%;}
 }
 
 @keyframes doneeperso2 {
 	from {opacity : 1;}
 	to {opacity : 0;}
 }

#DonneesPersonnelles {
	position: absolute;
	left:23%;
	top: 30%;
	height: auto;
	width: 50%;
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 20px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	z-index:1;
	opacity: 1;
	animation-name: doneeperso;
  	animation-duration: 4s;
}

#panel1{
	display: block;
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#panel2{
	display: block;
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#panel3{
	display: block;
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#panel4{
	display: block;
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#panel5{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin:auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#panel6{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#panel7{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin:auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#panel8{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#panel9{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	left: 70px;
}

#panel10{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	right: 70px;
}

#panel11{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	left: 70px;
}

#panel12{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	left: 70px;
}

#panel13{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	left: 70px;
}
#panel14{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	left: 70px;
}

#panel15{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	left: 70px;
}

#panel16{
	background-color:#F5F5DC;
	display: none;
	color: #808080;
	border: thin;
	border-radius: 25px;
	margin: auto;
	padding: 5px;
	border: 2px solid white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	left: 70px;
}

.zoom{
	-webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

.modal-content{    
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 16s;
}

.responsive1{
	display: inline-block;
	width: 100%;
    height:auto;
    margin:auto;
    padding:0px;
}

.responsive2{
	width: 100%;
    height:auto;
    margin:auto;
    padding:0;
}

.responsive3{
	margin:10px;
    padding:6px;
    float: left;
    width: 20.99999%;
}

.responsive4{
	margin-left:10px;
	margin-right:10px;
	margin-bottom:20px;
	margin-top:10px;
    padding: 5px;
    float: left;
    width: 29.99999%;
    background-color:white;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	border-radius:22px 0 22px 0;
}

.responsive5{
    margin:4px;
    padding:4px;
    display:inline-block;
    float: left;
    width: 47%;
   	height:680px;
    border-radius:22px 0 22px 0;
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.responsive8{
	margin:0px;
	padding:5px;
	border-radius:22px 0 22px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.ResponsiveDiv{
	width:50%;
}
.ResponsiveUML{
	width:100%;
}	
.ResponsiveEnvision {
	display:inline-block;
	position:absolute;
	left:80px;
	Top: 20px;
	margin:0;
	padding:10px;
	width:300px;
}	
.responsive9 {
		width:47%;
}
.responsive10 {
		display:block;
		margin:auto;
}
.responsive11 {
		display:none;
		margin:auto;
}
.responsive12 {
		display: inline-block;
		width:45%;
}
.responsive13 {
	width: 30%;
	margin:auto;
}
.responsive14 {
   width:00%;
   margin:auto;
}


/* Responsive Columns */

@media only screen and (min-width: 950px){
	.envision {
		font-family:"Times New Roman";
 		font-size:1.6em;
 		font-style:italic;
	}
	.responsiveA {
     	 width: 60%;
     	 display: none; 
    }
    .responsiveB {
     	 width: 60%;
     	 display: block; 
    }
	.responsive {
     	 width: 100%; 
    }       
    .responsive1 {
         display:none;
    }
    .responsive2 {
         display:block;
    }
    .responsive3 {
	 	width: 100%;
	}
	.responsive4{
	  	width: 100%;
	 	padding:0px;
	}
	.responsive5 {
	  width: 47%;
	  height:800px; 
	}
	.responsive8{
	  width: 100%;
	}
	.ResponsiveDiv {
		width:90%;
	}
	.ResponsiveEnvision {
		left:50px; 
	}	
	.Responsive9 {
		width:75%; 
	}
	.responsive10 {
		display:block;
		width:40%
	}
	.responsive11 {
		display:none;
	}
	.responsive12 {
		display: block;
		<!--width:90%;-->
	}
	.responsive13 {
        width:10%;
        margin:auto;
    }
    .responsive14 {
        width:70%;
        margin: auto;
    }
} 

/* Responsive Columns */

@media only screen and (max-width: 950pxx){
	.envision {
		font-family:"Times New Roman";
 		font-size:1.6em;
 		font-style:italic;
	}
	.responsiveA {
     	 width: 80%;
     	 display: block; 
    }
    .responsiveB {
     	 width: 80%;
     	 display: none;
     }
    .responsive {
        width: 100%;
    }
     .responsive1 {
        display:block;
    }
     .responsive2 {
        display:none;
    }
	.responsive4{
	  width: 100%;
	  padding:0px;
	}
	.responsive5{
	  width: 47%;
	  height:800px;
	}
	.responsive8{
	  width: 100%;
	}
	.ResponsiveDiv{
		width:90%;
	}
	.ResponsiveEnvision {
		left:50px;
	}	
	.responsive9 {
		width:75%;
	}
	.responsive10 {
		display:none;	
	}
	.responsive11 {
		display:block;
		width:40%;
	}
	.responsive12 {
		display: block;
		width:45%;
	}
	.responsive13 {
        width:10%;
        margin:auto;
    }
    .responsive14 {
        width:60%;
        margin:auto;
    }

}

@media only screen and (min-width: 720px){

	.envision {
 		font-family:"Times New Roman";
 		font-size:1.3em;
 		font-style:italic;
	}
	 .responsive {
      width: 60%;
    }
    .responsiveA {
     	widt:80%;
     	 display: none; 
    }
    .responsiveB {
     	 width:70%;
     	 display: block;
     	 opacity: 1;
    }
    .responsive0 {
      width: 100%;
    }
    .responsive1 {
        display:none;
    }
    .responsive2 {
        display:block;
    }
    .responsive3 {
	 	width: 100%;
	}
	.responsive5{
	  width: 47%;
	  height:800px;
	}
	.ResponsiveDiv {
		width:70%;
	}
	.ResponsiveEnvision {
		left:100px;
	}	
	.Responsive9 {
		width:70%;
	}
	.responsive10 {
		display:none;
	}
	.responsive11 {
		display:block;
		width:90%;
	}
	.responsive12 {
		display: block;
		width:90%;
	}
		.responsive13 {
        width:50%;
        margin:auto;
    }
   	 .responsive14 {
        width:50%;
        margin:auto;
    }

}

@media only screen and (max-width: 720px){

    .responsive {
      width: 80%;
    }
     .responsiveA {
     	width:90%;
     	display: block;
    }
    .responsiveB {
   	 	width:90%;
     	display: none;
    }
    .responsive0 {
      width: 100%;
    }
    .responsive1 {
        display:block;
    }
     .responsive2 {
        display:none;
    }
	.responsive4 {
	  width: 95%;
	  padding:0px;
	}
	.responsive5 {
	  width: 97%;
	  height:750px;
	}
	.responsive8 {
	  width: 70%;
	}
	.ResponsiveDiv {
		width:90%;
	}
	.ResponsiveEnvision {
		left:50px;
		top: 50px;
	}	
	.responsive9 {
		width:100%;
	}
	.responsive10 {
		display:block;
		width:90%;
	}
	.responsive11 {
		display:none;
	}
	.responsive12 {
		display: block;
		width:90%;
	}
	.responsive13 {
        width:80%;
        margin:auto;
    }
    .responsive14 {
        width:90%;
        margin:auto;
    }
}

#Titre{
	width: 90%;
    height:auto;
    margin:auto;
    padding:0;
}

.italique1{
	font-style:italic;
	font-size:16px;
}

.square{
	 list-style:square;
}

.imgBoxShadow{
	  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	  display:block;
	  margin:auto;
}

.imgBoxShadow:hover{
	 cursor:pointer;
}

.BoxShadow {
	 box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.5);
	/* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
	
}

.BoxShadowRound {
	 box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	 border-radius:22px 0 22px 0;
}

.vue{
	 display:inline-block;
}

#Corps4{
	margin:0;
	padding:0px;	
}

img.imgnormal{
	text-align:center;
	border-radius:0px;
	margin:auto;
	padding:0px;
	border:2px solid white;
	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/*-----------------------------*/

.mySlides {
	display: none;
}

/* Slideshow container */
.slideshow2-container {
  max-width: 720px;
  position: relative;
  margin: auto;
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 18px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/4 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dotUML {
  height: 12px;
  width: 12px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.3s ease;
  border-bottom:0;
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
  -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
  box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
  z-index:25;
}

.active2 {
  background-color: #717171;
 }

/* Fading IN animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 4s;
  animation-name: fade;
  animation-duration: 4s;
}

@-webkit-keyframes fade {
  from {opacity: .3} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .3} 
  to {opacity: 1}
}

/* Fading OUT animation */
.fadeOut {
  -webkit-animation-name: fadeOut;
  -webkit-animation-duration: 4s;
  animation-name: fadeOut;
  animation-duration: 4s;
}

@-webkit-keyframes fadeOut {
  from {opacity: 1} 
  to {opacity: .3}
}

@keyframes fadeOut {
  from {opacity: 1} 
  to {opacity: .3}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 10px}
}

/* Create two equal columns that floats next to each other */
.column {
  float: left;
  width: 50%;
  padding: 15px;
}

@media screen and (max-width:300px) {
  .column {
    width: 90%;
  }
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.imageText {
	 position: absolute;
	 color:aqua;
	 top:60%;
	 left:40%;
	 font-size:28px;
	 transform: translate(-50%, -50%);
	 /*text-shadow: 0 0 1px #aaa;*/
}