/* --------------------------------------------
   <= 1024px viewport [static]
-------------------------------------------- */			
				
@media (max-width: 1024px) {

	body { background: none; }
	header, #content, footer, .Boxed .slider-container { width: 100%; }

}

/* --------------------------------------------
   < 980px viewport [static]
-------------------------------------------- */			
				
@media (max-width: 979px) {

	body { font-size: 12px; }
	.wrap { width: 724px; }
	.flex-direction-nav li a { height: 60px; background-image: url(../img/slider-nav-small.png); margin: -30px 0 0 0; }
	.flex-caption { font-size: 11px; }
	#content .maincolumn { width: 524px; }
		#content .maincolumn .featured { width: 161px; }
			#content .maincolumn .featured .icon { width: 48px; height: 32px; background-position: bottom left; }
			#content .maincolumn .featured p { width: 113px; }
	#content .sidebar { width: 180px; }
	#content .featured { width: 228px; }
		#content .iconbox .icon { width: 48px; height: 32px; background-position: bottom left; }
		#content .iconbox p { margin-left: 48px; }
	#content .portfolio-excerpt { width: 166px; }
		#content .portfolio-excerpt .text { margin: 0; }
			#content .portfolio-excerpt .text a { margin: 5px 0 0 0; background-position: right 2px; }
	#content .blog-excerpt { width: 166px; }
		#content .blog-excerpt h3 { margin: 0 0 12px 0; }
	#footer-widgets .widgets { width: 166px; }
				#footer-widgets .widgets ul li a { padding: 9px 32px 10px 3px; }
		#footer-widgets .contact-footer .textinput { width: 62px; }
		#footer-widgets .contact-footer textarea { width: 148px; height: 48px; }
				footer .bottom .social-media li .icon { width: 16px; height: 16px; background: url(../img/icons-socialmedia-small.png); }
		footer .bottom .copyright { margin: 2px 0 0 0; }
	.portfoliofilter { width: 96%; margin: 0 2% 30px 2%; }
	.items { width: 100%; }
		.items article { width: 29%; margin: 0 2% 20px 2%; text-align: center; }

}

/* --------------------------------------------
   < 768px viewport [fluid]
-------------------------------------------- */

@media (max-width: 767px) {

	.wrap { width: 90%; }
	header nav ul#mainmenu li .submenu ul { width: 90%; }
	#content .maincolumn { width: 72%; }
	#content .sidebar { width: 25%; }
	#content .featured, #content .maincolumn .featured { width: 30.66%; margin-right: 4%; }
		#content .featured h2, #content .maincolumn .featured h2 { font-size: 11px; }
		#content .featured .icon, #content .maincolumn .featured .icon { display: none; }
		#content .featured p, #content .maincolumn .featured p { width: 100%; }
	#content .portfolio-excerpt { width: 22%; margin-right: 4%; }
	#content .blog-excerpt { width: 22%; margin-right: 4%; }
		#content .blog-excerpt h3 { font-size: 11px; }
		#content .blog-excerpt .meta div { width: 100%; margin: 5px 0 0 0; }
	#footer-widgets .widgets { width: 22%; margin-right: 4%; }
		#footer-widgets .contact-footer .textinput { width: 90%; padding: 3% 5%; margin: 0 0 5px 0; float: left; }
		#footer-widgets .contact-footer textarea { width: 90%; padding: 3% 5%; height: 48px; margin: 0; }
				footer .bottom .social-media li .icon { width: 16px; height: 16px; background: url(../img/icons-socialmedia-small.png); }
		footer .bottom .copyright { margin: 2px 0 0 0; }
	.blogpost .excerpt { width: 100%; margin: 0; }
	.blogpost .info { width: 100%; margin: 0 0 8px 0; }
	.blogpost .item .caption h2 { font-size: 14px; }
		.blogpost .info ul li { margin: 0 20px 0 0; float: left; }
			.blogpost .info ul li a { color: #222; font-size: 12px; padding: 5px 0 5px 32px; background: 7px center no-repeat; width: auto; }
			.blogpost .info ul li a:hover { background-color: transparent; color: #a5723d; }
			.blogpost .info ul li a.author { background-image: url(../img/icons/blog/author-small.png); }
			.blogpost .info ul li a.date { background-image: url(../img/icons/blog/date-small.png); }
			.blogpost .info ul li a.comments { background-image: url(../img/icons/blog/comments-small.png); }
	.widget-container h3.widget-title { font-size: 11px; }

}

/* --------------------------------------------
   <= 640px viewport [fluid]
-------------------------------------------- */

@media (max-width: 640px) {

	body { font-size: 12px; }
	.flex-direction-nav li a { display: none; }
	header h1.logo, header h1.logo-img { width: 100%; text-align: center; float: none; }
	header h1.logo-img { margin: 0 0 20px 0; }
	header nav ul#mainmenu { display: none; }
	header nav #menutoggle { display: block; }
	#content { padding: 0 0 10px 0; }
	#content .maincolumn { width: 100%; }
	#content .sidebar { width: 100%; margin: 30px 0 0 0; }
	#content .iconbox, #content .maincolumn .iconbox { width: 100%; margin: 0 0 20px 0; float: none; }
		#content .featured .icon, #content .maincolumn .featured .icon { display: inline; }
		#content .featured p, #content .maincolumn .featured p { width: auto; margin-left: 48px; float: none; }
	#content .portfolio-excerpt { width: 44%; margin: 0 3% 20px 3%; float: left; }
	#content article.portfolio-excerpt { text-align: center; }
	#content .blog-excerpt { width: 100%; margin: 0 0 20px 0; float: none; }
		#content .blog-excerpt .meta div { width: auto; margin: 0; }
	#content .search { display: none; }
	#content hgroup .pagetitle { text-align: center; width: 100%; }
	#content hgroup .pagesubtitle { background: none; padding: 0; margin: 12px 0 0 0; width: 100%; text-align: center; border: none; }
	#footer-widgets .widgets { width: 100%; margin: 19px 0 20px 0; }
		footer .bottom .copyright { width: 100%; text-align: center; }
		footer .bottom .social-media { width: 100%; text-align: center; }
			footer .bottom .social-media li { display: inline-block; float: none; margin: 5px 0 0 0; }
				footer .bottom .social-media li a { display: inline-block; float: none; }
	.item .caption { max-width: 70%; }
	.one-half,
	.one-third,
	.two-third,
	.three-fourth,
	.one-fourth,
	.one-fifth,
	.two-fifth,
	.three-fifth,
	.four-fifth,
	.one-sixth,
	.five-sixth {
		width: 100%;
	    margin-right: 0;
	    float: none;
	}
	.portfoliofilter { width: 94%; margin: 0 3% 30px 3%; }
	.items article { width: 44%; margin: 0 3% 20px 3%; }

}

/* --------------------------------------------
   <= 320px viewport [fluid]
-------------------------------------------- */

@media (max-width: 320px) {

	.slider-container { display: none; }
	.portfoliofilter { width: 100%; margin: 0 0 30px 0; text-align: center; }
		.portfoliofilter li { margin: 2px 0 2px 0; width: 100%; }
			.portfoliofilter li a, .portfoliofilter li span { width: 100%; max-width: 220px; padding: 3px 0; }
	.items article { width: 100%; margin: 0 0 20px 0; }
	#content .portfolio-excerpt { width: 100%; margin: 0 0 20px 0; float: none; }

}