@font-face{font-family:oswald;src:url(./fonts/Oswald-Regular.ttf)}body{background:#45160a;overflow:hidden}html,body{width:100%;height:100%;margin:0;padding:0;box-sizing:border-box}html #loader-container,body #loader-container{width:100%;height:100%;position:absolute;top:0;left:0;background:#00000087;z-index:1;cursor:not-allowed}html #loader-container #loader,body #loader-container #loader{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}html #loader-container .dot,body #loader-container .dot{width:10px;height:10px;border:2px solid #fff;border-radius:50%;float:left;margin:0 5px;-webkit-transform:scale(0);transform:scale(0);-webkit-animation:fx 1000ms ease infinite 0ms;animation:fx 1000ms ease infinite 0ms}html #loader-container .dot:nth-child(2),body #loader-container .dot:nth-child(2){-webkit-animation:fx 1000ms ease infinite 300ms;animation:fx 1000ms ease infinite 300ms}html #loader-container .dot:nth-child(3),body #loader-container .dot:nth-child(3){-webkit-animation:fx 1000ms ease infinite 600ms;animation:fx 1000ms ease infinite 600ms}@keyframes fx{50%{-webkit-transform:scale(1);transform:scale(1);opacity:1}100%{opacity:0}}html #logo,body #logo{height:4.5%;margin:5.5% auto;display:block}html .fadeout,body .fadeout{-webkit-transition:opacity .5s ease-in-out;transition:opacity .5s ease-in-out;opacity:0 !important}html .fadein,body .fadein{-webkit-transition:opacity .5s ease-in-out;transition:opacity .5s ease-in-out;opacity:1 !important}html #screen--1,body #screen--1{height:90%;width:inherit;position:relative;overflow:hidden;will-change:opacity}html #screen--1 img,body #screen--1 img{position:absolute;max-width:90%}html #screen--1 img#intro-text,body #screen--1 img#intro-text{height:46%;left:5%;top:7%;will-change:opacity}html #screen--1 img#bar-opened,body #screen--1 img#bar-opened{height:20.5%;left:5%;bottom:20%;will-change:bottom}html #screen--1 img#bar-opened.moveup,body #screen--1 img#bar-opened.moveup{animation:moveUp .5s linear;-webkit-animation:moveUp .5s linear;animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards}html #screen--1 img#getStarted,body #screen--1 img#getStarted{bottom:5%;left:50%;transform:translateX(-50%);height:8%;will-change:opacity}html #screen--1 #askAge,body #screen--1 #askAge{position:absolute;width:inherit;height:80%;padding:5%;top:20%;box-sizing:border-box;left:100%;will-change:left}html #screen--1 #askAge #birthday-text,body #screen--1 #askAge #birthday-text{position:static;width:50%;margin-top:10%}html #screen--1 #askAge #ageSelection,body #screen--1 #askAge #ageSelection{display:flex;align-items:flex-start;justify-content:flex-start;width:100%;margin:9% 0 0}html #screen--1 #askAge #ageSelection .c-dropdown,body #screen--1 #askAge #ageSelection .c-dropdown{position:relative;width:auto;color:#fff;background:#311009;border:0;border-radius:0;min-width:0;font-family:"oswald",Helvetica,Arial,sans-serif;font-weight:100;text-align:center;text-transform:uppercase;margin-right:2%;height:48px}html #screen--1 #askAge #ageSelection .c-dropdown span,body #screen--1 #askAge #ageSelection .c-dropdown span{padding:0 25px 0;font-size:30px}html #screen--1 #askAge #ageSelection .c-dropdown select,body #screen--1 #askAge #ageSelection .c-dropdown select{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0}html #screen--1 #askAge #minAgeText,body #screen--1 #askAge #minAgeText{height:3%;margin-top:4%}html #screen--1 #askAge #ageCTA,body #screen--1 #askAge #ageCTA{display:flex;width:90%;justify-content:space-between;position:absolute;bottom:7%;height:10%}html #screen--1 #askAge #ageCTA img,body #screen--1 #askAge #ageCTA img{position:static;width:45%;opacity:.5}html #screen--1 #askAge #ageCTA img.active,body #screen--1 #askAge #ageCTA img.active{opacity:1}html #screen--1 #askAge.moveleft,body #screen--1 #askAge.moveleft{animation:moveLeft .5s linear .25s;-webkit-animation:moveLeft .5s linear .25s;animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards}html #screen--2,body #screen--2{display:none;height:90%;width:inherit;position:relative;overflow:hidden;box-sizing:border-box}html #screen--2 .container,body #screen--2 .container{opacity:0;will-change:opacity;padding:5%;box-sizing:border-box;height:100%}html #screen--2 .container img,body #screen--2 .container img{max-width:90%}html #screen--2 .container img#sorryText,body #screen--2 .container img#sorryText{height:45%;margin-top:5%}html #screen--2 .container img#piece,body #screen--2 .container img#piece{height:30%;margin:6% 0 8%}html #screen--2 .container img#continue,body #screen--2 .container img#continue{height:9%;display:block;margin:0 0 0 auto}html #screen--2 .container img#pieceFront,body #screen--2 .container img#pieceFront{height:21%}html #screen--2 .container img#cameraAccessText,body #screen--2 .container img#cameraAccessText{height:42%;margin:6% 0}html #screen--2 .container img#TAndC,body #screen--2 .container img#TAndC{height:11%}html #screen--2 .container .action,body #screen--2 .container .action{display:flex;justify-content:space-between;align-items:center;margin:8% 0 0}html #screen--2 .container .action img,body #screen--2 .container .action img{width:40%}html #screen--2 .container .action img#withoutAccess,body #screen--2 .container .action img#withoutAccess{width:20%}html #screen--3,body #screen--3{display:none;height:90%;width:inherit;position:relative;overflow:hidden}html #screen--3 #tutorial,body #screen--3 #tutorial{height:100%;padding:5%;opacity:0;box-sizing:border-box}html #screen--3 #tutorial .tutorialTitle,body #screen--3 #tutorial .tutorialTitle{display:block;margin:0 auto;height:6%}html #screen--3 #tutorial #tutorialText,body #screen--3 #tutorial #tutorialText{margin:10% 0;height:46%}html #screen--3 #tutorial #tutorialEmoji,body #screen--3 #tutorial #tutorialEmoji{width:80%;margin:0 auto 10%;display:block}html #screen--3 #tutorial #begin,body #screen--3 #tutorial #begin{height:7%;display:block;margin:0 auto}html #screen--3 #question,body #screen--3 #question{height:100%;padding:5%;display:none;opacity:0;box-sizing:border-box}html #screen--3 #question #questionTitle,body #screen--3 #question #questionTitle{display:block;margin:0 auto;height:6%}html #screen--3 #question #question-text,body #screen--3 #question #question-text{margin:15% 0;max-width:70%}html #screen--3 #question #question-next,body #screen--3 #question #question-next{position:absolute;bottom:8%;left:50%;transform:translateX(-50%);height:9%}html #screen--3 #detection,body #screen--3 #detection{height:100%;padding:5%;display:none;opacity:0;box-sizing:border-box}html #screen--3 #detection #questionTextTiny,body #screen--3 #detection #questionTextTiny{width:100%}html #screen--3 #detection #detectedExpression,body #screen--3 #detection #detectedExpression{width:80%;display:block;margin:0 auto}html #screen--3 #detection #instructionText,body #screen--3 #detection #instructionText{width:80%;position:absolute;left:50%;transform:translateX(-50%);bottom:25%}html #screen--3 #detection #tiny-emojis,body #screen--3 #detection #tiny-emojis{width:100%;position:absolute;left:50%;transform:translateX(-50%);bottom:7%;height:14%;padding:2% 0;box-sizing:border-box;display:flex;justify-content:space-evenly}html #screen--3 #detection #tiny-emojis img,body #screen--3 #detection #tiny-emojis img{height:100%;border-radius:50%;border:4px solid transparent;transition:border .3s ease-in-out}html #screen--3 #detection #tiny-emojis img.selected,body #screen--3 #detection #tiny-emojis img.selected{border-color:#fff}html #screen--4,body #screen--4{display:none;height:100%;width:inherit;position:absolute;top:0;overflow:hidden}html #screen--4 img,body #screen--4 img{width:100%;max-height:110%;display:none}html #screen--end,body #screen--end{display:none;height:90%;width:inherit;position:relative;overflow:hidden}html #screen--end .container,body #screen--end .container{opacity:0;will-change:opacity;padding:5%;box-sizing:border-box;height:100%}html #screen--end .container img,body #screen--end .container img{max-width:90%}html #screen--end .container img#ageBelow18EndText,body #screen--end .container img#ageBelow18EndText{height:45%;margin-top:8%}html #screen--end .container img#bar-opened,body #screen--end .container img#bar-opened{height:20%;margin:13% 0}html #screen--end .container img#ur-text,body #screen--end .container img#ur-text{height:8%;margin-left:4%}html #screen--end .container img#end-bar,body #screen--end .container img#end-bar{margin:7% 0}html #screen--end .container img#endText,body #screen--end .container img#endText{height:40%;margin-left:4%}html #screen--end .container img.knowMore,body #screen--end .container img.knowMore{height:9%;display:block;margin:0 auto}html #screen--end .container #endScreenCTA,body #screen--end .container #endScreenCTA{display:flex;width:100%;height:8%;justify-content:space-around;margin:12% 0}html #screen--end .container #endScreenCTA img,body #screen--end .container #endScreenCTA img{width:40%}html #screen--end .container #endScreenCTA img.knowMore,body #screen--end .container #endScreenCTA img.knowMore{height:auto;margin:0}@keyframes moveUp{from{bottom:20%;height:20.5%}to{bottom:77%;height:17.5%}}@keyframes moveLeft{from{left:100%}to{left:0%}}/*# sourceMappingURL=index.css.map */
