body {
  margin:0;
  padding:0;
}


.description {
     position: fixed;
    font-family: HelveticaNeue;
    font-size: 15pt;
    color: black;
    text-align: center;
    width: 100vw;
    height: 10vh;
   bottom: 0vh;
    z-index: 15;
    text-align: center;
    line-height: 17pt;
}

.description a {
font-family:HelveticaNeue;
font-size:15pt;
color:black;
text-align:center;
text-decoration: none;
}

.description a:hover {
cursor:pointer;
filter: blur(3px);
    transition: all 2s;
  -webkit-transition: all 2s;
}
.header {
  position:fixed;
  width:100%;
  height:11vh;
  background-color: white;
  z-index: 13;
  font-size:12pt;

  font-family:HelveticaNeue;
  color:black;

}

.home {
float:left;
margin-top:4vh;
margin-left:2vw;  
}


.bouton {
float:right;
margin-top:1vh;
margin-right:2vw;
cursor:pointer;
 border-radius: 30px;
    background-color: white;
    padding: 10px;
    cursor: pointer;
    font-size: 12pt;
  

}

.precedent {
float:left;
margin-top:4vh;
margin-left:5vw;
margin-right:1vw;
cursor:pointer;
 border-radius: 10px;
 color:black;
    background-color: white;
    padding: 10px;
    cursor: pointer;
    font-size: 15pt;
    -webkit-box-shadow: 0px 0px 30px -11px rgba(0,0,0,0.73);
    -moz-box-shadow: 0px 0px 30px -11px rgba(0,0,0,0.73);
    box-shadow: 0px 0px 30px -11px rgba(0,0,0,0.73);

}
.suivant {
float:left;
margin-top:4vh;

cursor:pointer;
 border-radius: 10px;
 color:black;
    background-color: white;
    padding: 10px;
    cursor: pointer;
    font-size: 15pt;
    -webkit-box-shadow: 0px 0px 30px -11px rgba(0,0,0,0.73);
    -moz-box-shadow: 0px 0px 30px -11px rgba(0,0,0,0.73);
    box-shadow: 0px 0px 30px -11px rgba(0,0,0,0.73);

}

.back {
float:left;
margin-top:4vh;
margin-right:2vw;
color:black;
cursor:pointer;
 border-radius: 30px;
 margin-left:2vw;
    background-color: white;
    padding: 10px;
    cursor: pointer;
    font-size: 15pt;
    -webkit-box-shadow: 0px 0px 30px -11px rgba(0,0,0,0.73);
    -moz-box-shadow: 0px 0px 30px -11px rgba(0,0,0,0.73);
    box-shadow: 0px 0px 30px -11px rgba(0,0,0,0.73);

}


.about {
position:fixed;
width:100%;
height:100%;
display:none;
z-index:12;
background-color:white;
color:white;

}




.container {
 width: 100%;
  top:12vh;
    height: auto;
    position: absolute; 
    filter:blur(0px);
}



.container2 {
  width: 100%;
  
    height: 100vh;
    position: absolute;

}



#title,
#title2,
#title3,
#title4,
#title5,
#title6 {
  position:relative;

font-size:30pt;
text-align: center;
width:100%;
display:none;
height:auto;
top:-20vh;



}

@keyframes blink{
0%{opacity: 0;}

100%{opacity: 1;}
}

.container img {
  position:relative;
  width:100%;
  height:100%;
  filter:blur(0px);
  
}

.container2 img
{

  position:relative;
  width:80%;
  height:80%;
}



.container img:hover {
   filter:blur(7px);
    transition: all 2s;
  -webkit-transition: all 2s;
}

.container img.active {
  position:relative;
  width:100%;
  height:100%;
  filter:blur(7px);
    transition: all 1s;
  -webkit-transition: all 1s;
}
.mass {

 float:left;
 width:48%;
 margin-left:1vw;
  margin-top:1vh;
 height:66vh; 

}

.mass a,
.astr a,
.gal a,
.del a,
.walk a,
.sages a,
.pg a,
.typelab a,
.aste a,
.brut a {
text-decoration: none;
color:red;
font-family:HelveticaNeue;

}
.astr {

 float:left;
 width:48%;
 margin-left:2vw;
  margin-top:1vh;
 height:66vh;

}

.aste {

 float:left;
 width:48%;
 margin-left:1vw;
 height:66vh;

}

.brut {

 float:left;
 width:48%;
 margin-left:2vw;
 height:66vh;

}

.gal {

 float:left;
 width:48%;
 margin-left:2vw;
 margin-top:1vh;
 height:66vh;
 background-color:black; 
}

.del {

 float:left;
 width:48%;
 margin-left:1vw;
 height:66vh;
 margin-top:1vh;

}

.walk {

 float:left;
 width:48%;
 margin-left:1vw;
 height:66vh;
 margin-top:1vh;
 background-color:black; 
}

.sages {

 float:left;
 width:48%;
 margin-left:2vw;
 height:66vh;
 margin-top:1vh;
 
}

.pg {

 float:left;
 width:48%;
 margin-left:1vw;
 height:66vh;
 margin-top:1vh;
 
}

.typelab {

 float:left;
 width:48%;
 margin-left:2vw;
 height:66vh;
 margin-top:1vh;
 
}

.describe {
      
      font-family:Helvetica Neue;
      font-size:22pt;
      float:left;
      margin-top:15vh;
      margin-left:2vw;
      width:90vw;
      height:30vh;
      z-index:6;
      color:black;
      height:auto;
     
   
    padding: 10px;
    cursor: pointer;
    


     

}

.experience {
  float:left;
  margin-top:2vh;
 width:45%;
 margin-right:5vw;
font-family:Helvetica Neue;
font-size:15pt;
margin-left:2vw;
height:auto;
color:black;

    padding: 10px;
    cursor: pointer;
  

}

.describe a,
.intern a {
  text-decoration: none;
  color:black;
}

.describe a:hover,
.intern a:hover {
  font-style:italic;
}

.intern {
  float:left;
  margin-top:2vh;
 width:40%;
font-family:Helvetica Neue;
font-size:15pt;
margin-left:2vw;
color:black;

    padding: 10px;
    cursor: pointer;


}

ul {
  list-style: none;
}

li {
  list-style: none;
}

#slider li video {
width:90%;
margin-top:20vh;


}


#slider.ccc li video 
{

width:50%;

}


#slider.cc2 li video 
{

width:35%;

}


.dona {
  background-image: url(../image/dona.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;
      margin-top: 10px;

}


.slideinfi {
  background-image: url(../image/infi.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;
      margin-top: 10px;

}




.slidemass1 {
  background-image: url(../image/01.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;
      margin-top: 10px;

}


.slidemass2 {
  background-image: url(../image/02.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.slidek {
  background-image: url(../image/kata.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}


.slideka {
  background-image: url(../image/ka.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.slidenina {
  background-image: url(../image/nina.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.slideit {
  background-image: url(../image/list.gif);
  background-repeat: no-repeat;
  background-position:center;



}  


.slideapc {
  background-image: url(../image/apc.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}


.slidemass3 {
  background-image: url(../image/03.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.slidegvng1 {
  background-image: url(../image/dd2.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;
  margin-top: 10px;


}

.slidegvng2 {
  background-image: url(../image/dd.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;
  margin-top: 10px;


}


.slidetq {
  background-image: url(../image/tati.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.tati1 {
  background-image: url(../image/tati2.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.tati2 {
  background-image: url(../image/tati3.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.gvng1 {
  background-image: url(../image/type02.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.gvng2 {
  background-image: url(../image/gng.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}



.slidemass4 {
  background-image: url(../image/04.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}
.slidemass5 {
  background-image: url(../image/05.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.slidemass7 {
  background-image: url(../image/07.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}


.slidemass8 {
  background-image: url(../image/08.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;


}

.slide9 {
  background-image: url(../image/09.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide10 {
  background-image: url(../image/010.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide110 {
  background-image: url(../image/nice3.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}


.slide010 {
  background-image: url(../image/nice4.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}
.slide11 {
  background-image: url(../image/10.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slideave {
  background-image: url(../image/ave.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slidecc1 {
  background-image: url(../image/list.gif);
  background-repeat: no-repeat;
  background-position:center;
  background-size:60%;

}


.slide111 {
  background-image: url(../image/rr.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide12 {
  background-image: url(../image/11.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide13 {
  background-image: url(../image/exhibition.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide14 {
  background-image: url(../image/astr01.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}


.slide15 {
  background-image: url(../image/1991.png);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide16 {
  background-image: url(../image/mass.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide17 {
  background-image: url(../image/mass2.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide18 {
  background-image: url(../image/mass6.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide19 {
  background-image: url(../image/slyther3.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide20 {
  background-image: url(../image/slyther2.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}


.slide21 {
  background-image: url(../image/w.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide22 {
  background-image: url(../image/w2.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}

.slide23 {
  background-image: url(../image/w1.jpg);
  background-repeat: no-repeat;
  background-position:center;
  background-size:70%;

}



.header p {
 position:fixed;

 width:auto;
 left:2vw; 

}
.wrapper {
  width: 100%;
  height:100vh;
  overflow: hidden;

}

.swipe {
  
  overflow: hidden;
  visibility: hidden;
  position: relative;
  z-index:8;
  width: 100%;
  height:100vh;
}

.swipe-wrap {
  overflow: hidden;
  position: absolute;
  padding: 0;
  margin: 0;

  height:100vh;
  z-index:9;

}

.swipe-wrap > li {
  float: left;
  width: 100vw;
  height: 100vh;
  text-align: center;
  position: relative;
  box-sizing: border-box;
  line-height: 100vh;

}




.prev {
  position: absolute;
  left:0;
  height:100vh;
  width:50%;
 
  top:0;
  text-align: center;
  line-height: 100vh;
  font-size: 10pt;
  transition: all .5s;
  -webkit-transition: all .5s;
  cursor:url(../image/prev.cur), pointer;
  z-index:10;
}

.next {
  position: absolute;
  right:0;
  height:100vh;
  width:50%;
  
  top:0;
  text-align: center;
  line-height: 100vh;
  font-size: 10pt;
  transition: all .5s;
  -webkit-transition: all .5s;
  cursor:url(../image/next.cur), pointer;
  z-index:10;
}



.wrapper{

  

  filter:blur(0px);

    transition: all 1s;
  -webkit-transition: all 1s;
}


.wrapper.active {

  

  filter:blur(7px);
    transition: all 1s;
  -webkit-transition: all 1s;
}



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

.container {
  top:15vh;
}

.mass,
.astr,
.del,
.gal,
.walk,
.sages,
.pg,
.typelab {
    float: left;
    width: 90%;
    margin-left: 5vw;
    height: auto;
}

.header{

font-size:9pt;  
}

.bouton {
  margin-top:2vh;
  font-size:9pt;
}



.describe {
    font-family: Helvetica Neue;
    font-size: 17pt;
    float: left;
    margin-top: 14vh;
    margin-left: 2vw;
    width: 90vw;
    height: 30vh;
    z-index: 6;
    color: black;
    height: auto;
    padding: 10px;
    cursor: pointer;
}

.experience {
    float: left;
    margin-top: 2vh;
    width: 30%;
    margin-right: 7vw;
    font-family: Helvetica Neue;
    font-size: 14pt;
    margin-left: 2vw;
    height: auto;
    color: black;
    padding: 10px;
    cursor: pointer;
}

.intern {
    float: left;
    margin-top: 2vh;
    width: 40%;
    font-family: Helvetica Neue;
    font-size: 14pt;
    margin-left: 2vw;
    color: black;
    padding: 10px;
    cursor: pointer;
}







}