@charset "UTF-8";

/* seuils retenus :
480px
640px
960px
1280px
----------------- */

@media only screen and (max-width:480px) {
	h1 {
		font-size: 1.8em;
		border: solid 1px #777;
		-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
		-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
		-o-box-shadow: rgba(0,0,0,.2);
		box-shadow: 0 1px 2px rgba(0,0,0,.2);
		color: #eee;
		background: #555;
		background: -webkit-gradient(linear, left top, left bottom, from(#777), to(#555));
		background: -moz-linear-gradient(top, #777, #555);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#777777', endColorstr='#555555');	
		}
	h1 a {
		display: block;
		padding: 0 3%;
		color: #fff;
		text-shadow: 0 1px 1px #333;
		}
	h1 a:hover, h1 a:focus {
		background: #333;
		}
	#prelude {
		display: none;
		}
}

@media only screen and (min-width: 481px) {
	#page {
		padding-top: 16px;
		}
	h1 {
	font-size: 2.25em;
		}
	h1 a, h1 a:hover, h1 a:focus {
		background-repeat: no-repeat;
		background-position: left center;
		padding-left: 68px;
		background-image: url(img/home-small.png);
		}
}

@media only screen and (max-width:639px) {
	html {
		-webkit-text-size-adjust: none;
		}
	#wrapper {
		padding: 0 3%;
		}
	img {
		max-width: 100%;
		height: auto;
		width: auto\9; /* pour ie8 */
		}
}

@media only screen and (min-width: 640px) and (max-width: 960px) {
	#wrapper {
		padding: 0 10%;
		}
	#blognav, #blogextra { 
		width: 48%; float:left;
		}
	#blognav {
		margin-right: 4%;
	}
}

@media only screen and (min-width: 961px) {
	#wrapper {
		padding: 0 15%;
		}
	#main {
		width : 100%;
		margin : 0 -26% 0 0;
		float : left;
		display: inline;
		}
	#content {
		margin : 0 32% 0 0;
		padding : 10px;
		}
	#footer {
		clear : both;
		text-align:center;
		}
	#sidebar {
		width : 26%;
		float : right;
		margin-top: 4.66em;
		}
	#blognav, #blogextra {
		margin : 0;
		}
}

@media only screen and (min-width: 1280px) {
	#wrapper {
		padding: 0 140px 0 340px;
		}
	.dc-tags #wrapper, .dc-archive-month #wrapper, .dc-404 #wrapper {
		padding: 0 15%;
		}
	p.post-info { 
		margin-left: -200px; 
		float: left; 
		width: 140px; 
		text-align: right;
		}
	.dc-archive-month p.post-info {
		margin-left: 0;
		float:none;
		width: auto;
		text-align: left;
		}
}