/* Width Media Queries */

@media only screen and (min-width: 1025px) {
	#mobile-portfolio {
		display:none !important;
	}
	body.single  {
		background-color:#222 !important;
	}	
}
@media only screen and (min-width: 720px) {
	body {
	}
	body.page .architect-container {
		min-height: 890px;
		min-height: 720px;
	}
		body.home .architect-container {
		min-height: 550px;
		}
		body.single {
			overflow-y: scroll;
		}
		body.blog .architect-container  {
			width: 100%;
			overflow:visible;
		}
	#architect {
	}
		/*#nav.nav .menu {
			display: block !important;
		}*/
		
}

/* Start Portfolio Custom Width */
@media only screen and (min-width: 1680px) and (max-width: 1920px) {
		
.portfolio .side {
	width: 179px;
}

	.portfolio #logo a {
		width: 179px;
	}
		.portfolio #nav.nav {
			width: 149px;
		}
		
		.portfolio #content {
			width: 465px;
		}
	
	
	
	.mos-portfolio .a { /* 1 x 1 */
	width: 179px;
	}
	
	.mos-portfolio .b { /* 2 x 1 */
	width: 368px;
	}
	
		.mos-portfolio .b.footer { /* 2 x 1 */
		width: 348px; /* -20px */
		}

	.mos-portfolio .c { /* 1 x 2 */ 
	width: 179px;
	}
	
	.mos-portfolio .d { /* 2 x 2 */
	width: 368px;
	}
	
	.mos-portfolio .e { /* 3 x 2 */
	width: 557px;
	}
	
	.mos-portfolio .f { /* 1 x 3 */
	width: 179px;
	}
	.mos-portfolio .g { /* 1 x 4 */
	width: 179px;
	}
	
	.mos-portfolio .h { /* 2 x 4 */
	width: 368px;
	}

}

@media only screen and (min-width: 1440px) and (max-width: 1680px) {
			
.portfolio .side {
	width: 173px;
}

	.portfolio #logo a {
		width: 173px;
	}
	.portfolio #nav.nav {
		width: 143px;
	}
		
		.portfolio #content {
			width: 448px;
		}
	
	
	
	.mos-portfolio .a { /* 1 x 1 */
	width: 173px;
	}
	
	.mos-portfolio .b { /* 2 x 1 */
	width: 356px;
	}
	
		.mos-portfolio .b.footer { /* 2 x 1 */
		width: 336px; /* -20px */
		}

	.mos-portfolio .c { /* 1 x 2 */ 
	width: 173px;
	}
	
	.mos-portfolio .d { /* 2 x 2 */
	width: 356px;
	}
	
	.mos-portfolio .e { /* 3 x 2 */
	width: 539px;
	}
	
	.mos-portfolio .f { /* 1 x 3 */
	width: 173px;	}
	.mos-portfolio .g { /* 1 x 4 */
	width: 173px;
	}
	
	.mos-portfolio .h { /* 2 x 4 */
	width: 356px;
	}

}

@media only screen and (min-width: 1367px) and (max-width: 1440px) {
			
.portfolio .side {
	width: 166px;
}

	.portfolio #logo a {
		width: 166px;
	}
	.portfolio #nav.nav {
		width: 136px;
	}
		
		.portfolio #content {
			width: 428px;
		}
	
	
	
	.mos-portfolio .a { /* 1 x 1 */
	width: 166px;
	}
	
	.mos-portfolio .b { /* 2 x 1 */
	width: 342px;
	}
	
		.mos-portfolio .b.footer { /* 2 x 1 */
		width: 322px; /* -20px */
		}

	.mos-portfolio .c { /* 1 x 2 */ 
	width: 166px;
	}
	
	.mos-portfolio .d { /* 2 x 2 */
	width: 342px;
	}
	
	.mos-portfolio .e { /* 3 x 2 */
	width: 518px;
	}
	
	.mos-portfolio .f { /* 1 x 3 */
	width: 166px;
	}
	.mos-portfolio .g { /* 1 x 4 */
	width: 166px;
	}
	
	.mos-portfolio .h { /* 2 x 4 */
	width: 342px;
	}
	
		.mos-portfolio .box-resize-2 {
			width: 166px;
			height: 170px;
		}
		
		
	.mos-portfolio .box-resize {
		height: 350px;
	}

}

@media only screen and (min-width: 1281px) and (max-width: 1366px) {
			
.portfolio .side {
	width: 181px;
}

	.portfolio #logo a {
		width: 181px;
	}
	.portfolio #nav.nav {
		width: 151px;
	}
		
		.portfolio #content {
			width: 473px;
		}
	

	.mos-portfolio .a { /* 1 x 1 */
	width: 181px;
	}
	
	.mos-portfolio .b { /* 2 x 1 */
	width: 372px;
	}
	
		.mos-portfolio .b.footer { /* 2 x 1 */
		width: 352px; /* -20px */
		}

	.mos-portfolio .c { /* 1 x 2 */ 
	width: 181px;
	}
	
	.mos-portfolio .d { /* 2 x 2 */
	width: 372px;
	}
	
	.mos-portfolio .e { /* 3 x 2 */
	width: 513px;
	max-width:513px;
	}
	
	.mos-portfolio .f { /* 1 x 3 */
	width: 181px;
	}
	.mos-portfolio .g { /* 1 x 4 */
	width: 181px;
	}
	
	.mos-portfolio .h { /* 2 x 4 */
	width: 372px;
	}

	.mos-portfolio .box-resize {
		height: 350px;
	}
}

@media only screen and (min-width: 1025px)  and (max-width: 1280px) {
			
.portfolio .side {
	width: 169px;
}

	.portfolio #logo a {
		width: 169px;
	}
	.portfolio #nav.nav {
		width: 139px; /* .a - 30 */
	}
		
		.portfolio #content {
			width: 437px;
		}
	
	
	

	.mos-portfolio .a { /* 1 x 1 */
	width: 169px;
	}
	
	.mos-portfolio .b { /* 2 x 1 */
	width: 348px;
	}
	
		.mos-portfolio .b.footer { /* 2 x 1 */
		width: 328px; /* -20px */
		}

	.mos-portfolio .c { /* 1 x 2 */ 
	width: 169px;
	}
	
	.mos-portfolio .d { /* 2 x 2 */
	width: 348px;
	}
	
	.mos-portfolio .e { /* 3 x 2 */
	width: 527px;
	}
	
	.mos-portfolio .f { /* 1 x 3 */
	width: 169px;
	}
	.mos-portfolio .g { /* 1 x 4 */
	width: 169px;
	}
	
	.mos-portfolio .h { /* 2 x 4 */
	width: 348px;
	}

	.mos-portfolio .box-resize {
		height: 350px;
	}
}

/* End Portfolio Custom Width */

	/* All Mobile Sizes (mobile devices) */
	@media only screen and (max-width: 1024px) { /* 767px */ 

		.mobile-content {
			display:block;
		}

		body.blog > .architect-container {
			padding-bottom:10px;
		}

		#ajax_loader {
			background-color:#FFF;
		}

		#gallery-info, .portfolio-loader {
			display:none;
		}

		.fleft.mini_link {
			width:auto;
			margin-right:10px;
		}

		.footer .sep {
			display:inline-block !important;
			opacity:0.35;
			margin-right:5px;
			position:relative;
			top:-1px;
		}

		.mini_link {
			top:0px;
		}

		body.blog .phone-mail .spacer {
			display:none;
		}

		body.blog .footer .sep {
			top:-10px;
		}

		body.blog .mini_clear {
			padding-top:10px;
		}

		div.wpcf7 img.ajax-loader {
			bottom:-30px;	
		}

		div.wpcf7-response-output {
			margin-bottom:-30px !important;
		}

		body.blog .bg-architect {
			background: #4d3f3f;
		}
		
		.mobile { display: block; }
		.desktop { display: none; }
		
		body {
			height: 550px;
			overflow:visible !important;
		}
		
		#page-border-right, #page-border-bottom {
			display: none;
		}
		.container, #single.container {
			background: yellow;
			height: auto !important;
			width: 100%;
			margin: 0 0 0 10px;
			padding: 10px 0;
			overflow: hidden;
			position: relative;
		}
		#single.container {
			padding: 10px 0 0;
		}
		.container .a {
			width: 100%;
			margin: 0 0 10px -10px;
			height:250px;
		}
		.architect-container {
			overflow: visible;
		}
		
		#portfolio-item .architect-container {
			margin: 0;
		}
			#architect {
				display: none !important;
			}
				#architect.mos-portfolio {
					position: relative !important;
					width: 100% !important;
					margin: 0 0 0 0;
					border-left: 5px solid #fff;
					overflow: hidden;
					height: auto !important;
				}
				
			#architect.mos-portfolio .bg-architect {
				position: relative !important;
				width: 100%;
				height: 170px;
				float: none;
				margin: 0 5px 5px -10px;
				top: auto !important;
				left: auto !important;
			}
			
			#architect .desktop {
				display: none !important;
			}
		
			.architect-pic {
				background-attachment: scroll !important;
			}
		#logo a {
			display: flex;
			width: 100%;
			height: 170px;			
			margin:0 5px 10px -10px;
			border: 0;
		}
		
		.side {
			width: 100%;
			float: none;
		}
		#skip {
			display: block;
			display: none;
			width: 100%;
			height: 5px;
			background: green;
			overflow: hidden;
		}
		
		#nav.nav {
			display: block;
			width: 100%;
			height: auto;
			padding: 0 20px 0 0;
			margin: 0 5px 10px -30px;
			border: 0 !important;
		} 
		#nav.nav .menu {
			
			padding: 0 0 5px;
		}
		#main-content #nav.nav .menu {
			display: block;
		}
			#nav.nav .nav-toggle {
				display: block;
				width: 100%;
				height: 21px;
				overflow: hidden;
				text-decoration: none;
				padding: 0 0 7px 0;
				margin: 0 0 0 20px;
			}
			#nav.nav .nav-toggle span{
				background:#791e00 url(../images/menu.png) no-repeat center center;
				display: block;
				text-indent: -999px;
				overflow: hidden;
				font: 12px/23px 'GeogrotesqueMdMedium', Helvetica, Verdana, Arial, sans-serif;
				text-decoration: none;
				color: #af3e31;
				padding: 3px 0 1px 0;
				margin: 0 0 0 0px;
				cursor: pointer;
			}

			#nav.nav li a {
				padding: 7px 0;
				margin: 0 0 0 50px;
			}
		
		#content {
			width: 100%;
			height: auto !important;
			padding: 15px 0;
			margin:0 5px 10px -10px;
			color: white;
			border: 0 !important;
		}
			.hide-row-1, .hide-row-2, .hide-row-3 {
				height: 0;
				overflow:hidden;
			}
		
		#content > * {
			margin: 0 30px 0.3em !important;
		}
		#content p {margin-bottom: 1em !important;}
		#main-content #content h2, #page #content h1{
			font-size: 200%;
		}
		.foot .b {
			width: 100%;
			float: none;
			margin: 0 5px 10px -15px;
			display: none;
		}
		.footer {
			width: 100%;
			height: auto;
			padding: 15px 0;
			
			margin: 0 0 -10px -10px;

		}

		body.single .footer {
			margin: 0 0 10px -10px;
		}
		/*
		.footer div.fleft {
			margin: 0 0px 0 20px !important;
			width: auto !important;
		}
		
		.footer div.clear, .footer div.address {
			margin: 0 0px 0 40px !important;
			width: auto !important;
		}
		*/
		
		.footer > div{
			margin: 0 30px 0 30px !important;
			width: auto !important;
		}
		#mobile-portfolio .footer > div{
			margin: 0 25px !important;
			width: auto !important;
		}
			.footer span {
				display: block;
			}
			.footer .address span {
				display: inline;
			}
		
		.container .foot .footer p{
			margin: 0;
		}
		/* Page - Contact */

		.contact-col1, .contact-col2 {
		width: 100%;
		float: none;
		}
		.contact-col2 {
			margin: -0.5em 0 0;
		}
		
		.page-contact form input, .page-contact form textarea  {
			width: 100%;
			margin: 0 0 0.5em;
		}
		
		.page-contact form input[type='submit'] {
			margin: 1em -16px 0 0;	
		}

		/* Portfolio Page */ 
		
		body.blog .container {
			padding: 10px 0 0;
		}
		
		#filter {
		margin: 0 20px 0.3em !important;
		}
		#filter li a{
			padding: 7px 0;
			margin: 5px 0% 5px 1.5%;
			font-size: 80%;
			width: 48.5%;
			text-align: center;
			display: block;
		}
			#filter li.filter-label {
				margin: 0 0 1em 10px;
			}
		
		#mobile-portfolio {
			margin: 0 0 0 10px;
			overflow: hidden;
		}
		
		#portfolio-item {
			border: 0;
		}
		#mobile-portfolio .portfolio-item{
			float: none;
			width: 100%;
			height: auto;
			clear: both;
			padding: 0 0 0 5px;
			margin: 0 0 10px -15px;
			position: relative;
		}
			.bg-architect img {
			position: relative;
			display: block;
			z-index: 2;
			top: 0;
			left: 0;
			width: 100%;
			height: auto;
			padding: 0;
			}
			.bg-architect .portfolio-info {
				opacity: 0.8;
				display:block;
				padding: 0;
				width: 100%;
				position: relative;
				top: auto;
				left: 5px;
			}
			.bg-architect .portfolio-info div{
				display:block;
				padding: 2% 5%;
				width: 90%;
			}
		#mobile-portfolio .footer {
			float: none;
			width: 100%;
			clear: both;
			height: auto;
			padding: 15px 0 0 0;
			margin: 0 0 0px -10px;
		}

		/* Portfolio - Single  */
		body.single .architect-container{
			height: auto;
		}
		#portfolio-item {
			margin: 0px 0 0 10px;
		}
		#single.container {
			width: 100%;
		}
		#single #content {
			width: 100%;
			margin: 0 0 10px -10px;
		}
		
		#single .single-info {
			padding: 20px 15px 10px 30px;
			text-align: left;
			margin: 0 !important;
		}
			#single h1 {
				font-size: 150%;
			}
			
		#single .share {
			width:100%;
			clear: both;
		} 	
		#single .share li {
			width: 49.5%;
			float: right;
			display: block;
		} 	
		#single .share li:first-child {
			margin: 0 0.5% 0 0;
			float: left;
		} 	
		#single .share a{
			padding: 7px 0;
			margin: 5px 0 5px 0;
			font-size: 80%;
			width:100%;
			text-align: center;
			display: block;
		}
		
		#gallery-carousel {
			width: 0;
			height: 0;
			overflow: hidden;
		}
			
			#gallery-list .gallery-code li {
				width: 100%;
				height: auto;
				display: block;
				margin: 0 0 10px -10px;
				overflow: hidden;
			}
			
			#gallery-list .gallery-code li img{
				width: 100%;
				height: auto;
				display: block;
			}
		
		div.controls {
			display: none !important;
		}
	.close-mobile {
		background: #700e00;
		display: block;
		width: 100%;
		padding: 5px 0;
		margin: 0 0 10px -10px;
		height: auto;
		position: relative;
		top: auto;
		right: auto;
		clear: both;
		z-index: 7;
		border: 0;
		text-indent: 0;
		overflow: visible;
		text-align: center;
		cursor: pointer;
		transition:all 0.3s ease;
	}

	.close-mobile:hover {
		background:#560C03;
	}

	.close {
		display:none;
	}
		
	}
	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		
		.container {
			background: red;
		}

		div.wpcf7-response-output {
			width:50%;
		}

		.footer .sep {
			margin-right:1px;
		}

		.fleft.mini_link {
			margin-right:6px;
		}
	}
	
	
/* Height Media Queries for Desktop */
	@media only screen and (max-height: 1080px) {	/* 6 Rows  */
		
	}
	@media only screen and (max-height: 900px) {	/* 5 Rows  */
		.hide-row-1 {
			height: 0;
		}
		
	}
	@media only screen and (max-height: 710px) {	/* 4 Rows  */
		.hide-row-1 {
			height: 0;
		}
		.hide-row-2 {
			height: 0;
		}
		#gallery-carousel .gallery-nav span {
			bottom: 30%;
		}
		.controls a {
			bottom: 25%;
		}
		body {
			height: 550px;
			overflow:visible;
		}
		body.home {
			overflow:hidden;
		}
		body.blog {
			overflow:visible;
		}
	}
	@media only screen and (max-height: 560px) {	/* 3 Rows, Minimun Height  */
		#gallery-carousel .gallery-nav span {
			bottom: 15%;
		}
		.controls a {
			bottom: 10%;
		}

		body.home {
			min-height: 550px;
			overflow:visible;
		}
	}

@media only screen and (min-width: 720px) and (max-width: 1024px) {
	/*2 col portfolio*/

	.bg-architect img, .bg-architect .portfolio-info {
		transition: none !important;
	}

	#mobile-portfolio {
		margin:0 10px !important;
	}

	#mobile-portfolio .portfolio-item {
		clear:none !important;
		width:50% !important;
		float:left !important;
		/*display:inline-block !important;*/
		display:block;
		/*height:190px !important;*/
	}
	/*#mobile-portfolio .portfolio-item.even {*/
	#mobile-portfolio .portfolio-item.even {
		/*margin:0 !important;*/
		left:29px;
	}

	#mobile-portfolio .portfolio-item.odd {
		/*margin:0 !important;*/
		left:6px;
	}

	.bg-architect img {
		left:4px !important;
	}

	#mobile-portfolio .portfolio-item.even img {
		left:-7px !important;
	}

	#mobile-portfolio .portfolio-item.even .portfolio-info {
		left:-10px !important;
	}

	#mobile-portfolio .portfolio-item{ 
		margin-bottom:10px !important;
	}

	#mobile-portfolio .footer {
		margin-left:0px !important;
	}
	#mobile-portfolio .footer > div{
			margin: 0 20px !important;
		}
	#mobile-portfolio .footer > div {
		width:43% !important;
		margin-right:4% !important;
	}
}
 
	@media (max-width:767px){#content ul li::before{margin-left:0px}#main-content #content h1, #page #content h1{font-size:20px}#content ul li{font-size:14px;}}