body{
	background: url("../images/blog/mobile/background.jpg");
	color: #4b4b4b;
	font-size: 14px;
}
.bodyPicture{
	background: black url("../images/blog/mobile/ajax-loader.gif") no-repeat center 150px;
}

/* Header */
	.header{
		background: #6b6b6b; /* Old browsers */
		background: -moz-linear-gradient(top, #6b6b6b 0%, #5b5e62 2%, #575b5f 11%, #4c525a 47%, #4b5158 51%, #464d56 52%, #404852 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6b6b6b), color-stop(2%,#5b5e62), color-stop(11%,#575b5f), color-stop(47%,#4c525a), color-stop(51%,#4b5158), color-stop(52%,#464d56), color-stop(100%,#404852)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #6b6b6b 0%,#5b5e62 2%,#575b5f 11%,#4c525a 47%,#4b5158 51%,#464d56 52%,#404852 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, #6b6b6b 0%,#5b5e62 2%,#575b5f 11%,#4c525a 47%,#4b5158 51%,#464d56 52%,#404852 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, #6b6b6b 0%,#5b5e62 2%,#575b5f 11%,#4c525a 47%,#4b5158 51%,#464d56 52%,#404852 100%); /* IE10+ */
		background: linear-gradient(top, #6b6b6b 0%,#5b5e62 2%,#575b5f 11%,#4c525a 47%,#4b5158 51%,#464d56 52%,#404852 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6b6b6b', endColorstr='#404852',GradientType=0 ); /* IE6-9 */
		border-top: 1px solid #222325;
		border-bottom: 2px solid #222325;
		height: 43px;
		position: fixed;
		top: 0px;
		width: 100%;
		z-index: 1000;
	}
	.header .logo{
		background: url("../images/blog/mobile/logo-overblog.png") no-repeat scroll 0 0;
		float: left;
		height: 35px;
		margin: 3px 0 0 20px;
		width: 100px;
	}
	.header .button-box{
		background: url("../images/blog/mobile/header-separator.gif") no-repeat left top;
		float: right;
		padding: 7px 7px 7px 9px;
	}
	.header .button-icon,
	.header .searchForm{
		background: #ececec; /* Old browsers */
		background: -moz-linear-gradient(top, #ececec 0%, #f8f8f8 2%, #fefefe 3%, #fcfcfc 10%, #d2d2d2 83%, #cccccc 98%, #434a54 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ececec), color-stop(2%,#f8f8f8), color-stop(3%,#fefefe), color-stop(10%,#fcfcfc), color-stop(83%,#d2d2d2), color-stop(98%,#cccccc), color-stop(100%,#434a54)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #ececec 0%,#f8f8f8 2%,#fefefe 3%,#fcfcfc 10%,#d2d2d2 83%,#cccccc 98%,#434a54 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, #ececec 0%,#f8f8f8 2%,#fefefe 3%,#fcfcfc 10%,#d2d2d2 83%,#cccccc 98%,#434a54 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, #ececec 0%,#f8f8f8 2%,#fefefe 3%,#fcfcfc 10%,#d2d2d2 83%,#cccccc 98%,#434a54 100%); /* IE10+ */
		background: linear-gradient(top, #ececec 0%,#f8f8f8 2%,#fefefe 3%,#fcfcfc 10%,#d2d2d2 83%,#cccccc 98%,#434a54 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ececec', endColorstr='#434a54',GradientType=0 ); /* IE6-9 */
		float: none;
		margin: 0;
	}
	.header .searchForm{
		border: none;
		left: 50%;
		margin-left: -150px;
		text-align: center;
		top: 46px;
		width: 300px;
	}
	.header .searchQuery{
		padding: 2px;
		width: 250px;
	}
	.header .icon{
		height: 29px;
		width: 30px;
	}
	.header .home .icon{
		background: url("../images/blog/mobile/icons.png") no-repeat 6px 4px;
	}
	.header .categories .icon{
		background: url("../images/blog/mobile/icons.png") no-repeat -40px 5px;
	}
	.header .albums .icon{
		background: url("../images/blog/mobile/icons.png") no-repeat -89px 5px;
	}
	.header .search .icon{
		background: url("../images/blog/mobile/icons.png") no-repeat -134px 5px;
	}
	.header .searchSubmit{
		background-color: #FF457E;
		-moz-border-radius: 5px;
		-o-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		-webkit-appearance: none;
		height: 28px;
	}

	/* @group erog */
		.XX .header .logo{
			background-image: url("../images/blog/mobile/logo-erog.png");
			width: 61px;
		}
	/* end erog */
/* end header */

/* Main */
	.main{
		margin-top: 55px;
		padding: 0 10px 10px;
	}
	.h1{
		font-size: 20px;
		text-align: center;
		/*overflow: hidden;
		text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
		white-space: nowrap;*/
		width: 100%;
	}
	.h2{
		font-size: 17px;
		margin: 0 0 5px 0;
	}
	.h1, .h2, .h2 a{
		color: #0072bc;
	}
	.bigtitle{
		color: #0072bc;
	}
	a{
		color: #0072bc;
		text-decoration: none;
	}
	.article-sample{
		font-size: 13px;
	}
	.link-article-sample{
		color: #4B4B4B;
	}
	.article-sample .h2 a{
		display: block;
		width: 100%;
	}
	.box,
	.article,
	.comment,
	.writeComment{
		background-color: #FFFFFF;
		-moz-border-radius: 4px;
		-o-border-radius: 4px;
		-webkit-border-radius: 4px;
		border-radius: 4px;
		-moz-box-shadow: 0px 2px 4px #656565;
		-webkit-box-shadow: 0px 2px 4px #656565;
		-o-box-shadow: 0px 2px 4px #656565;
		box-shadow: 0px 2px 4px #656565;
		margin: 15px 0;
		overflow: hidden;
		padding: 1em;
	}
	.article{
		margin: 0 0 40px 0;
	}
	.writeComment{
		padding: 0 1em 1em;
	}
	.album,
	.category{
		background: #ffffff; /* Old browsers */
		background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 25%, #e5e5e5 75%, #e5e5e5 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(25%,#ffffff), color-stop(75%,#e5e5e5), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 25%,#e5e5e5 75%,#e5e5e5 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, #ffffff 0%,#ffffff 25%,#e5e5e5 75%,#e5e5e5 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, #ffffff 0%,#ffffff 25%,#e5e5e5 75%,#e5e5e5 100%); /* IE10+ */
		background: linear-gradient(top, #ffffff 0%,#ffffff 25%,#e5e5e5 75%,#e5e5e5 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
	}
	.cats ul{
		margin: 0;
		padding: 0;
	}
	.category{
		list-style: none;
	}
	.category p{
		margin: 0;
	}
	.category a{
		color: #4b4b4b;
		text-decoration: none;
	}
	.illustration img,
	li.album .img span{
		border: 1px solid #d0d0d0;
	}
	.contenuArticle{
		overflow: hidden;
	}
	.contenuArticle img{
		display: block;
		float: none;
		height: auto;
		width: 100%;
	}
	.infoArticle{
		margin: 1em 0 0 0;
	}
	.infoArticle .date{
		float: left;
		font-weight: bold;
		text-transform: uppercase;
	}
	.infoArticle .nbComments{
		float: right;
		text-transform: uppercase;
	}
	.infoArticle .date,
	.infoArticle .nbComments{
		font-size: 12px;
	}
	.addComment{
		margin-top: 1em;
	}
	.addComment fieldset{
		padding : 1em;
	}
	.addComment ul{
		margin: 0;
		padding: 0;
	}
	.addComment li{
		list-style: none;
		margin: 0 0 1em 0;
	}
	.addComment .inlineInput{
		float: left;
		width: 49%;
	}
	.addComment .inlineInput.spacer{
		margin-right: 2%;
	}
	.addComment .w100prct,
	.addComment textarea{
		-moz-border-radius: 5px;
		-o-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		border: 1px solid #999999;
        -moz-box-sizing: border-box; /* ff2 */
        -ms-box-sizing: border-box; /* ie8 */
        -webkit-box-sizing: border-box; /* safari3 */
		box-sizing: border-box; /* css3 rec */
		display: block;
		font-size: 16px;
		overflow: hidden;
		width: 100%;
	}
	.addComment .w100prct{
		padding-top: 7px;
		padding-bottom: 7px;
	}
	.addComment .checkbox{
		vertical-align : bottom;
	}
	.addComment input.w100pcrt{
		display: none;
		margin: 0;
	}
	.addComment #img_key,
	.addComment #texteImage,
	.addComment .refresh{
		-moz-border-radius: 5px;
		-o-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		border: 1px solid #999999;
		vertical-align: middle;
	}
	.addComment #texteImage{
		font-size: 16px;
	}
	.addComment .submit{
		display: block;
		font-size: 16px;
		font-weight: bold;
		padding-top: 7px;
		padding-bottom: 7px;
		width: 100%;
	}
	.addComment .infonok{
		display: none;
	}
	.addComment .error{
		border: 1px solid red;
	}
	.commentPosted{
		color: #0072bc;
		font-weight: bold;
		margin: 1em 0 0;
		text-align: center;
	}
	.comment .bubble{
		margin-bottom: 1em;
	}
	.comment .autor{
		color: #ff457e;
	}
	.comment .autor,
	.comment .date{
		font-size: 14px;
	}
	.comment a.autor{
		text-decoration: underline;
	}
	.ancre{
		position: relative;
	}
	.ancre a{
		position: absolute;
		top: -50px;
	}
	.button.submit,
	.search .searchSubmit{
		background-color: #ff457e;
		-moz-border-radius: 5px;
		-o-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		border: none;
		color: #FFFFFF;
		cursor: pointer;
		-webkit-appearance: none;
	}
	.albums > ul,
	.album > ul{
		list-style: none;
		padding: 0;
		margin: 0;
	}
	.albums .img{
		float: left;
		padding: 0 10px 5px 0;
	}
	.albums .img img{
		height: 70px;
		width: 70px;
	}
	.text h3{
		margin: 0;
	}
	.main.album{
		background-image: none;
		padding: 0 2px 10px;
	}
	.album li{
		display: block;
		float: left;
		margin: 0;
		padding: 0 2px;
	}
	.album li a.img{
		background-color:#CCCCCC;
		border: 1px solid rgba(0, 0, 0, 0.3);
		display: inline-block;
		height: 73px;
		overflow: hidden;
		width: 73px;
	}
	.album .img span{
		height: 73px;
		width: 73px;
		display:block;
		background-position: center center;
		background-repeat: no-repeat;
	}
	.main.picture_wrapper{
		margin: 0;
		min-height: 100%;
		padding: 40px 0 0 0;
		width: 100%;
	}
	.picture{
		text-align: center;
		width: 100%;
	}
	.picture .caption{
		background: rgba(255,255,255, 0.7);
		bottom: 0;
		color: #000;
		display: block;
		font-size: 14px;
		min-height: 20px;
		margin: 0;
		padding: 10px;
		position: fixed;
		width: 100%;
	}
	.picture_wrapper .pagination{
		padding: 0;

	}
	.picture_wrapper .pagination a{
		background: url("../images/blog/mobile/pagination.gif") no-repeat;
		display: block;
		height: 46px;
		position: fixed;
		top: 40%;
		width: 31px;
		opacity: 0.5;
	}
	.picture_wrapper .pagination a.next{
		background-position: right top;
		right: 5px;
	}
	.picture_wrapper .pagination a.prev{
		background-position: left top;
		left: 5px;
	}
/* end main */

/* footer */
	.footer{
		font-family: Arial;
		font-size: 12px;
		margin: 0 20px 5px;
		text-align: right;
	}
	.footer a{
		color: #565656;
		text-decoration: underline;
	}
	.footer .copyright{
		color: #565656;
		text-align: center;
	}
/* end footer */

/* divers */
	/* Erog */
		.XX .adsButton a{
			color: inherit;
		}
	/* end Erog */
/* end divers */

/* media queries pour mobile */
@media screen and (max-width: 640px){
	.list p{
		clear:none;
	}

	/* Ads Top */
	.ads.mobileTop{
		margin-top: 55px;
	}
	.ads+.main{
		margin-top: 10px;
	}
	/* end Ads Top */
}

/* media queries pour tablette */
@media screen and (min-width: 641px){
	.header{
		height: 86px;
	}
	.header .logo{
		background: url("../images/blog/mobile/logo-overblog@2x.png") no-repeat scroll 0 0;
		height: 70px;
		margin: 6px 0 0 20px;
		width: 200px;
	}
	.header .icon{
		height: 58px;
		width: 60px;
	}
	.header .button-box{
		padding: 14px 16px 14px 22px;
	}
	.header .home .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat 12px 10px;
	}
	.header .categories .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat -80px 10px;
	}
	.header .albums .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat -178px 10px;
	}
	.header .search .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat -268px 10px;
	}
	.header .searchForm{
		top: 89px;
	}
	/* Ads Top */
		.ads.mobileTop{
			margin-top: 110px;
		}
		.ads+.main{
			margin-top: 10px;
		}
	/* end Ads Top */
	.main{
		margin-top: 110px;
	}
	.main.picture_wrapper{
		padding: 80px 0 0 0;
	}
	.ancre{
		top: -100px;
	}
	/* @group erog */
		.XX .header .logo{
			background-image: url("../images/blog/mobile/logo-erog@2x.png");
			width: 121px;
		}
	/* end erog */
}

/* @group retina friendly */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-webkit-min-device-pixel-ratio: 2){
	.header .logo{
		background: url("../images/blog/mobile/logo-overblog@2x.png") no-repeat scroll 0 0;
		-moz-background-size: 100px 36px;
		-o-background-size: 100px 36px;
		-webkit-background-size: 100px 36px;
		background-size: 100px 36px;
	}
	.header .home .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat 6px 5px;
	}
	.header .categories .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat -46px 5px;
	}
	.header .albums .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat -100px 5px;
	}
	.header .search .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat -150px 5px;
	}
	.header .home .icon,
	.header .categories .icon,
	.header .albums .icon,
	.header .search .icon{
		-moz-background-size: 171px 21px;
		-o-background-size: 171px 21px;
		-webkit-background-size: 171px 21px;
		background-size: 171px 21px;
	}
	/* @group erog */
		.XX .header .logo{
			background-image: url("../images/blog/mobile/logo-erog@2x.png");
			-moz-background-size: 61px 36px;
			-o-background-size: 61px 36px;
			-webkit-background-size: 61px 36px;
			background-size: 61px 36px;
		}
	/* end erog */
}

/* tablet + retina */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (min-width: 641px), only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 641px){
	.header .logo,
	.XX .header .logo{
		background: url("../images/blog/mobile/logo-overblog-big@2x.png") no-repeat scroll 0 0;
		-moz-background-size: 200px 72px;
		-o-background-size: 200px 72px;
		-webkit-background-size: 200px 72px;
		background-size: 200px 72px;
		float: left;
		height: 140px;
		margin: 6px 0 0 20px;
		width: 200px;
	}
	.header .button-icon{
		margin: 14px 12px 0 0;
	}
	.header .home .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat 12px 10px;
	}
	.header .categories .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat -80px 10px;
	}
	.header .albums .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat -178px 10px;
	}
	.header .search .icon{
		background: url("../images/blog/mobile/icons@2x.png") no-repeat -268px 10px;
	}
	.header .home .icon,
	.header .categories .icon,
	.header .albums .icon,
	.header .search .icon{
		-moz-background-size: 310px 38px;
		-o-background-size: 310px 38px;
		-webkit-background-size: 310px 38px;
		background-size: 310px 38px;
	}
	/* @group erog */
		.XX .header .logo{
			background-image: url("../images/blog/mobile/logo-erog-big@2x.png");
			-moz-background-size: 121px 72px;
			-o-background-size: 121px 72px;
			-webkit-background-size: 121px 72px;
			background-size: 121px 72px;
		}
	/* end erog */
}
