html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block
}
body {
	line-height: 1
}
ol, ul {
	list-style: none
}
blockquote, q {
	quotes: none
}
blockquote:before, blockquote:after {
	content: "";
	content: none
}
q:before, q:after {
	content: "";
	content: none
}
table {
	border-collapse: collapse;
	border-spacing: 0
}
@font-face {
	font-family: "wimpykidregular";
	src: url("../fonts/wimpykid-webfont.woff2") format("woff2"), url("../fonts/wimpykid-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal
}
@font-face {
	font-family: "wimpykiddialogue";
	src: url("../fonts/wimpykid-dialogue.woff2") format("woff2"), url("../fonts/wimpykid-dialogue.woff") format("woff");
	font-weight: normal;
	font-style: normal
}
html, body {
	height: 100%
}
html {
	font-family: "wimpykidregular", sans-serif
}
body {
	overflow-x: hidden
}
a {
	text-decoration: none;
	outline: none
}
.menuToggle {
	position: absolute;
	z-index: 2;
	transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transform: translateY(0);
	top: 15px;
	right: 15px;
	border: none;
	background: #fff;
	border: 10px solid #fff
}
.menuToggle i {
	width: 32px;
	height: 32px
}
.menuToggle i svg {
	width: 32px;
	height: 32px;
	fill: #000
}
.menuToggle.hidden {
	transform: translateY(-80px)
}
i.icon {
	vertical-align: middle;
	display: inline-block
}
p {
	color: #000
}
button {
	background: none;
	outline: none;
	border: none;
	-webkit-appearance: none;
	cursor: pointer;
	border-radius: 0;
	padding: 0;
	margin: 0;
	transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	font-size: 20px
}
button:disabled {
	cursor: default;
	color: #000;
	opacity: 0.25;
	transform: scale(0.75)
}
button.red, button.black {
	height: 66px;
	position: relative
}
button.red span, button.black span {
	position: relative;
	z-index: 2;
	text-align: center;
	margin: 0 20px 0 20px;
	background: #fd4100;
	height: 65px;
	box-sizing: border-box;
	display: inline-block;
	padding-top: 32px;
	min-width: 207px;
	line-height: 0;
	color: #fff
}
button.red:before, button.black:before {
	content: "";
	position: absolute;
	width: 40px;
	background: #fff url("../images/ui/red-left-cap.png") no-repeat top;
	background-size: 40px 66px;
	height: 100%;
	left: 0;
	z-index: 1
}
button.red:after, button.black:after {
	content: "";
	position: absolute;
	width: 40px;
	background: #fff url("../images/ui/red-right-cap.png") no-repeat top;
	background-size: 40px 66px;
	height: 100%;
	right: 0;
	z-index: 1
}
button.black span {
	background: #000
}
button.black:before {
	background-image: url("../images/ui/black-left-cap.png")
}
button.black:after {
	background-image: url("../images/ui/black-right-cap.png")
}
button.outlined {
	height: 66px;
	position: relative;
	font-size: 25px
}
button.outlined span {
	position: relative;
	text-align: center;
	margin: 0 20px 0 20px;
	background: #fff url("../images/ui/button-middle.svg") repeat-x top;
	background-size: 287.9px 66px;
	height: 66px;
	box-sizing: border-box;
	display: inline-block;
	padding-top: 32px;
	min-width: 207px;
	line-height: 0
}
button.outlined:before {
	content: "";
	position: absolute;
	width: 23px;
	background: #fff url("../images/ui/button-left-cap.svg") no-repeat top;
	background-size: 23.4px 66px;
	height: 100%;
	left: 0
}
button.outlined:after {
	content: "";
	position: absolute;
	width: 23px;
	background: #fff url("../images/ui/button-right-cap.svg") no-repeat top;
	background-size: 23.3px 66px;
	height: 100%;
	right: 0
}
button, input {
	font-family: "wimpykiddialogue", Helvetica, sans-serif
}
#root {
	background: url("../images/ui/rules.gif");
	background-size: 361px 422px;
	height: 100%;
	overflow: hidden
}
#hidden {
	display: none
}
[v-cloak] {
	display: none
}
i.icon.arrow-down-white {
	background: url("../images/ui/icons/arrow-down-white.svg") no-repeat center center
}
i.icon.arrow-right-white {
	background: url("../images/ui/icons/arrow-right-white.svg") no-repeat center center
}
i.icon.chevron-right {
	background: url("../images/ui/icons/chevron-right.svg") no-repeat center center
}
i.icon.chevron-right-white {
	background: url("../images/ui/icons/chevron-right-white.svg") no-repeat center center
}
i.icon.chevron-left {
	background: url("../images/ui/icons/chevron-left.svg") no-repeat center center
}
i.icon.chevron-down {
	background: url("../images/ui/icons/chevron-down.svg") no-repeat center center
}
i.icon.chevron-down-outlined {
	background: url("../images/ui/icons/chevron-down-outlined.svg") no-repeat center center
}
i.icon.chevron-up {
	background: url("../images/ui/icons/chevron-up.svg") no-repeat center center
}
i.icon.chevron-up-outlined {
	background: url("../images/ui/icons/chevron-up-outlined.svg") no-repeat center center
}
i.icon.chevron-up-white {
	background: url("../images/ui/icons/chevron-up-white.svg") no-repeat center center
}
i.icon.back {
	background: url("../images/ui/icons/arrow-left.svg") no-repeat center center
}
i.icon.edit {
	background: url("../images/ui/icons/edit.svg") no-repeat center center
}
i.icon.redo {
	background: url("../images/ui/icons/redo.svg") no-repeat center center
}
i.icon.redo.white {
	background: url("../images/ui/icons/redo-white.svg") no-repeat center center
}
i.icon.camera {
	background: url("../images/ui/icons/camera-white.svg") no-repeat center center
}
i.icon.check {
	background: url("../images/ui/icons/check.svg") no-repeat center center
}
i.icon.close {
	background: url("../images/ui/icons/close.svg") no-repeat center center
}
i.icon.family-add {
	background: url("../images/ui/icons/family.svg") no-repeat center center
}
i.icon.mobile-rotate {
	background: url("../images/ui/icons/mobile-rotate.svg") no-repeat center center
}
footer {
	text-align: center;
	background-color: #000;
	color: #fff;
	padding: 40px 0;
	min-height: 50px;
	position: relative;
	font-family: Arial, sans-serif;
	font-size: 0
}
footer .locale-selector, footer .legal-logos, footer .movie-rating {
	vertical-align: middle;
	display: inline-block
}
footer .locale-selector.hidden, footer .legal-logos.hidden, footer .movie-rating.hidden {
	display: none
}
footer .movie-rating {
	margin-top: -15px
}
footer .legal-logos {
	padding: 0 0 0 40px;
	opacity: 0.6
}
footer .legal-logos img {
	padding: 0 20px 0 0;
	width: 60%;
}
footer .movie-rating-image {
	opacity: 0.6;
	max-height: 45px;
	width: auto;
	margin-bottom: 10px
}
footer .legal-text, footer .rating-reasons {
	font-size: 12px;
	line-height: 15px
}
footer .legal-text a, footer .rating-reasons a {
	color: #fff
}
footer .legal-text a:hover, footer .rating-reasons a:hover {
	color: #fff !important
}
footer .legal-text {
	display: inline-block;
	max-width: 900px
}
footer .rating-reasons {
	font-size: 10px;
	line-height: 12px
}
footer .rating-reasons a {
	text-decoration: underline
}
footer .rating-reasons a:after {
	content: "";
	display: inline-block;
	margin-right: 5px
}
footer .rating-reasons a:last-of-type:after {
	/* margin-right: 0;
	content: "" */
}
footer .left, footer .right {
	position: absolute;
	z-index: 2;
	top: 40px
}
footer .left {
	width: 290px;
	left: 0
}
footer .right {
	width: 290px;
	right: 0
}
footer .center {
	position: relative;
	padding: 0 290px 0 290px;
	z-index: 1
}

@media screen and (max-width: 1150px) {
footer .legal-logos {
	padding-left: 20px
}
footer .left, footer .right {
	position: relative;
	display: inline-block;
	box-sizing: border-box;
	right: auto;
	left: auto;
	top: auto
}
footer .left {
	width: 60%
}
footer .right {
	width: 40%
}
footer .center {
	display: block;
	padding: 40px 80px
}
}

@media screen and (max-width: 630px) {
footer .center {
	padding: 40px
}
footer .left, footer .right {
	display: block;
	width: 100%
}
footer .right {
	padding-top: 40px
}
}

@media screen and (max-width: 450px) {
footer .left .locale-selector {
	display: block;
	padding-bottom: 40px
}
}
.ua-phone footer .legal-text a {
	color: #fff !important
}
.ua-phone footer .legal-text a:hover {
	color: #fff !important
}
#ieUpgrade {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	display: none
}
#ieUpgrade .centered {
	position: absolute;
	width: 100%;
	left: 0;
	top: 20%;
	text-align: center
}
#ieUpgrade .centered .logoWrap {
	width: 300px;
	padding-bottom: 30px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
	border-bottom: 1px solid #000
}
#ieUpgrade .centered strong {
	font-size: 40px;
	display: block;
	margin-bottom: 20px
}
#ieUpgrade .centered p {
	margin-bottom: 20px;
	font-size: 18px;
	line-height: 20px
}
#ieUpgrade .centered a {
	display: inline-block;
	background: #fd4100;
	padding: 10px 20px;
	color: #fff;
	text-transform: uppercase
}
html.ie10below #ieUpgrade {
	display: block;
	z-index: 99
}
#intro {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: .99;
	overflow: hidden
}
#intro.intro-enter-active, #intro.intro-leave-active {
	transition: all .8s linear
}
#intro.intro-enter-active h1, #intro.intro-enter-active button.create, #intro.intro-leave-active h1, #intro.intro-leave-active button.create {
	transition: all .5s cubic-bezier(0.175, 0.885, 0.32, 1.275)
}
#intro.intro-enter-active ul, #intro.intro-leave-active ul {
	transition: all .6s cubic-bezier(0.19, 1, 0.22, 1) .2s
}
#intro.intro-enter-active h1, #intro.intro-leave-active h1 {
	transition-delay: .1s
}
#intro.intro-enter-active button.create, #intro.intro-leave-active button.create {
	transition-delay: .3s
}
#intro.intro-enter h1, #intro.intro-leave-active h1 {
	top: -200px
}
#intro.intro-enter ul, #intro.intro-leave-active ul {
	opacity: 0;
	transform: scale(.65)
}
#intro.intro-enter button.create, #intro.intro-leave-active button.create {
	bottom: -200px
}
#intro button.create {
	position: absolute;
	bottom: 40px;
	left: 50%;
	transform: translateX(-50%);
	font-size: 20px
}
#intro button.create span {
	padding-top: 23px;
	min-width: 247px
}
#intro button.create i {
	vertical-align: middle;
	display: inline-block
}
#intro button.create i.icon {
	width: 23px;
	height: 21px;
	margin-left: 10px
}
#intro h1 {
	position: absolute;
	top: 55px;
	left: 50%;
	overflow: hidden;
	transform: translateX(-50%);
	width: 289px;
	height: 112px;
	background-size: 100%;
	text-indent: -100%;
	z-index: 2
}

@media screen and (max-width: 460px) {
#intro h1 {
	top: 65px;
	left: 43%
}
}

@media screen and (max-width: 320px) {
#intro h1 {
	width: 230px;
	height: 90px
}
}
#intro #homeContainer {
	position: absolute;
	left: 50%;
	width: 1000px;
	margin-left: -500px;
	bottom: 100px;
	top: 0
}

@media screen and (max-height: 740px) {
#intro #homeContainer {
	transform: scale(.75)
}
}

@media screen and (max-width: 800px) {
#intro #homeContainer {
	top: 85px;
	transform: scale(.7)
}
}

@media screen and (max-width: 320px) {
#intro #homeContainer {
	transform: scale(.55);
	top: 95px
}
}
#intro #homeContainer .polaroid {
	position: absolute;
	width: 315px;
	height: 330px;
	margin: 0 auto;
	margin-top: 40px;
	border-radius: 12px;
	border: 5px solid #000;
	background: #fff;
	overflow: hidden;
	background: #fff;
	box-sizing: border-box;
	padding: 14px;
	top: 0
}
#intro #homeContainer .polaroid .pictureContainer {
	border: 2px solid #000;
	position: relative;
	width: 273px;
	height: 273px;
	display: block;
	z-index: 2;
	background-size: 100%;
	background-position: center center;
	background-repeat: no-repeat
}
#intro #homeContainer .polaroid:nth-child(1) {
	left: 0;
	z-index: 1;
	margin-top: -95px;
	top: 50%;
	transform: rotate(-11deg);
	transition-delay: .1s
}
#intro #homeContainer .polaroid:nth-child(1) .pictureContainer {
	background-image: url("../images/home/1.gif")
}
#intro #homeContainer .polaroid:nth-child(2) {
	left: 142px;
	z-index: 2;
	margin-top: -55px;
	top: 50%;
	transform: rotate(9deg);
	transition-delay: .4s
}
#intro #homeContainer .polaroid:nth-child(2) .pictureContainer {
	background-image: url("../images/home/2.gif")
}
#intro #homeContainer .polaroid:nth-child(3) {
	left: 50%;
	margin-left: -157px;
	margin-top: -115px;
	z-index: 5;
	top: 50%;
	transform: rotate(-1deg);
	transition-delay: .8s
}
#intro #homeContainer .polaroid:nth-child(3) .pictureContainer {
	background-image: url("../images/home/3.gif")
}
#intro #homeContainer .polaroid:nth-child(4) {
	left: 486px;
	z-index: 4;
	transform: rotate(10.4deg);
	margin-top: -105px;
	top: 50%;
	transition-delay: .55s
}
#intro #homeContainer .polaroid:nth-child(4) .pictureContainer {
	background-image: url("../images/home/4.gif")
}
#intro #homeContainer .polaroid:nth-child(5) {
	left: 714px;
	z-index: 3;
	transform: rotate(10.7deg);
	margin-top: -95px;
	top: 50%;
	transition-delay: .65s
}
#intro #homeContainer .polaroid:nth-child(5) .pictureContainer {
	background-image: url("../images/home/5.gif")
}
#intro #homeContainer.group-1 .polaroid:nth-child(1) .pictureContainer {
	background-image: url("../images/home/6.gif")
}
#intro #homeContainer.group-1 .polaroid:nth-child(2) .pictureContainer {
	background-image: url("../images/home/7.gif")
}
#intro #homeContainer.group-1 .polaroid:nth-child(3) .pictureContainer {
	background-image: url("../images/home/8.gif")
}
#intro #homeContainer.group-1 .polaroid:nth-child(4) .pictureContainer {
	background-image: url("../images/home/9.gif")
}
#intro #homeContainer.group-1 .polaroid:nth-child(5) .pictureContainer {
	background-image: url("../images/home/10.gif")
}
#intro #homeContainer.group-2 .polaroid:nth-child(1) .pictureContainer {
	background-image: url("../images/home/11.gif")
}
#intro #homeContainer.group-2 .polaroid:nth-child(2) .pictureContainer {
	background-image: url("../images/home/12.gif")
}
#intro #homeContainer.group-2 .polaroid:nth-child(3) .pictureContainer {
	background-image: url("../images/home/13.gif")
}
#intro #homeContainer.group-2 .polaroid:nth-child(4) .pictureContainer {
	background-image: url("../images/home/14.gif")
}
#intro #homeContainer.group-2 .polaroid:nth-child(5) .pictureContainer {
	background-image: url("../images/home/15.gif")
}
#intro #homeContainer.drop-enter-active, #intro #homeContainer.drop-leave-active {
	transition: all 1.5s cubic-bezier(0.19, 1, 0.22, 1)
}
#intro #homeContainer.drop-enter-active .polaroid, #intro #homeContainer.drop-leave-active .polaroid {
	transition: all 1.2s cubic-bezier(0.19, 1, 0.22, 1)
}
#intro #homeContainer.drop-enter-active .polaroid:nth-child(1), #intro #homeContainer.drop-leave-active .polaroid:nth-child(1) {
	transition-delay: .1s
}
#intro #homeContainer.drop-enter-active .polaroid:nth-child(2), #intro #homeContainer.drop-leave-active .polaroid:nth-child(2) {
	transition-delay: .3s
}
#intro #homeContainer.drop-enter-active .polaroid:nth-child(3), #intro #homeContainer.drop-leave-active .polaroid:nth-child(3) {
	transition-delay: .65s
}
#intro #homeContainer.drop-enter-active .polaroid:nth-child(4), #intro #homeContainer.drop-leave-active .polaroid:nth-child(4) {
	transition-delay: .35s
}
#intro #homeContainer.drop-enter-active .polaroid:nth-child(5), #intro #homeContainer.drop-leave-active .polaroid:nth-child(5) {
	transition-delay: .15s
}
#intro #homeContainer.drop-leave-active .polariod {
	transition: all 1.2s cubic-bezier(0.945, 0.03, 0.295, 0.995)
}
#intro #homeContainer.drop-enter, #intro #homeContainer.drop-leave-active {
	opacity: .99
}
#intro #homeContainer.drop-enter .polaroid, #intro #homeContainer.drop-leave-active .polaroid {
	opacity: 0
}
#intro #homeContainer.drop-enter .polaroid:nth-child(1), #intro #homeContainer.drop-leave-active .polaroid:nth-child(1) {
	transform: rotate(-21deg) scale(1.5) translate(-100px, 100px)
}
#intro #homeContainer.drop-enter .polaroid:nth-child(2), #intro #homeContainer.drop-leave-active .polaroid:nth-child(2) {
	transform: rotate(15deg) scale(1.6) translate(-50px, -100px)
}
#intro #homeContainer.drop-enter .polaroid:nth-child(3), #intro #homeContainer.drop-leave-active .polaroid:nth-child(3) {
	transform: rotate(-15deg) scale(1.7) translate(-100px, 100px)
}
#intro #homeContainer.drop-enter .polaroid:nth-child(4), #intro #homeContainer.drop-leave-active .polaroid:nth-child(4) {
	transform: rotate(25deg) scale(1.6) translate(50px, -100px)
}
#intro #homeContainer.drop-enter .polaroid:nth-child(5), #intro #homeContainer.drop-leave-active .polaroid:nth-child(5) {
	transform: rotate(21deg) scale(1.5) translate(100px, -100px)
}
#creator {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	overflow: hidden;
	z-index: 1;
	background: #fff
}
#creator #characterStage canvas {
	transition: 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;
	touch-action: auto !important
}
#creator.finishVisible #characterStage canvas {
	transform: translateY(-90px)
}
#creator button.share {
	position: absolute;
	top: -130px;
	left: 50%;
	height: 50px;
	transform: translateX(-50%);
	font-size: 12px;
	z-index: 4;
	transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
	background: #fd4100;
	border-radius: 8px;
	text-align: center;
	padding: 0 20px;
	box-sizing: border-box
}
#creator button.share span {
	color: #fff;
	vertical-align: middle;
	font-size: 19px;
	margin-right: 12px
}
#creator button.share i.icon {
	width: 26px;
	height: 22px;
	background-size: 26px 22px;
	vertical-align: middle
}

@media screen and (max-width: 800px) {
#creator button.share {
	padding: 0 15px
}
#creator button.share span {
	font-size: 15px
}
#creator button.share i.icon {
	width: 25px;
	height: 20px;
	background-size: 100% 100%
}
}
#creator button.familyAdd {
	position: absolute;
	top: -60px;
	right: 80px;
	width: 46px;
	height: 45px;
	z-index: 4;
	transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s;
	background: url("../images/ui/icons/family-add.svg") no-repeat left bottom;
	background-size: 41px 39px
}

@media screen and (max-width: 800px) {
#creator button.familyAdd {
	right: auto;
	left: 25px
}
}
#creator.stageVisible button.share {
	top: 13px
}

@media screen and (max-width: 800px) {
#creator.stageVisible button.share {
	top: 15px
}
}
#creator.stageVisible button.familyAdd {
	top: 16px
}
#creator #zoomOutHeader {
	position: absolute;
	width: 100%;
	font-size: 19px;
	text-align: center;
	top: -40px;
	transition: 0.5s top cubic-bezier(0.19, 1, 0.22, 1) 0.1s
}
#creator #zoomOutHeader.visible {
	top: 90px
}
#creator #zoomOutAdd {
	position: absolute;
	width: 50px;
	height: 50px;
	border: 3px solid #fd4100;
	border-radius: 30px;
	left: 50%;
	transform: translateX(-50%);
	bottom: -100px;
	transition: 0.5s bottom cubic-bezier(0.19, 1, 0.22, 1) 0.15s
}

@media screen and (max-width: 800px) {
#creator #zoomOutAdd {
	transition: 0.5s bottom cubic-bezier(0.19, 1, 0.22, 1) 0.15s
}
}
#creator #zoomOutAdd span {
	color: #fd4100;
	font-size: 38px;
	display: block;
	position: absolute;
	left: 13px;
	top: 25px;
	line-height: 0
}
#creator #zoomOutAdd.visible {
	bottom: 25px
}
#categorySelector {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 90px;
	text-align: center;
	background: #000;
	transform: translateX(0);
	z-index: 3;
	height: 100%;
	white-space: nowrap;
	overflow: hidden;
	box-sizing: border-box;
	padding-top: 20px
}
#categorySelector.slide-enter-active, #categorySelector.slide-leave-active {
	transition: all 0.42s cubic-bezier(0.19, 1, 0.22, 1)
}
#categorySelector.slide-enter, #categorySelector.slide-leave-active {
	transform: translateX(-90px)
}

@media screen and (max-width: 800px) {
#categorySelector {
	height: 70px;
	width: 100%;
	padding-top: 0;
	transform: translateY(0)
}
#categorySelector.slide-enter, #categorySelector.slide-leave-active {
	transform: translateY(80px)
}
}
#categorySelector .desktopScroller {
	position: relative;
	height: 100%;
	display: block;
	overflow: hidden
}

@media screen and (max-width: 800px) {
#categorySelector .desktopScroller {
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	width: 100%
}
}
#categorySelector ul {
	position: relative;
	font-size: 0
}

@media screen and (max-width: 800px) {
#categorySelector ul {
	height: auto;
	overflow: visible
}
}
#categorySelector ul li {
	display: block
}

@media screen and (max-width: 800px) {
#categorySelector ul li {
	display: inline-block
}
}
#categorySelector ul li button {
	height: 70px;
	width: 70px;
	margin: 0;
	background-size: 35px 35px;
	background-position: center center;
	background-repeat: no-repeat;
	opacity: 0.4;
	position: relative;
	transition: opacity 0.3s;
	overflow: hidden
}
#categorySelector ul li button:before {
	content: "";
	position: absolute;
	background: #fd4100;
	border-radius: 3px;
	opacity: 0;
	transition: all 0.45s cubic-bezier(0.19, 1, 0.22, 1) 0.15s;
	left: -6px;
	width: 4px;
	height: 42px;
	bottom: 12px
}

@media screen and (max-width: 800px) {
#categorySelector ul li button:before {
	width: 42px;
	height: 4px;
	left: 14px;
	bottom: -6px
}
}
#categorySelector ul li.active button {
	opacity: 1
}
#categorySelector ul li.active button:before {
	opacity: 1;
	left: 2px
}

@media screen and (max-width: 800px) {
#categorySelector ul li.active button:before {
	left: 14px;
	bottom: 6px
}
}
#partsSelector {
	position: absolute;
	width: 90px;
	left: 90px;
	top: 0;
	height: 100%;
	text-align: center;
	background: #fff;
	border-right: 3px solid #000;
	transform: translateX(0);
	z-index: 2
}
#partsSelector.slide-enter-active, #partsSelector.slide-leave-active {
	transition: all 0.42s cubic-bezier(0.19, 1, 0.22, 1)
}
#partsSelector.slide-enter, #partsSelector.slide-leave-active {
	transform: translateX(-100%);
	opacity: 0
}

@media screen and (max-width: 800px) {
#partsSelector {
	transform: translateY(0);
	width: 100%;
	height: auto;
	top: auto;
	left: 0;
	bottom: 70px;
	border-top: 3px solid #000
}
#partsSelector.slide-enter, #partsSelector.slide-leave-active {
	transform: translateY(100%);
	opacity: 0
}
}
#partsSelector.hasPages .partsCarousel {
	min-height: 74px
}
#partsSelector.hasPages .indicators {
	display: block
}
#partsSelector.hasPages i.expandy {
	display: block
}
#partsSelector i.expandy, #partsSelector i.collapsy {
	position: absolute;
	right: 13px;
	top: -28px;
	font-size: 28px;
	display: none;
	cursor: pointer;
	width: 27px;
	height: 14px;
	background-size: 100%
}
#partsSelector .title {
	font-size: 20px;
	padding: 7px;
	padding-left: 14px;
	position: absolute;
	top: 28px;
	left: 93px;
	z-index: 1;
	width: auto;
	text-align: left;
	background: #fff;
	white-space: nowrap
}

@media screen and (max-width: 800px) {
#partsSelector .title {
	font-size: 16px;
	position: relative;
	left: auto;
	width: auto;
	text-align: center;
	padding: 0;
	top: auto;
	padding-top: 5px;
	font-size: 18px
}
}
#partsSelector .arrowLeft, #partsSelector .arrowRight {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	padding: 0;
	width: 14px;
	height: 27px;
	background-size: 100%
}
#partsSelector .arrowLeft i.icon, #partsSelector .arrowRight i.icon {
	width: 100%;
	height: 100%;
	background-size: 100%
}

@media screen and (max-width: 800px) {
#partsSelector .arrowLeft, #partsSelector .arrowRight {
	width: 8px;
	height: 24px
}
}
#partsSelector .arrowLeft {
	left: 13px
}
#partsSelector .arrowRight {
	right: 13px
}
#partsSelector .indicators {
	display: none;
	position: absolute;
	bottom: 6px;
	left: 50%;
	transform: translateX(-50%);
	transition: bottom 0.5s cubic-bezier(0.19, 1, 0.22, 1)
}
#partsSelector .indicators ul {
	font-size: 0
}
#partsSelector .indicators ul li {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 8px;
	background: rgba(0,0,0,0.25);
	margin: 0 3px;
	cursor: pointer;
	transition: 0.3s background linear
}
#partsSelector .indicators ul li.active {
	background: #fd4100
}
#partsSelector .partsCarousel {
	min-height: 0;
	position: relative;
	padding: 0;
	width: 100%;
	box-sizing: border-box;
	margin: 0 auto;
	height: 100%;
	z-index: 2
}

@media screen and (max-width: 800px) {
#partsSelector .partsCarousel {
	height: auto;
	min-height: 56px;
	width: 90%;
	padding-top: 3px;
	padding-bottom: 9px
}
}
#partsSelector .partsCarousel .masker {
	overflow: hidden;
	position: relative;
	transition: height 0.5s cubic-bezier(0.19, 1, 0.22, 1);
	height: 100%
}

@media screen and (max-width: 800px) {
#partsSelector .partsCarousel .masker {
	overflow: hidden;
	height: 56px
}
}
#partsSelector .partsCarousel .scroller {
	position: relative;
	left: 0;
	white-space: nowrap;
	font-size: 0;
	transition: 0.45s all cubic-bezier(0.19, 1, 0.22, 1);
	height: 95%;
	top: 0;
	left: 0
}

@media screen and (max-width: 800px) {
#partsSelector .partsCarousel .scroller {
	position: absolute;
	width: 100%;
	top: 0;
	height: auto;
	left: 0
}
}
#partsSelector .partsCarousel .scroller .page {
	display: block;
	width: auto;
	white-space: nowrap;
	font-size: 0
}

@media screen and (max-width: 800px) {
#partsSelector .partsCarousel .scroller .page {
	display: inline-block;
	width: 100%
}
}
#partsSelector .partsCarousel .part {
	width: 52px;
	height: 52px;
	display: block;
	background-size: 46px;
	background-repeat: no-repeat;
	background-position: center center;
	margin: 12px auto;
	cursor: pointer;
	font-size: 10px;
	vertical-align: middle;
	line-height: 52px;
	opacity: 1;
	transition: 0.5s opacity;
	position: relative;
	z-index: 1
}

@media screen and (max-width: 800px) {
#partsSelector .partsCarousel .part {
	display: inline-block;
	margin: 0 3px
}
}
#partsSelector .partsCarousel .part:before {
	content: "";
	position: absolute;
	width: 57px;
	height: 57px;
	background: url("../images/ui/icons/selected-circle.svg") no-repeat center center;
	background-size: 100%;
	top: -2px;
	left: -2px;
	opacity: 0;
	transition: opacity 0.25s linear;
	z-index: 2
}
#partsSelector .partsCarousel .part button.colorConfig {
	cursor: pointer;
	position: absolute;
	width: 15px;
	height: 15px;
	background: #000;
	top: 0;
	right: 0;
	display: none;
	font-size: 0
}
#partsSelector .partsCarousel .part button.colorConfig i.material-icons {
	color: #fff;
	font-size: 12px;
	position: absolute;
	left: 3px;
	top: 0
}
#partsSelector .partsCarousel .part.clear {
	text-indent: -50px;
	overflow: hidden;
	background: url("../images/ui/icons/cancel.svg") no-repeat center center;
	background-size: 24px
}
#partsSelector .partsCarousel .part.active:before {
	opacity: 1
}
#partsSelector .partsCarousel .part.active button.colorConfig {
	display: block
}
#partsSelector .partsCarousel .part.hiddenPartSizer {
	position: absolute;
	left: -200px
}
#partsSelector.expanded i.expandy {
	display: none
}
#partsSelector.expanded i.collapsy {
	display: block
}
#partsSelector.expanded .indicators {
	bottom: -20px
}
#partsSelector.expanded .arrowLeft, #partsSelector.expanded .arrowRight {
	display: none
}
#partsSelector.expanded .partsCarousel .masker {
	height: 170px;
	padding-bottom: 10px
}
#partsSelector.expanded .partsCarousel .scroller {
	white-space: normal;
	position: relative;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	max-height: 165px;
	left: 0 !important;
	transition: none
}
#partsSelector.expanded .partsCarousel .scroller .page {
	white-space: normal;
	display: block;
	margin-bottom: 6px
}
#share {
	position: absolute;
	z-index: 10;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	position: absolute;
	background: #fff url("../images/ui/rules.gif");
	background-size: 361px 422px;
	opacity: 1
}
#share.snap-enter-active, #share.snap-leave-active {
	transition: .2s opacity linear
}
#share.snap-enter, #share.snap-leave-active {
	opacity: 0
}
#share button.back {
	position: absolute;
	left: 25px;
	top: 25px;
	z-index: 3
}
#share button.back i.icon {
	width: 30px;
	height: 30px;
	background-size: contain;
	vertical-align: middle
}
#share button.back span {
	display: inline-block;
	vertical-align: middle;
	font-size: 22px;
	text-transform: uppercase;
	margin-left: 10px;
	margin-top: 4px
}

@media screen and (max-width: 510px) {
#share button.back span {
	display: none
}
}
#share .content {
	position: absolute;
	left: 0;
	right: 0;
	z-index: 2;
	box-sizing: border-box;
	padding-top: 75px;
	-webkit-overflow-scrolling: touch;
	top: 50%;
	bottom: auto;
	padding-top: 50px;
	transform: translateY(-50%);
	overflow: visible
}

@media screen and (max-width: 830px) {
#share .content {
	top: 0;
	bottom: 0;
	padding-top: 35px;
	transform: translateY(0);
	overflow-y: auto;
	-webkit-overflow-scrolling: touch
}
}
#share .content .stepTitle {
	position: absolute;
	top: 40px;
	left: 50%;
	width: 220px;
	margin-left: 140px
}

@media screen and (max-width: 830px) {
#share .content .stepTitle {
	transform: translateX(-50%);
	margin-left: 0;
	top: 35px
}
}
#share .content .stepTitle .item {
	position: absolute;
	width: 100%;
	text-align: center;
	top: 0;
	left: 0;
	font-size: 19px
}
#share .content .stepTitle .item.titleTransition-enter-active, #share .content .stepTitle .item.titleTransition-leave-active {
	transition: .6s all cubic-bezier(0.19, 1, 0.22, 1) .45s
}
#share .content .stepTitle .item.titleTransition-enter {
	transform: translateY(-25px);
	opacity: 0
}
#share .content .stepTitle .item.titleTransition-leave-active {
	transform: translateY(25px);
	opacity: 0
}
#share .content .mainWrapper {
	position: relative;
	width: 790px;
	margin: 0 auto
}

@media screen and (max-width: 830px) {
#share .content .mainWrapper {
	width: 100%
}
}
#share .content .mainWrapper .clear {
	clear: both
}
#share .content .previewWrap {
	width: 420px;
	height: 488px;
	margin: 0;
	margin-right: 60px;
	border-radius: 12px;
	border: 5px solid #000;
	transform: rotate(14deg) scale(1.5) translate(150px, -150px);
	opacity: 0;
	overflow: hidden;
	position: relative;
	transition: 1.6s all cubic-bezier(0.19, 1, 0.22, 1);
	background: #fff;
	box-sizing: border-box;
	padding: 14px;
	float: left
}

@media screen and (max-width: 830px) {
#share .content .previewWrap {
	width: 275px;
	height: 275px;
	margin: 0 auto;
	margin-top: 40px;
	float: none
}
}
#share .content .previewWrap .polaroid {
	border: 2px solid #000;
	position: relative;
	overflow: hidden;
	width: 378px;
	height: 378px
}

@media screen and (max-width: 830px) {
#share .content .previewWrap .polaroid {
	width: 233px;
	height: 187px
}
}
#share .content .previewWrap .foot {
	position: relative;
	margin-top: 8px
}
#share .content .previewWrap .foot .wimpyKid {
	position: absolute;
	left: 0;
	width: 210px;
	height: 60px
}

@media screen and (max-width: 830px) {
#share .content .previewWrap .foot .wimpyKid {
	width: 151px;
	height: 46px
}
}
#share .content .previewWrap .foot .inTheaters {
	position: absolute;
	right: 0;
	width: 127px;
	height: 34px;
	top: 12px
}

@media screen and (max-width: 830px) {
#share .content .previewWrap .foot .inTheaters {
	width: 80px;
	height: 20px
}
}
#share .content .previewWrap .logoContainer {
	position: absolute;
	width: 100%;
	text-align: center;
	top: -125px;
	z-index: 3;
	transition: top .5s cubic-bezier(0.19, 1, 0.22, 1)
}
#share .content .previewWrap .logoContainer .the {
	display: none;
	color: #fd4100;
	text-align: center;
	font-size: 12px
}

@media screen and (max-width: 830px) {
#share .content .previewWrap .logoContainer .the {
	font-size: 6px
}
}
#share .content .previewWrap .logoContainer .familyName {
	display: none;
	margin-top: 2px;
	color: #fd4100;
	text-align: center;
	font-size: 29px;
	font-family: "wimpykiddialogue", Helvetica, sans-serif;
}

@media screen and (max-width: 830px) {
#share .content .previewWrap .logoContainer .familyName {
	font-size: 15px
}
}
#share .content .previewWrap .logoContainer .logo {
	background: url("../images/ui/download-image-logo-singular.png") no-repeat;
	background-size: contain;
	background-position: center center;
	margin: 0 auto;
	width: 137px;
	height: 30px
}

@media screen and (max-width: 830px) {
#share .content .previewWrap .logoContainer .logo {
	width: 77px;
	height: 17px
}
}
#share .content .previewWrap .logoContainer.hasLastName {
	top: 15px
}

@media screen and (max-width: 830px) {
#share .content .previewWrap .logoContainer.hasLastName {
	top: 5px
}
}
#share .content .previewWrap .logoContainer.hasLastName .the {
	display: block
}
#share .content .previewWrap .logoContainer.hasLastName .familyName {
	display: block
}
#share .content .previewWrap .logoContainer.hasLastName .logo {
	background-image: url("../images/ui/download-image-logo.png")
}
#share .content .previewWrap.loaded {
	transform: rotate(-4deg) scale(1) translate(0, 0);
	opacity: 1
}
#share .content .previewWrap img.preview {
	position: relative;
	width: 100%;
	height: 100%;
	display: block;
	z-index: 2;
	transition: margin-top .5s cubic-bezier(0.19, 1, 0.22, 1)
}

@media screen and (max-width: 830px) {
#share .content .previewWrap img.preview {
	width: 100%;
	height: 233px;
	margin-top: -25px
}
}
#share .content .stepWrap {
	margin-top: 30px;
	width: 310px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	text-align: center;
	float: left
}

@media screen and (max-width: 830px) {
#share .content .stepWrap {
	float: none
}
}
#share .content .stepWrap p {
	line-height: 30px;
	font-size: 20px;
	margin-bottom: 20px
}

@media screen and (max-width: 830px) {
#share .content .stepWrap p {
	font-size: 16px;
	line-height: 22px;
	margin-bottom: 10px
}
}
#share .content .stepWrap button.fullWidth {
	margin-bottom: 20px;
	margin-left: 5px;
	font-size: 17px
}
#share .content .stepWrap button.fullWidth span {
	min-width: 255px
}

@media screen and (max-width: 830px) {
#share .content .stepWrap button.fullWidth {
	margin-bottom: 10px;
	transform: scale(.9);
	margin-top: -10px
}
}
#share .content .stepWrap .step.stepTransition-enter-active, #share .content .stepWrap .step.stepTransition-leave-active {
	transition: all .75s cubic-bezier(0.19, 1, 0.22, 1)
}
#share .content .stepWrap .step.stepTransition-enter, #share .content .stepWrap .step.stepTransition-leave-active {
	opacity: 0;
	position: absolute;
	transform: scale(.5)
}
#share #step-initial-share .hasFam {
	margin-top: 40px
}
#share #step-initial-share button.makeEdits {
	font-size: 17px
}

@media screen and (max-width: 830px) {
#share #step-initial-share button.makeEdits {
	font-size: 15px;
	margin-top: -10px
}
}
#share #step-initial-share button.makeEdits .icon.edit {
	vertical-align: middle;
	width: 17px;
	height: 17px;
	background-size: contain;
	margin-bottom: 5px
}
#share #step-initial-share button.addFamilyMember {
	font-size: 17px
}
#share #step-initial-share button.addFamilyMember span {
	line-height: 20px;
	padding-top: 12px
}
#share #step-add-name {
	margin-top: -10px
}

@media screen and (max-width: 830px) {
#share #step-add-name {
	margin-top: -20px
}
}
#share #step-add-name .inputWrap {
	width: 280px;
	margin: 0 auto;
	position: relative;
	padding-top: 10px
}
#share #step-add-name .inputWrap input {
	display: block;
	width: 100%;
	margin: 0 auto;
	border: none;
	-webkit-appearance: none;
	border-radius: 0;
	font-size: 40px;
	color: #000;
	background: none;
	font-family: "wimpykiddialogue", Helvetica, sans-serif;
	outline: none;
	padding: 5px;
	text-align: center;
	position: relative;
	z-index: 2;
	height: 60px;
	line-height: 60px
}

@media screen and (max-width: 800px) {
#share #step-add-name .inputWrap input {
	vertical-align: middle
}
}
#share #step-add-name .inputWrap input::-ms-clear {
display:none;
width:0;
height:0
}
#share #step-add-name .inputWrap .validationError {
	color: #fd4100;
	position: absolute;
	top: -12px;
	font-size: 15px;
	text-align: center;
	left: 0;
	width: 100%;
	z-index: 3
}
#share #step-add-name .inputWrap .validationError.scale-enter-active, #share #step-add-name .inputWrap .validationError.scale-leave-active {
	transition: all .45s cubic-bezier(0.19, 1, 0.22, 1)
}
#share #step-add-name .inputWrap .validationError.scale-enter, #share #step-add-name .inputWrap .validationError.scale-leave-active {
	opacity: 0;
	transform: scale(.5)
}
#share #step-add-name .inputWrap:after {
	content: "";
	position: absolute;
	bottom: 8px;
	z-index: 1;
	left: 0;
	height: 1px;
	width: 100%;
	border-bottom: 5px solid #000
}
#share #step-add-name label {
	display: block;
	text-align: center;
	padding: 7px 0 25px 0;
	font-size: 14px
}
#share #step-add-name button.skip {
	font-size: 20px
}
#share #step-done {
	margin-top: 20px;
	text-align: center
}
#share #step-done .downloadBttnWrap {
	display: inline-block;
	background: none;
	padding: 0;
	position: relative;
	vertical-align: middle;
	margin-right: 8px
}
#share #step-done .downloadBttnWrap img {
	position: absolute;
	z-index: 2;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0
}
#share #step-done .downloadBttnWrap button {
	position: relative;
	z-index: 1;
	font-size: 17px;
	padding-right: 3px
}
#share #step-done .downloadBttnWrap button span {
	min-width: 0
}
#share #step-done .downloadBttnWrap button.tapHold span {
	line-height: 19px;
	font-size: 14px;
	padding-top: 14px
}
#share #step-done span.legal {
	display: block;
	font-size: 16px;
	line-height: 21px;
	padding: 0 30px;
	margin-bottom: 20px
}
#share #step-done span.legal a {
	color: #000;
	text-decoration: underline
}

@media screen and (max-width: 830px) {
#share #step-done span.legal {
	font-size: 12px;
	line-height: 19px;
	margin-bottom: 10px;
	padding: 0
}
}
#share #step-done .shareMenu {
	font-size: 0;
	box-sizing: border-box;
	display: inline-block;
	vertical-align: middle
}
#share #step-done .shareMenu button {
	width: 74px;
	height: 66px;
	display: inline-block;
	margin: 0;
	padding: 0
}
#share #step-done .shareMenu button.facebook {
	background: url("../images/ui/social-left-bkg.svg") no-repeat;
	background-size: contain;
	margin-right: 6px
}
#share #step-done .shareMenu button.twitter {
	background: url("../images/ui/social-right-bkg.svg") no-repeat;
	background-size: contain
}
#share #step-done .shareMenu button.twitter svg {
	margin-left: 2px
}
#share #step-done .shareMenu button svg {
	width: 44px;
	height: 50px;
	margin-top: 5px
}
#share #step-done .tools {
	margin-top: 20px
}
#share #step-done .tools button {
	display: block;
	text-align: center;
	font-size: 18px;
	width: 100%;
	margin: 0;
	margin-bottom: 10px;
	height: 30px
}

@media screen and (max-width: 830px) {
#share #step-done .tools button {
	margin-bottom: 0;
	height: auto
}
}
#share #step-done .tools button i.icon {
	width: 22px;
	height: 18px;
	vertical-align: middle;
	background-size: contain;
	background-position-x: center
}
#mainMenu {
	position: absolute;
	right: 0;
	width: 100%;
	height: 100%;
	z-index: 3;
	transform: translateX(0);
	color: #fff;
	text-align: center
}
#mainMenu .bkg {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: none
}
#mainMenu .content {
	position: absolute;
	height: 100%;
	z-index: 2;
	width: 460px;
	padding: 25px;
	box-sizing: border-box;
	background: #000;
	right: 0
}

@media screen and (max-width: 460px) {
#mainMenu .content {
	width: 100%
}
#mainMenu .bkg {
	display: none
}
}
#mainMenu.menuSlide-enter-active, #mainMenu.menuSlide-leave-active {
	transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1)
}
#mainMenu.menuSlide-enter-active img.logo, #mainMenu.menuSlide-leave-active img.logo {
	transition: opacity 0.3s linear 0.5s
}
#mainMenu.menuSlide-enter-active ul li, #mainMenu.menuSlide-leave-active ul li {
	transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.2s
}
#mainMenu.menuSlide-enter-active ul li.second, #mainMenu.menuSlide-leave-active ul li.second {
	transition-delay: 0.3s
}
#mainMenu.menuSlide-enter-active ul li.third, #mainMenu.menuSlide-leave-active ul li.third {
	transition-delay: 0.4s
}
#mainMenu.menuSlide-enter-active .social a, #mainMenu.menuSlide-leave-active .social a {
	transition: all 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s
}
#mainMenu.menuSlide-enter-active .social a.second, #mainMenu.menuSlide-leave-active .social a.second {
	transition-delay: 0.6s
}
#mainMenu.menuSlide-enter, #mainMenu.menuSlide-leave-active {
	transform: translateX(100%)
}
#mainMenu.menuSlide-enter img.logo, #mainMenu.menuSlide-leave-active img.logo {
	opacity: 0
}
#mainMenu.menuSlide-enter ul li, #mainMenu.menuSlide-leave-active ul li {
	transform: translateX(-100px);
	opacity: 0
}
#mainMenu.menuSlide-enter .social a, #mainMenu.menuSlide-leave-active .social a {
	transform: translateY(25px) !important;
	opacity: 0
}
#mainMenu button.startOver {
	position: absolute;
	top: 200px;
	left: 50%;
	transform: translateX(-50%);
	color: #fff
}
#mainMenu button.startOver i.icon {
	vertical-align: middle;
	width: 17px;
	height: 17px;
	margin-right: 5px
}
#mainMenu button.startOver span {
	color: #fff;
	vertical-align: middle;
	font-size: 18px
}
#mainMenu button.audio {
	position: absolute;
	top: 25px;
	left: 25px;
	color: #fff
}
#mainMenu button.audio .masker {
	width: 26px;
	height: 26px;
	overflow: hidden;
	position: relative
}
#mainMenu button.audio i.icon {
	background: url("../images/ui/icons/sound.svg") no-repeat;
	width: 26px;
	height: 26px
}
#mainMenu button.audio.muted .masker {
	width: 15px
}
#mainMenu button.close {
	position: absolute;
	top: 25px;
	right: 25px;
	color: #fff
}
#mainMenu button.close i.icon {
	background: url("../images/ui/icons/close-white.svg") no-repeat;
	width: 26px;
	height: 26px
}
#mainMenu img.logo {
	width: 280px;
	margin-top: 30px;
	object-fit: contain;
}
#mainMenu ul {
	position: absolute;
	width: 100%;
	left: 0;
	top: 65%;
	transform: translateY(-50%);
	margin-top: 20px
}
#mainMenu ul li {
	display: block;
	margin: 18px 0;
	color: #fff;
	font-size: 25px;
	transform: translateX(0)
}
#mainMenu ul li span {
	cursor: pointer
}
#mainMenu ul li a {
	color: #fff;
	cursor: pointer
}
#mainMenu .wimpyKidLogo {
	position: absolute;
	width: 101px;
	height: 56px;
	background: url("../images/ui/wimpy-kid-logo.png") no-repeat;
	background-size: 100%;
	overflow: hidden;
	text-indent: -400px;
	font-size: 10px;
	bottom: 80px;
	left: 50%;
	margin-left: -50px;
	visibility: hidden;
}
#mainMenu .social {
	position: absolute;
	left: 25px;
	right: 25px;
	text-align: center
}
#mainMenu .social a {
	transform: translateY(0);
	opacity: 1;
	display: inline-block
}
#mainMenu .social a svg {
	width: 35px;
	height: 35px
}
#mainMenu .social a svg path {
	fill: #fff
}
#preloader {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 4;
	opacity: 1;
	overflow: hidden
}
#preloader.fade-leave-active {
	transition: all 1.2s
}
#preloader.fade-leave-active .bkg {
	transition: all 0.6s linear 0.4s
}
#preloader.fade-leave-active .centered {
	transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1)
}
#preloader.fade-leave-to .bkg {
	opacity: 0
}
#preloader.fade-leave-to .centered {
	transform: translate(-50%, 100%)
}
#preloader .bkg {
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: #fff url("../images/ui/rules.gif");
	background-size: 361px 422px
}
#preloader .centered {
	z-index: 2;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	text-align: center;
	/* background: url("../images/preloader/preloader.png") no-repeat bottom center; */
	background-size: auto 100%;
	height: 100%;
	bottom: 0;
	overflow: hidden;
	min-width: 320px
}
#preloader .centered .inSign {
	position: absolute;
	left: 50%;
	transform: rotate(354deg) translateX(-50%); /* 5deg */
	width: 66vh;
	height: 52%;
	bottom: 42%
}
#preloader .centered .inSign h2 {
	margin: 0;
	padding: 0;
	height: 29%;
	display: block;
	text-indent: -150%;
	overflow: hidden;
	width: 70%;
	margin: 0 auto;
	margin-top: 6%
}
#preloader .centered .inSign .carWrap {
	padding: 0;
	position: relative;
	text-align: center;
	height: 50%;
	margin-top: 3%
}
#preloader .centered .inSign .carWrap .car {
	background: url("../images/preloader/car.png") no-repeat bottom center;
	background-size: contain;
	width: 80%;
	height: 70%;
	margin: 0 auto;
	position: relative;
	z-index: 2
}
#preloader .centered .inSign .carWrap .loadBar {
	z-index: 1;
	position: absolute;
	width: 60%;
	left: 20%;
	height: 5px;
	top: 61%;
	background: #000;
	transform: rotate(6deg)
}
#preloader .centered .inSign .carWrap .loadBar .percentLoaded {
	position: absolute;
	height: 100%;
	background: #fd4100;
	transition: width 0.1s cubic-bezier(0.19, 1, 0.22, 1)
}
#preloader .centered .inSign span {
	transform: rotate(6deg);
	position: absolute;
	width: 100%;
	text-align: center;
	bottom: 8%;
	left: 0
}
#characterTypeSelector {
	position: absolute;
	left: 0;
	top: 1px;
	width: 100%;
	height: 100%;
	z-index: 7;
	opacity: 0.99
}
#characterTypeSelector.slide-enter-active, #characterTypeSelector.slide-leave-active {
	transition: all 1s linear
}
#characterTypeSelector.slide-enter-active .bkg, #characterTypeSelector.slide-leave-active .bkg {
	transition: all 0.3s linear
}
#characterTypeSelector.slide-enter-active .centered button.start, #characterTypeSelector.slide-enter-active .centered button.cancel {
	transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.6s
}
#characterTypeSelector.slide-enter-active .centered button.cancel {
	transition-delay: 0.7s
}
#characterTypeSelector.slide-enter-active .centered h3 {
	transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275)
}
#characterTypeSelector.slide-enter-active .centered .characterWrap {
	transition: all 0.55s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s
}
#characterTypeSelector.slide-enter-active .centered .characterWrap:nth-child(2) {
	transition-delay: 0.15s
}
#characterTypeSelector.slide-enter-active .centered .characterWrap:nth-child(3) {
	transition-delay: 0.2s
}
#characterTypeSelector.slide-enter-active .centered .characterWrap:nth-child(4) {
	transition-delay: 0.25s
}
#characterTypeSelector.slide-leave-active .centered button.cancel {
	transition: all 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275)
}
#characterTypeSelector.slide-leave-active .centered button.start {
	transition: all 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.05s
}
#characterTypeSelector.slide-leave-active .centered h3 {
	transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s
}
#characterTypeSelector.slide-leave-active .centered .characterWrap {
	transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.175s
}
#characterTypeSelector.slide-leave-active .centered .characterWrap:nth-child(2) {
	transition-delay: 0.15s
}
#characterTypeSelector.slide-leave-active .centered .characterWrap:nth-child(3) {
	transition-delay: 0.125s
}
#characterTypeSelector.slide-leave-active .centered .characterWrap:nth-child(4) {
	transition-delay: 0.1s
}
#characterTypeSelector.slide-enter .bkg, #characterTypeSelector.slide-leave-active .bkg {
	opacity: 0
}
#characterTypeSelector.slide-enter {
	opacity: 1
}
#characterTypeSelector.slide-enter .centered button.cancel {
	opacity: 0;
	transform: translateY(-25px)
}
#characterTypeSelector.slide-enter .centered button.start {
	opacity: 0;
	transform: translateY(-35px)
}
#characterTypeSelector.slide-enter .centered h3 {
	opacity: 0;
	transform: translateY(-55px)
}
#characterTypeSelector.slide-enter .centered .characterWrap {
	opacity: 0;
	transform: translateY(-45px)
}
#characterTypeSelector.slide-leave-active .centered button.cancel {
	opacity: 0;
	transform: translateY(55px)
}
#characterTypeSelector.slide-leave-active .centered button.start {
	opacity: 0;
	transform: translateY(45px)
}
#characterTypeSelector.slide-leave-active .centered h3 {
	opacity: 0;
	transform: translateY(35px)
}
#characterTypeSelector.slide-leave-active .centered .characterWrap {
	opacity: 0;
	transform: translateY(25px)
}
#characterTypeSelector .bkg {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #fff url("../images/ui/rules.gif");
	background-size: 361px 422px
}
#characterTypeSelector .centered {
	z-index: 2;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	text-align: center
}
#characterTypeSelector .centered button.cancel {
	display: block;
	margin-top: 10px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	font-size: 20px
}

@media screen and (max-width: 400px) {
#characterTypeSelector .centered button.cancel {
	margin-top: 0
}
}
#characterTypeSelector .centered button.close {
	position: absolute;
	top: -35px;
	right: -35px
}
#characterTypeSelector .centered button.close i.icon.close {
	background: url("../images/ui/icons/close.svg") no-repeat;
	width: 26px;
	height: 26px
}
#characterTypeSelector .centered h3 {
	font-weight: normal;
	font-size: 24px;
	line-height: 28px;
	margin-bottom: 20px;
	text-align: center
}

@media screen and (max-width: 330px) {
#characterTypeSelector .centered h3 {
	font-size: 20px;
	margin-bottom: 4px
}
}
#characterTypeSelector .centered .characters {
	font-size: 0;
	display: block;
	overflow: hidden;
	padding-bottom: 10px
}
#characterTypeSelector .centered .characters .row .characterWrap {
	display: inline-block;
	min-width: 150px;
	height: 30vh;
	width: 20vw;
	border: 4px solid #000;
	border-radius: 10px;
	margin: 7px;
	padding: 13px;
	box-sizing: border-box;
	background: #fff;
	max-width: 240px
}

@media screen and (max-width: 330px) {
#characterTypeSelector .centered .characters .row .characterWrap {
	min-width: 140px;
	margin: 5px
}
#mainMenu ul{
	top:75%;
	
}
}
#characterTypeSelector .centered .characters .row .characterWrap .character {
	position: relative;
	height: 100%;
	width: 100%;
	background-position: bottom center;
	cursor: pointer;
	background-size: contain;
	background-repeat: no-repeat
}
#removeConfirm {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 8;
	transform: translateX(0);
	opacity: 1
}
#removeConfirm.zoom-enter-active, #removeConfirm.zoom-leave-active {
	transition: all 0.45s cubic-bezier(0.19, 1, 0.22, 1) 0.2s
}
#removeConfirm.zoom-enter, #removeConfirm.zoom-leave-active {
	transform: translateX(-153px);
	opacity: 0
}
#removeConfirm .bkg {
	background: #fff url("../images/ui/rules.gif");
	background-size: 361px 422px;
	z-index: 1;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%
}
#removeConfirm .vertCentered {
	z-index: 2;
	position: absolute;
	top: 50%;
	left: 50%;
	text-align: center;
	transform: translate(-50%, -50%)
}
#removeConfirm .vertCentered .profilePic {
	overflow: hidden;
	width: 180px;
	height: 180px;
	border-radius: 180px;
	border: 6px solid #000;
	margin: 0 auto
}
#removeConfirm .vertCentered .profilePic img {
	width: 180px
}
#removeConfirm .vertCentered .text {
	margin: 35px 0;
	font-size: 20px;
	line-height: 26px
}
#removeConfirm .vertCentered .tools {
	text-align: center;
	min-width: 210px
}
#removeConfirm .vertCentered .tools button {
	padding-bottom: 8px;
	padding: 0;
	margin: 0 20px
}
#removeConfirm .vertCentered .tools button.remove {
	background: url("../images/ui/underline.png") repeat-x;
	background-size: 90px 5px;
	background-position: bottom;
	margin-left: 0
}
#removeConfirm .vertCentered .tools button.cancel {
	margin-right: 0
}
#sceneSelector {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 9;
	opacity: 1
}
#sceneSelector.slide-enter-active, #sceneSelector.slide-leave-active, #sceneSelector.photoStepTransition {
	transition: all 1.1s cubic-bezier(0.19, 1, 0.22, 1)
}
#sceneSelector.slide-enter-active .scroller, #sceneSelector.slide-leave-active .scroller, #sceneSelector.photoStepTransition .scroller {
	transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0.1s
}
#sceneSelector.slide-enter-active button.back, #sceneSelector.slide-leave-active button.back, #sceneSelector.photoStepTransition button.back {
	transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0.65s
}
#sceneSelector.slide-enter-active button.takePhoto, #sceneSelector.slide-leave-active button.takePhoto, #sceneSelector.photoStepTransition button.takePhoto {
	transition: all 0.42s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.35s
}
#sceneSelector.slide-enter-active .title, #sceneSelector.slide-leave-active .title, #sceneSelector.photoStepTransition .title {
	transition: 0.5s top cubic-bezier(0.19, 1, 0.22, 1) 0.1s
}
#sceneSelector.slide-enter, #sceneSelector.slide-leave-active {
	opacity: 0.99
}
#sceneSelector.slide-enter .scroller, #sceneSelector.slide-leave-active .scroller {
	bottom: -75px
}
#sceneSelector.slide-enter button.back, #sceneSelector.slide-leave-active button.back {
	top: -45px
}
#sceneSelector.slide-enter button.takePhoto, #sceneSelector.slide-leave-active button.takePhoto {
	top: -80px
}
#sceneSelector.slide-enter .title, #sceneSelector.slide-leave-active .title {
	top: -40px
}
#sceneSelector .bkg {
	position: absolute;
	left: 0;
	z-index: 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%
}
#sceneSelector button.back {
	position: absolute;
	left: 15px;
	top: 15px;
	z-index: 3;
	background: #fff;
	padding: 10px
}
#sceneSelector button.back i.icon {
	width: 30px;
	height: 30px;
	background-size: contain;
	vertical-align: middle
}
#sceneSelector button.back span {
	display: inline-block;
	vertical-align: middle;
	font-size: 22px;
	text-transform: uppercase;
	margin-left: 10px;
	margin-top: 4px
}

@media screen and (max-width: 510px) {
#sceneSelector button.back span {
	display: none
}
}
#sceneSelector button.takePhoto {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	height: 50px;
	top: 25px;
	text-transform: uppercase;
	font-size: 12px;
	z-index: 4;
	transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
	background: #fd4100;
	border-radius: 8px;
	text-align: center;
	padding: 0 20px;
	box-sizing: border-box
}
#sceneSelector button.takePhoto span {
	color: #fff;
	vertical-align: middle;
	font-size: 19px;
	margin-right: 6px
}
#sceneSelector button.takePhoto i.icon {
	width: 38px;
	height: 31px;
	background-size: 32px 27px;
	vertical-align: middle
}

@media screen and (max-width: 800px) {
#sceneSelector button.takePhoto {
	padding: 0 15px;
	top: 15px
}
#sceneSelector button.takePhoto span {
	font-size: 15px
}
#sceneSelector button.takePhoto i.icon {
	width: 25px;
	height: 20px;
	background-size: 100% 100%
}
}
#sceneSelector button.takePhoto.hidden {
	top: -80px
}
#sceneSelector .title {
	position: absolute;
	width: 100%;
	font-size: 19px;
	text-align: center;
	top: 90px;
	z-index: 2;
	transition: 0.5s top cubic-bezier(0.19, 1, 0.22, 1) 0.1s
}
#sceneSelector .scroller {
	position: absolute;
	height: 70px;
	bottom: 0;
	width: 100%;
	border-top: 3px solid #000;
	text-align: center;
	overflow-y: hidden;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	background: #fff;
	white-space: nowrap;
	z-index: 3
}
#sceneSelector .scroller ul {
	font-size: 0;
	display: block
}
#sceneSelector .scroller ul li {
	display: inline-block;
	width: 45px;
	height: 45px;
	border-radius: 45px;
	border: 2px solid #000;
	margin-top: 10px;
	margin-left: 7px;
	margin-right: 7px;
	background-size: cover;
	position: relative;
	cursor: pointer;
	transition: 0.25s border-color linear
}
#sceneSelector .scroller ul li.active {
	border-color: #fd4100
}
#sceneSelector .scroller ul li.clear:before {
	position: absolute;
	content: "";
	width: 54px;
	height: 2px;
	border-radius: 1px;
	background: #000;
	left: -2px;
	top: 50%;
	margin-top: -1px;
	transform: rotate(-45deg);
	transition: 0.25s background linear
}
#sceneSelector .scroller ul li.active.clear:before {
	background: #fd4100
}
#utility-page {
	position: absolute;
	top: 50%;
	width: 100%;
	transform: translateY(-50%);
	text-align: center
}
#utility-page h1 {
	color: #fd4100;
	font-size: 50px;
	margin-bottom: 20px
}
#utility-page p {
	font-size: 18px
}
#finish {
	position: absolute;
	left: 0;
	width: 100%;
	bottom: 0;
	z-index: 9;
	opacity: 1
}
#finish.slide-enter-active, #finish.slide-leave-active {
	transition: all 1s linear
}
#finish.slide-enter-active .buttons button, #finish.slide-leave-active .buttons button {
	transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1) 0.3s
}
#finish.slide-enter-active .buttons button.selectScene, #finish.slide-leave-active .buttons button.selectScene {
	transition-delay: 0.4s
}
#finish.slide-enter, #finish.slide-leave-active {
	opacity: 0.99
}
#finish.slide-enter .buttons button, #finish.slide-leave-active .buttons button {
	transform: translateY(300px)
}
#finish .buttons {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%
}
#finish .buttons button {
	display: block;
	margin: 0 auto;
	margin-bottom: 15px
}
#mobileRotate {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #000;
	z-index: 6;
	display: none
}
#mobileRotate .centered {
	width: 300px;
	height: 200px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -150px;
	margin-top: -65px;
	text-align: center
}
#mobileRotate .centered i.icon {
	width: 97px;
	height: 66px;
	display: block;
	margin: 0 auto;
	background-size: contain
}
#mobileRotate .centered span {
	color: #fff;
	font-size: 19px;
	text-align: center;
	display: block;
	margin-top: 15px;
	letter-spacing: 0.09em
}
#mobileRotate.visible {
	display: block
}
#trailer {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 3
}
#trailer.open-enter-active, #trailer.open-leave-active {
	transition: all 1.4s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}
#trailer.open-enter-active .bkg, #trailer.open-leave-active .bkg {
	transition: all 0.5s linear 0.1s
}
#trailer.open-enter-active .content, #trailer.open-leave-active .content {
	transition: all 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s
}
#trailer.open-enter-active .content button.close, #trailer.open-leave-active .content button.close {
	transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1) 1s
}
#trailer.open-enter, #trailer.open-leave-active {
	opacity: 0.999
}
#trailer.open-enter .bkg, #trailer.open-leave-active .bkg {
	opacity: 0
}
#trailer.open-enter .content, #trailer.open-leave-active .content {
	opacity: 0;
	transform: scale(0.85)
}
#trailer.open-enter .content button.close, #trailer.open-leave-active .content button.close {
	transform: translateY(45px)
}
#trailer .content {
	position: absolute;
	width: 90%;
	height: 90%;
	left: 0;
	top: 0;
	background: #000;
	z-index: 2
}
#trailer .content button.close {
	position: absolute;
	z-index: 2;
	top: -25px;
	right: 0;
	width: 20px;
	height: 20px
}
#trailer .content button.close i.icon {
	position: relative;
	width: 100%;
	height: 100%
}
#trailer .content iframe {
	position: relative;
	z-index: 1
}
#trailer .bkg {
	z-index: 1;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.6)
}
#ageGate {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 5
}
#ageGate.modal-enter-active, #ageGate.modal-leave-active {
	transition: all 0.5s linear
}
#ageGate.modal-enter-active .content, #ageGate.modal-leave-active .content {
	transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1)
}
#ageGate.modal-enter-active .bkg, #ageGate.modal-leave-active .bkg {
	transition: all 0.3s linear
}
#ageGate.modal-enter, #ageGate.modal-leave-active {
	opacity: 0.99
}
#ageGate.modal-enter .content, #ageGate.modal-leave-active .content {
	opacity: 0;
	transform: translate(-50%, -40%)
}
#ageGate.modal-enter .bkg, #ageGate.modal-leave-active .bkg {
	opacity: 0
}
#ageGate .content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	width: 85%;
	max-width: 500px;
	box-sizing: border-box;
	background: #fff;
	text-align: center;
	border: 5px solid #000;
	border-radius: 7px;
	padding-top: 20px;
	padding-bottom: 20px
}
#ageGate .content button.close {
	position: absolute;
	z-index: 2;
	top: -40px;
	right: 0;
	width: 20px;
	height: 20px
}
#ageGate .content button.close i.icon {
	position: relative;
	width: 100%;
	height: 100%
}
#ageGate .content strong, #ageGate .content .error-message {
	font-weight: normal;
	font-size: 19px;
	text-transform: uppercase;
	display: block;
	line-height: 24px;
	max-width: 280px;
	margin: 0 auto;
	padding: 0 20px;
	margin-bottom: 20px
}
#ageGate .content .error-message {
	color: #fd4100
}
#ageGate .content p.validationMessage {
	margin-bottom: 20px;
	color: #fd4100;
	font-size: 18px
}
#ageGate .content form {
	display: block;
	text-align: center;
	margin-bottom: 30px;
	font-size: 0
}
#ageGate .content form input {
	font-size: 24px;
	display: inline-block;
	height: 60px;
	border: 2px solid #000;
	border-radius: 3px;
	outline: none;
	text-align: center;
	margin: 0;
	vertical-align: middle;
	width: 20%;
	-webkit-appearance: none
}

@media screen and (max-width: 425px) {
#ageGate .content form input {
	font-size: 18px;
	height: 50px
}
}
#ageGate .content form .divline {
	display: inline-block;
	margin: 0 2px;
	height: 60px;
	width: 1px;
	vertical-align: middle
}

@media screen and (max-width: 425px) {
#ageGate .content form .divline {
	margin: 0
}
}

@media screen and (max-width: 425px) {
#ageGate .content button.red, #ageGate .content button.black {
	transform: scale(0.8)
}
}
#ageGate .bkg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: rgba(255,255,255,0.8)
}
.ps-container {
	-ms-touch-action: auto;
	touch-action: auto;
	overflow: hidden !important;
	-ms-overflow-style: none
}
@supports (-ms-overflow-style: none) {
.ps-container {
overflow:auto !important
}
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.ps-container {
	overflow: auto !important
}
}
.ps-container.ps-active-x>.ps-scrollbar-x-rail, .ps-container.ps-active-y>.ps-scrollbar-y-rail {
	display: block;
	background-color: transparent
}
.ps-container.ps-in-scrolling.ps-x>.ps-scrollbar-x-rail {
	opacity: 0.9
}
.ps-container.ps-in-scrolling.ps-x>.ps-scrollbar-x-rail>.ps-scrollbar-x {
	background-color: #999;
	height: 11px
}
.ps-container.ps-in-scrolling.ps-y>.ps-scrollbar-y-rail {
	opacity: 0.9
}
.ps-container.ps-in-scrolling.ps-y>.ps-scrollbar-y-rail>.ps-scrollbar-y {
	background-color: #999
}
.ps-container>.ps-scrollbar-x-rail {
	display: none;
	position: absolute;
	opacity: 0;
	-webkit-transition: background-color .2s linear, opacity .2s linear;
	-o-transition: background-color .2s linear, opacity .2s linear;
	-moz-transition: background-color .2s linear, opacity .2s linear;
	transition: background-color .2s linear, opacity .2s linear;
	bottom: 0px;
	height: 15px
}
.ps-container>.ps-scrollbar-x-rail>.ps-scrollbar-x {
	position: absolute;
	background-color: #aaa;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
	transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
	-o-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
	-moz-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
	transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
	transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -webkit-border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
	bottom: 2px;
	height: 6px
}
.ps-container>.ps-scrollbar-x-rail:hover>.ps-scrollbar-x, .ps-container>.ps-scrollbar-x-rail:active>.ps-scrollbar-x {
	height: 11px
}
.ps-container>.ps-scrollbar-y-rail {
	display: none;
	position: absolute;
	opacity: 0;
	-webkit-transition: background-color .2s linear, opacity .2s linear;
	-o-transition: background-color .2s linear, opacity .2s linear;
	-moz-transition: background-color .2s linear, opacity .2s linear;
	transition: background-color .2s linear, opacity .2s linear;
	right: 0;
	width: 15px
}
.ps-container>.ps-scrollbar-y-rail>.ps-scrollbar-y {
	position: absolute;
	background-color: #aaa;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
	transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out;
	-o-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
	-moz-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
	transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out;
	transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -webkit-border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out;
	right: 2px;
	width: 6px
}
.ps-container:hover.ps-in-scrolling.ps-x>.ps-scrollbar-x-rail {
	opacity: 0.9
}
.ps-container:hover.ps-in-scrolling.ps-x>.ps-scrollbar-x-rail>.ps-scrollbar-x {
	background-color: #999;
	height: 11px
}
.ps-container:hover.ps-in-scrolling.ps-y>.ps-scrollbar-y-rail {
	opacity: 0.9
}
.ps-container:hover.ps-in-scrolling.ps-y>.ps-scrollbar-y-rail>.ps-scrollbar-y {
	background-color: #999
}
.ps-container:hover>.ps-scrollbar-x-rail, .ps-container:hover>.ps-scrollbar-y-rail {
	opacity: 0.6
}
.ps-container:hover>.ps-scrollbar-x-rail:hover {
	opacity: 0.9
}
.ps-container:hover>.ps-scrollbar-x-rail:hover>.ps-scrollbar-x {
	background-color: #999
}
.ps-container:hover>.ps-scrollbar-y-rail:hover {
	opacity: 0.9
}
.ps-container:hover>.ps-scrollbar-y-rail:hover>.ps-scrollbar-y {
	background-color: #999
}
.locale-en #intro h1 {
	top: 20px
}
.locale-au #intro h1 {
	top: 20px
}
.locale-au footer .movie-rating {
	display: none
}
.locale-au footer .commonfooter
{
	display:none;
}
footer .au{
	display:none;
}
.locale-au footer .au {
	display: inline-block;
}
.locale-de #intro button.create span, .locale-de #step-initial-share .hasFam .black span, .locale-de #finish button.addFamily span {
	padding-top: 13px;
	line-height: 1
}
.locale-de #intro button.create .arrow-right-white, .locale-de #step-initial-share .hasFam .black .arrow-right-white, .locale-de #finish button.addFamily .arrow-right-white {
	display: none
}
.locale-br #step-initial-share .hasFam .black, .locale-br #step-initial-share .hasFam .red, .locale-br #step-initial-share .noFam .black, .locale-br #step-initial-share .noFam .red {
	font-size: 17px
}
.locale-br #step-initial-share .hasFam .black span, .locale-br #step-initial-share .hasFam .red span, .locale-br #step-initial-share .noFam .black span, .locale-br #step-initial-share .noFam .red span {
	line-height: 20px;
	padding-top: 12px
}
.locale-br #mainMenu .wimpyKidLogo {
	background-image: url("../images/localized/pt-br/menu-logo.png")
}
@font-face {
	font-family: 'geoslb712_xbd_btextra_bold';
	src: url('../fonts/geoslb712_xbd_bt_extra_bold-webfont.woff2') format('woff2'),  url('../fonts/geoslb712_xbd_bt_extra_bold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
.buynow {
	position: absolute;
	top: 140px;
	left: 50%;
	overflow: hidden;
	transform: translateX(-50%);
	height: 50px;
	transform: translateX(-50%);
	font-size: 12px;
	z-index: 4;
	transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
	border-radius: 8px;
	background: rgb(253, 84, 29);
	border-radius: 8px;
	text-align: center;
	padding: 0 20px;
	box-sizing: border-box;
}
.buynow span {
	font-family: 'geoslb712_xbd_btextra_bold';
	letter-spacing: 1px;
	color: #fff;
	vertical-align: middle;
	font-size: 19px;
}

.social-media-item {
	width: 35px;
	height: 35px;
	display: inline-block;
	margin: 0 5px;
}
.social-media-item img {
	width: 100%;
}

.dialogue-font {
	font-family: "wimpykiddialogue", Helvetica, sans-serif;
}