/*
.greydout {
  -webkit-opacity: 0.0;
  -moz-opacity: 0.0;
  opacity: 0.0;
  -webkit-transition: all 3s ease;
  -moz-transition: all 3s ease;
  -ms-transition: all 3s ease;
  -o-transition: all 3s ease;
  transition: all 3s ease;
}
.greydout:hover {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;}
  */
html{margin: 0;
    padding: 0;}

body{margin: 0;
    padding: 0;}

#titel {
  text-align: center;
}
.sommaire{
  width:170px;
    left:40%;
    top:5%;
    position:absolute;
    font-family: 'Old Standard TT', serif;
font-variant: small-caps;
    line-height: 35px;
    z-index:10;
}

#menu1, #menu2{
    position:absolute;
    font-family: 'Old Standard TT', serif;
    z-index:10;
}

.title ul {
  -webkit-opacity: 0.0;
  -moz-opacity: 0.0;
  opacity: 0.0;
  -webkit-transition: all 3s ease;
  -moz-transition: all 3s ease;
  -ms-transition: all 3s ease;
  -o-transition: all 3s ease;
  transition: all 3s ease;
}


.title ul.opacity {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
  -webkit-transition-delay: 2s;
  -moz-transition-delay: 2s;
  -ms-transition-delay: 2s;
  -o-transition-delay: 2s;
  transition-delay: 2s;
} 

.number ul {
  -webkit-opacity: 0.0;
  -moz-opacity: 0.0;
  opacity: 0.0;
  -webkit-transition: all 3s ease;
  -moz-transition: all 3s ease;
  -ms-transition: all 3s ease;
  -o-transition: all 3s ease;
  transition: all 3s ease;
}


.number ul.opacity {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
} 

.number{
  text-align: center;
  float:right;
  font-size: 20px;
}
.title{
  float:left;
 text-align: right;
  font-size: 20px;
}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

a {
    display: block; 
    text-decoration: none;
    color:white;
}

 .text {
 	font-family: 'Old Standard TT', serif;
  font-size: 17px;
  color: black;
	width: 75%;
	left:12.5%;
	top: 10%;
  z-index: 10;
}
.text p {
  -webkit-opacity: 0.0;
  -moz-opacity: 0.0;
  opacity: 0.0;
  -webkit-transition: all 3s ease;
  -moz-transition: all 3s ease;
  -ms-transition: all 3s ease;
  -o-transition: all 3s ease;
  transition: all 3s ease;
 	}

.text p.opacity {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
   -webkit-transition-delay: 2s;
  -moz-transition-delay: 2s;
  -ms-transition-delay: 2s;
  -o-transition-delay: 2s;
  transition-delay: 2s;
} 

.dropcap { 
  float: left; 
  color: firebrick; 
  font-size: 75px; 
  line-height: 60px; 
  padding-top: 4px; 
  padding-right: 8px; 
  padding-left: 3px; 
  opacity: 0.7;
   }

#ink {
  width: 100%;

   
}
.ink img{
  -webkit-opacity: 0.0;
  -moz-opacity: 0.0;
  opacity: 0.0;
  -webkit-transition: all 7s ease;
  -moz-transition: all 7s ease;
  -ms-transition: all 7s ease;
  -o-transition: all 7s ease;
  transition: all 7s ease;
  }
.ink img.opacity {
  -webkit-opacity: 0.9;
  -moz-opacity: 0.9;
  opacity: 0.9;;
} 

 .text, .ink, .menu {
 	position: absolute;
 
 }


#arrow-right {
   display: inline-block;
    position: right;
  margin-right: 5px;
  color: black;
}
#arrow-down {
    display: inline-block;
    position: center;
   color: black;
}
#arrow-left {
   display: inline-block;
    position: left;
   color: black;
}