
/*-----------------------------------------------------------------------------------*/
/* Media Queries for Standard Devices */
/* http://css-tricks.com/snippets/css/media-queries-for-standard-devices/ */
/*-----------------------------------------------------------------------------------*/

/* All Mobile ----------- */
@media only screen and (min-width : 240px) and (max-width : 1024px) {

	/* iOS and WinMobile text mobile-optimize j.mp/textsizeadjust */
	html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; }

	#navi .custom-menu, #navi .menu ul { display: none; }

	select.responsive_menu {
		display: inline-block;
		background: #fdfdfd url(../images/sprites.png) 12px -167px no-repeat;
		width: 50px;
		border: 1px solid #d8dbdf;
		padding: 10px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		-o-border-radius: 2px;
		border-radius: 2px;
		color: #8f969c;
		cursor: pointer;
		-webkit-appearance: none;
		-moz-appearance: none;
		-o-appearance: none;
		text-indent: -999999px !important;
	}

	select.responsive_menu:hover {  }

	#navi { height: auto; }
	div.menu-notice {
		display: inline-block;
		text-align: center;
		background-color: #f7f8f9;
		padding: 12px;
		margin-top: 25px;
	}

	.slider-home { display: inline-block; }

}


/* iPads (landscape) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : landscape) {
	#navi .custom-menu, #navi .menu ul { display: block; }
	select.responsive_menu, div.menu-notice { display: none; }
}


/* iPads (portrait) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) {

	#header, #footer, #main, #tagline { min-width: 620px; }

	.wrapper { width: 620px; }
	
	#content, #home-content { border-bottom: 1px solid #d8dbdf; margin-bottom: 40px; }

	#home-content:last-of-type { border-bottom: none; margin-bottom: 10px; }

	#primary, #secondary { width: 280px; float: left; }
	#primary { margin-right: 60px; }
	#primary li.widget-container { margin: 0 80px 40px 0; }
	#primary li.widget-container:nth-child(even) { margin-right: 0; }
	#primary span.overlay, #secondary span.overlay { width: 280px; height: 196px; }
	li.widget-container { float: left; }
	span.tagline_text { float: left; clear: left; margin-top: 4px; width: 100%; }

	#content.portfolio { border-bottom: none; margin-bottom: 0; }
	#projects { max-width: 640px !important; }

	#slider-default .slider .item, #slider-default .slider .item .inner { width: 620px; }
	#slider-default.slider-default, #slider-default.slider-default .slider, #slider-default .slider .item .inner { /*height: 237px !important;*/ } /* 360px/100x65.958 = 237px */

	#footer-widget-area .widget-area { float: left; clear: right; display: inline-block; }
	#footer-widget-area .widget-area:nth-child(even) {}
	#footer-widget-area #second.widget-area { margin-right: 0; }
	#footer-widget-area #third.widget-area { margin-left: 0; }
	#footer-widget-area span.overlay { width: 280px; height: 196px; }

	#site-generator { float: left; margin-bottom: 8px; }
	#footer .menu { margin-top: 5px; }
	#footer .menu ul li { margin-right: 20px; margin-left: 0; }

	.layout-2cl #secondary { clear: right; }
	.layout-1col #content { width: 640px; }

	.single-project .hentry { margin-right: 0; }

	.single-project #content { border-bottom: none; margin-bottom: 0; }

	.single-project #secondary { display: none; }

	#project-content { width: 620px; }

	#project-details {
		float: left;
		clear: left;
		width: 100%;
		padding: 0;
		margin-bottom: 20px;
		border-bottom: 1px solid #d8dbdf;
		padding-bottom: 10px;
	}

	.custom-fields { max-width: 300px; float: left; }
	.project-link { float: right; clear: right; width: 260px; }

	#project-details.desktop { display: none; }

	#project-details.mobile {
		display: inline-block;
		border-bottom: none;
		padding-bottom: 0;
		padding-top: 30px;
		margin-bottom: 0;
	}

	.single-project #content {
		border-bottom: none;
		margin-bottom: 0;
	}

}


/* Smartphones (portrait + landscape) ----------- */
@media only screen and (min-width : 320px) and (max-width : 767px) {

	#header, #footer, #main, #tagline { min-width: 420px; }
	.wrapper { width: 420px; }
	#primary, #secondary { float: left; clear: left; width: 420px; }
	#content, #home-content { width: 420px; border-bottom: 1px solid #d8dbdf; margin-bottom: 40px; }
	#home-content:last-of-type { border-bottom: none; margin-bottom: 10px; }
	#tagline { display: none; }

	#projects { max-width: 300px !important; float: left; }

	.slider-home { display: none; }

	#home-message { width: 420px; }

	.page-template-page-templateshomepage-php #header .wrapper { border-bottom: 1px solid #d8dbdf; }
	.page-template-page-templateshomepage-php #main { padding-top: 40px; }

	#footer-widget-area .widget-area { width: 100%; border-bottom: 2px solid #d8dbdf; float: left;}
	#footer-widget-area .widget-area:last-child { border-bottom: none; }
	#footer-widget-area #second { width: 100%; margin-left: 0px; }
	#footer-widget-area #third { width: 100%; margin-right: 0; margin-left: 0px; }

	#site-generator { float: left; text-align: left; }
	#footer .menu ul li { margin-left: 0px; display: block; margin-bottom: 8px; }
	p.footer-text { margin-top: 20px; }

	#player-audio, #player-video, .mejs-container, .mejs-overlay, .mejs-poster { width: 420px !important; }
	#player-video, .format-video .mejs-container, .format-video .mejs-overlay { height: 236px !important; } /* child */

	#primary span.overlay, #secondary span.overlay { width: 300px; height: 210px; }

	.search-results .search-thumb, .search-results .search-thumb span.overlay { display: none; }

	#footer .menu { margin-top: 10px; margin-bottom: 0; }

	.contact_name, .contact_email { width: 420px; }

	.layout-1col #content { width: 420px; }

	#project-content { width: 420px; }

	.single-project .hentry { width: 420px; margin-right: 0; }

	.single-project #content { border-bottom: none; margin-bottom: 0; }

	.single-project #secondary { display: none; }

	#project-details {
		float: left;
		clear: left;
		width: 100%;
		padding: 0;
		margin-bottom: 50px;
		border-bottom: 1px solid #d8dbdf;
		padding-bottom: 50px;
	}

	.custom-fields { margin-bottom: 30px !important; }
	.project-link { float: left; clear: left; width: 260px; }

	span.comments-link { float: left; display: block; margin-top: 7px; width: 100%; }

	#project-details.desktop { display: none; }

	#project-details.mobile {
		display: inline-block;
		border-bottom: none;
		padding-bottom: 0;
		padding-top: 30px;
		margin-bottom: 40px;
	}

	.project-link { margin-top: 0; }

}


/* Smartphones (portrait) ----------- */
@media only screen and (min-width : 320px) and (max-width : 520px) and (orientation : portrait) {

	#header, #footer, #main, #tagline { min-width: 300px; }
	.wrapper { width: 300px; }
	#primary, #secondary { float: left; clear: left; width: 300px; }
	#content, #home-content { width: 300px; }

	#home-message { width: 300px; }

	#player-audio, #player-video, .mejs-container, .mejs-overlay, .mejs-poster { width: 300px !important; }
	#player-video, .format-video .mejs-container, .format-video .mejs-overlay { height: 169px !important; } /* child */

	.contact_name, .contact_email, .contact_message { width: 299px; }

	.layout-1col #content { width: 300px; }
	
	#project-content { width: 300px; }

	.single-project .hentry { width: 300px; }

	.commentlist .children li.comment { padding-left: 0; }

	.format-gallery .gallery-thumb { margin-right: 0; }

}
