/* 
	- RadioElectroLyon | V.3.0 | article.css -
	
	 ______   ______     ______
	/\  ___\ /\  ___\   /\  ___\
	\ \  __\ \ \  __\   \ \  __\
	 \ \_\    \ \_____\  \ \_\
	  \/_/     \/_____/   \/_/
	
*/

/*--------------------------------------------------*/
/*---------------------- Entité --------------------*/
/*--------------------------------------------------*/

.article
{
	width: 530px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 25px;
	background-color: #bababa;
	-webkit-box-shadow: 0px 0px 10px 0px #000000;
	-moz-box-shadow: 0px 0px 10px 0px #000000;
	box-shadow: 0px 0px 10px 0px #000000;
	z-index: 3;
}

.article .thumbnail
{
	width: 530px;
	min-height: 75px;
	margin: 0px;
	opacity: 1;
	background-color: #bababa;
}

.article .arrow
{
	position: relative;
	width: 16px;
	height: 8px;
	margin-top: -12px;
	margin-left: 35px;
	background-image: url(../images/arrow.png);
}

.article .content
{
	width: 480px; /* 530-2*25 px */
	padding: 25px;
	padding-bottom: 0px;
	font-size: 12px;
	text-align: justify;
	line-height: 18px;
	color: #666666;
	background-color: #dadada;
	background-image:url(../images/backgroundClear.png);
}

.article .title
{
	width: 440px;
	margin-bottom: 15px;
	text-align: left;
	font-weight: bold;
	color: #999999;
}

.article .tags
{
	widows: 490px;
	padding: 5px;
	font-size: 12px;
	text-align: justify;
	line-height: 16px;
}

/*--------------------------------------------------*/
/*----------------------- Date ---------------------*/
/*--------------------------------------------------*/

.article .date
{
	position: absolute;
	margin-top: 25px;
	margin-left: 20px;
	width: 66px;
	height: 25px;
	z-index: 2;
}

.article .day
{
	position: absolute;
	width: 35px;
	height: 25px;
	margin-top: 0px;
	margin-left: 0px;
	background-image: url(../images/days.png);
}

.article .d01 {background-position: 0px -0px;}
.article .d02 {background-position: 0px -25px;}
.article .d03 {background-position: 0px -50px;}
.article .d04 {background-position: 0px -75px;}
.article .d05 {background-position: 0px -100px;}
.article .d06 {background-position: 0px -125px;}
.article .d07 {background-position: 0px -150px;}
.article .d08 {background-position: 0px -175px;}
.article .d09 {background-position: 0px -200px;}
.article .d10 {background-position: 0px -225px;}
.article .d11 {background-position: 0px -250px;}
.article .d12 {background-position: 0px -275px;}
.article .d13 {background-position: 0px -300px;}
.article .d14 {background-position: 0px -325px;}
.article .d15 {background-position: 0px -350px;}
.article .d16 {background-position: 0px -375px;}
.article .d17 {background-position: 0px -400px;}
.article .d18 {background-position: 0px -425px;}
.article .d19 {background-position: 0px -450px;}
.article .d20 {background-position: 0px -475px;}
.article .d21 {background-position: 0px -500px;}
.article .d22 {background-position: 0px -525px;}
.article .d23 {background-position: 0px -550px;}
.article .d24 {background-position: 0px -575px;}
.article .d25 {background-position: 0px -600px;}
.article .d26 {background-position: 0px -625px;}
.article .d27 {background-position: 0px -650px;}
.article .d28 {background-position: 0px -675px;}
.article .d29 {background-position: 0px -700px;}
.article .d30 {background-position: 0px -725px;}
.article .d31 {background-position: 0px -750px;}

.article .month
{
	position: absolute;
	width: 30px;
	height: 13px;
	margin-top: 0px;
	margin-left: 35px;
	background-image: url(../images/months.png);
}

.article .m01 {background-position: 0px -0px;}
.article .m02 {background-position: 0px -13px;}
.article .m03 {background-position: 0px -26px;}
.article .m04 {background-position: 0px -39px;}
.article .m05 {background-position: 0px -52px;}
.article .m06 {background-position: 0px -65px;}
.article .m07 {background-position: 0px -78px;}
.article .m08 {background-position: 0px -91px;}
.article .m09 {background-position: 0px -104px;}
.article .m10 {background-position: 0px -117px;}
.article .m11 {background-position: 0px -130px;}
.article .m12 {background-position: 0px -143px;}

.article .year
{
	position: absolute;
	width: 31px;
	height: 12px;
	margin-top: 13px;
	margin-left: 35px;
	background-image: url(../images/years.png);
}

.article .y2010 {background-position: 0px -0px;}
.article .y2011 {background-position: 0px -12px;}
.article .y2012 {background-position: 0px -24px;}
.article .y2013 {background-position: 0px -36px;}

/*--------------------------------------------------*/
/*---------------------- Icones --------------------*/
/*--------------------------------------------------*/

.article .icon
{
	position: absolute;
	margin-top: 25px;
	margin-left: 480px;
	padding: 0px;
	width: 25px;
	height: 25px;
	background-color: transparent;
	background-image: url(../images/categories.png);
	z-index: 2;
}

.article .album {background-position: 0px -0px;}
.article .compilation {background-position: 0px -25px;}
.article .ep {background-position: 0px -50px;}
.article .single {background-position: 0px -75px;}
.article .remix {background-position: 0px -100px;}
.article .clip {background-position: 0px -125px;}
.article .review {background-position: 0px -150px;}
.article .report {background-position: 0px -175px;}
.article .evenement {background-position: 0px -200px;}
.article .playlist {background-position: 0px -225px;}
.article .news {background-position: 0px -250px;}
.article .partenariat {background-position: 0px -275px;}
.article .mixtape {background-position: 0px -300px;}
.article .rdf {background-position: 0px -325px;}
.article .tscml {background-position: 0px -350px;}

/*--------------------------------------------------*/
/*----------------------- Like ---------------------*/
/*--------------------------------------------------*/

.article .like
{
	position: absolute;
	width: 60px;
	height: 14px;
	margin-left: 420px;
	text-align: right;
}

/*--------------------------------------------------*/
/*------------------- Informations -----------------*/
/*--------------------------------------------------*/

.article table
{
	width: 100%;
	height: 21px;
}

.article #author
{
	padding-right: 10px;
	text-align: justify;
}

.article #likefb
{
	width: 130px;
	padding-top: 5px;
	text-align: right;
}

.article #displayAuthorDescription{cursor: pointer;}

.article #authorDescription{padding-bottom: 20px;}

/*--------------------------------------------------*/
/*----------------------- Tags ---------------------*/
/*--------------------------------------------------*/

.article .tags a
{
	padding: 0px 5px 0px 5px;
	margin-left: 4px;
	color: #999999;
	text-decoration: none;
	text-transform: lowercase;
	background-color: #dadada;
	border-radius: 7px;
}

.article .tags a:before {content: "#";}