/* general */
@media screen and (max-width: 400px) {
	h1 {
		font-size: 1.4em;
	}
	h2 {
		font-size: 1.2em;
	}
	span.intro {
		font-size: 1.2em;
	}



}

/* header */
@media screen and (max-width: 1305px ) {
	header .wrap, footer .wrap, .wrap.front {
		width: calc(100% - 40px);
		margin: 0 20px;
	}
}

@media screen and (max-width: 1290px ) {
	.wrap {
		width: calc(100% - 40px);
		margin: 0 20px;
	}

}


@media screen and (max-width: 810px ) {
	.show-desk {
		display: none;
	}
	.show-mob {
		display: block;
	}
	header nav {
		padding-top: 0;
	}
	nav ul {
		display: none;
		width: 100%;
		float: left;
	}
	nav ul li {
		width: 100%;
		float: left;
		text-align: center;

	}
	nav ul li a {
		width: 100%;
		float: left;
		padding: 20px 0;
		background-color: #f8f8f8;
		border-bottom: 1px solid #eae8e8;
		transition: 0.2s;
	}
		nav ul li a:hover {
			background-color: #6e6f71;
			color: #fff;
		}

	.mob-menu {
		display: block;
		margin-top: 15px;
	}
	nav ul li a:before {
		display: none;
	}


	.header-left img {
		display: block;
		margin: 0 auto;
		max-width: 100%;
		height: auto;
	}
}


@media screen and (max-width: 400px ) {
	#footer-left span {
		width: 100%;
		float: left;
		margin-top: 15px;
		text-align: center;
	}
}

/* about us */
@media screen and (max-width: 1190px ) {
	#aboutus-left, #aboutus-right {
		width: 100%;
	}
	#aboutus-right {
		padding-top: 30px;
	}
	#aboutus-lower-left {
		width: 100%;
		padding-right: 0;
	}
	.mob-ab-w100 {
		width: 100%;
		float: left;
	}
	#aboutus-lower-right {
		display: block;
		margin: 30px auto 0 auto;
		float: none;
	}
}

@media screen and (max-width: 633px ) {
	#ab-right-box {
		width: calc(100% - 40px);
		margin: 0 20px;
	}
	#ab-right-box .videoimg {
		max-width: 100%;
		height: auto;
	}
}
@media screen and (max-width: 574px ) {
	.aboutus-social {
		width: 230px;
	}
	.aboutus-social section:first-child, .aboutus-social section:nth-child(2) {
		margin-bottom: 5px;
	}

	#aboutus-lower-right {
		background-image: none;
		padding: 20px;
		width: 100%;
		display: block;
		float: left;
		border: 2px solid #444e68;
		box-sizing: border-box;
		min-height: 100px;
		height: auto;
	}
	#aboutus-lower-right section {
		width: 100%;
		padding: 0;
		margin: 0;
		height: auto;
	}
}



/* books and apps */
@media screen and (max-width: 1200px ) {
	.avnow-right {
		width: 400px;
	}
	.avnow-left {
		width: calc(100% - 440px);
	}
}
@media screen and (max-width: 1140px ) {
	.csoon-left {
		width: 650px;
		box-sizing: border-box;
		padding-right: 15px;
	}
	.csoon-right {
		width: calc(100% - 650px);
	}
}

@media screen and (max-width: 1090px ) {
	.contentslide, .slick-track {
		box-sizing: border-box;
		height: 350px;
		overflow: hidden;
		max-height: 350px;
	}

}

@media screen and (max-width: 1000px ) {
	.avnow-right {
		display: none;
	}
	.avnow-left {
		width: 100%;
		padding-right: none;
	}
	.av-mob {
		display: block;
		width: 100%;
		font-size: 0.8em;
		padding-bottom: 20px;
		text-align: center;
	}
		.av-mob img {
			max-width: 100%;
			height: auto;
			display: block;
			margin: 0 auto;
		}

}
@media screen and (max-width: 950px ) {
	.contentslide, .slick-track {
		box-sizing: border-box;
		height: auto;
		overflow: hidden;
		max-height: 400px;
	}
	.slick-current {
		border: none;
	}
	.blankslide {
		display: none;
	}
	.w100.onlyOne {
		pointer-events: none;
	}
}
@media screen and (max-width: 915px ) {
	.csoon-left {
		padding-right: 0;
		width: 100%;
		border-right: 0;
		padding-bottom: 20px;
		border-bottom: 1px solid #dcdcdc;
	}
	.csoon-right {
		width: 100%;
		padding: 15px 0;
	}
}
@media screen and (max-width: 650px ) {
	.csoon-left section {
		width: 100% !important;
		padding: 0 !important;
		text-align: center;
		padding-bottom: 20px !important;
	}
	.csoon-left section img {
		max-width: 100%;
		height: auto;
		float: none;
	}
	.avnow-50 {
		padding: 0 0 0px 0;
		width: 100%;
		text-align: center;
	}
		.avnow-50 img {
			max-width: 100%;
			height: auto;
		}
}
@media screen and (max-width: 560px ) {
	.arrow-section {
		width: 40px;
	}
		.arrow-section img {
			max-width: 100%;
			height: auto;
		}
	.sub-product {
		width: calc(100% - 80px);
	}
}
@media screen and (max-width: 450px ) {
	.sub-left, .sub-right {
		box-sizing: border-box;
		padding: 0 20px;
		padding-bottom: 20px;
		width: 100%;
	}
	.sub-left img {
		max-height: 150px;
		width: auto;
		display: block;
		margin: 0 auto;
	}
	.contentslide, .slick-track {
		max-height: 600px;
	}
}


/* support */
@media screen and (max-width: 1200px ) {
	.support-right {
		width: 450px;
	}
	.support-left {
		width: calc(100% - 450px);
	}
}
@media screen and (max-width: 915px ) {
	.support-left, .support-right {
		padding: 0;
		width: 100%;
		float: left;
		padding-bottom: 15px;
	}

}



/* contact us */
@media screen and (max-width: 1030px ) {
	#contact-left, #contact-right {
		width: 100%;
		padding: 0;
	}
	#contact-left {
		padding-bottom: 20px;
	}
}
@media screen and (max-width: 920px ) {
	#contact-bottom-left, #contact-bottom-right {
		width: 100%;
		float: left;
		padding-bottom: 30px;
	}

}



/* our blog */
@media screen and (max-width: 980px) {
	#blog-nav {
		width: 100%;
		float: left;
		margin-top: 20px;
	}
	#blog-nav section {
		margin-left: 0;
		margin-right: 15px;
	}
	#blog-nav section:nth-child(3) {
		margin-right: 0;
	}
	#blog-posts .postcol section {
		width: 47%;
		padding-bottom: 47%;
		margin-right: 0;
		margin-left: 3%;
		box-sizing: border-box;
	}
}
@media screen and (max-width: 805px) {
	#blog-nav section {
		width: calc(50% - 122px);
	}
}
@media screen and (max-width: 678px) {
	#blog-posts .postcol section {
		width: 100%;
		padding-bottom: 100%;
		margin-right: 0;
		margin-left: 0;
		box-sizing: border-box;
	}
}
@media screen and (max-width: 550px) {
	.ourblog-img, .ourblog-text {
		width: 100%;
		padding: 0;
	}
	.ourblog-img {
		padding-bottom: 20px;
	}
}
@media screen and (max-width: 500px) {
	.monthcol, .postcol {
		width: 100%;
	}
	.monthcol {
		padding-bottom: 20px;
	}
	#blog-nav section {
		width: 100% !important;
		margin-right: 0;
		margin-bottom: 10px;
	}
}


/* shop */
@media screen and (max-width: 1300px) {
	#content ul.products li { 
		width: 33%; 
	}
}
@media screen and (max-width: 1100px) {
	.offers, .entry-summary {
		width: 50%;
		box-sizing: border-box;
		padding-left: 20px;
		float: left;
	}
}
@media screen and (max-width: 1000px) {
	#content ul.products li {
		width: 50%;
	}
}
@media screen and (max-width: 750px) {
	#content ul.products li {
		width: 50%;
	}
	.offers, .entry-summary, .shop-single-img {
		width: 100%;
		padding-left: 0;
	}
}
@media screen and (max-width: 700px) {
	#content ul.products li { 
		width: 100%; 
	}
	.shop-head h1 {
		font-size: 1.5em;
		line-height: 1.4em;
	}
	h3.shop-title {
		padding-top: 0.15em;
	}
}
@media screen and (max-width: 475px) {
	#content ul.products li {
		width: 100%;
	}
}
@media screen and (max-width: 400px) {
	.shop-head {
		padding: 0;
	}
	.shop-head h1, .shop-head h3 {
		width: 100%;
		float: left;
		padding-bottom: 20px;
		font-size: 1.2em;
	}
	.shop-head h3 {
		font-size: 1em;
	}
}


/* not alone */
@media screen and (max-width: 950px) {
	#not-alone .img-notalone {
		width: 200px;
		padding-right: 40px;
	}
	#not-alone .na-text {
		width: calc(100% - 240px);
	}
}
@media screen and (max-width: 950px) {
	#not-alone .img-notalone {
		width: 100%;
		padding-right: 0;
		padding-bottom: 20px;
	}
	#not-alone .na-text {
		width: 100%;
		text-align: center;
	}
}

/* ethos popup */
@media screen and (max-width: 670px) {
	/*
	.ethos-popup {
		width: calc(100% - 40px);
		margin: 0 20px;
		left: 0;
		position: absolute;
		top: 20%;
		height: auto;
	}*/
	.ethos-popup {
		width: calc(100% - 40px);
		margin: 0 20px;
		left: 0;
		position: absolute;
		top: 10px;
		height: calc(100% - 20px);
		overflow: scroll;
	}	
	.ethos-popup img {
		max-width: 100%;
		height: auto;
	}
}
@media screen and (max-width: 560px) {
	.ethos-popup {
		width: 100%;
		margin: 0 auto;
	}
	.popup-wrap, .ethos-popup {
		position: relative;
		background: #fff;
		float: left;
		margin-bottom: 10px;
	}
	.popup-wrap.bookspage {
		padding-top: 30px;
	}
}


@media screen and (max-width: 940px) {
#sidebar {
    float: left;
    width: 100%;
    padding-bottom: 40px;
    display: block;
    margin: 0 auto;
}
	#content {
		width: 100%;
	}
}