/* Overridden once the browser width reaches 480px */
.hide-mobile {
	display: none;
}

/*
* Mobile Device Media Query
*
*/
@media only screen and (min-device-width : 320px) and (max-device-width : 700px) {

	.post-title, .pinboard .post-title {
		font-size: 21px !important;
		line-height: 24px !important;
	}

	.post-share-prompt {

		left: 100%;

	}

	.container {
		padding-left: 0;
		padding-right: 0;
	}
}



/*
 * This file contains all the tweaks necessary for the site to look and
 * act properly at various resolutions. Most of the responsive layout
 * items are taken care of in grid.css, but this file takes care of the rest
 * (like spacing tweaks, font size changes, etc).
 */

/* Adjust for admin bar */
@media screen and (max-width: 782px) {
	/*
	 * This is necessary for when the user selects to display the admin bar at the top
	 * of the site when they are logged in and the user's browser is less or equal to
	 * 782px wide. Otherwise part of the header would be overlapped by the admin bar.
	 */
	.admin-bar .header-fixable {
		top: 46px;
	}
}

@media screen and (max-width: 480px) {
	body {
		padding-top: 0 !important;
	}
}

@media screen and (max-width: 420px) {
	.sidebar {display: none;}
}


@media screen and (min-width: 750px) {
	.hide-mobile {
		display: block;
	}

	/* When the page scrolls */
	.page-scrolled .header-fixable {
		background: rgba(255, 255, 255, 0.85);
		margin: 0;
		position: fixed;
	}

	.site-logo-container-outer,
	.site-logo-container {
		display: block;
		width: auto;
	}

	.header-nav-full {
		display: table;
		text-align: left;
		width: 100%;
	}

	.header-nav-full .header-nav-inner {
		display: table-row;
		vertical-align: middle;
	}

	.header-nav-full .header-nav-inner .site-logo-container-outer,
	.header-nav-full .header-nav-inner .header-nav-menu-container {
		display: table-cell;
		vertical-align: middle;
		white-space: nowrap;
	}

	.header-nav-full .header-nav-inner .site-logo-container-outer {
		width: 100%;
	}

	.header-nav-full .header-nav-inner .header-nav-menu-container {
		width: auto;
	}

	.header-nav .menu-sliding-toggle,
	.header-nav .menu-sliding-spacer {
		display: none;
	}

	.header-nav .site-logo {
		display: block;
		text-align: center;
	}

	.header-nav-full .site-logo {
		display: inline-block;
		text-align: left;
	}

	.header-nav-full .menu-header-container {
		display: inline-block;
	}

	.share-bar-site {
		padding-top: 7px;
	}

	.header-nav-full .share-bar-site {
		display: inline-block;
		padding-top: 0;
	}

	.site-logo,
	.menu-header-container {
		padding: 6px 0;
	}

	.menu-sliding-container {
		display: none;
	}

	.menu-header .menu-item:hover .sub-menu {
		display: block;
	}

	.post-meta {
		float: left;
		padding-bottom: 0;
		text-align: left;
	}

	.excerpt-widget .post-meta {
		text-align: center;
	}

	.post-share {
	}

	.menu-footer .menu-item {
		display: inline-block;
	}
}

/* Small */
@media screen and (max-width: 767px) {
	.intro-container {
		padding-bottom: 0;
		padding-top: 0;
	}

	.intro-inner > * {
		display: block;
		padding: 6px 0;
		text-align: center;
		width: auto;
	}

	.intro-description {
		border: 1px solid #e5e5e5;
		border-width: 1px 0;
	}
}

/* Medium */
@media screen and (min-width: 768px) {
	.menu-header .menu-item a {
		/* has to be 3 less because of padding */
	}

	.header-nav-left .site-logo {
		padding: 0;
		text-align: left;
	}

	.header-nav-left .menu-header-container {
		padding: 0;
		text-align: right;
	}

	.header-nav-left .menu-header .sub-menu {
		text-align: center;
	}

	.menu-header > .menu-item > a {
		border-width: 0 1px 0 0;
		padding-left: 10px;
		padding-right: 10px;
	}

	.menu-header > .menu-item:first-child > a {
		padding-left: 0;
	}

	.menu-header > .menu-item:first-child > .menu-header-embellishment {
		left: 0;
	}

	.menu-header > .menu-item:last-child > a {
		border-width: 0;
		padding-right: 0;
	}

	.menu-header > .menu-item:last-child > .menu-header-embellishment {
		right: 0;
	}

	.menu-header .menu-header-embellishment {
		left: 10px;
		right: 10px;
	}

	.post-padder {
		padding: 35px 50px 20px;
	}

	.dual .post-padder {
		padding-top: 22px;
	}

	/* Split */
	.maybe-half {
		float: left;
		padding: 0 10px;
		width: 50%;
	}

	.maybe-half-left {
		padding-left: 0;
	}

	.maybe-half-right {
		padding-right: 0;
	}

	/* Change pinboard items from 50% to 33.3333333% */
	.pinboard-item {
		padding: 0 3px;
		width: 33.3333%;
	}
}

/* Large */
@media screen and (min-width: 961px) {
	.pagination-single {
		display: table;
		table-layout: fixed;
		width: 100%;
	}

	.pagination-single-inner {
		display: table-row;
		vertical-align: middle;
	}

	.pagination-single-inner-link {
		display: table-cell;
		width: 50%;
		vertical-align: middle;
	}

	.pagination-single a {
		display: table;
		float: none;
		margin: 0;
		width: 100%;
	}

	.pagination-single .pagination-link-inner {
		display: table-row;
		vertical-align: middle;
	}

	.pagination-single .pagination-image,
	.pagination-single .pagination-text {
		display: table-cell;
		vertical-align: middle;
	}

	.pagination-single .pagination-text {
		padding: 0 12px;
	}

	.dual .pagination-text {
		display: none;
	}
}