@media only screen and (max-width: 1240px) {

	.site { width: 1060px; padding-left: 40px; padding-right: 40px; }
	.contained { width: 1060px; }

	.sharing-desktop 	{ display: none; }
	.sharing-mobile 	{ display: table; width: 280px; height: 42px; padding: 10px 10px 0 10px; margin-bottom: 20px; text-align: left; }
	.sharing-mobile button,
	.sharing-mobile iframe { display: table-cell; float: left; vertical-align: top; }
	.sharing-mobile button.print { height: 20px; line-height: 18px; border-radius: 3px; }
}

@media only screen and (max-width: 1060px) {

	.site { width: 100%; padding: 0; position: relative; z-index: 100; }
	.contained,
	.products,
	.site-header { width: 980px; margin-left: auto; margin-right: auto; }

	 /* keep the banner above the fold on iPad landscape */
	.logo { top: 12px; width: 310px; }
	.logo a { background-size: contain; }
	.nav-main { margin-top: 130px; }
	.site-header .container { height: 205px; }
	.site-header .social { top: 83px; }
	.site-header .search-form { top: 80px; }
	.site-header .logout-subscription { top: 84px; }

	.footer-affiliates.contained { width: 100%; }
	.subscribe-box .cover {
		right: -10px;
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		transform: rotate(0deg);
	}
}

@media only screen and (max-width: 1020px) {

	.show-desktop 	{ display: none !important; }
	.hide-desktop 	{ display: inherit !important; }
	.show-tablet 	{ display: inherit !important; }
	.hide-tablet 	{ display: none !important; }

	body { font-size: 15px; }
	.body-overlay { background: #FFF; }

	.contained,
	.container,
	.footer-affiliates { width: 640px; }

	.site-header,
	.content-area,
	.sidebar { width: 100%; clear: both; margin: 0 auto; padding: 0; }
	.products { width: 640px; margin-left: auto; margin-right: auto; padding: 0 20px; }

	.sidebar { padding-top: 0;	padding-bottom: 20px; }
	.sidebar:before { display: block; content: ''; width: 100%; height: 32px; background: url('../png/divider-bg.png') left top repeat-x; }

	.site-content { padding-top: 20px; padding-bottom: 20px; }
	.content-area { padding-top: 30px; padding-bottom: 30px; }
	.home .content-area { padding-top: 0; }

	h1 { font-size: 1.45em; }
	h2 { font-size: 1.25em; }

	p.callout { font-size: 1.3em; }

	.topbar,
	#brightcove,
	.products .scroller,
	.footer-nav .sub-menu,
	.footer-nav .is-pseudo-parent { display: none; }
	.footer-nav .sub-menu.reveal-on-devices { display: block; }
	.footer-nav .sub-menu a { font-size: 14px; }

	.site-header {
		margin: 0;
		background: #635c59;
		background: -moz-linear-gradient(top,  rgba(105,97,93,1) 0%, rgba(93,88,84,1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(105,97,93,1)), color-stop(100%,rgba(93,88,84,1)));
		background: -webkit-linear-gradient(top,  rgba(105,97,93,1) 0%,rgba(93,88,84,1) 100%);
		background: -o-linear-gradient(top,  rgba(105,97,93,1) 0%,rgba(93,88,84,1) 100%);
		background: -ms-linear-gradient(top,  rgba(105,97,93,1) 0%,rgba(93,88,84,1) 100%);
		background: linear-gradient(to bottom,  rgba(105,97,93,1) 0%,rgba(93,88,84,1) 100%);
	}
	.site-header .container { height: 70px; margin: 0 auto; float: none; }

	.logo { width: 155px; height: 52px; top: 10px; left: 8px; }
	.logo a { background: url('../png/logo-mobile.png') center center no-repeat; background-size: contain; }

	.switch-nav-main { display: block; position: absolute; top: 0; right: 0; width: 70px; height: 70px; padding: 0; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; text-indent: -9999px; border: 0; outline: none; -webkit-appearance: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
		background: url('../png/switch-nav-bg.png') center center no-repeat;
		background-size: 26px auto;
	}
	a.subscribe-cta-tablet,
	a:hover.subscribe-cta-tablet {
		color: #ebc511;
		font: 12px 'Montserrat', sans-serif;
		text-transform: uppercase;
		text-decoration: none;
		position: absolute;
		display: inherit;
		top: 27px;
		right: 85px;
	}

	.navigation { display: none; }
	.nav-active .navigation { display: block; }
	.nav-active .switch-nav-main { background-color: rgba(0,0,0,0.2); }

	.navigation { background: #f3f1ec; width: 96%; max-width: 420px;  position: absolute; right: 0; top: 70px; z-index: 999;
		padding-top: 60px; /* search */
		padding-bottom: 140px; /* logout, subscribe, social */
		-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.5);
		-moz-box-shadow: 0 0 5px rgba(0,0,0,0.5);
		box-shadow: 0 0 5px rgba(0,0,0,0.5);
	}

	.nav-main { background: transparent; height: auto; margin: 0; padding: 20px 25px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
	.nav-main .menu {
		display: block;
	}
	.nav-main .menu > li {
		background: transparent;
	}
	.nav-main .menu > li,
	.nav-main .menu > li > a { display: block; width: 100%; float: none; border: 0; }
	.nav-main .menu > li > a,
	.nav-main .menu > li > a:hover { height: auto; line-height: 36px; font-size: 18px; border: 0; padding-left: 20px; color: #b61311; border-top: #dbd8d1 1px solid; background: transparent; border-left-color: transparent; border-right-color: transparent; }
	.nav-main .menu > .menu-item-has-children > a { font-size: 18px; }
    .nav-main li > .sub-menu a { white-space: normal; }

	.nav-main .menu > li:hover > a { border-color: #dbd8d1; }
	.nav-main .menu > li:first-child > a { border-top: 0; }
	.nav-main .menu > li:last-child > a { border-bottom: #dbd8d1 1px solid; }

	.nav-main .menu > .menu-item-has-children > a:after { display: none; }
	.nav-main .menu > li.current-menu-item > a { background: transparent; color: #b61311; border-top: #dbd8d1 1px solid; /* font-weight: 700; */ }
	.nav-main .menu > li:before { display: none; }

	.nav-main .sub-menu .spacer { display: none; }
	.nav-main .buffer { margin-top: 0; }
	.nav-main .buffer + .buffer { margin-top: 0; }
	.footer-nav .menu .buffer { margin-top: 0; }

    #masthead .sub-menu-columns .menu-item-has-children,
	#masthead .sub-menu { width: 100%; clear: both; float: none; padding: 0; border: 0; }
	#masthead .sub-menu { display: none; position: static; background: transparent; opacity: 1; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }

	.nav-main .menu > .menu-item-has-children > i { display: inline-block; width: 10px; height: 100%; width: 16px; position: absolute; left: 1px; top: 0; }
	.nav-main .menu > .menu-item-has-children > i:before { font-family: 'FontAwesome'; font-size: 13px; content: '\f067'; color: #948f8c; font-style: normal; line-height: 40px; }

	#masthead .menu-item-expanded { padding-bottom: 8px; }
	#masthead .menu-item-expanded > .sub-menu { padding-left: 20px; }
	#masthead .menu-item-expanded .sub-menu { display: block; }
	#masthead .menu-item-expanded.menu-item-has-children > i:before { content: '\f068'; }

	#masthead .nav-main li:hover > a { background: transparent; color: #b61311; }
	.nav-main .sub-menu .menu-item strong { color: #58514e; font: 14px 'Montserrat', sans-serif; font-weight: 400; }
	#masthead .nav-main li > .sub-menu > li:first-child > a,
	#masthead .nav-main li > .sub-menu a { background: transparent; text-shadow: none; color: #58514e; font: 14px 'Montserrat', sans-serif; font-weight: 400; padding: 8px 0; }
	#masthead .nav-main li > .sub-menu a { background: url('../png/sub-menu-item-bg-mobile.png') left top repeat-x; }

	#masthead .nav-main li > .sub-menu .sub-menu .menu-item { display: none; }
	#masthead .nav-main li > .sub-menu .sub-menu .menu-item.is-pseudo-parent { display: block; }

	.logout-subscription {
		position: absolute;
		right: auto;
		bottom: 120px;
		left: 25px;
	}
	.site-header .logout-subscription {
		top: auto;
	}

	.site-header .social { top: auto; right: auto; bottom: 20px; left: 20px; }
	.site-header .logout-subscription ~ .social { right: auto; }
	.site-header .social a { margin-right: 5px; font-size: 22px; }

	.site-header .search-form { top: 25px; right: auto; left: 25px; width: 90%; max-width: 335px; height: 32px; background: rgba(255,255,255,0.75); }
	.site-header .search-form input { line-height: 30px; }
	.site-header .search-form button { top: 2px; right: 4px; }
    .site-header .search-query { width: 365px; }
    .site-header .search-query input { width: 320px; }

	.subscribe-box * { display: none; }
	.subscribe-box:before { display: none; }
	.subscribe-box { width: auto; height: auto; top: auto; right: auto; bottom: 70px; left: 25px; }
	.subscribe-box a.button-cta { display: block; left: 0; bottom: 0; padding: 0 48px 0 18px; font-size: 15px; height: 35px; line-height: 35px; }
	.subscribe-box a.button-cta:after { width: 32px; }

	.subscribe-box-home * { display: none; }
	.subscribe-box-home:before { display: none; }
	.subscribe-box-home { width: auto; height: auto; top: auto; right: auto; bottom: 70px; left: 25px; }
	.subscribe-box-home__link { display: block; }
	.subscribe-box-home .button-cta { display: block; padding: 0 48px 0 18px; font-size: 15px; height: 35px; line-height: 28px; margin: 0; }
	.subscribe-box-home .button-cta:after { width: 32px; }

	.flexslider,
	.slides > div {
		height: 225px;
	}

	.slides span { font-size: 24px; left: 25px; bottom: 20px; }
	.flex-control-nav { display: none; }
	.slides a span:after { width: 22px; height: 22px; font-size: 8px; line-height: 23px; top: -4px; text-indent: 9px; }
	.slides a span:after { text-shadow: none; }

	.card { width: calc(50% - 15px); }
	.card--article--8 {
		display: block;
	}

	.category .post-list:last-child > li:last-child { margin-bottom: 0; }
	.post-list li.has-thumbnail > div { width: 415px; }

	.page-header,
	.entry-header { padding-right: 75px; }

	.page-header .rss,
	.entry-header .rss { top: 2px; right: 26px; font-size: 22px; }

	.sideblock.weekly { }

	.weekly-editorial,
	.magazine-editorial { margin-bottom: 30px; }

	.products { min-height: 0; margin-top: 30px; }
	.products .scroller-prev,
	.products .scroller-next { display: none; }
	.products h2 { margin: 0; font-size: 1.1em; text-align: center; }
	.products h2 a { display: block; padding: 30px 20px; }
	.products h2 a:after { font: 1em 'FontAwesome'; content: '\f101'; color: #a99e8a; padding-left: 8px; }

	.footer-affiliates { height: auto; background: url('../jpg/footer-logos-bg-mobile.jpg') center bottom no-repeat; background-size: 700px auto; }
	.footer-affiliates .container { width: 100%; max-width: 690px; border-top: 0; }
	.footer-affiliates li { width: 130px; height: 50px; margin-right: 14px; }
	.footer-affiliates li:last-child { margin-right: 0; }
	.footer-affiliates li a { background-size: contain; }
	.footer-affiliates ul { text-align: center; }
	.footer-affiliates ul:after { display: none; }
	.footer-affiliates .ad { display: none; margin-bottom: 8px; }

	.footer-nav .container { padding: 20px 30px;
		-webkit-column-count: 2;
		-webkit-column-gap: 30px;
	}

	.footer-nav .col { clear: both; width: auto; margin: 0; padding: 0; min-height: 0; background: none; }
	.footer-nav .menu a { display: block; margin-bottom: 8px; }

	.footer-info { text-align: left; }
	.footer-info > div { padding-left: 30px; padding-right: 190px; }
    .footer-info .copyright,
    .footer-info .credits {
        float: none;
    }
    .footer-info .credits:before {
        content: '';
    }
    .footer-info .copyright:after,
    .footer-info .credits:after {
        content: '\00a0\00a0\2022\00a0';
    }
	.site-footer a.subscribe { right: 30px; }

	.site-footer .social { margin-top: 20px; margin-bottom: 10px; }
	.site-footer .social a { width: 22px; height: 24px; font-size: 18px; margin: 0 5px 0 0; }
	input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"] {
		width: 50%;
	}
}

@media only screen and (max-width: 680px) {

	body { font-size: 14px; }

	.show-desktop 	{ display: none !important; }
	.hide-desktop 	{ display: inherit !important; }
	.show-tablet 	{ display: none !important; }
	.hide-tablet 	{ display: none !important; }
	.show-mobile 	{ display: inherit !important; }
	.hide-mobile 	{ display: none !important; }

	.content-area,
	.sidebar { padding-left: 20px; padding-right: 20px; padding-top: 10px; }
	.products { margin-left: 20px; margin-right: 20px; }

	.navigation { max-width: 350px; }

    .site-header .search-form { max-width: 265px; }
    .site-header .search-query { width: 295px; }
    .site-header .search-query input { width: 245px; }


	.site { width: 100%; padding: 0; position: relative; z-index: 100; }
	.contained,
	.container,
	.footer-affiliates,
	.products { width: 100%; margin: 0 auto; padding-left: 0; padding-right: 0; }

	.home .site-content { padding-top: 0; }

	.card { width: 90%; margin-left: auto; margin-right: auto; }
	.card--current-issue:before {
		content: '';
		display: block;
		padding-top: 40%;
	}
	.card__cover--behind,
	.card__link:hover .card__cover--behind {
		left: 48%;
		-webkit-transform: translateY(13px) rotate(-6deg);
		-moz-transform: translateY(13px) rotate(-6deg);
		transform: translateY(13px) rotate(-6deg);
	}
	.card__cover--front,
	.card__link:hover .card__cover--front {
		left: 52%;
		-webkit-transform: translateY(14px) rotate(9deg);
		-moz-transform: translateY(14px) rotate(9deg);
		transform: translateY(14px) rotate(9deg);
	}

	.banner .slides span { font-size: 22px; }
	.banner.flexslider { height: 300px; }
	.banner .slides > div { height: 300px; background-size: auto 300px; }

	.page-header .rss,
	.entry-header .rss { right: 5px; }

	.post-categories a,
	.entry-meta { font-size: 11px; }
	.post-categories li { margin-right: 7px; margin-bottom: 0px; }

	.entry-content h3 { font-size: 1.4em; }

	.post-list li.has-thumbnail > a { float: left; padding-right: 20px; }
	.post-list li.has-thumbnail > div { width: auto; overflow: hidden; float: none; }
	.post-list img { width: 170px; }
	.post-list h2 { margin-bottom: 4px; }
	.post-list .entry-meta .posted-by,
	.post-list .entry-meta .posted-on,
	.post-list .entry-meta .separator { display: none; }

	.archive-content,
	.entry-content { border-top-width: 1px; }

	.content-area .sideblock.weekly { display: none; }

	.sharing-mobile { width: 100%; }

	.project-gallery .gallery-item { width: 42.25%; margin: 0 2.5% 2.5% 0; }

	.related-posts__nav--endcap {
		flex-flow: column wrap;
	}
	.related-posts__item--endcap {
		width: 100%;
		padding-bottom: 10px;
	}

	#disqus { padding: 25px 0; }

	.footer-affiliates li { display: block; width: 100%; max-width: 170px;  }
	.footer-affiliates li a { background-position: left center !important; }
	.footer-affiliates ul { max-width: 380px; margin: 0 auto; }

	.footer-info .container	{ padding: 22px 170px 20px 20px; max-width: 420px; height: auto; line-height: 18px; min-height: 80px; }
	.footer-nav .container 	{ padding: 20px 20px 10px 20px; max-width: 420px; height: auto; }
	.footer-nav .menu > li > a { font-size: 14px; }

	.site-footer a.subscribe { top: 15px; right: 20px; padding: 0 15px; }

	input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"] {
		width: 50%;
	}

	.playlist-categories li a { width: 48.5%; }

    a.button-plans--subscribe { display: none; }
    a.button-plans--subscribe--alternate { display: block; }

	.subscribe-modal__interstitial {
		margin-left: auto;
		margin-right: auto;
		padding-left: 0;
		max-width: 250px;
	}
}

@media only screen and (max-width: 600px) {
	input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"] {
		width: 100%;
	}
	.banner.flexslider { height: 250px; }
	.banner .slides > div { height: 250px; background-size: auto 250px; }
	.banner .slides span { font-size: 18px; left: 20px; padding-right: 20px; }
	.banner .slides a span:after { display: none; }

    .post-list li.is-premium h2::after {
        position: relative;
        content: '\00a0\2605';
        right: auto;
        top: auto;
        font-size: 1em;
    }

	.project-gallery .gallery-item { width: 42.25%; margin: 0 2.5% 2.5% 0; }
}

@media only screen and (max-width: 468px) {
	input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"] {
		width: 100%;
	}
	.post-list img { width: 120px; }
	.footer-affiliates { padding-top: 0; }
	.playlist-categories li a { width: 100%; margin-right: 0; height: 40px; line-height: 40px; }
    .site-header .search-form { max-width: 230px; }
    .site-header .search-query { width: 260px; }
    .site-header .search-query input { width: 215px; }

}

@media only screen and (max-width: 420px) {
	input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"] {
		width: 100%;
	}
	.footer-affiliates .container { margin: 0; padding-left: 20px; padding-right: 20px; }
}

@media only screen and (max-width: 400px) {
	input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"] {
		width: 100%;
	}
	h2 { font-size: 1.2em; }

	.logo { width: 135px; }
	a.subscribe-cta-tablet, a:hover.subscribe-cta-tablet { right: 75px; }

	.button.button-plans { font-size: 15px; }
	.button.button-plans .hide-mobile { display: none; }

	.banner.flexslider { height: 200px; }
	.banner .slides > div { height: 200px; background-size: auto 200px; }

	.post-list li.has-thumbnail > a { padding-right: 15px; }
	.post-list li p { display: none; }
	.post-list img { width: 100px; }

	.project-gallery { width: 100%; }
	.project-gallery .gallery-item > a { display: block; width: 100%; }
	.project-gallery .gallery-item img { width: 100%; }
	.project-gallery .gallery-item { width: 100%; margin: 0 0 15px 0; }

	.content-area, .sidebar { padding-right: 10px; padding-left: 10px;}

	.footer-nav .container { -webkit-column-count: 1; }
	.footer-info .container { padding-right: 20px; }
	.site-footer a.subscribe { position: relative; top: auto; right: auto; width: 100%; margin: 20px auto 0 auto; }
}