@charset "utf-8";

.mainbanners { clear:both; position:relative; margin:auto; }
.mainbanner { position:relative; background:url(/images/2014/home/mainbanners/bg.png) no-repeat; background-size:cover; display:none; }
.navbtn { display:none; }
.paging_dots { position:relative; width:100%; text-align:center; }
.paging_dots .paging_dot { position:relative; display:inline-block; margin:1rem 0.5rem 2rem 0.5rem; width:2rem; height:2rem; background-color:#e1ec2c; border-radius:5rem; margin-bottom:2rem; }
.paging_dots .paging_dot.current { background-color:#114c00; }

.subbanners { margin:auto; width:100%; }
.subbanner { position: relative; width:42%; background: url(/images/2014/home/subbanners/bg.png) no-repeat; background-size: cover; display:inline-block; margin:0 2.5%;  }

.subbanner:hover { background-position:bottom; }
.subbanner .label { position:absolute; top:0; left:0; width:100%; height:100%; }
.subbanner .label p { position:absolute; top:29.5rem; left:0; width:100%; text-align:center; 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; }
.subbanner .label:hover { top: 2px; }
.subbanner .label p { letter-spacing:0.1em; font-size:14px; }
.subbanner.compact .label p { letter-spacing:0.0em; }

.subbanner.red .label { background:url(/images/2014/home/subbanners/label-red.png) no-repeat; background-size: cover; }
.subbanner.red .label p { color:#f2b200; }
.subbanner.blue .label { background:url(/images/2014/home/subbanners/label-blue.png) no-repeat; background-size: cover; }
.subbanner.blue .label p { color:#0e7369; }
.subbanner.yellow .label { background:url(/images/2014/home/subbanners/label-yellow.png) no-repeat; background-size: cover; }
.subbanner.yellow .label p { color:#ff7f00; }
.subbanner.greenyellow .label { background:url(/images/2014/home/subbanners/label-greenyellow.png) no-repeat; background-size: cover; }
.subbanner.greenyellow .label p { color:#114c00; }

.features { clear:both; position:relative; margin:auto; top: 2rem; }
.feature { position:relative; background:url(/images/2014/home/features/bg-mobile.png) no-repeat; background-size:cover; }
.feature .label { position:absolute; top:0; left:0; width:100%; height:100%; }
.feature .label div { position:absolute; letter-spacing:0.1em; font-size:11px; 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; text-align:center; }
.feature .label .label_title { width:100%; color:#da4393; top:2rem; }
.feature .label .label_sub { top:35%; }
.feature .label .label_sub.first { left:17rem; }
.feature .label .label_sub.second { left:35%; }
.feature .label .label_sub.third { left:67rem;}
.feature .label .label_more { color: #d1b9d9; text-shadow:none; letter-spacing:0; top:22.5rem; right:2.5rem; font-size:1.3rem; }

.feature.benefits .label { background:url(/images/2014/home/features/purple-mobile.png) no-repeat; background-size:cover; }

.outer {
	padding: 0 25px;
	margin-top: 20px;
}

.outer .inner {
	background-color: #BD956B;
	border-radius: 20px;
	padding: 10px;
	box-sizing: border-box;
	position: relative;
	max-width: 90%;
	margin: auto;
}

.outer .inner .title {
	position: absolute;
	top: -14px;
	left: 50%;
	transform: translateX(-50%);
}

.outer .inner .innerer{
	border: 2px dashed #592202;
	padding: 10px;
	border-radius: 20px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.outer .inner .innerer .box{
	margin: 0 10px 10px;
}

.outer .inner .innerer .box .inside{
	width: 100%;
}

.outer .inner .innerer .box:last-child{
	position: relative;
}

.outer .inner .innerer .box:last-child .more{
	position: absolute;
	bottom: 10px;
    right: -4px;
    z-index: 1;
}

.outer .inner .innerer .box:last-child img{
	margin: 0;
}

@media only screen and (max-width: 450px) {
	.outer {
		padding: 0 10px !important;
	}

	.subbanner .label p {
		top: 30.5rem;
	}
	/* .outer .inner .innerer .box img{
		margin: 0 0 10px !important;
	} */
}

@media only screen and (min-width: 481px) {
	.mainbanners { clear:both; width:100%; position:relative; margin:auto; }
	.subbanner { width: 21.5rem; margin: 0 1rem;}
	.subbanner .label p { top: 14.7rem; font-size: 2.5rem; }
	.features { width:94rem; }
	.feature .label div { letter-spacing:0.1em; font-size:1.6rem; }
	.feature .label .label_title { top:1.3rem; }
	.feature { background:url(/images/2014/home/features/bg.png) no-repeat; background-size:cover; }
	.feature.benefits .label { background:url(/images/2014/home/features/purple.png) no-repeat; background-size:cover; }
	.feature .label .label_sub { top:6.7rem; }
	.feature .label .label_sub.second { left:40rem; }
	.feature .desktop { display:block; }
	.feature .mobile { display:none; }
	.feature .label .label_more { top:20.4rem; right:1.5rem; }
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 1025px) {
	.navbtn { display:block; position:absolute; top:18rem; width:50px; height:81px; cursor:pointer; }
	.navbtn.left { background:url(/images/2014/button/round-prev.png) no-repeat; left:-38px; }
	.navbtn.right { background:url(/images/2014/button/round-next.png) no-repeat; right:-42px; }
	.navbtn:hover { background-position:bottom; }
	.paging { color:#114c00; text-align:right; width:94%; margin-top:-9px; margin-bottom:10px; }
	.paging .item { background:url(/images/2014/home/mainbanners/paging.png) no-repeat; width:42px; height:36px; position:relative; display:inline-block; text-align:center; cursor:pointer; }
	.paging .item:hover, .paging .item.current { background-position:bottom; color:#e1ec2c; }
	.paging .item p { margin-top:5px; }

	.subbanner { width: 21.5rem; margin: 0 1rem; }
	.feature:hover { background-position:bottom; cursor:pointer; }
	.subbanner .label p { top:15.2rem; font-size:2.1rem; }
	/*.feature { background:url(/images/2014/home/features/bg.png) no-repeat; }*/
	.feature .label div { letter-spacing:0.1em; font-size:1.6rem; }
	/*.feature.benefits .label { background:url(/images/2014/home/features/purple.png) no-repeat; }*/
	.feature .label .label_title { top:1.5rem; }
}