@import url("../fonts/livory.css");@import url("../fonts/proxima.css");*{margin:0;padding:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html{font-family:'livory', serif;line-height:1.3;font-size:1em;background-color:#A9B1B0}body,html{width:100%;height:100%;overflow:hidden}body .background-img{position:fixed;display:block;min-width:100%;min-height:100%;overflow:hidden}body .background-img svg.floor{position:absolute;width:100%;min-width:2000px;left:50%;-webkit-transform:translate(-50%, 50vh);-moz-transform:translate(-50%, 50vh);-ms-transform:translate(-50%, 50vh);-o-transform:translate(-50%, 50vh);transform:translate(-50%, 50vh)}@media (min-width: 1024px) and (min-height: 1300px){body .background-img svg.floor{-webkit-transform:translate(-50%, 40vh);-moz-transform:translate(-50%, 40vh);-ms-transform:translate(-50%, 40vh);-o-transform:translate(-50%, 40vh);transform:translate(-50%, 40vh)}}body .salute{overflow:hidden;position:fixed;width:100%;height:100%;text-align:center;top:20px;color:#fff}@media (min-width: 1024px){body .salute{top:5vh}}body .salute span{display:block;max-width:500px;margin:0 auto}body .salute span.name{font-family:'proxima-extrabold', sans-serif;font-size:2rem;text-transform:uppercase;line-height:1}@media (min-width: 600px){body .salute span.name{font-size:3rem}}body .salute span.wish{font-size:1.5rem;line-height:1.3;font-family:'livory-italic', serif;padding:0 30px}@media (min-width: 600px){body .salute span.wish{font-size:2rem}}body .instruction{-webkit-transition:left 1s ease-in-out;transition:left 1s ease-in-out;bottom:92px;left:-100%;position:fixed;text-align:left;padding:20px;background-color:#e94b3e;color:#ffffff;width:500px;line-height:1.5}@media (max-width: 600px){body .instruction{width:calc(100% - 60px)}}body .instruction.active{left:0}body .instruction:after{content:'×';width:30px;height:30px;display:inline-block;background-color:#ffffff;text-align:center;border-radius:100%;color:#e94b3e;position:absolute;right:-10px;top:-10px;box-sizing:border-box;border:3px solid #e94b3e;font-size:2em;line-height:0.7;padding-left:1px;cursor:pointer}body .footer{position:fixed;bottom:0;width:100%;text-align:center;padding:20px 0;background-color:#A9B1B0}@media (max-width: 600px){body .footer{text-align:left}}body .footer svg{-webkit-transform:translateY(20%);-moz-transform:translateY(20%);-ms-transform:translateY(20%);-o-transform:translateY(20%);transform:translateY(20%)}@media (max-width: 600px){body .footer svg{padding-left:20px}}body .footer span{font-size:1.2rem;line-height:1;color:#ffffff;display:block}@media (max-width: 600px){body .footer span{padding-left:20px}}body .footer span:first-child{margin-bottom:2px}body .footer span:last-child{margin-top:7px}body .footer span.info{text-align:center;position:absolute;right:20px;top:calc(50% - 25px);height:30px;width:30px;border-radius:100%;border:3px solid #ffffff;background-color:#ffffff;line-height:31px;font-family:'proxima-bold', sans-serif;padding:0;cursor:pointer;color:#A9B1B0}body .modal{-webkit-transition:opacity .2s;transition:opacity .2s;opacity:0;pointer-events:none;position:fixed;background-color:rgba(0,0,0,0.7);width:100%;height:100%;z-index:1000}body .modal.active{opacity:1;pointer-events:all}body .modal .modal-wrapper{line-height:1.4;position:relative;width:60%;max-width:400px;top:50%;left:50%;padding:30px;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);background-color:#ffffff;border-radius:4px;-webkit-box-shadow:0px 0px 10px 0px rgba(0,0,0,0.3);-moz-box-shadow:0px 0px 10px 0px rgba(0,0,0,0.3);box-shadow:0px 0px 10px 0px rgba(0,0,0,0.3)}body .modal .modal-wrapper p{margin-bottom:20px}body .modal .modal-wrapper h2{font-family:'Proxima', sans-serif;margin-bottom:10px}body .modal .modal-wrapper .modal-button{font-family:'Proxima', sans-serif;text-transform:uppercase;background-color:#e22727;padding:10px 20px;border-radius:4px;display:block;text-align:center;color:#ffffff;text-decoration:none;cursor:pointer}body .modal .modal-wrapper .modal-button:hover,body .modal .modal-wrapper .modal-button:active,body .modal .modal-wrapper .modal-button:focus{background-color:#d91717;text-decoration:none}body .xmas-band{position:fixed;width:942px;height:457px;left:50%;top:25%;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%)}@media (max-width: 1024px){body .xmas-band{width:822px}}@media (max-width: 768px){body .xmas-band{width:411px;top:35%}}@media (max-width: 768px) and (max-height: 750px){body .xmas-band{top:280px}}@media (max-width: 600px) and (max-height: 750px){body .xmas-band{top:220px}}@media (max-height: 400px){body .xmas-band{top:100px}}@media (max-width: 600px) and (max-height: 400px){body .xmas-band{top:200px}}body .xmas-band .sync-state{display:block;text-align:center;position:relative;font-family:'proxima-bold', sans-serif;text-transform:uppercase;color:#ffffff;letter-spacing:0px;top:50%;transform-origin:50%;opacity:0;pointer-events:none;text-shadow:0 2px 4px rgba(0,0,0,0.3)}body .xmas-band .sync-state.active{animation:status 1.6s linear}body .xmas-band .band-mate{cursor:pointer;position:absolute;bottom:0}body .xmas-band .band-mate:nth-of-type(1){-webkit-transform:translate(0%, -90px);-moz-transform:translate(0%, -90px);-ms-transform:translate(0%, -90px);-o-transform:translate(0%, -90px);transform:translate(0%, -90px)}body .xmas-band .band-mate:nth-of-type(2){-webkit-transform:translate(100%, -90px);-moz-transform:translate(100%, -90px);-ms-transform:translate(100%, -90px);-o-transform:translate(100%, -90px);transform:translate(100%, -90px)}body .xmas-band .band-mate:nth-of-type(3){-webkit-transform:translate(200%, -90px);-moz-transform:translate(200%, -90px);-ms-transform:translate(200%, -90px);-o-transform:translate(200%, -90px);transform:translate(200%, -90px)}body .xmas-band .band-mate:nth-of-type(4){-webkit-transform:translate(0%, 0px);-moz-transform:translate(0%, 0px);-ms-transform:translate(0%, 0px);-o-transform:translate(0%, 0px);transform:translate(0%, 0px)}body .xmas-band .band-mate:nth-of-type(5){-webkit-transform:translate(100%, 0px);-moz-transform:translate(100%, 0px);-ms-transform:translate(100%, 0px);-o-transform:translate(100%, 0px);transform:translate(100%, 0px)}body .xmas-band .band-mate:nth-of-type(6){-webkit-transform:translate(200%, 0px);-moz-transform:translate(200%, 0px);-ms-transform:translate(200%, 0px);-o-transform:translate(200%, 0px);transform:translate(200%, 0px)}@media (min-width: 769px){body .xmas-band .band-mate:nth-of-type(1){-webkit-transform:translateX(0%);-moz-transform:translateX(0%);-ms-transform:translateX(0%);-o-transform:translateX(0%);transform:translateX(0%)}body .xmas-band .band-mate:nth-of-type(2){-webkit-transform:translateX(100%);-moz-transform:translateX(100%);-ms-transform:translateX(100%);-o-transform:translateX(100%);transform:translateX(100%)}body .xmas-band .band-mate:nth-of-type(3){-webkit-transform:translateX(200%);-moz-transform:translateX(200%);-ms-transform:translateX(200%);-o-transform:translateX(200%);transform:translateX(200%)}body .xmas-band .band-mate:nth-of-type(4){-webkit-transform:translateX(300%);-moz-transform:translateX(300%);-ms-transform:translateX(300%);-o-transform:translateX(300%);transform:translateX(300%)}body .xmas-band .band-mate:nth-of-type(5){-webkit-transform:translateX(400%);-moz-transform:translateX(400%);-ms-transform:translateX(400%);-o-transform:translateX(400%);transform:translateX(400%)}body .xmas-band .band-mate:nth-of-type(6){-webkit-transform:translateX(500%);-moz-transform:translateX(500%);-ms-transform:translateX(500%);-o-transform:translateX(500%);transform:translateX(500%)}}@media (max-width: 1024px){body .xmas-band .band-mate{width:137px}}body .xmas-band .band-mate.active #Mund-lachend{opacity:0 !important}body .xmas-band .band-mate.active #Mund-2{opacity:0 !important}body .xmas-band .band-mate svg{width:157px;overflow:visible}@media (max-width: 1024px){body .xmas-band .band-mate svg{width:137px}}body .xmas-band .band-mate svg #Mund_singend_1,body .xmas-band .band-mate svg #Mund_singend_2,body .xmas-band .band-mate svg #Augen_zu,body .xmas-band .band-mate svg #Mund-lachend{opacity:0}body .xmas-band .band-mate svg #Auge_rechts,body .xmas-band .band-mate svg #Auge_links{transform-origin:50%}body .xmas-band .band-mate svg #Mund_singend_1{transform-origin:50%}body .xmas-band .band-mate svg #kopf-und-oberkoerper{transform-origin:50% 100%;-webkit-animation-direction:alternate;animation-direction:alternate;-webkit-animation-timing-function:ease;animation-timing-function:ease}body .xmas-band .band-mate svg .beatbox{opacity:0}@keyframes blink{95%{-webkit-transform:scaleY(1);-moz-transform:scaleY(1);-ms-transform:scaleY(1);-o-transform:scaleY(1);transform:scaleY(1)}100%{-webkit-transform:scaleY(0.1);-moz-transform:scaleY(0.1);-ms-transform:scaleY(0.1);-o-transform:scaleY(0.1);transform:scaleY(0.1)}}@keyframes head-bang{0%{-webkit-transform:scale(1) rotate(0.01deg);-moz-transform:scale(1) rotate(0.01deg);-ms-transform:scale(1) rotate(0.01deg);-o-transform:scale(1) rotate(0.01deg);transform:scale(1) rotate(0.01deg)}100%{-webkit-transform:scale(2) rotate(0.01deg);-moz-transform:scale(2) rotate(0.01deg);-ms-transform:scale(2) rotate(0.01deg);-o-transform:scale(2) rotate(0.01deg);transform:scale(2) rotate(0.01deg)}}@keyframes idle-head{0%{-webkit-transform:translate(0px, 0px) rotate(0.01deg);-moz-transform:translate(0px, 0px) rotate(0.01deg);-ms-transform:translate(0px, 0px) rotate(0.01deg);-o-transform:translate(0px, 0px) rotate(0.01deg);transform:translate(0px, 0px) rotate(0.01deg)}50%{-webkit-transform:translate(0px, -3px) rotate(0.01deg);-moz-transform:translate(0px, -3px) rotate(0.01deg);-ms-transform:translate(0px, -3px) rotate(0.01deg);-o-transform:translate(0px, -3px) rotate(0.01deg);transform:translate(0px, -3px) rotate(0.01deg)}100%{-webkit-transform:translate(0px, 0px);-moz-transform:translate(0px, 0px);-ms-transform:translate(0px, 0px);-o-transform:translate(0px, 0px);transform:translate(0px, 0px)}}@keyframes idle-body{0%{-webkit-transform:translate(0px, 0px) rotate(0.01deg);-moz-transform:translate(0px, 0px) rotate(0.01deg);-ms-transform:translate(0px, 0px) rotate(0.01deg);-o-transform:translate(0px, 0px) rotate(0.01deg);transform:translate(0px, 0px) rotate(0.01deg)}50%{-webkit-transform:translate(0px, 4px) rotate(0.01deg);-moz-transform:translate(0px, 4px) rotate(0.01deg);-ms-transform:translate(0px, 4px) rotate(0.01deg);-o-transform:translate(0px, 4px) rotate(0.01deg);transform:translate(0px, 4px) rotate(0.01deg)}100%{-webkit-transform:translate(0px, 0px) rotate(0.01deg);-moz-transform:translate(0px, 0px) rotate(0.01deg);-ms-transform:translate(0px, 0px) rotate(0.01deg);-o-transform:translate(0px, 0px) rotate(0.01deg);transform:translate(0px, 0px) rotate(0.01deg)}}@keyframes idle-arm-right{0%{-webkit-transform:rotate(1.5deg);-moz-transform:rotate(1.5deg);-ms-transform:rotate(1.5deg);-o-transform:rotate(1.5deg);transform:rotate(1.5deg)}50%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(1.5deg);-moz-transform:rotate(1.5deg);-ms-transform:rotate(1.5deg);-o-transform:rotate(1.5deg);transform:rotate(1.5deg)}}@keyframes idle-arm-left{0%{-webkit-transform:rotate(-1.5deg);-moz-transform:rotate(-1.5deg);-ms-transform:rotate(-1.5deg);-o-transform:rotate(-1.5deg);transform:rotate(-1.5deg)}50%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(-1.5deg);-moz-transform:rotate(-1.5deg);-ms-transform:rotate(-1.5deg);-o-transform:rotate(-1.5deg);transform:rotate(-1.5deg)}}@keyframes mouth{50%{-webkit-transform:scaleY(1);-moz-transform:scaleY(1);-ms-transform:scaleY(1);-o-transform:scaleY(1);transform:scaleY(1)}100%{-webkit-transform:scaleY(1.2);-moz-transform:scaleY(1.2);-ms-transform:scaleY(1.2);-o-transform:scaleY(1.2);transform:scaleY(1.2)}}@keyframes body-on-beat{0%{-webkit-transform:rotate(-1deg);-moz-transform:rotate(-1deg);-ms-transform:rotate(-1deg);-o-transform:rotate(-1deg);transform:rotate(-1deg)}50%{-webkit-transform:rotate(1deg);-moz-transform:rotate(1deg);-ms-transform:rotate(1deg);-o-transform:rotate(1deg);transform:rotate(1deg)}100%{-webkit-transform:rotate(-1deg);-moz-transform:rotate(-1deg);-ms-transform:rotate(-1deg);-o-transform:rotate(-1deg);transform:rotate(-1deg)}}@keyframes status{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);opacity:0}30%{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);opacity:1}90%{-webkit-transform:scale(1.6);-moz-transform:scale(1.6);-ms-transform:scale(1.6);-o-transform:scale(1.6);transform:scale(1.6);opacity:1}100%{-webkit-transform:scale(2.5);-moz-transform:scale(2.5);-ms-transform:scale(2.5);-o-transform:scale(2.5);transform:scale(2.5);opacity:0}}