@charset "UTF-8";
/* CSS Document */
/* Mise en forme du site Michael Kuszla Photographie, ©MILK-Michael Kuszla 2014 */
/* _________________ Pense-bête __________________*/
/*
FONTS:			Roboto, Reso
Couleurs:		3c3c3b
				6CE5C9
				2DB8C5
				D7E5B1
*/


@media only screen and (min-width: 1028px) and (min-device-width: 1028px) {

#basis #journal-content article .journal-article h7 {
	text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}

}

@media only screen and (min-width: 767px) and (max-device-width: 1027px) {
	body {
		width:100%!important;
		max-width:100%;
		min-width:100%;
		margin:0;
		padding:0;
		overflow-x:none;
	}
	#homeslideshow, .pulse-main-container {
		height:100%;
		margin-bottom:20px;
	}
	

	/* PAGES INTERIEURS */
	
	body#basis aside {
		min-width:96% !important;
		max-width:100% !important;
		width:calc(100% - 20px) !important;
		margin:0;
		padding:0;
	}
	body#inside aside, body#pages aside, body#album-page aside, aside {
		min-width:100%;
		width:100% !important;
		width:calc(100% - 20px) !important;
		margin:0;
		padding:0;
	}
	.journal-social {
		width:300px;
		max-width:300px;
		margin-left:auto;
		margin-right:auto;
	}
		
}




@media only screen and (min-width: 400px) and (max-width: 767px) {
	body {
		width:100%!important;
		max-width:100%;
		min-width:100%;
		margin:0;
		padding:0;
		overflow-x:none;
	}
	header {
		background-size:cover;
		background-color:transparent;
	}
	#main-logo {
		background:url(../images/main-logo.png) 50% center no-repeat;
		background-size: 50%;
		margin: 10px auto 0 auto;
	}
	#homeslideshow, .pulse-main-container {
		height:100%;
		margin-bottom:20px;
	}
	#basis aside#journal-nav, #basis #photographies-cat, #journal-article-date, h1#overlaytitle, #overlaycaption, .nav-logo, nav#menu ul li.slash, /*div#photographies-home,*/ #sldshw-next, #sldshw-prev, #sldshw-suite, .controls, div.scrollbar {
		display:none !important;
	}
	#basis aside#lifestyle-nav, aside#lifestyle-nav, #photographies-grid, #journal-content, article, .read-more a, #lifestyle-content, #lifestyle-background, #lifestyle-background img, header, nav#menu, nav ul, nav ul li, .nav-item {
		width:100%!important;
		max-width:100%;
		min-width:100%;
		margin:0;
		padding:0;
		
	}
	#image-grid {
		width: 240px !important;
margin: 0px 1em; /*1.06*/
float:left;
	}
	#image-grid img {
		width:100%!important;
		max-width:100%;
		height:100%
	}
	#photographies-grid-preview {
		display:none !important;
	}
	h2 {
	font-size:32px;
	font-size-adjust: inherit;
	}
	h7 {
		font-size:22px;
		width: 100%;
	}
	nav ul li {
		display:block;
	}
	nav {
		width: 100%;
		max-width: 100%;
		/*background: #333;*/
		opacity:0.9;
	}
	#inside header, #inside nav#menu, #pages header, #pages nav#menu, #album-page header, #album-page nav#menu {
		position:relative;
		height: auto;
		padding-bottom: 10px;
	}
	#basis header, #basis nav#menu {
		height: auto;
		padding-bottom: 10px;
	}
	#basis li#image-grid:nth-child(n+4) {
		display:none !important;
	}
	
	

	/* PAGES INTERIEURS */
	
	
	body#inside aside, body#pages aside, body#album-page aside {
		width:100%;
		max-width:100%;
	}
	.journal-social {
		width:300px;
		max-width:300px;
		margin-left:auto;
		margin-right:auto;
	}
	input, textarea {
		width:94%;
		max-width:100%;
	}
	button, div.field {
		width:100%;
		max-width:100%;
		margin:10px 0;
	}
	#home-title.photographie-title, #home-title.journal-title {
		margin: 35px auto 35px auto !important;
	}
	.title-mask {
		background:#fff;
		background-image:none !important;
		-webkit-text-fill-color: #333; /* overrides the white text color in webkit browsers */
		-webkit-background-clip: none;
	}	
	.frame ul li, .frame ul li.album-image-desc {
		min-height:200px;
		height:auto !important;
		width:auto;
		min-width:100%;
		max-width:568px;
		padding:0;
		line-height:0px;
		float:none;
	}
	
	.frame ul li.album-image-desc {
		padding:20px;
		white-space: normal;
		display: block;
	}
	span.image-content {
		max-width:568px;
		min-width:528px;
		width:548px;
		height:auto;
		white-space: normal;
		/*display:block;*/
	}
	.frame {
		min-height:100%;
		max-height:100%;
		width:auto;
		/*max-width:320px !important;*/
		padding:0;
		padding:0;
		line-height:0px;
	}.frame ul, ul#album-display-content, div#album-display {
		min-height:100%;
		max-height:100%;
		width:auto;
		min-width:548px;
		max-width:568px;
		padding:0;
		padding:0;
	}
	
	.image-content {
		width:auto;
		height:200px !important;
	}
	img.album-image {
		min-width:548px;
		width:auto;
		max-width:568px;
		height:auto;
		/*max-height:100%;*/
	}
	#inside #photographies-cat a {
		display:block;
	}
	#inside #photographies-cat {
		display:block;
		height:auto;
	}
	#album-page #album-display-title div.title-content {
		padding:0px;
	}
	#album-page #container {
		padding:0 10px;
		width:auto;
	}
	.frame ul li img {
		filter: grayscale(0);
		-webkit-filter: grayscale(0);
		-moz-filter: grayscale(0);
		-ms-filter: grayscale(0);
		-o-filter: grayscale(0);
		-webkit-transition: all 300ms ease-in-out;
		-moz-transition: all 300ms ease-in-out;
		-o-transition: all 300ms ease-in-out;
		-ms-transition: all 300ms ease-in-out;
		transition: all 300ms ease-in-out;
	}
	#album-page .title-content h2 {
		height:auto;
	}
	
	/* WIDGETS  */
	.fb_iframe_widget, .fb_iframe_widget ~ p, div#___plusone_0 {
		display:block;
		padding:10px !important;
		float:left;
		text-align:center;
	}
		
}
@media only screen and (min-width: 320px) and (max-width: 400px) {
  
	body {
		width:100%!important;
		max-width:100%;
		min-width:100%;
		margin:0;
		padding:0;
		overflow-x:none;
	}
	header {
		background-size:cover;
		background-color:transparent;
	}
	#main-logo {
		background:url(../images/main-logo.png) 50% center no-repeat;
		background-size: 50%;
		margin: 10px auto 0 auto;
	}
	#homeslideshow, .pulse-main-container {
		height:100%;
		margin-bottom:20px;
	}
	#basis aside#journal-nav, #basis #photographies-cat, #journal-article-date, h1#overlaytitle, #overlaycaption, .nav-logo, nav#menu ul li.slash, /*div#photographies-home,*/ #sldshw-next, #sldshw-prev, #sldshw-suite, .controls, div.scrollbar {
		display:none !important;
	}
	#basis aside#lifestyle-nav, aside#lifestyle-nav, #photographies-grid, #image-grid, #journal-content, article, .read-more a, #lifestyle-content, #lifestyle-background, #lifestyle-background img, header, nav#menu, nav ul, nav ul li, .nav-item {
		width:100%!important;
		max-width:100%;
		min-width:100%;
		margin:0;
		padding:0;
		
	}
	#image-grid img {
		width:100%!important;
		max-width:100%;
		height:100%
	}
	#photographies-grid-preview {
		display:none !important;
	}
	h2 {
	font-size:32px;
	font-size-adjust: inherit;
	}
	h7 {
		font-size:22px;
		width: 100%;
	}
	nav ul li {
		display:block;
	}
	nav {
		width: 100%;
		max-width: 100%;
		/*background: #333;*/
		opacity:0.9;
	}
	#inside header, #inside nav#menu, #pages header, #pages nav#menu, #album-page header, #album-page nav#menu {
		position:relative;
		height: auto;
		padding-bottom: 10px;
	}
	#basis header, #basis nav#menu {
		height: auto;
		padding-bottom: 10px;
	}
	#basis li#image-grid:nth-child(n+4) {
		display:none !important;
	}
	
	

	/* PAGES INTERIEURS */
	
	
	body#inside aside, body#pages aside, body#album-page aside {
		width:100%;
		max-width:100%;
	}
	.journal-social {
		width:300px;
		max-width:300px;
		margin-left:auto;
		margin-right:auto;
	}
	input, textarea {
		width:94%;
		max-width:100%;
	}
	button, div.field {
		width:100%;
		max-width:100%;
		margin:10px 0;
	}
	#home-title.photographie-title, #home-title.journal-title {
		margin: 35px auto 35px auto !important;
	}
	.title-mask {
		background:#fff;
		background-image:none !important;
		-webkit-text-fill-color: #333; /* overrides the white text color in webkit browsers */
		-webkit-background-clip: none;
	}	
	.frame ul li, .frame ul li.album-image-desc {
		min-height:200px;
		height:auto !important;
		width:auto;
		min-width:100%;
		max-width:320px;
		padding:0;
		line-height:0px;
		float:none;
	}
	
	.frame ul li.album-image-desc {
		padding:20px;
		white-space: normal;
		display: block;
	}
	span.image-content {
		max-width:600px;
		min-width:200px;
		width:260px;
		height:auto;
		white-space: normal;
		/*display:block;*/
	}
	.frame {
		min-height:100%;
		max-height:100%;
		width:auto;
		/*max-width:320px !important;*/
		padding:0;
		padding:0;
		line-height:0px;
	}.frame ul, ul#album-display-content, div#album-display {
		min-height:100%;
		max-height:100%;
		width:auto;
		min-width:300px;
		/*max-width:320px;*/
		padding:0;
		padding:0;
	}
	
	.image-content {
		width:auto;
		height:200px !important;
	}
	img.album-image {
		min-width:300px;
		width:auto;
		max-width:320px;
		height:auto;
		max-height:100%;
	}
	#inside #photographies-cat a {
		display:block;
	}
	#inside #photographies-cat {
		display:block;
		height:auto;
	}
	/*#album-page #container {
		width:auto;
		max-width:100%;
		padding:10px;
	}*/
	#album-page #album-display-title div.title-content {
		padding:0px;
	}
	#album-page #container {
		padding:0 10px;
		width:auto;
	}
	.frame ul li img {
		filter: grayscale(0);
		-webkit-filter: grayscale(0);
		-moz-filter: grayscale(0);
		-ms-filter: grayscale(0);
		-o-filter: grayscale(0);
		-webkit-transition: all 300ms ease-in-out;
		-moz-transition: all 300ms ease-in-out;
		-o-transition: all 300ms ease-in-out;
		-ms-transition: all 300ms ease-in-out;
		transition: all 300ms ease-in-out;
	}
	#album-page .title-content h2 {
		height:auto;
	}
	
	/* WIDGETS  */
	.fb_iframe_widget, .fb_iframe_widget ~ p, div#___plusone_0 {
		display:block;
		padding:10px !important;
		width:300px !important;
		float:left;
		text-align:center;
	}
		
		
}