@charset "utf-8";

.bm .steps .step.s1 { margin-top:14rem; }

.shroom_usage { position:relative; border:2px dotted #592202; width:70%; border-radius:2rem; margin:5rem auto 2rem auto; }
.shroom_usage .title_box { background:url(/images/2014/store/text-holder.png) no-repeat; position:absolute; width:80%; left:10%; height:8rem; border:1px solid transparent;  background-size:100% 100%; color:#0E7369; top:-4.8rem; font-size:11px; }
.shroom_usage .title_box p { position:relative; top:0rem; }

.shroom_usage .shroom_list { width:100%; height:auto; position:relative; margin-top:2.5rem; font-size:11px; }
.shroom_usage .shroom_list .row { border-bottom:1px dotted #592202; text-align:left;  }
.shroom_usage .shroom_list .row div { position:relative; display:inline-block; vertical-align:middle; margin:2rem auto; width:87%; }
.shroom_usage .shroom_list .row.last { border:0; }
.shroom_usage .shroom_list .row .mushroom { background:url(/images/2014/store/icon-bullet-shroom.png) no-repeat; height:4rem; clear:none; width:6%; margin:0 2rem; background-size:cover; }


.shroom_guide { position:relative; width:75%; margin:7rem auto; }
.shroom_guide .top { background:url(/images/2014/store/popup-how-top.png) no-repeat; height:4.3rem; }
.shroom_guide .middle { background:url(/images/2014/store/popup-how-body.png) repeat-y; height:auto; min-height:5rem; }
.shroom_guide .bottom { background:url(/images/2014/store/popup-how-bottom.png) no-repeat; height:5.7rem; }
.shroom_guide .top, .shroom_guide .middle, .shroom_guide .bottom {  width:100%; background-size:100% auto !important; }
.shroom_guide .mushroom_head { position:absolute; top:-7.5rem; left:6%; width:30%; }
.shroom_guide .tree { position:absolute; top:-4.3rem; right:7%; width:55%; }
.shroom_guide .tree img { max-width:800%; width:100%; }
.shroom_guide .button { right:4%; top:1.9rem; text-align:center; cursor:pointer; }
.shroom_guide .button p { position:relative; margin-top:1.2rem; }
.shroom_guide .title { position:absolute; top: 3rem; left: 37%; font-size: 3rem; text-align:left; width:50%; font-size:11px; }

.steps { width:92%; position:relative; border:1px solid transparent; margin-left:4.5%; }
.steps .step .step_thumb { text-align:center; }
.steps .step.s1 { margin-top:12rem; }
.steps .step.s1 .step_thumb img, .steps .step.s2 .step_thumb img, .steps .step.s3 .step_thumb img, .steps .step.s4 .step_thumb img, .steps .step.s5 .step_thumb img, .steps .step.s6 .step_thumb img{ width:80%; }
.steps .step_thumb, .steps .step_content { position:relative; display:inline-block; vertical-align:middle; top:1rem;  }
.steps .step_content { position:relative; margin-left:3%; width:75%; margin-top:1rem; }
.steps .step_content .verdana { font-size:11px;}
.steps .desc { margin:1rem auto; }

@media only screen and (max-width: 390px) {
	.bm .steps .step.s1 { margin-top: 19rem; }
}

@media only screen and (max-width: 480px) {
	.bm .page_title { height: 12rem; }
	.bm .page_title p { font-size: 3.5rem; }
}

@media only screen and (min-width: 481px) {
	.shroom_guide .title { font-size:2.5rem; }
	.shroom_holder .title_box.desktop { display:block; }
	.shroom_holder .title_box.mobile { display:none;}
	.shroom_guide .top { height:4rem;}
	.shroom_usage .title_box p { top:0.4rem; }
	.shroom_usage .title_box { font-size:1.5rem;}
	.shroom_usage .shroom_list { font-size:1.9rem;}
	.steps .step_content .verdana { font-size:1.9rem;}
}
/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 768px) {
	.shroom_usage .title_box { width:60%; height:6rem; left:20%; }
}

@media only screen and (min-width: 1025px) {
	.shroom_usage .title_box p { position:relative; top:0.5rem; }
	.shroom_usage .shroom_list .row { border-bottom:1px dashed #592202; }
	.shroom_usage .shroom_list { font-size:1.5rem;}
	.steps .step_content .verdana { font-size:1.5rem;}
}
