@import url("https://fonts.googleapis.com/css?family=Bad+Script|Caveat");body{width:100%;height:100%;overflow-x:hidden;overflow-y:hidden;background:-webkit-gradient(linear,left top,left bottom,color-stop(2%,#aea6fc),color-stop(2%,#fefefe));background:linear-gradient(#aea6fc 2%,#fefefe 2%);background-size:100% 68px;margin:0 auto;}body.blaks{background:rgb(0 0 0 / 50%);}#wrapsbody{width:90%;height:100%;border-right:3px solid red;margin:auto auto;}#wrapsgame{width:100%;height:1000px;margin:0 auto;}#wraps{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-between;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-ms-flex-wrap:nowrap;flex-wrap:nowrap;margin-top:5px;width:100%;}#scoreboard{max-width:230px;margin-top:-60px;}.flex_center{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;}#menu{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;z-index:1;}#regulations,#blockHints{width:90%;z-index:5;background:-webkit-gradient(linear,left top,left bottom,color-stop(2%,#aea6fc),color-stop(2%,#fefefe));background:linear-gradient(#aea6fc 2%,#fefefe 2%);background-size:100% 39px;position:absolute;margin:auto;left:0;right:0;overflow-x:hidden;overflow-y:hidden;text-align:center;display:none;}#regulations h1,#blockHints h1{margin-bottom:15px;}.center{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative;}.fontsize{font-size:48px;line-height:48px;}.headline{font-family:Caveat,cursive;color:#0033ff;font-size:35px;line-height:38px;font-weight:bold;}.messages{font-size:35px;line-height:40px;margin:-10px;}.befaft:before{width:27px;background:url(img/executioner.png);margin:0 -40px;}.befaft:after{width:24px;background:url(img/Skull.png);margin:0 410px;}.befaft:before,.befaft:after{border-bottom:3px solid red;content:"";background-repeat:no-repeat;display:block;position:absolute;padding-bottom:1px;height:50px;top:10px;}button{width:280px;height:60px;margin-bottom:10px;background:#fefefe;border-radius:0 65px 0 65px;border:2px solid #0033ff;outline:none;}button:hover{-webkit-box-shadow:0 0 8px 2px rgba(0,0,0,.8);box-shadow:0 0 8px 2px rgba(0,0,0,.8);border:2px solid #000;border-radius:65px 0 65px 0;cursor:url(img/hand.png),pointer;color:#000;background-color:rgba(165,164,164,.5);}button:active{-webkit-box-shadow:0 0 15px 3px rgba(0,0,0,1.2) inset;box-shadow:0 0 15px 3px rgba(0,0,0,1.2) inset;}input{width:48px;height:48px;outline:3px solid #0033ff;text-align:center;margin:15px;z-index:1;}input:hover{border-radius:15px;border:2px solid #0033ff;}input:active{-webkit-box-shadow:0 0 8px 2px rgba(0,0,0,.5) inset;box-shadow:0 0 8px 2px rgba(0,0,0,.5) inset;border:3px solid #0033ff;}#regulations p,#blockHints p,.manuscript{font-family:"Bad Script",cursive;font-size:25px;text-align:center;font-weight:bold;margin-top:0;}#regulations p,#blockHints p{line-height:20px;z-index:1;}.manuscript{line-height:20px;width:230px;z-index:1;}h1,h3{margin:0 auto;text-align:center;font-family:Caveat,cursive;}h1{padding-top:0;color:red;font-size:35px;line-height:45px;border-bottom:3px solid red;max-width:400px;}h3{font-size:25px;line-height:25px;}#mycanvas{background:url("img/gallows.png");width:33%;max-width:256px;height:512px;margin-left:15px;}#moon{width:85px;height:96px;display:block;position:absolute;top:10px;right:5px;background:url(img/moon.png);}#reaper{width:167px;height:150px;display:block;position:fixed;left:5px;bottom:0;background:url(img/reaper.png);z-index:0;}#bat{width:189px;height:85px;display:block;position:absolute;left:200px;top:0;background:url(img/bat.png);z-index:0;}#BlackSkull{width:43px;height:55px;display:block;background:url(img/BlackSkull.png);}#witchbroom{display:block;width:120px;height:124px;position:fixed;background:url(img/witchbroom.png);left:5px;top:10px;z-index:0;}#skeleton{width:200px;height:238px;display:block;position:fixed;right:-10px;bottom:0;z-index:3;background:url(img/skeleton.png);background-repeat:no-repeat;z-index:0;}#tree{width:206px;height:256px;display:block;position:fixed;left:350px;bottom:0;background:url(img/tree.png);z-index:0;}#info{width:285px;height:200px;display:-webkit-box;display:-ms-flexbox;display:flex;text-align:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:url(img/WebInSquare.png);background-repeat:no-repeat;opacity:0;z-index:3;-webkit-transition:opacity 2s;transition:opacity 2s;position:relative;bottom:10px;right:210px;-webkit-box-shadow:none;box-shadow:none;}#win{background:url(img/win.png);}#gameover{background:url(img/gameover.png);}#gameover,#win{width:100%;height:100%;position:absolute;top:0;left:0;right:0;bottom:0;z-index:99999;background-repeat:no-repeat;background-position:50% 50%;background-color:rgba(0,0,0,.25);display:none;text-align:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-family:Caveat,cursive;font-weight:bold;line-height:65px;font-size:65px;color:#fff;text-shadow:2px -1px 4px #000000;}#Batbottom{height:113px;width:55px;display:block;position:absolute;bottom:15px;left:-250px;background:url(img/Batbottom.png);z-index:2;-webkit-animation:animbat 60s linear infinite;animation:animbat 60s linear infinite;}#hiddenword,#hiddenletters,#attempt{height:45px;}.fade-in{animation:fadeIn ease 1s;-webkit-animation:fadeIn ease 1s;-moz-animation:fadeIn ease 1s;-o-animation:fadeIn ease 1s;-ms-animation:fadeIn ease 1s;}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes animbat{0%{left:-350px}50%{left:125%}100%{left:-350px}}@keyframes animbat{0%{left:-350px}50%{left:125%}100%{left:-350px}}#hid{display:none;}@media screen and (min-width:1366px){#info{background:#fefefe;bottom:5px;left:0;height:130px;-webkit-box-shadow:-2px -2px 25px 0 rgba(0,0,0,.3);box-shadow:-2px -2px 25px 0 rgba(0,0,0,.3);border:#000 5px solid;border-radius:15px;position:relative;z-index:3}}@media screen and (max-width:1366px){#info{width:285px;height:200px;display:-webkit-box;display:-ms-flexbox;display:flex;text-align:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:url(img/WebInSquare.png);background-repeat:no-repeat;opacity:0;z-index:3;-webkit-transition:opacity 2s;transition:opacity 2s;position:relative;bottom:0;right:100px;-webkit-box-shadow:none;box-shadow:none}}@media screen and (max-width:1280px){#info{background:#fefefe;border:#000 5px solid;border-radius:15px;height:130px;-webkit-box-shadow:-2px -2px 25px 0 rgba(0,0,0,.3);box-shadow:-2px -2px 25px 0 rgba(0,0,0,.3);right:0;bottom:5px}#regulations p,#blockHints p{font-size:20px}#skeleton{display:none}}@media screen and (max-width:1245px){#bat,#moon,#tree{display:none}#menu{margin-top:-37px}}@media screen and (max-width:1020px){.befaft::before,.befaft::after{display:none}button{width:90%}.headline{font-size:20px;line-height:20px}.manuscript{font-size:20px}}@media screen and (max-width:850px){#mycanvas{width:45%}}@media screen and (max-width:750px){#scoreboard{margin-top:-40px;max-width:150px}h1{font-size:25px;line-height:30px;max-width:200px}.manuscript{font-size:15px}#info{position:fixed;border:none;box-shadow:none;height:50px}}@media screen and (max-height:600px){#info{background:#fefefe;border:#000 5px solid;border-radius:15px;height:130px;-webkit-box-shadow:-2px -2px 25px 0 rgba(0,0,0,.3);box-shadow:-2px -2px 25px 0 rgba(0,0,0,.3);right:0;bottom:5px;width:200px}#regulations p,#blockHints p{font-size:20px}#skeleton{display:none}}@media screen and (max-height:495px){#info{position:fixed;border:none;box-shadow:none;height:50px}.manuscript{font-size:15px}.messages{font-size:30px;line-height:30px}#Batbottom,#reaper{display:none}button{width:90%;height:10%}.headline{font-size:20px;line-height:20px}@media screen and (max-height:320px){.manuscript{font-size:15px}#hiddenword{height:15px}.messages{font-size:30px;line-height:30px}button{width:90%;height:8%}.headline{font-size:15px;line-height:15px}}@media screen and (max-height:270px){.manuscript{font-size:10px}#hiddenword{height:10px}.messages{font-size:20px;line-height:20px}button{width:90%;height:7%}.headline{font-size:15px;line-height:15px}}}