/**************** Mobile Portrait ****************/

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

	.wrapper,
	.home-content {
		width: 100%;
		padding: 0;
	}

	.home-content {
		margin: 90px 0 0 0;
	}

	.home-post {
		margin: auto;
	}

	a.post,
	.post {
		width: 96%;
		padding: 0 2%;
		margin: 0;
		height: auto;
	}

	.post-title,
	.post-thumb,
	.post-thumb img {
		width: 100%;
		height: auto;
		padding: 0;
		margin: 0;
	}

	.header {
		margin: 0 auto;
	}

	.header-container,
	.footer-container {
		width: 96%;
		padding: 0 2%;
		margin: 0;
		position: relative;
	}

	.logo-text {
		display: none;
	}

	.category-select {
		display: block;
	}

	.header-nav {
		display: none;
		position: absolute;
		top: 70px;
		left: 0;
		width: 100%;
		background: #fff;
		box-shadow: 0 4px 8px rgba(0,0,0,0.1);
		z-index: 999;
		float: none;
	}

	.header-nav.open {
		display: block;
	}

	.main-menu {
		flex-direction: column;
		width: 100%;
	}

	.main-menu li {
		width: 100%;
		border-bottom: 1px solid #eee;
	}

	.main-menu li a {
		height: auto;
		line-height: 22px;
		padding: 12px 15px;
		font-size: 16px;
	}

	.search-form {
		right: 0;
		top: 6px;
	}

	.search-field:focus {
		width: 260px;
	}

	.post-content {
		width: 96%;
		margin: 40px 0 0 0;
		padding: 0 2%;
		float: none;
	}

	h1 {
		font-size: 24px !important;
		line-height: 27px !important;
	}

	h2 {
		font-size: 22px;
		line-height: 25px;
	}

	h3 {
		font-size: 20px;
		line-height: 23px;
	}

	.single {
		margin-top: 0;
	}

	.single-title {
		margin: 40px 0 0 0;
	}

	.single img {
		width: 100%;
		height: auto;
	}

	.sidebar {
		width: 96%;
		margin: 0;
		padding: 0 2%;
		float: none;
	}

	.widget-title {
		width: auto;
		margin: 0;
	}

	.footer {
		margin: 120px 0 0 0;
		font-size: 11px;
	}

	.footer-copy {
		float: none;
		text-align: center;
		line-height: 70px;
	}

	.footer a {
		font-size: 11px;
	}
}


/**************** Tablets ****************/

@media only screen and (min-width: 768px) and (max-width: 1113px) {

	.wrapper,
	.home-content {
		width: 100%;
	}

	.header,
	.footer {
		margin: 0 auto;
	}

	.header-container,
	.footer-container {
		width: 98%;
		margin: 0 1%;
		position: relative;
	}

	.logo-text {
		display: none;
	}

	.category-select {
		display: block;
	}

	.header-nav {
		display: none;
		position: absolute;
		top: 70px;
		left: 0;
		width: 100%;
		background: #fff;
		box-shadow: 0 4px 8px rgba(0,0,0,0.1);
		z-index: 999;
		float: none;
	}

	.header-nav.open {
		display: block;
	}

	.main-menu {
		flex-direction: column;
		width: 100%;
	}

	.main-menu li {
		width: 100%;
		border-bottom: 1px solid #eee;
	}

	.main-menu li a {
		height: auto;
		line-height: 22px;
		padding: 12px 15px;
		font-size: 16px;
	}

	.search-form {
		right: 0;
		top: 6px;
	}

	.search-field:focus {
		width: 300px;
	}

	.post-content {
		width: 98%;
		margin: 60px 1% 0 1%;
		padding: 0;
		float: none;
	}

	.single img {
		width: 100%;
		height: auto;
	}

	.post {
		width: 48%;
		padding: 1% 1% 40px 1%;
		height: auto;
	}

	.post-thumb,
	.post-thumb img,
	.post-title {
		width: 100%;
		height: auto;
	}

	.sidebar {
		width: 98%;
		padding: 0 1%;
		margin: auto;
		float: none;
	}

	.widget-title {
		width: 98%;
		padding: 15px 1%;
		margin: 15px 0;
	}

	.footer {
		margin: 120px 0 0 0;
	}

	.footer-copy {
		float: none;
		text-align: center;
	}
}