html,body{width:100%;height:100%;font-family:'ProximaNova-Bold-webfont',Arial,sans-serif;}
html{overflow:hidden;}
body{margin:0;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background:#ffffff;}
.rotate-screen{position:fixed;width:100%;height:100%;left:0;top:0;bottom:0;right:0;display:none;background:url('../preloader/orange_gradient.jpg') no-repeat center center;background-size:cover;z-index:999;font-size:20px;font-size:2.5vw;text-align:center;color:#fff;text-transform:uppercase;}
@media all and (orientation:landscape){.is-mobile.snapad .rotate-screen,.is-mobile.other .rotate-screen{display:block;}}
.rotate-icon{position:absolute;width:12.75%;height:10%;top:50%;left:50%;margin-top:-5%;-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);}
.rotate-label{position:absolute;top:50%;left:50%;margin-top:10%;-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);}
.load-indicator{position:absolute;width:182px;height:210px;top:50%;left:50%;z-index:999;-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);-webkit-animation:fadein 2s;-moz-animation:fadein 2s;-ms-animation:fadein 2s;animation:fadein 2s;}
.load-indicator svg{fill:transparent;stroke:#fff;stroke-width:3px;stroke-dashoffset:1000;stroke-dasharray:1000;animation:fill 1.5s ease-in-out alternate infinite;-webkit-animation-delay:0.333s;-moz-animation-delay:0.333s;-ms-animation-delay:0.333s;animation-delay:0.333s;}
@keyframes fill{0%,20%{stroke-dashoffset:1000;} 80%,100%{stroke-dashoffset:0;}}
@-webkit-keyframes fill{0%,20%{stroke-dashoffset:1000;} 80%,100%{stroke-dashoffset:0;}}
.container{display:block;overflow:hidden;}
.container-wrapper{width:100%;height:100%;}
.logo{display:none;}
.is-desktop body{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;background:#fcfcd9 url('../desktop/frame.jpg') repeat-x top center;}
.is-desktop .container{width:600px;height:800px;box-shadow:0 0 40px rgba(0,0,0,0.3);}
.is-desktop canvas{border-radius:15px;}
.is-desktop .logo{width:calc(50% - 300px);height:100%;bottom:0;top:0;left:0;right:0;display:block;position:absolute;background:url('../desktop/logo.png') no-repeat center center;}
@media (max-width:1230px){.is-desktop .logo{background-image:url('../desktop/logo_small.png');}}
@media (max-height:750px){.is-desktop .logo{width:calc(50% - 281.25px);}}
@media (max-height:700px){.is-desktop .logo{width:calc(50% - 262.5px);}}
@media (max-height:650px){.is-desktop .logo{width:calc(50% - 243.75px);}}
@media (max-height:600px){.is-desktop .logo{width:calc(50% - 225px);}}
@media (max-height:550px){.is-desktop .logo{width:calc(50% - 206.25px);}}
@media (max-height:500px){.is-desktop .logo{width:calc(50% - 187.5px);}}
.is-desktop .container-wrapper{width:1300px;height:800px;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;}
@media (max-height:750px){.is-desktop .container-wrapper{-webkit-transform:scale(0.875);-moz-transform:scale(0.875);-ms-transform:scale(0.875);transform:scale(0.875);}}
@media (max-height:700px){.is-desktop .container-wrapper{-webkit-transform:scale(0.8125);-moz-transform:scale(0.8125);-ms-transform:scale(0.8125);transform:scale(0.8125);}}
@media (max-height:650px){.is-desktop .container-wrapper{-webkit-transform:scale(0.75);-moz-transform:scale(0.75);-ms-transform:scale(0.75);transform:scale(0.75);}}
@media (max-height:600px){.is-desktop .container-wrapper{-webkit-transform:scale(0.6875);-moz-transform:scale(0.6875);-ms-transform:scale(0.6875);transform:scale(0.6875);}}
@media (max-height:550px){.is-desktop .container-wrapper{-webkit-transform:scale(0.625);-moz-transform:scale(0.625);-ms-transform:scale(0.625);transform:scale(0.625);}}
@media (max-height:500px){.is-desktop .container-wrapper{-webkit-transform:scale(0.5625);-moz-transform:scale(0.5625);-ms-transform:scale(0.5625);transform:scale(0.5625);}}
.is-mobile .container{width:100%;height:100%;}
canvas{position:relative;overflow:hidden;width:100%;height:100%;}
@keyframes fadein{from{opacity:0;}
to{opacity:1;}}
@-moz-keyframes fadein{from{opacity:0;}
to{opacity:1;}}
@-webkit-keyframes fadein{from{opacity:0;}
to{opacity:1;}}
@-ms-keyframes fadein{from{opacity:0;}
to{opacity:1;}}
@-o-keyframes fadein{from{opacity:0;}
to{opacity:1;}}

