.corde1 {

	margin-top :0.1%;

}


.corde2 {


	margin-top :15%;
}


.corde3 {


	margin-top :30%;
}


.corde4 {


	margin-top :45%;
}


.corde5 {


	margin-top :60%;
}


.corde6 {


	margin-top :75%;
}

.gratte1{
position:absolute;
background-image: -webkit-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:    -moz-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:     -ms-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:      -o-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:         linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
border-radius: 50%;
	width: 14.5%;
	height: 10%; 
    -webkit-border-radius: 50%/50%;
    -moz-border-radius: 50%/50%;
    border-radius: 50%/50%;    
	margin-left: 1%;
  border:1.5px solid #679403;
  cursor:pointer;
}
/*je fais bouger gratte1 */
.gratte1:active{
  -webkit-transform:perspective(1%) rotateX(-10deg);
  transform:perspective(1%) rotateX(-10deg);
	margin-left: 2%;
}

/*gratte2*/


.gratte2{
position:absolute;
background-image: -webkit-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:    -moz-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:     -ms-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:      -o-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:         linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
border-radius: 50%;
	width: 14.5%;
	height: 10%; 
    -webkit-border-radius: 50%/50%;
    -moz-border-radius: 50%/50%;
    border-radius: 50%/50%;    
	margin-left: 16.5%;
  border:1.5px solid #679403;
  cursor:pointer;
}
/*je fais bouger gratte2 */
.gratte2:active{
  -webkit-transform:perspective(1%) rotateX(-10deg);
  transform:perspective(1%) rotateX(-10deg);
	margin-left: 17.5%;
}

/*gratte3*/


.gratte3{
position:absolute;
background-image: -webkit-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:    -moz-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:     -ms-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:      -o-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:         linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
border-radius: 50%;
	width: 14.5%;
	height: 10%; 
    -webkit-border-radius: 50%/50%;
    -moz-border-radius: 50%/50%;
    border-radius: 50%/50%;    
	margin-left: 32%;
  border:1.5px solid #679403;
  cursor:pointer;
}
/*je fais bouger gratte3 */
.gratte3:active{
  -webkit-transform:perspective(1%) rotateX(-10deg);
  transform:perspective(1%) rotateX(-10deg);
	margin-left: 33%;
}

/*gratte4*/


.gratte4{
position:absolute;
background-image: -webkit-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:    -moz-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:     -ms-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:      -o-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:         linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
border-radius: 50%;
	width: 14.5%;
	height: 10%; 
    -webkit-border-radius: 50%/50%;
    -moz-border-radius: 50%/50%;
    border-radius: 50%/50%;    
	margin-left: 48.5%;
  border:1.5px solid #679403;
  cursor:pointer;
}
/*je fais bouger gratte4 */
.gratte4:active{
  -webkit-transform:perspective(1%) rotateX(-10deg);
  transform:perspective(1%) rotateX(-10deg);
	margin-left: 49.5%;
}

/*gratte5*/


.gratte5{
position:absolute;
background-image: -webkit-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:    -moz-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:     -ms-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:      -o-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:         linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
border-radius: 50%;
	width: 14.5%;
	height: 10%; 
    -webkit-border-radius: 50%/50%;
    -moz-border-radius: 50%/50%;
    border-radius: 50%/50%;    
	margin-left: 64%;
  border:1.5px solid #679403;
  cursor:pointer;
}
/*je fais bouger gratte5 */
.gratte5:active{
  -webkit-transform:perspective(1%) rotateX(-10deg);
  transform:perspective(1%) rotateX(-10deg);
	margin-left: 65%;
}

/*gratte6*/


.gratte6{
position:absolute;
background-image: -webkit-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:    -moz-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:     -ms-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:      -o-linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
background-image:         linear-gradient(right top, #D60F0E 0%, #FFDD01 100%);
border-radius: 50%;
	width: 14.5%;
	height: 10%; 
    -webkit-border-radius: 50%/50%;
    -moz-border-radius: 50%/50%;
    border-radius: 50%/50%;    
	margin-left: 80%;
  border:1.5px solid #679403;
  cursor:pointer;
}
/*je fais bouger gratte6 */
.gratte6:active{
  -webkit-transform:perspective(1%) rotateX(-10deg);
  transform:perspective(1%) rotateX(-10deg);
	margin-left: 81%;
}



.menu a {
  display:block;
  color: #fff;
  text-decoration:none;
}
.menu > li,
.menu > li li {
  position: relative;
  display:inline-block;
  padding: 6px 15px;
  background-color: #777;
  background-image: linear-gradient(#aaa, #888 50%, #777 50%,#999);
}
.menu > li li { background: transparent none; }
.menu > li li a { color: #444; }
.menu > li li:hover { background:#eee; }
.menu > li:first-child {
  border-right: 1px solid #777;
  border-radius: 8px 0 0 8px;
}
.menu > li + li {
  border-left: 1px solid #aaa;
  border-right: 1px solid #777;
}
.menu > li:last-child {
  border-right:0;
  border-left: 1px solid #aaa;
  border-radius: 0 8px 8px 0 ;
}
.menu > li:hover {
  background-color: #999;
  background-image: linear-gradient(#ccc, #aaa 50%, #999 50%,#bbb);
}

.menu ul {
  position: absolute;
  top: 2em; left:0;
  max-height:0em;
  margin:0; padding:0;
  background-color:#ddd;
  background-image: linear-gradient(#fff,#ddd);
  overflow:hidden;
  transition: 1s max-height 0.3s;
  border-radius: 0 0 8px 8px;
}

.menu > li:hover ul {

  max-height:13em;
}