@charset "utf-8";

.row { text-align:left; }
.red { color: #b31e20; }
.page_content .item { width:49%; position:relative; display:inline-block; vertical-align:top; text-align:center; }

.thumb { background:url(/images/2014/store/frame-store.png) no-repeat; position:relative; width:90%; margin:auto; background-size:100% auto; height:45rem; }
.thumb .image_holder { width:75%; position:relative; left:13.5%; top:6rem; }
.thumb .image_holder img { border-radius:2rem; }
.details { width:90%; position:relative; margin:auto; font-size:11px; }
.details div { margin-top:1rem; }
.details .verdana { font-size:1.8rem; }
.details .verdana.footer { font-size:1.5rem; }
.details .item_price { color:#0E7369; }

.desc { margin:2rem auto; }
.how { background:url(/images/2014/store/how-to-btn.png) no-repeat; position:relative; margin:auto; width:90%; height:15rem; background-size:cover; cursor:pointer; }
.how:hover { top: 0.2rem; }
.how .text { position:absolute; top:8.5rem; left:30%; font-size:11px; }

.button { background:url(/images/2014/button/circle.png) no-repeat; width:7%; height:7rem; position:absolute; background-size:cover; right:1%; top:6.5rem; color:#529900; font-size:3rem; font-weight:bold; text-align:center; }
.button p { margin-top:2rem; margin-left:8%; }

.layerpop .top { background:url(/images/2014/store/popup-how-top.png) no-repeat; height:4.7rem; }
.layerpop .middle { background:url(/images/2014/store/popup-how-body.png) repeat-y; height:auto; min-height:5rem; }
.layerpop .bottom { background:url(/images/2014/store/popup-how-bottom.png) no-repeat; height:5.7rem; }
.layerpop .top, .layerpop .middle, .layerpop .bottom { width:100%; background-size:100% auto !important; }

.layerpop .mushroom_head { position:absolute; top:-7.5rem; left:3%; width:30%; }
.layerpop .tree { position:absolute; top:-7rem; right:3%; width:65%; }
.layerpop .tree img { max-width:800%; width:100%; }
.layerpop .button { right:4%; top:1.9rem; text-align:center; cursor:pointer; }
.layerpop .button p { position:relative; margin-top:1.2rem; }

.layerpop .title { position:absolute; top: 4rem; left: 41%; font-size: 3rem; }

.steps { width:92%; position:relative; border:1px solid transparent; margin-left:4.5%; }
.steps .step .step_thumb { width:35%; text-align:right; }
.steps .step.s2 .step_thumb img, .steps .step.s3 .step_thumb img { width:80%; }
.steps .step_thumb, .steps .step_content { position:relative; display:inline-block; vertical-align:middle; }
.steps .step_content { position:relative; margin-left:3%; width:55%; }
.steps .desc { margin:1rem auto; }
.note { text-align:center; }

.clickbtn { background:url(/images/2019/button_updates/btn-clickhere-1.png) no-repeat; width:50%; background-size:cover; height:7.8rem; float:right; cursor:pointer; }
.clickbtn:hover { background:url(/images/2019/button_updates/btn-clickhere-2.png) no-repeat; }

.bm .clickbtn { background:url(/images/2019/button_updates/btn-clickhere-1-bm.png) no-repeat; width:50%; background-size:cover; height: 7.8rem; float:right; cursor:pointer; }
.bm .clickbtn:hover { background:url(/images/2019/button_updates/btn-clickhere-2-bm.png) no-repeat; background-size:cover; }

.comingsoon { width:70%; position:relative; margin:2rem auto; display:block; }
.comingsoon .biglabel, .comingsoon .smalllabel { position:absolute; }
.comingsoon .biglabel { font-size:4.5rem; text-shadow: 1px 1px 0 #fff,-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,0px 1px 0 #fff,1px 0px 0 #fff,0px -1px 0 #fff,-1px 0px 0 #fff,1px 3px 7px #000; letter-spacing:1px; width:50%; top:11rem; left:12%; }
.comingsoon .smalllabel { font-size:2rem; width:60%; top:19.6rem; left:7%; }
.bm .comingsoon .smalllabel { font-size:1.5rem; width:60%; top:20rem; left:7%; }

@media only screen and (min-width: 480px) {
	.thumb, .details { display:inline-block; vertical-align:top; }
	.thumb { width:45%; height:21.5rem; }
	.thumb .image_holder { left:12.5%; top:3rem; }
	.details { width:50%; text-align:left; margin-left:2.5%; font-size:2rem; }
	.details .verdana { font-size:1.5rem; }
	.layerpop .button p { top:0.5rem; margin-left:20%; }
	.details .item_title { font-size:3rem; }

}

@media only screen and (min-width: 481px) {
	.comingsoon .biglabel { font-size:4rem; top:11rem; }
}

@media only screen and (min-width: 700px){
	.layerpop { width:640px; left:50%; margin-left:-320px; }
	.layerpop .top, .layerpop .middle, .layerpop .bottom { width:640px; }
	.layerpop .top, .layerpop .bottom { height:40px; }
	.layerpop .tree { width:340px; height:46px; }
	.layerpop .mushroom_head { width:244px; height:170px; top:-69px; left:25px; }
	.layerpop .tree { width:340px; height:46px; top:-37px; right:33px; }

	.layerpop .button { width:60px; height:60px; font-size:30px; }
	.layerpop .button p { margin-left:0; top:0px; }

	.layerpop .title { font-size:20px; top:30px; }

	.steps .step.s2 .step_thumb img { width:143px; }
	.steps .step.s3 .step_thumb img { width:117px; }
	.clickbtn { width:200px; height:70px; }
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 1024px) {
	.thumb { width:213px; height:213px; }
	.thumb .image_holder { width:155px; height:155px; top:30px; position:relative; left:29px; }
	.thumb .image_holder img { border-radius:1rem; }
	.details .verdana { font-size:1.3rem; }
	.details .item_title { font-size:2rem; }
	.layerpop .button p { top:-3px; }
	.how .text { font-size:1.5rem; top:9rem; }
	.bm .clickbtn { height: 5.8rem; }
}

@media only screen and (min-width: 1025px) {
	.comingsoon .biglabel { font-size:2.5rem; top:9rem; }
	.comingsoon .smalllabel { font-size:1.8rem; top:158px; width:350px; left:111px; }
	.bm .comingsoon .smalllabel { font-size:1.3rem; top:162px; width:350px; left:111px; }
}