<html>
  <head>
  	<title>Invoquez la sainte pelle</title>
  	<link rel="shortcut icon" href="/images/petikek_inv.ico">
    <script src="/js/createjs.min.js"></script>
    <script src="/js/jquery.min.js"></script>
    <script src="/js/jquery.ui.min.js"></script>
    <script src="/js/konami.js"></script>
    <script>
    var soundPlaying = false;
    var limit = true;
    
    function loadSound () {
        createjs.Sound.registerSound("sounds/WTC_35_Sainte_pelle.ogg", "sp");
        soundPlaying = true;
    }
    
    function playSound () {
        if (soundPlaying && limit) { return; }
        var instance = createjs.Sound.play("sp");
        instance.on("complete", function(){ soundPlaying = false; playSound(); });
        soundPlaying = true;
    }
    
    var easter_egg = new Konami(function() { 
        limit = false;
         $("html body").animate({ backgroundColor: "#A0A0A0" }, 1000);
    });
    
    </script>
    <style>
    	.myButton {
			-moz-box-shadow:inset 0px 1px 0px 0px #f29c93;
			-webkit-box-shadow:inset 0px 1px 0px 0px #f29c93;
			box-shadow:inset 0px 1px 0px 0px #f29c93;
			background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100));
			background:-moz-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
			background:-webkit-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
			background:-o-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
			background:-ms-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
			background:linear-gradient(to bottom, #fe1a00 5%, #ce0100 100%);
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100',GradientType=0);
			background-color:#fe1a00;
			-moz-border-radius:8px;
			-webkit-border-radius:8px;
			border-radius:8px;
			border:1px solid #d83526;
			display:inline-block;
			cursor:pointer;
			color:#ffffff;
			font-family:Arial;
			font-size:28px;
			font-weight:bold;
			padding:32px 76px;
			text-decoration:none;
			text-shadow:0px 1px 0px #b23e35;
		}
		.myButton:hover {
			background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00));
			background:-moz-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
			background:-webkit-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
			background:-o-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
			background:-ms-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
			background:linear-gradient(to bottom, #ce0100 5%, #fe1a00 100%);
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00',GradientType=0);
			background-color:#ce0100;
		}
		.myButton:active {
			position:relative;
			top:1px;
		}
		
		div.cont {
		   height: 100%;
           position: relative;
		    text-align: center;
		}              /* 1 */
        div.cont p {
           position: absolute;
           top: 50%;
           left: 50%;
           transform: translate(-50%, -50%) }
    </style>
  </head>
  <body onload="loadSound();" bgcolor="#0F0F0F">
    <div class="cont">
        <p>
            <img src="/images/saintepelle.png" width="70%"></img>
            <button onclick="playSound();" class="playSound myButton">Invoquer la Sainte Pelle !</button>
        </p>
    </div>
  </body>
</html>