/* 10 juin 2023 */

body
{
 font-family: arial, helvetica, sans-serif ;
 width: 100%;
 text-align:center;
 line-height:1.4;
 margin: 10px auto 10px auto;
}

@media (max-width: 1000px)
{
 body
 {
  width: 900px;
 }
}


footer
{
 font-size: .7em;
 text-align: right;
}


#topnav 
{
 text-align:center;
 font-size:1.3em;
}

#topnav a
{
 color:#000000;
 text-decoration: none;
}

#topnav a:hover
{
 text-decoration: underline;
}

#nav2
{
 text-align:center;
 font-size:1.3em;
}


#content { padding:0px; }

#content1
{
 /*padding-top:0px;*/
 text-align:left;
}

#sidebar1
{
 float: left;
 width: 400px;
}

#retour
   {
    position: fixed;
    border: 1px solid #000;
    background-color: #7d3c98;
    font-size: 30pt; 
    color: white; 
    padding: 1px;
    bottom: 0;
    right: 0;
    width: 50px;
    height: 60px;
   }

#retour2
   {
    position: absolute;
    border: 1px solid #000;
    background-color: #7d3c98;
    font-size: 30pt; 
    color: white; 
    padding: 1px;
    left: 50%;
    width: 50px;
    height: 60px;
   }


 #bandeau
   {
    position: fixed;
    background-color: #ffffff;
    padding: 1px;
    top: 0;
    left: 0;
    width: 100%;
   }

nav ul 
{
 list-style-type: none;
}

.sous
{
 display: none;
 box-shadow: 0px 1px 2px #CCC;
 background-color: white;
 position: absolute;
 width: 100%;
 z-index: 1000;
}

.sous:hover
{
 display: block;
 box-shadow: 0px 1px 2px #CCC;
 background-color: white;
 position: absolute;
 width: 100%;
 z-index: 1000;
}
 
.sous a
{
 padding: 10px;
 border-bottom: none;
}

.sous a:hover
{
 color: blue;
 background-color: RGBa(200,200,200,0.1)
}

.sous li
{
 float: none;
 width: 100%;
 text-align: left;
}
 
nav > ul> li:hover .sous
{display: block;}
 
nav ul li
{
 float: left;
 width: 14%;
 text-align: center;
 position: relative;
}

nav ul::after
{
 content="";
 display: table;
 clear: both;
}

nav a
{
 display: block;
 text-decoration: none;
 color: black;
 border-bottom: 2px solid transparent;
 padding: 10px 0px;
 font-size: 1.3em;
}

nav a:hover
{
 color: blue;
}


.paragraphe {text-align: left; margin: 1em;}

.paragraphe img 
{
 padding-right: 10px; float: left;
}

/*.paragraphe1 {margin-left: 50px; text-align: left;}*/


.grid
{
 list-style: none;
 padding: .5em;
 display: grid;
 grid-auto-flow: row;
 grid-template-columns: 1fr;
}

.grid1
{
 list-style: none;
 padding: .5em;
 display: grid;
 grid-auto-flow: row;
 grid-template-columns: 1fr;
}

.grid2
{
 list-style: none;
 padding: .5em;
 display: grid;
 grid-auto-flow: row;
 grid-template-columns: 1fr;
}


.grid-item
{
 margin: .5em;
}

.grid-item1
{
 margin: .5em;
 padding: 2em 0;
}

.grid-item2
{
 margin: .5em;
 padding: .7em 0;
}

.grid-item3
{
 margin: .5em;
 padding-top: 8em;
}

.grid-item4
{
 margin: .5em;
 padding-top: 4em;
}

.grid-item5
{
 margin: .5em;
 /*padding-top: 3em;*/
 padding-top: 15%;
 /*padding-left: 7em;*/
 padding-left: 30%;
}

.grid-item6
{
 margin: .5em;
 /*padding-top: 6em;*/
 padding-top:20%;
}


.grid-item img
{
 display: block;
 height: auto;
 max-width: 100%;
 margin: 0 auto;
}

@media (max-width: 1000px)
{
 .grid-item img {width: 100%;}
}

.grid-item1 img
{
 display: block;
 height: auto;
 max-width: 100%;
 margin: 0 auto;
}

@media (max-width: 1000px)
{
 .grid-item1 img {width: 100%;}
}


.grid-item2 img
{
 display: block;
 height: auto;
 max-width: 100%;
 margin: 0 auto;
}

@media (max-width: 1000px)
{
 .grid-item2 img {width: 100%;}
}


.grid-item3 img
{
 display: block;
 max-width: 100%;
 height: auto;
 margin: 0 auto;
}

@media (max-width: 1000px)
{
 .grid-item3 img {width: 100%;}
}


.grid-item4 img
{
 display: block;
 max-width: 100%;
 height: auto;
 margin: 0 auto;
}

@media (max-width: 1000px)
{
 .grid-item4 img {width: 100%;}
}


.grid-item5 img
{
 display: block;
 max-width: 100%;
 height: auto;
 margin: 0 auto;
}

@media (max-width: 1000px)
{
 .grid-item5 img {width: 75%; margin-right: 20%}
}


.grid-item6 img
{
 display: block;
 max-width: 100%;
 height: auto;
 margin: 0 auto;
}

@media (max-width: 1000px)
{
 .grid-item6 img {width: 50%;}
}



 
@media (min-width: 1000px)
{
 .grid {grid-template-columns: 1fr 1fr;}
}
 
@media (min-width: 1000px)
{
 .grid1 {grid-template-columns: 1fr 1fr 1fr;}
}

@media (min-width: 1000px)
{
 .grid2 {grid-template-columns: 1fr 1fr 1fr 1fr;}
}



.sliderfr
{
 /*width: 405px;*/
 /*width: 50%;*/
 width: 80%;
 /*height: 300px;*/
 height: 525px;
 margin-top: 25px;
 /*margin-right: 25%;*/
 /*margin-left: 25%;*/
 margin-right: 10%;
 margin-left: 10%; 
 /*margin: 1em auto;*/
 /*margin: 0px;*/
 overflow: hidden;
 position: relative;
 /*float: left;*/
}

@media (min-width: 1000px)
{
 .sliderfr 
 {
  /*width: 100%;*/
  width: 405px; 
  height: 300px;
  margin: 0px;
  float: left;
  /*left: 25%;*/
 }
}

.sliderscav
{
 width: 90%;
 /*width: 50%;*/
 /*height: 260px;*/
 height: 460px;
 margin-right: 5%;
 margin-left: 5%;
 /*margin: 1em auto;*/
 /*margin: 0px;*/
 overflow: hidden;
 position: relative;
 /*padding-left: 300px;*/
 /*position: center;*/
 /*float: left;*/
}

@media (min-width: 1000px)
{
 .sliderscav 
 {
  /*width: 810px;*/
  width: 405px;
  height: 260px;
  margin: 0px;
  /*padding-left: 300px;*/
  /*padding-left: 0px;*/
  float: left;
  /*left: 200px;*/
  /*left: 25%;*/
 }
}

.sliderev2
{
 width: 650px;
 height: 525px;
 margin: 1em auto;
 overflow: hidden;
 position: relative;
}

.sliderev
{
 width: 1200px;
 height: 650px;
 margin: auto auto;
 overflow: hidden;
 position: relative;
}

@media (max-width: 1000px)
{
 .sliderev 
 {
  /*margin-right: 5%;*/
  /*margin-left: 5%;*/
  /*width: 100%;*/
  width: 700px;
  /*padding-left: 150px;*/
  /*padding-left: 10%;
  /*left: 25%;*/
 }
}

.slidersci
{
 /*width: 405px;*/
 /*width: 50%;*/
 width: 90%;
 height: 600px;
 /*margin: 1em auto;*/
 /*margin: 0px;*/
 /*margin-right: 25%;*/
 /*margin-left: 25%;*/
 margin-right: 5%;
 margin-left: 5%;
 overflow: hidden;
 position: relative;
 /*float: left;*/
}

@media (min-width: 1000px)
{
 .slidersci
 {
  width: 405px;
  margin: 0px;
  float: left;
  height: 550px;
  /*height: 500px;*/
  /*width: 100%;*/ 
  /*left: 25%;*/
 }
}

.slidesci1
{
 max-width: 100%;
 position: absolute;
 animation : slide1 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slidesci1
 {
  left: 150px;
 }
}

.slidesci2
{
 max-width: 100%;
 position: absolute;
 /*top: 50px;*/
 animation : slide2 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slidesci2
 {
  left: 100px;
 }
}

.slidesci3
{
 max-width: 100%;
 position: absolute;
 animation : slide3 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slidesci3
 {
  left: 200px;
 }
}

.slidesci4
{
 max-width: 100%;
 position: absolute;
 animation : slide4 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slidesci4
 {
  left: 100px;
 }
}


.slidesci5
{
 max-width: 100%;
 position: absolute;
 animation : slide5 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slidesci5
 {
  left: 200px;
 }
}


.slidesci6
{
 max-width: 100%;
 position: absolute;
 top: 0px;
 left: 14px;
 animation : slide6 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slidesci6
 {
  left: 214px;
 }
}

.slidesci7
{
 max-width: 100%;
 position: absolute;
 top: 0px;
 animation : slide7 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slidesci7
 {
  left: 200px;
 }
}

.slidesci8
{
 max-width: 100%;
 position: absolute;
 /*top: 50px;*/
 animation : slide8 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slidesci8
 {
  left: 100px;
 }
}

 
.slidesc1
{
 max-width: 100%;
 position: absolute;
 top: 8px;
 left: 0px;
 animation : slide1 40s linear infinite;
}

.slidesc2
{
 max-width: 100%;
 position: absolute;
 top: 0px;
 left: 29px;
 animation : slide2 40s linear infinite;
}

.slidesc3
{
 max-width: 100%;
 position: absolute;
 top : 10px;
 left: 0px;
 animation : slide3 40s linear infinite;
}

.slidesc4
{
 max-width: 100%;
 position: absolute;
 left: 80px;
 animation : slide4 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slidesc4
 {
 left: 180px;
 }
}


.slidesc5
{
 max-width: 100%;
 position: absolute;
 top: 20px;
 left: 0px;
 animation : slide5 40s linear infinite;
}

.slidesc6
{
 max-width: 100%;
 position: absolute;
 top: 55px;
 left: 0px;
 animation : slide6 40s linear infinite;
}

.slidesc7
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 left: 0px;
 animation : slide7 40s linear infinite;
}

.slidesc8
{
 max-width: 100%;
 position: absolute;
 left: 10px;
 animation : slide8 40s linear infinite;
}

.slidefr1
{
 max-width: 100%;
 position: absolute;
 top: 0px;
 left: 0px;
 animation : slide1 40s linear infinite;
}

.slidefr2
{
 max-width: 100%;
 position: absolute;
 top: 0px;
 animation : slide2 40s linear infinite;
}

.slidefr3
{
 max-width: 100%;
 position: absolute;
 top: 0px;
 left: 50px;
 animation : slide3 40s linear infinite;
}

.slidefr4
{
 max-width: 100%;
 position: absolute;
 top: 0px;
 left: 40px;
 animation : slide4 40s linear infinite;
}

.slidefr5
{
 max-width: 100%;
 position: absolute;
 left: 90px; 
 animation : slide5 40s linear infinite;
}

.slidefr6
{
 max-width: 100%;
 position: absolute;
 left: 0px;
 animation : slide6 40s linear infinite;
}

.slidefr7
{
 max-width: 100%;
 position: absolute;
 left: 0px;
 animation : slide7 40s linear infinite;
}

.slidefr8
{
 max-width: 100%;
 position: absolute;
 top: 0px;
 animation : slide8 40s linear infinite;
}
 
.slideav1
{
 max-width: 100%;
 position: absolute;
 left: 108px;
 animation : slide1 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slideav1
 {
 left: 200px;
 }
}


.slideav2
{
 max-width: 100%;
 position: absolute;
 left: 5px;
 animation : slide2 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slideav2
 {
  left: 50px;
  top: 30px;
 }
}

.slideav3
{
 max-width: 100%;
 position: absolute;
 left: 2px;
 animation : slide3 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slideav3
 {
  left: 100px;
 }
}


.slideav4
{
 max-width: 100%;
 position: absolute;
 left: 150px;
 animation : slide4 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slideav4
 {
  left: 130px;
 }
}

.slideav5
{
 max-width: 100%;
 position: absolute;
 top: 29px;
 left: 0px;
 animation : slide5 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slideav5
 {
  left: 50px;
  top: 50px;
 }
}

.slideav6
{
 max-width: 100%;
 position: absolute;
 top: 32px;
 left: 0px;
 animation : slide6 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slideav6
 {
  left: 50px;
  top: 50px;
 }
}

.slideav7
{
 max-width: 100%;
 position: absolute;
 top: 17px;
 left: 0x;
 animation : slide7 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slideav7
 {
  left: 50px;
 }
}

.slideav8
{
 max-width: 100%;
 position: absolute;
 left: 72px;
 animation : slide8 40s linear infinite;
}

@media (max-width: 1000px)
{
 .slideav8
 {
  left: 180px;
 }
}


.slide41
{
 max-width: 100%;
 position: absolute;
 left: 0;
 right: 0;
 padding-top: 10px;
 animation : slide1 40s linear infinite;
}

.slide42
{
 max-width: 100%;
 position: absolute;
 left: 0;
 right: 0;
 padding-top: 10px;
 animation : slide2 40s linear infinite;
}

.slide43
{
 max-width: 100%;
 position: absolute;
 left: 0;
 right: 0;
 padding-top: 10px;
 animation : slide3 40s linear infinite;
}

.slide44
{
 max-width: 100%;
 position: absolute;
 left: 0;
 right: 0;
 padding-top: 10px;
 animation : slide4 40s linear infinite;
}

.slide45
{
 max-width: 100%;
 position: absolute;
 left: 0;
 right: 0;
 padding-top: 10px;
 animation : slide5 40s linear infinite;
}

.slide46
{
 max-width: 100%;
 position: absolute;
 left: 0;
 right: 0;
 padding-top: 10px;
 animation : slide6 40s linear infinite;
}

.slide47
{
 max-width: 100%;
 position: absolute;
 left: 0;
 right: 0;
 padding-top: 10px;
 animation : slide7 40s linear infinite;
}

.slide48
{
 max-width: 100%;
 position: absolute;
 left: 0;
 right: 0;
 padding-top: 10px;
 animation : slide8 40s linear infinite;
}

.sliderf1
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide101 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf1
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}

.sliderf2
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide102 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf2
 {
  /*padding-left: 5%;*/
  padding-left: 5%;
 }
}

.sliderf3
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide103 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf3
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}

.sliderf4
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide104 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf4
 {
  /*padding-left: 20%;*/
  padding-left: 15%; 
 }
}

.sliderf5
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide105 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf5
 {
  /*padding-left: 15%;*/
  padding-left: 15%;
 }
}

.sliderf6
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide106 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf6
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}

.sliderf7
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide107 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf7
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}

.sliderf8
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide108 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf8
 {
  /*padding-left: 25%;*/
  padding-left: 20%;
 }
}

.sliderf9
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide109 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf9
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}

.sliderf10
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide110 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf10
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}

.sliderf11
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide111 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf11
 {
  /*padding-left: 10%;*/
  padding-left: 5%;
 }
}

.sliderf12
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide112 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf12
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}

.sliderf13
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide113 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf13
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}

.sliderf14
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide114 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf14
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}

.sliderf15
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide115 60s linear infinite;
}

@media (max-width: 1000px)
{
 .sliderf15
 {
  /*padding-left: 20%;*/
  padding-left: 15%;
 }
}
 

.slideeev1
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide2001 30s linear infinite;
}

.slideeev2
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide2002 30s linear infinite;
}

.slideeev3
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide2003 30s linear infinite;
}

.slideeev4
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 animation : slide2004 30s linear infinite;
}


.slideev1
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 left: 25%;
 animation : slide201 30s linear infinite;
}

@media (max-width: 1000px)
{
 .slideev1
 {
  left: 15%;
 }
}

.slideev2
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 left: 25%;
 animation : slide202 30s linear infinite;
}

@media (max-width: 1000px)
{
 .slideev2
 {
  left: 15%;
 }
}

.slideev3
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 left: 15%;
 animation : slide203 30s linear infinite;
}

@media (max-width: 1000px)
{
 .slideev3
 {
  left: 0px;
 }
}

.slideev4
{
 max-width: 100%;
 position: absolute;
 top: 15%;
 animation : slide204 30s linear infinite;
}

.slideev5
{
 max-width: 100%;
 position: absolute;
 top: 10px;
 left: 15%;
 animation : slide205 30s linear infinite;
}

@media (max-width: 1000px)
{
 .slideev5
 {
  left: 0px;
 }
}


@keyframes slide1
{
 0%, 12.5%, 100% {opacity: 0;}
 3%, 9.5% {opacity: 1;}
}

@keyframes slide2
{
 0%, 12.5%, 25%, 100% {opacity: 0;}
 15.5%, 22% {opacity: 1;}
}

@keyframes slide3
{
 0%, 25%, 37.5%, 100% {opacity: 0;}
 28%, 34.5% {opacity: 1;}
}

@keyframes slide4
{
 0%, 37.5%, 50%, 100% {opacity: 0;}
 40.5%, 47% {opacity: 1;}
}

@keyframes slide5
{
 0%, 50%, 62.5%, 100% {opacity: 0;}
 53%, 59.5% {opacity: 1;}
}

@keyframes slide6
{
 0%, 62.5%, 75%, 100% {opacity: 0;}
 65.5%, 72% {opacity: 1;}
}

@keyframes slide7
{
 0%, 75%, 87.5%, 100% {opacity: 0;}
 78%, 84.5% {opacity: 1;}
}

@keyframes slide8
{
 0%, 87.5%, 100% {opacity: 0;}
 90.5%, 97% {opacity: 1;}
}

@keyframes slide101
{
 0%, 6.7%, 100% {opacity: 0;}
 3.35% {opacity: 1;}
}

@keyframes slide102
{
 0%, 6.7%, 13.3%, 100% {opacity: 0;}
 10% {opacity: 1;}
}

@keyframes slide103
{
 0%, 13.3%, 20%, 100% {opacity: 0;}
 16.65% {opacity: 1;}
}

@keyframes slide104
{
 0%, 20%, 26.7%, 100% {opacity: 0;}
 23.35% {opacity: 1;}
}

@keyframes slide105
{
 0%, 26.7%, 33.3%, 100% {opacity: 0;}
 30% {opacity: 1;}
}

@keyframes slide106
{
 0%, 33.3%, 40%, 100% {opacity: 0;}
 36.65% {opacity: 1;}
}

@keyframes slide107
{
 0%, 40%, 46.7%, 100% {opacity: 0;}
 43.35% {opacity: 1;}
}

@keyframes slide108
{
 0%, 46.7%, 53.3%, 100% {opacity: 0;}
 50% {opacity: 1;}
}

@keyframes slide109
{
 0%, 53.3%, 60%, 100% {opacity: 0;}
 56.65% {opacity: 1;}
}

@keyframes slide110
{
 0%, 60%, 66.7%, 100% {opacity: 0;}
 63.35% {opacity: 1;}
}

@keyframes slide111
{
 0%, 66.7%, 73.3%, 100% {opacity: 0;}
 70% {opacity: 1;}
}

@keyframes slide112
{
 0%, 73.3%, 80%, 100% {opacity: 0;}
 76.65% {opacity: 1;}
}

@keyframes slide113
{
 0%, 80%, 86.7%, 100% {opacity: 0;}
 83.35% {opacity: 1;}
}

@keyframes slide114
{
 0%, 86.7%, 93.3%, 100% {opacity: 0;}
 90% {opacity: 1;}
}

@keyframes slide115
{
 0%, 93.3%, 100% {opacity: 0;}
 96.65% {opacity: 1;}
}

@keyframes slide2001
{
 0%, 25%, 100% {opacity: 0;}
 6%, 19% {opacity: 1;}
}

@keyframes slide2002
{
 0%, 25%, 50%, 100% {opacity: 0;}
 31%, 44% {opacity: 1;}
}

@keyframes slide2003
{
 0%, 50%, 75%, 100% {opacity: 0;}
 56%, 69% {opacity: 1;}
}

@keyframes slide2004
{
 0%, 75%, 100% {opacity: 0;}
 81%, 94% {opacity: 1;}
}


@keyframes slide201
{
 0%, 20%, 100% {opacity: 0;}
 5%, 15% {opacity: 1;}
}

@keyframes slide202
{
 0%, 20%, 40%, 100% {opacity: 0;}
 25%, 35% {opacity: 1;}
}

@keyframes slide203
{
 0%, 40%, 60%, 100% {opacity: 0;}
 45%, 55% {opacity: 1;}
}

@keyframes slide204
{
 0%, 60%, 80%, 100% {opacity: 0;}
 65%, 75% {opacity: 1;}
}

@keyframes slide205
{
 0%, 80%, 100% {opacity: 0;}
 85%, 95% {opacity: 1;}
}