@CHARSET "ISO-8859-1";

@media screen and (min-width:3840px){
	
}
/** Screens **/
@media screen and (min-width:1440px){
	
}
@media screen and (min-width: 1920px){
	.main-bg{
		height:63vh;
		min-height:63vh;
	}
}
@media screen and (min-width: 2560px){
	h3{
		font-size:85px;
	}
	.surprise-background p {
	    font-size: 50px;
	}
}
/** tiny fix based on height **/
@media screen and (max-height:736px){
	h3{
		font-size:46px;
	}
	.container-sm{
		margin-top:85px;
	}
}
@media screen and (max-height:768px) and (orientation: landscape){
	h3{
		font-size:36px;
	}
	.container-sm{
		margin-top:70px;
	}
}

/**
	Response for 1366px width (15" laptops)
	**/
@media screen and (max-width:1440px){
	.star-lg{
		width:190px;
	}
	.star-md, .star-md3, .star-md2{
		width:170px;
	}
	.star-sm{
		width:100px;
	}
	.products li{
		width:244px;
	}
	.product{
		height:250px;
	}
}
/** tablet **/
@media screen and (max-width: 1024px){
	.star-lg, .star-md, .star-md2, .star-md3, .star-sm, .star-xs{
		top:0;
	}
	.star-lg{
		width:200px;
	}
	.star-md, .star-md3, .star-md2{
		width:170px;
	}
	.star-sm{
		width:100px;
	}
	.star-lg{
		/* animation-name: StarFall;
		animation-duration:2s; */
		background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/star.png);
	    width: 210px;
	    height: 403px;
	    left: 50%;
	    top: 0;
	}
	.star-md{
		/* animation-name: StarFall;
		animation-duration:2s; */
		background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/star-md.png);
	    width: 160px;
	    height: 469px;
	    right: 1%;
	    top: 0;
	}
	.star-md2{
		/* animation-name: StarFall;
		animation-duration:2s; */
	    background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/star-md2.png);
	    width: 175px;
	    height: 587px;
	    left: 25%;
	    top: 0;
	}
	.star-md3{
		/* animation-name: StarFall;
		animation-duration:2s; */
		background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/star-md3.png);
	    width: 175px;
	    height: 469px;
	    left: 1%;
	    top: 0;
	}
	.star-sm{
		/* animation-name: StarFall;
		animation-duration:2s; */
		background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/star-sm.png);
	    width: 114px;
	    height: 604px;
	    right: 15%;
	    top: 0;
	}
	.star-xs{
		/* animation-name: StarFall;
		animation-duration:2s; */
		background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/star-xs.png);
	    width: 58px;
	    height: 243px;
	    left: 24%;
	    top: 0;
	}
	.story-toys{
		width:768px;
		left:calc(50% - (768px / 2));
		/* bottom: -62px; */
	}
	.story-begin #story{
		background-image:url(../img/story/story_bg_mobile.png);
		background-position: 0 74%;
	}
	.startButton{
		padding-top:38px;
	}
	#slide-5{
		overflow:hidden;
	}
	.story-presents1 {
	    background-image: url(../img/story/story-presents1.png);
	    width: 578px;
	    height: 206px;
	    left: calc(50% - (578px / 2));
	    bottom: -11px;
	}
	.story-presents2{
		background-image:url(../img/story/story-presents2.png);
		width: 100%;
	    height: 233px;
	    left:0;
	    bottom: -8px;
	}
	.gfx-select .nav li:not(.selected) .icon.dark-red{
		background-color: #85161a !important;
	}
	#header.big-header{
		background-size:cover !important;		
	}
	.action-bar {
	    background-color: #cc2027;
	    padding: 15px 0;
	    width: 100%;
	}
	#counter{
		position:relative;
	}
	#counter:after {
	    content: url(../img/input_info.png);
	    display: inline-block;
	    position: absolute;
	    left: -30px;
	    width:22px;
	    height:22px;
	    bottom: 0;
	}
	.select-options .select-option:nth-child(4){
		border-left:0;
	}
	.bg-middle{
		background-size:initial;
	}
	.secondary-footer{
		width:100%;
	}
	.select-options .input.shopping-cart {
	    background-image: url(../img/checkout_cart.png);
	    background-repeat: no-repeat;
	    padding-top: 29px;
	    background-position: center;
	    height: 74px;
	}
	.main-container{
		min-height: calc(100vh - 70px);
	}
	.story .main-container{
		min-height: 100vh;
	}
}

@media screen and (max-width: 1024px){
	
	.big-bubble{
	    animation-name: BubbleAppear;
	    animation-duration: .5s;
	    background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/bigBubble.png);
	    width: 227px;
	    height: 227px;
	    left: 60%;
	    top: -194px;
	}
	.small-bubble1{
		animation-name: BubbleAppear;
	    animation-duration: .7s;
	    background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/smallBubble1.png);
	    width: 107px;
	    height: 104px;
	    left: 5%;
	    top: -266px;
	}
	.small-bubble2{
		animation-name: BubbleAppear;
	    animation-duration: .9s;
	    background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/smallBubble2.png);
	    width: 107px;
	    height: 103px;
	    left: 16%;
	    top: -172px;
	}
	.small-bubble3{
		animation-name: BubbleAppear;
	    animation-duration: 1.1s;
	    background-repeat: no-repeat;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/smallBubble3.png);
	    width: 111px;
	    height: 103px;
	    left: -1%;
	    top: -110px;
	}
	
	#main-content .content.no-scroll{
		height: calc(100vh - 60px - 70px - 60px - 50px);
	}
	.share {
	    width: 35px;
	    min-width: 35px;
	    padding: 0;
	}
	.action-needed{
		width:100%;
		background-color:#cc2027;
	}
	.product-pic img{
		width:100%;
	}
	.bottom-dashed {
	    margin-top: 15px;
	    border-top: 1px dashed #ff8989;
	}
	#counter{
		position:relative;
	}
	#counter:after {
	    content: url(../img/input_info.png);
	    display: inline-block;
	    position: absolute;
	    left: -30px;
     	width:22px;
	    height:22px;
	    bottom: 0;
	}
	.wizard.horizontal {
	    position: fixed;
	    max-width: 100%;
	    margin: 10px auto;
		width:100%;
	}
	ul.w-breadcrumbs li .step-cont {
	    border: 1px solid #cc2027;
	}
	ul.w-breadcrumbs li .steps {
	    background-color: #cc2027;
	}
	.wizard.horizontal ul.w-breadcrumbs{
		position: static;
	    display: table;
	    text-align: center;
	}
	.steps .small-icon {
	    color: #fff;
	}
	.wizard.horizontal ul.w-breadcrumbs li.wb-separator .line {
	    background-color: #cc2027;
	    height: 1px;
	    width: 40px;
	}
	.wizard.horizontal ul.w-breadcrumbs li {
	    display: inline-block;
	    vertical-align: middle;
	}
	.wizard.horizontal ul.w-breadcrumbs li.wb-separator{
		width:auto !important;
	}
	#main-content {
	    padding-top: 0;
	    padding: 0;
	    border: 0 !important;
	}
	#footer .bar {
	    position: static;
	    height: 100%;
	}
	#footer>div {
	    display: inline-block;
	}
	.visible-sm{
		display: block !important;
	}
	.visible-md{
		display:none !important;
	}
	.main-bg{
		min-height:calc(46vh);
	}
	.main-logo{
		line-height:calc(500px - 2em) !important;
		width:380px !important;
		height:380px !important;
	}
	#header{
		/* position:static; */
	}
	#header.big-header{
		background-size:cover !important;
	}
	.select-options .select-option{
		flex:1 1 25%;
		padding:0;
		position:relative;
		margin:10px 0;
	}
	.select-options .select-option .visible-sm:not(.edit-image-pencil){
		position:absolute;
		width:100%;
		bottom:0;
		font-size:20px;
	}
	.select-option .input.shopping-cart input{
		width: 57px;
	    color: #fff;
	    margin-top: -12px;
	}	
	.select-option .input.number input{
		width:60px;
	}
	.selected-img{
		margin:10px auto;
		position:relative;
	}
	.edit-image-pencil {
	    line-height: 1;
	    position: absolute;
	    right: -6px;
	    bottom: 0;
	    height: 16px;
	    color: #cc2027;
	}
	#footer {
	    position: fixed;
	    bottom: 0;
	    left: 0;
	    width: 100%;
	    z-index: 99;
	    height: 70px;
	}
	.wizard.horizontal ul.w-breadcrumbs li{
		position:relative;
	}
	.mobile-icon-desc{
		position:absolute;
		color:#cc2027;
		width:100px;
		text-align:center;
		right:-34px;
		font-size:16px;
	}
	.submitters{
		margin-top:0;
		padding: 10px 0;
  		box-sizing: border-box;
	}
	.pre-footer-fixed{
		display:none !important;
	}
	.why-us .container{
		max-width:100%;
	}	
	#main-content{
		background-attachment:fixed;
		margin-bottom:70px;
	}
	.story-flags {
        width: 58%;
	    height: 996px;
	    right: -43px;
	    top: -213px;
	    background-size: 100%;
	}
	.products li{
		flex: 0 1 33.33333%;
	}
	
	.selected-img{
		line-height: 117px;
   	 	font-size: 60px;
   	 	width: 78px;
   		height: 78px;
   		flex: 0 0 auto;
	}
	.input.number{
		padding-top:24px;
	}
}

/** nexus 10 fix **/
@media screen and (max-width:800px){
	.product{
		height:220px;
	}
	.product.gift-card h4{
		font-size: 24px;
    	font-weight: bold;
	}
	.product.gift-card p.bold{
		font-weight: bold;
    	font-size: 22px;
	}
	.gift-card:before{
		height:48px;
	}
}

@media screen and (max-width: 768px){
	.gfx-select.step-1, .gfx-select.step-2 {
	    padding: 0 !important;
	}
	#catalogue #main-content {
	    height: calc(100vh - 60px - 85px);
	}
	.startButton {
	    padding-top: 18px;
	}
	#main-content{
		background-attachment:fixed;
		margin-bottom:70px;
	}
	.story-presents2 {
	    background-image: url(../img/story/story-presents2.png);
	    width: 100%;
	    /* height: 176px; */
	    left: 0;
	    bottom: -8px;
	}
	.why-us .container{
		max-width:100%;
	}	
	.story-flags {
	    width: 123%;
	    height: 984px;
	    right: -65px;
	    top: -271px;
	}
	.products li{
		flex: 0 0 33.33333%
	}
	.select-options .input.shopping-cart {
	    background-image: url(../img/checkout_cart.png);
	    background-repeat: no-repeat;
	    padding-top: 28px;
	    background-position: center;
	    height: 72px;
	}
	.select-options .select-option {
	    flex: 1 1 25%;
	    padding: 0;
	    position: relative;
	    margin: 10px 0;
	}
	.selected-img{
		margin:0 auto;
		width:80px;
		height:80px;
		font-size: 65px;
    	line-height: 116px;
    	flex: 0 0 80px;
	}
	.input.number{
		padding-top:14px;
	}
	.select-options .input.shopping-cart {
	    background-image: url(../img/checkout_cart.png);
	    background-repeat: no-repeat;
	    padding-top: 22px;
	    background-position: center;
	    height: 60px;
	}
	.select-options .select-option .visible-sm:not(.edit-image-pencil){
		line-height:17px;
	}
	.greeting.center.white{
		margin:10px 0;
	}
}
/** mobile devices **/
@media screen and (max-width: 720px){
	.why-us .half{
		width:100% !important;
		flex:unset;
	}
	.main-bg{
		/* min-height:47vh; */
	}
	.main-logo{
		line-height:calc(500px - 2em) !important;
		width:380px !important;
		height:380px !important;
	}
	.products li{
		flex: 0 0 50%
	}
	
}

/* global mobile definitions **/
@media screen and (max-width: 600px){
	.nav.allowedMultiselect{
		padding:0 10px;
	}
	.interests #main-content{
		height:auto !important;
		margin-bottom: 70px !important;
	}
	#interests.gfx-select .nav li .icon {
	    width: 80px;
	    height: 80px;
	    line-height: 91px;
	    font-size: 40px;
	}
	startButton {
    	padding-top: 18px;
	}
	.social-links{
		font-size: 19px;
	}
	.jumping{
		top:7.5px;
	}
	h5 {
	    font-size: 24px;
	    padding: 20px 0 0 0;
	}
	.button.big{
		font-size:20px;
	}
	.menu-mobile-fix{
		position:static;
	}
	.display-viewport{
		height: auto;
		overflow:auto;
	}
	#nav .menu-item:not(.has-sub-menu){
		padding-top:8px;
		font-size:24px;
	}
	/* .greeting.center.white{
		font-size:22px;
	} */
	.greeting.center.white {
	    font-size: 20px;
	    padding: 7px 0;
	}
	.sr-select{
		height: 25px;
	    line-height: 25px;
	    max-width: 100px;
	    text-align: right;
	    font-size: 18px;
	}
	.button.present{
		padding:5px 50px;
		font-size: 18px;
	}
	.wizard + .content .catalogue{
		height: calc(100% - 189px);
	}
	button, input {
		height:30px;
	}
	.footer-middle{
		width:100%;
	}	
	.product-page-btn button{
		margin:0 !important;
	    width: 90%;
  		height: 50px !important;
 	    line-height: 50px !important;
	}
	.product-page-btn.flex-container.center.visible-md{
		display:none !important;
	}
	html, body, p, div, table, h1, h2, h3, h4, h5, h6, ul, li{
		line-height:1;
	}
	#main-content .content.no-scroll {
	    padding: 0;
	    height: calc(100vh - 60px - 70px - 60px);
	    margin:0;
	    width:100%;
	    flex: 0 0 100%;
	    border-radius: 0;
	}

	body:not(.story):not(.home):not(.gifts-found) .main-container{
		height:calc(100vh - 70px);
		min-height:calc(100vh - 70px);
		margin-bottom:70px;
	}
	#catalogue #main-content{
		height: calc(100vh - 70px - 50px);
		margin-bottom:0;
	}
	.startButton + #footer{
		position:static;
	}
	.main-container.fullview{
		height:100vh;
		min-height:100vh;
	}
	/* .main-container.fullview .main-bg{
		height:50vh;
	}
	.main-container.fullview .intro{
		height: 32vh;
	} */
	.main-container.fullview .intro .button.big.red{
		padding:0 50px;
	}
	.main-bg{
	    background-size: 300%;
	}

	.input.text.search{
		flex: 1 1 calc(60% - 6px);
		height: 25px;
	    line-height: 25px;
	    font-size: 18px;
		
	}
	.input.search input{
		width:100%;
		height:25px;
		padding-right: 25px;
	}
	.input.search:before {
		top:5px;
	    content: "";
	    background-image: url(../img/search.png);
	    position: absolute;
	    right: 7px;
	    width: 15px;
	    height: 15px;
	    background-size: contain;
	    background-repeat: no-repeat;
	}
	
	.wizard + .content .catalogue{
		padding-right:0;
		margin-top:7px;
	}
	
	.main-container.fullview #main-content{
		/* padding:10px; */
		min-height:calc(100vh - 130px);
		height:calc(100vh - 130px);
	}
	.filters{
		padding:0;
		/* display:block; */
		display:flex;
		flex-wrap:wrap;
	}
	/* .filters > div{
		flex:unset;
		text-align:center;
	} */
	filters .filter .input{
		display:inline-block;
	}
	.filters .filter{
		display:table;
		margin:0 auto;
	}
	.input.present:not(.button):before {
	    top: -26px;
	    width: 75px;
	    height: 26px;
       	left: calc(50% - 37.5px);
	}
	.button.present:before{
		top:-21px;
	}
	.input.number input, .input.number.present input{
		width:40px;
		padding:0;
		font-size:15px;
	}
	.icon.selected-img{
	    line-height: 80px;
   		font-size: 50px;
   		margin:5px auto;
	}
	.selected-img{
		width:50px;
		height:50px;
		flex:unset;
		position:relative;
	}
	#main-content.double-footer{
	    background-color: #cc2027;
	    margin-bottom: 150px;
	    background-size: cover;
	}
	.main-logo {
	    /* line-height: calc(500px - 2em) !important; */
	    /* width: 100% !important; */
	    height: 380px !important;
	}
	.gfx-select .nav li{
		color:#fff !important;
		padding:20px;
		height:175px;
	}
	.interests .gfx-select .nav li{
		padding:10px;
		font-size:20px;
		/* font-size:0; */
		height:auto !important;
		/* width: 30%; */
	}
	#header, #header.absolute-header{
		z-index:unset;
		position:relative;
	}
	#nav, .menu-item{
		position:static;
	}
	.menu-item[data-section]{
		padding:5px;
	}
	#interests.gfx-select{
		padding:0;
	}
	.surprise-background{
		background-image:url(../img/mobile_main_bg.jpg);
		background-size:cover;
		background-position: center -70px;
		margin-bottom:0 !important;
	}
	.gfx-select .input.range{
		width:100%;
	}
	.rangeInput .track{
		width:80%;
	}
	.gfx-select.bottom-icons .icon{
		font-size: 75px;
    	line-height: 147px;
	}
	.nav li .icon{
	    height: 100px;
    	width: 100px;
	}
	.gfx-select.step-1, .gfx-select.step-2{
		padding:0 0 0 0 !important;
	}
	.wizard.horizontal{
		position:fixed;
		background:#fff;
		max-width:100%;
		/* margin:10px auto; */
		margin: 10px auto 0 auto;
		padding: 10px 0;
		height:55px;
	}
	.wizard.horizontal ul.w-breadcrumbs{
		position:static;
		display:table;
		text-align:center;
	}
	.wizard.horizontal ul.w-breadcrumbs li{
		display:inline-block;
		vertical-align: middle;
	}
	.wizard.horizontal ul.w-breadcrumbs li.wb-separator{
		width:auto !important;
	}
	.wizard.horizontal ul.w-breadcrumbs li.wb-separator .line{
		background-color:#cc2027;
		height:1px;
		width:40px;
	}
	.steps .small-icon{
		color:#fff;
	}
	ul.w-breadcrumbs li .steps{
		background-color:#cc2027;
	}
	ul.w-breadcrumbs li .step-cont{
		border:1px solid #cc2027;
	}
	.visible-md{
		display: none !important;
	}
	.visible-sm{
		display:block !important;
	}
	#footer{
		position:fixed;
		bottom:0;
		left:0;
		width:100%;
		z-index:99;
		height:70px;
		display:block;
	}
	#footer .bar{
		position:static;
		height:100%;
	}
	.bar{
		height:100%;
		bottom:-10px;
	}
	.collapse-menu .sub-menu{
		width:100%;
		text-align:center;
	}
	#header.big-header{
		background-image:url(../img/big-header-mobile.png);
		background-color:#cc2027;
		background-size: 137% !important;
		height:200px !important;
	}
	#header.big-header.logged-in{
		background-size:cover !important;
	}
	#header.big-header.logged-in:before{
		content: unset;
	}
	#header>div:not(.row){
		/* padding:8px; */
	}
	.collapse-menu .sub-menu:before{
		right: 12px;
	}
	.collapse-menu .sub-menu.show{
		position: absolute;
		top:56px;
		padding:0;
	}
	.bg-middle{
		background-image:url(../img/bg_middle_mobile.png);
		background-position:bottom;
		background-size: 100%;
	}
	.sub-menu.show{
		z-index:99;
	}
	.copyright{
		font-size:20px;
		padding:0;
	}
	.like-btn{
		background-size:75%;
	}
	.like-btn, .like-btn.liked + .desc, .like-btn.disliked + .desc{
		width:30px;
		height:30px;
		font-size:18px;
	}
	.like-btn.liked + .desc, .like-btn.disliked + .desc{
		line-height:30px;
	}
	.products li{
		padding:0 5px 10px 5px;
		flex: 0 0 50%;
	}
	.gift-card-total{
		font-size:14px;
	}
	.gift-card-total:before {
	    content: "";
	    position: absolute;
	    right: -7px;
	    top: calc(50% - 5px);
	    border-left: 10px solid #fff;
	    border-top: 5px solid transparent;
	    border-bottom: 5px solid transparent;
	}
	.product{
		height:180px;
	}
	.gift-card{
		padding: 10px 25px
	}
	.gift-card p, .gift-card h4{
		font-size:18px;
	}
	.gift-card:before{
		content: "";
	    background-image: url(../img/gift-card-wrap.png);
	    width: 100%;
	    height: 34px;
	    display: block;
	    background-size: 59%;
	    background-repeat: no-repeat;
	    background-position: bottom;
	}
	.select-options .select-option{
		flex:1 1 25%;
		padding:0;
		position:relative;
		margin:5px 0;
		height:63px;
	}
	.select-options .select-option .visible-sm:not(.edit-image-pencil){
		position:absolute;
		width:100%;
		bottom:0;
	}
	.select-option .input.shopping-cart input{
		width: 57px;
	    color: #fff;
	    margin-top: -8px;
	    font-size: 14px;
	    padding-right: 0;
	    text-align: center;
	}	
	.input.number {
	    text-align: center;
	    padding-top: 14px;
	}
	.select-option .input.number input{
		   width: 46px;
		   height: 25px;
	}
	.input.shopping-cart{
		margin-top: 3px;
	    background-size: 40%;
	    padding-top: 12px !important;
	    height:41px !important;
	}
	.product-pic{
		width:100%;
	}
	.product-pic img{
		width:100%;
	}
	.pre-footer-fixed{
		position:fixed;
		bottom:80px;
		width:100%;
		left:0;
		height:80px;
	}
	.product-like-btn {
		margin:0;
		padding:0;
	    position: relative;
	    width: 49%;
	    height: 80px;
	    display: inline-block;
	}
	.product-like-btn .like-btn{
		width:50px;
	}
	.product-like-btn .like-btn, .product-like-btn .like-btn + .desc{
		width:50px;
		height:50px;
	}
	.product-like-btn .like-btn + .desc{
	    width: 90%;
  		line-height: 50px;
	}
	#footer>div{
		flex:unset;
		display:inline-block;
	}
	.footer-nav{
		width:70%;
	}
	.footer-nav .menu-item{
		padding:0;
	}
	.social-links{
		padding:5px;
		width:28%;
		text-align:left;
	}
	.fullview .social-links.absolute{
	    top: auto;
	    height: 33px;
	    bottom: 0;
	} 
	.home .social-links.absolute{
	    top: 10px;
	    height: 33px;
	    bottom: auto;
	} 
	#idus_logo {
	    width: 70px;
	    bottom: 0;
	    padding: 0;
	    margin: 10px;
	}
	.social-links + #idus_logo{
		position:static;
		padding:0;
	}
	.footer-nav + .social-links + .copyright{
		width:100%;
		text-align:center;
	}
	.register-form{
		width:100% !important;
		padding:0;
	}
	.input label{
		width:24%;
		padding-right:8px;
	}
	.button.big.single{
		padding:0 50px;
	}
	.submitters .button.big{
		margin:0 5px;
	}
	.modal-box{
		width:90%;
	}
	.action-needed{
		background-color:#cc2027;
		width:100%;
		padding:10px;
	}
	.modal-box.white{
		width: 90%;
	}
	.share{
		width:35px;
		min-width:35px;
		padding:0;
	}
	.modal-box .half:not(.field){
		padding:0 !important;
	}
	.row{
		margin-right:0;
	}
	.action-bar{
		background-color:#cc2027;
		padding:15px 0;
		width:100%;
	}
	.action-bar h4{
		font-size:19px;
	}
	#counter .time td{
		padding:0;
	}
	.font-size-40{
		font-size:30px !important;
	}
	.bottom-dashed{
		margin-top:15px;
		border-top:1px dashed #ff8989;
	}
	.bottom-dashed>div{
		padding-top:10px;
	}
	.bottom-dashed h4{
		font-size:30px !important;
	}
	#counter:after{
		content:unset;
	}
	.next, .prev{
		display:none;
	}
	.button{
		padding:0 15px;
	}
	.button.big{
		padding:0 50px;
	}
	.accordion + .product-page-btn{
		margin-top:15px;
	}
	.gift-card-img{
		padding:10px;
	}
	.gift-card-img:before{
		background-size:contain;
		height:100px;
	}
	.gift-card-img h4{
		font-size:40px;
	}
	.gift-card-img p{
		font-size:28px;
	}
	#summary .thumbnail{
		height:80px;
		width:80px;
	}
	.profile-pic.row{
		padding:75px 0;
	}
	#thankyou-text {
	    font-size: 40px !important;
	}
	.templates .template{
		display:inline-block;
		vertical-align:top;
		padding:0 5px;
	}
	.greeting-card{
		padding:20px;
	    border: 1px solid #dedede;
	    background-size:contain;
	}
	.greeting-card .form{
		padding:10px;
	}
	.templates>div{
		display:table;
		text-align:center;
	}
	.templates h4{
		font-size:26px;
	}
	
	.templates h4:after{
		border-style: solid;
	    border-width: 3px 3px 0 0;
	    content: '';
	    display: inline-block;
	    height: 8px;
	    position: relative;
	    top: 12px;
	    vertical-align: top;
	    width: 8px;
	    left: -5px;
	    transform: rotate(-225deg);
	}
	.templates h4.hidden:after{
		content: "";
		transform: rotate(-135deg);
	}
	.template.hide{
		display:none;
	}
	.header-title img{
		width:60%;
	}
	
	#active-events, #finished-events{
		display:table;
		text-align:center;
		width: 100%;
	}
	.event-title{
		font-size:24px;
	}
	.event{
		height:180px;
		width:180px;
		margin-bottom:10px;
	}
	.event .event-thumbnail{
		width: 80px;
    	height: 80px;
    	font-size:60px;
	}
	.purchased-label{
		background-size:65%;
	}
	.post .image{
		padding:0;
	}
	.nav.with-indicator li .icon{
		height:100px;
		width:100px;
	    line-height: 120px;
  		font-size: 50px;
	} 
	
	.join-us #main-content{
		padding-left:15px;
		padding-right:15px;
	}
	.left-separator{
		border-left:0;
		width:100%;
		text-align:center;
	}
	.form{
		padding:15px;
		flex:100%;
	}
	.why-us .site-name.half, .why-us #nav.half{
		width:50% !important;
	}
	h4.sp-heading{
		font-size:32px;
		margin-bottom:25px;
	}
	.font-size-30{
		font-size:24px !important;
	}
	.select-options .select-option:nth-child(4){
		border-left:0;
	}
	.site-name img{
		margin-left:7px;
		margin-top:10px;
		width:84px;
	}
	#header{
		height:50px;
		/* height:30px; */
		background-color:#cc2027;
	}
	.product .like-btn.disliked:hover + .desc, .product .like-btn.liked:hover + .desc{
		text-align:center;
		width:110px;
		padding-left:30px;
	}
	.input.number .fa{
		font-size:12px;
	}
	.edit-image-pencil {
	    line-height: 1;
	    position: absolute;
	    right: -10px;
	    bottom: 0;
	    height: 16px;
	    color: #cc2027;
	}
	/* .filters > .selectors{
		display:table;
		margin:0 auto;		
	} */
	.filters .filter{
		flex:0 1 70%;
		text-align:initial;
	    padding-left: 5px;
	}
	.filters .filter form{
		display:flex;
	    flex-wrap:wrap;
	}
	.filters .filter .input.select, .filters .filter .input.search{
		box-sizing:border-box;
	}
	.filters .filter .input.select{
		flex: 1 1;
		padding-left:5px;
	}
	.filters .selectors .menu-item{
		font-size:18px;
	}
	.select-options{
		max-height:90px;
	}
	.input.address .half:first-child{
		flex:unset;
		width:100% !important;
	}
	#summary .saleprice{
		color:#000;
	}
	#summary .fa-times{
		/* color:#000;
	    font-size: 15px; */
	}
	.footer-nav .menu-item{
		margin-left:10px;
	}
	#footer>div.copyright{
		text-align:left !important;
		padding:0 10px;
	}
	.header-title h3{
		font-size:26px;
	}
	.flex-container{
		display:block;
	}
	.gift-card-purchase{
		text-align:right;
	}
	.gift-card-purchase .fa{
		margin-top:11px !important;
	}
	.gift-card-purchase + .product-like-btn{
		margin-top:30px;
	}
	.gift-card-purchase + .product-like-btn button{
		margin: 0;
  		width: 100%;
 	    line-height: 40px !important;
  		height: 40px !important;	
	}
	button.input.button.present.big.whitebtn {
	    padding: 0 50px;
	    margin-top: 10px;
	}
	.separator{
		margin:25px 10px;
		width:95%;
	}
	.separator .line{
		top:30%;
	}
	.separator .edit {
	    position: absolute;
	    left: 0;
	    top: -6px;
	    width: 45px;
	    height: 35px;
	    font-size: 16px;
	    line-height: 30px;
	}
	.separator .edit.shopping-cart-bg{
		padding:0 !important;
		padding-left:10px !important;
		text-align:center;
	}
	#counter{
		position:relative;
	}
	#counter:after {
	    content: url(../img/input_info.png);
	    display: inline-block;
	    position: absolute;
	    left: -22px;
     	width:22px;
	    height:22px;
	    bottom: 0;
	}
	#counter .time{
		font-size:32px;
	}
	.nav.with-indicator{
		margin:0;
		margin-top:20px;
		height: 155px;
	}
	.pic{
		width:110px;
	}
	.big-btn-share{
		padding:10px;
	}
	.big-btn-share button{
		padding:0 50px !important;
		font-size:30px !important;
	}
	#greeting-note .edit{
		top:0;
		right:0;
	}
	.menu-item a.modal-toggle{
		color:#fff;
		text-decoration:none;
	}
	
	/** Story **/
	#story{
		position:relative;
		width:100%;
		height: calc(100vh - 50px);
	}
	.story-fixed{
		position:fixed;
		bottom:0;
		left:0;
		width:100%;
		height:60px;
	}
	.story-overview{
		width:100%;
		height:calc((100% - 50px - 103px) * 5);
	}
	.story #header{
		padding:10px;
		position:fixed;
		z-index:3;
	}
	.story h5.how-it-works{
	    font-size: 36px;
	    padding: 0;
	}
	.story h5.how-it-works:after{
	    content: " ";
	    background-repeat: no-repeat;
	    background-image: url(../img/story/how_bottom.png);
	    background-position: center;
	    display: block;
	    margin: 0 auto;
	    width: 132px;
	    height: 11px;
	}
	.slide{
		width:100%;
		position:relative;
		height:100%;
		left:0;
		top:0;
		transition: All .3s;
	}
	.cloud{
		position:absolute;
		background-image:url(../img/story/cloud.png);
		background-repeat:no-repeat;
		background-size:contain;
		text-align:center;
		font-size:32px;
		animation-direction:alternate;
	}
	.cloud.large{
		animation-name: CloudAppearsLargeMobile;
	    animation-duration: 1s;
	    color: #a71e22;
	    margin: 0 auto;
	    width: 220px;
	    height: 142px;
	    line-height: 135px;
	    left: calc(50% - (220px / 2));
	    top: 20%;
	}
	.story h3.how-it-works{
		padding:0;
		}
	.cloud.small{
		color:#010101;
		width: calc(272px / 2);
		height: calc(142px / 2);
		line-height: calc(142px / 2);
		top:40%;
	}
	.cloud.small.left{
		animation-name: CloudAppearsSmallLeftMobile;
	    animation-duration: 2s;
		left:5%;
		top: 44%;
	}
	.cloud.small.right{
		right:5%;
		animation-name: CloudAppearsSmallRightMobile;
	    animation-duration: 1s;
	}
	.boy{
		background-image: url(../img/story/boy.png);
	    background-size: contain !important;
	    background-repeat: no-repeat;
	    width: 77px;
	    /* height: 200px; */
	    display: inline-block;
	    position: absolute;
	    bottom: -35px;
	    left: calc(50% - 77px);
	}
	.boy[data-show-on="step-1"] { bottom: -5px !important	; }
	.boy.centered{
		left: calc(50% - (77px / 2));
	}
	.boy.animated{
		    background-image: url(../img/story/boy.gif);
		    width: 200px;
		    left: calc(50% - (200px / 2));
	}
	.girl{
		background-image: url(../img/story/girl.png);
	    background-size: contain !important;
	    background-repeat: no-repeat;
	    width: 102px;
	    /* height: 200px; */
	    display: inline-block;
	    position: absolute;
	    bottom: -35px !important;
	    right: calc(50% - 102px);
	}
	.girl.centered{
		right: calc(50% - (160px /2));
	}
	.story-toys, .story-presents1, .story-presents2{
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		bottom:30px;
	}
	.story-toys{
		background-image:url(../img/story/story-toys.png);
		width: 100%;
	    height: 165px;
	    left:calc(50% - (1138px / 2));
	    bottom:-12px;
	}
	.story-presents1 {
	    background-image: url(../img/story/story-presents1.png);
	    width: 100%;
	    height: 148px;
	    left: 0;
	    bottom: -9px;
	}
	.story-presents2{
		background-image: url(../img/story/story-presents2.png);
	    width: 180%;
	    height: 290px;
	    left: calc(50% - (180% / 2));
	    bottom: -135px;
	}
	.story-flags{
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/flag.gif);
		/* width: 123%; */
		width: 60%;
	    height: 909px;
	    right: -34px;
	    overflow: hidden;
	    top: -100px;
	}
	#slide-5{
		/* height: calc(100% - 125px); */
		overflow:hidden;
	}
	.story-begin .white.bar.step-5{
		height:185px;	
	}
	.story-confetti{
		animation-name:Confetti;
		animation-duration:5s;
		background-repeat:no-repeat;
		background-size: cover;
		position:absolute;
		background-image:url(../img/story/story-confetti_mobile.png);
		width: 100%;
	    height: 395px;
	    left:0;
	    top:0;
	}
	.star-lg{
		animation-name: unset;
		animation-duration:2s;
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/star_mobile.png);
		width: 140px;
	    height: 245px;
	    left:50%;
	    top:0;
	}
	.star-md{
		animation-name: unset;
		animation-duration:2s;
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/star-md_mobile.png);
		width: 95px;
	    height: 463px;
	    right:1%;
	    top:-40px;
	}
	.star-md2{
	    animation-name: unset;
	    background-size: contain;
	    position: absolute;
	    background-image: url(../img/story/star-md2_mobile.png);
	    width: 95px;
	    height: 333px;
	    left: 18%;
	    top:-85px;
		/* opacity:1; */
	}
	.star-md3{
		animation-name: unset;
		/* animation-duration:2s; */
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/star-md3_mobile.png);
		width: 95px;
	    height: 430px;
	    left:3%;
	    top:-50px;
		opacity: 1;
	}
	.star-sm{
		/* animation-name: StarFall;
		animation-duration:2s; */
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/star-sm.png);
		width: 139px;
	    height: 604px;
	    left:63%;
	    top:0;
	    display:none;
	}
	.star-xs{
		/* animation-name: StarFall;
		animation-duration:2s; */
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/star-xs.png);
		width: 68px;
	    height: 243px;
	    left:28%;
	    top:0;
	    display:none;
	}
	
	.big-bubble{
		animation-name:BubbleAppear;
		animation-duration:.5s;
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/bigBubble.png);
		width: 130px;
	    height: 130px;
	    left: 62%;
	    top: -130px;
	}
	.small-bubble1{
		animation-name:BubbleAppear;
		animation-duration:.7s;
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/smallBubble1.png);
		width: 80px;
	    height: 75px;
	    left: 8%;
	    top: -240px;
	}
	.small-bubble2{
		animation-name:BubbleAppear;
		animation-duration:.9s;
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/smallBubble2.png);
		width: 80px;
	    height: 75px;
	    left: 18%;
	    top: -160px;
	}
	.small-bubble3{
		animation-name:BubbleAppear;
		animation-duration:1.1s;
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		background-image:url(../img/story/smallBubble3.png);
		width: 80px;
	    height: 75px;
	    left: 4%;
	    top: -80px;
	}
	
	.cloud-share{
		position:absolute;
		background-image:url(../img/story/cloud_share.png);
		background-repeat:no-repeat;
		background-size:contain;
		animation-name: unset;
	    animation-duration: 1s;
		color:#a71e22;
		margin:0 auto;
		width: 210px;
   		height: 115px;
		line-height:190px;
		left:calc(50% - (210px / 2));
		top:14%;
	}
	.story-icon1{
		animation-name: BubbleAppear;
		animation-duration: .5s;
		position:absolute;
		background-image:url(../img/story/icon1.png);
		background-repeat:no-repeat;
		background-size:contain;
		margin:0 auto;
		width: 55px;
		height:55px;
	    right: -90px;
        top: 150px;
	}
	.story-icon2{
		animation-name: BubbleAppear;
		animation-duration: .7s;
		position:absolute;
		background-image:url(../img/story/icon2.png);
		background-repeat:no-repeat;
		background-size:contain;
		margin:0 auto;
	    width: 90px;
	    height: 90px;
	    left: -105px;
	    top: -17px;
	}
	.story-icon3{
		animation-name: BubbleAppear;
		animation-duration: .9s;
		position:absolute;
		background-image:url(../img/story/icon3.png);
		background-repeat:no-repeat;
		background-size:contain;
		margin:0 auto;
		width: 55px;
		height:55px;
		left: 5px;
    	top: -40px;
	}
	.story-icon4{
		animation-name: BubbleAppear;
		animation-duration: 1.1s;
		position:absolute;
		background-image:url(../img/story/icon4.png);
		background-repeat:no-repeat;
		background-size:contain;
		margin:0 auto;
		width: 90px;
		height:90px;
	    right: -115px;
 	   top: 50px;
	}
	.story-icon5{
		animation-name: BubbleAppear;
		animation-duration: 1.3s;
		position:absolute;
		background-image:url(../img/story/icon5.png);
		background-repeat:no-repeat;
		background-size:contain;
		margin:0 auto;
		width: 55px;
		height:55px;
	    left: -90px;
	    top: 92px;
	}
	.story-icon6{
		animation-name: BubbleAppear;
		animation-duration: 1.5s;
		position:absolute;
		background-image:url(../img/story/icon6.png);
		background-repeat:no-repeat;
		background-size:contain;
		margin:0 auto;
		width: 70px;
	    height: 70px;
	    right: -70px;
	    top: -50px;
	}
	.story-button.present{
	    background-color: #cc2027;
	    color: #fff;
	    font-size: 30px;
	    padding: 10px 65px;
	    border-radius: 99px;
	    height: auto;
		bottom:30px;
	}
	.story-button.present:hover{
		cursor:pointer;
	}
	.story-button.present:before{
		background-image: url(../img/story/story-present-bow.png);
		top:-43px;
		width: 123px;
		height: 43px;
		left: calc(50% - 61.5px);
	}
	.end-of-story{
		padding-top: 75px;
	}
	.how-it-works:hover{
		cursor:pointer;
	}
	.story-begin{
		background-image:url(../img/story/story-bg_mobile.png);
		height: auto !important;
		background-size:cover !important;
	    background-attachment: fixed;
	    height:100vh !important;
	}
	
	.fa-pencil{
		font-size:15px;
	}
	.select-options .select-option .visible-sm:not(.edit-image-pencil){
		font-size:17px;
	}
	.modal-box.thankyou{
		background-image:url('../img/modal-confetti.png');
		background-position: center 95%;
		background-repeat:no-repeat;
		background-size:90%;
	}
	.story-toys {
	    background-image: url(../img/story/story-toys.png);
	    width: 100%;
	    height: 60px;
	    left: 0;
	    bottom: -6px;
	}
	.action-bar .shopping-cart-white{
		display: flex !important;
		align-items: center;
	}
	.button.present:before {
	    background-image: url(../img/present_white.png);
	    top: -21px;
	    width: 50px;
	    left: calc(50% - 25px);
	}
	.button.present:before {
	    top: -16px;
	}
	.button.present {
	    padding: 5px 30px;
	    font-size: 18px;
	}
	.products li>div:not(.product), .products li>div:not(.product)>div{
		font-size:18px !important;
		line-height:25px;
	}
	.sale {
	    background-image: url(../img/sale.png);
	    position: absolute;
	    top: 10px;
	    right: 10px;
	    background-size: 100%;
	    width: 70px;
	    height: 45px;
	}
	.product.gift-card h4 {
	    font-size: 20px;
	    font-weight: bold;
	}
	.product.gift-card p.bold{
		font-size: 18px;
	}
	#header.absolute-header{
		height:50px;
	}
}
@media screen and (max-width: 384px){
	.story-presents1{
		bottom:-20px;
	}
	.story-presents2 {
	    bottom: -145px;
	}
}
@media screen and (max-width: 375px){
	.story-presents2 {
	    bottom: -150px;
	}
	.story-presents1{
		  bottom: -23px;
	}
	.products li{
		padding:0 5px 10px 5px;
		width:180px;
	}
	.product{
		height: 176px;
	}
	.main-logo{
		line-height:calc(500px - 2em) !important;
		width:375px !important;
		height:375px !important;
	}
	.main-bg {
	   /*  min-height: 38vh; */
	}
	.nav li .icon {
	    height: 120px;
	    width: 120px;
	}
	.gfx-select.bottom-icons .icon {
	    line-height: 175px;
	}
	#header.big-header{
		background-size:150% !important;
	}
	.event{
		width:165px;
		height:165px;
	    margin: 0 5px 10px;
	}
	.wizard + .content .catalogue {
	    padding-right: 0;
	}
	.story-toys {
	    background-image: url(../img/story/story-toys.png);
	    width: 100%;
	    height: 60px;
	    left: 0;
	    bottom: -12px;
	}
}
@media screen and (max-width: 360px){
	.story-presents1{
		  bottom: -28px;
	}
	.wizard + .content .catalogue{
		padding-right:0;
	}
	html, body, p, div, table, h1, h2, h3, h4, h5, h6, ul, li{
		font-size:19px;
	}
	h3{
		font-size:30px;
	}
	#how-to h5{
		font-size:28px;
	}
	.gift-card p{
		font-size:15px;		
	}
	.main-logo{
		line-height:calc(500px - 2em) !important;
		width: 360px !important;
   		height: 360px !important;
	}
	.main-bg{
		/* min-height:42vh; */
		background-size:320%;
	}
	.nav li .icon {
	    height: 110px;
	    width: 110px;
	}
	.gfx-select.bottom-icons .icon {
	    line-height: 155px;
	}
	.event{
		height:160px;
		width:160px;
		margin-bottom:10px;
	}
	.event .event-thumbnail{
		width: 80px;
    	height: 80px;
	}
	#header.big-header{
		background-size: 158% !important;
	}
	.story-toys {
	    background-image: url(../img/story/story-toys.png);
	    width: 100%;
	    height: 60px;
	    left: 0;
	    bottom: -12px;
	}
	.filters > .selectors{
		/* display:table;
		margin:0 auto; */
		font-size:18px;
	}
	.story-presents2 {
	    bottom: -155px;
	}
	.story-flags {
	    top: -108px;
	}
	.product {
	    height: 154px;
	}
}

@media screen and (max-width: 320px){
	.story-presents1 {
	    bottom: -40px;
	}
	.big-bubble{
		left:58%;
	}
	.story-presents2 {
	    bottom: -170px;
	}
	.story-flags {
	    top: -85px;
	}
	.filters .filter {
    	flex: 0 1 68%;
	}
	.input.shopping-cart {
	    margin-top: 0px;
	    background-size: 44%;
	    padding-top: 9px !important;
	    height: 38px !important;
	}
	.input.shopping-cart input{
		padding-left:12px;
	}
	.product {
	    height: 143px;
	    padding: 5px 10px;
	}
	.main-logo {
	    line-height: calc(500px - 2em) !important;
	    width: 320px !important;
	    height: 320px !important;
	}
	.container-sm{
		width: 100%;
	}
	.nav.allowedMultiselect{
		padding:0;
	}
}

/** iphone X fix **/
@media screen and (max-width:375px) and (max-height:812px) and (orientation: portrait){
	.container-sm{
		margin-top:70px;
	}
}

@media screen and (max-width: 800px){
	#fp-nav { display:none !important; }
}

@media (aspect-ratio: 16/9) {
	.cloud { scale (0.7); }
}