/*----------------------------------------------------------
	Main CSS
	Main styles for all the website

	Project:		virtuousquare.fr
	Author:			Sébastien Plaignaud
	Last modif:		Juillet 2009
	
	Summary :
		Ligne 27	Génréral
		Ligne 120	Header
		Ligne 150	Colonnes principales gauche et droite
		Ligne 167	Affichage
		Ligne 428	Affichage droite
		Ligne 462	Cellules et lignes
		Ligne 614	Colonne
		Ligne 720	Barre de navigation
		Ligne 788	Paginator
		Ligne 814	Footer
		Ligne 898	Billet
		Ligne 997	Form
		Ligne 1029	Page coups de coeur
		ligne 1071	Signature
		ligne 1084	RSS
----------------------------------------------------------*/

body
	{	
	background:url(../images/bg_arc.png) fixed top !important;
	color:#676767;
	font-family: tahoma, verdana;
	font-size:12px;
	line-height:16px;
	margin:0;
	}

ul,
p
	{
	margin:0;
	padding:0;
	}
	
li
	{
	list-style:none;
	}

a,
a img
	{
	border:none;
	text-decoration:none;
	}

a,
h2,
h2 a
	{
	color:#2ebdf0;
	}

h2,
h3
	{
	font-size:14px;
	font-weight:bold;
	padding:3px 0;
	}
	
h2
	{
	margin:0;
	}

h2 a:hover,
a:hover
	{
	color:#ec5f88;
	}
	
h3
	{
	background:url(../images/fd_h3.png) right -50px no-repeat;
	border-bottom:1px solid #dedbdb;
	clear:both;
	color:#2ebdf0;
	cursor:pointer;
	height:17px;
	margin:0 0 9px 0;
	}
	
h3:hover
	{
	background-position: right -75px;
	}
	
h3.close
	{
	background-position: right 0px;
	}
	
h3.close:hover
	{
	background-position: right -25px;
	}
	
.footer h3,
.footer h3:hover
	{
	background:none;
	}
	
.clear
	{
	clear:both;
	}


/*________________________________Header___________________________________*/
.top_body,
.perso,
.container
	{
	float:left;
	width:3500px;
	}
	
.top_body
	{
	background:url(../images/gb_top.png);
	height:185px;
	margin-top:40px;
	}
	
.perso
	{
	background:url(../images/gb_perso.png) 0 40px fixed no-repeat;
	height:185px;
	margin-top:0px;
	}


.container
	{
	background:url(../images/gb_body.png);
	}


/*________________________________Colonnes principales gauche et droite___________________________________*/
.content_gch,
.content_drt
	{
	background:#fff;
	float:left;
	padding:0 0 20px 14px;
	width:976px;
	}
	
.content_drt
	{
	float:right;
	padding:0 14px 20px 0;
	}


/*________________________________Affichage___________________________________*/
.barre_aff
	{
	background:#fff;
	border-bottom:1px solid #dedbdb;
	float:left;
	height:24px;
	line-height:22px;
	width:976px;
	}
	
.aff_opt li
	{
	float:left;
	height:24px;
	margin:0 10px 0 0;
	width:10px;
	}
	
.aff_opt li.legende
	{
	font-size:10px;
	width:60px;
	}
	
.content_drt .aff_opt li
	{
	float:right;
	margin:0 0 0 10px;
	}
	
.aff_opt li a
	{
	background:url(../images/aff_opt.png) no-repeat;
	float:left;
	height:22px;
	width:10px;
	}

.barre_aff .aff_cell a
	{
	background-position: top left;
	margin:0 10px 0 0;
	}

.content_drt .barre_aff .aff_cell a
	{
	margin:0;
	}

.barre_aff .aff_cell a:hover,
.aff_cell a.selected
	{
	background-position: bottom left;
	}

.barre_aff .aff_line a
	{
	background-position: top right;
	}

.barre_aff .aff_line a:hover,
.aff_line a.selected
	{
	background-position: bottom right;
	}

.aff_tags,
.aff_tags li,
.aff_tags li a,
.billet_tags span
	{
	float:left;
	height:24px;
	}
	
.aff_tags
	{
	background:url(../images/tag.gif) no-repeat;
	margin:0 0 0 40px;
	padding:0 0 0 40px;
	width:430px;
	}
	
.aff_tags li
	{
	margin:0 10px 0 0;
	padding:0;
	width:25px;
	}
	
.aff_tags li a,
.billet_tags span
	{
	background:url(../images/tags.gif) no-repeat;
	width:25px;
	}
	
.tag_illu a.affich,
.billet_tags .tag_illu
	{
	background-position: 0px top;
	}
	
.tag_web a.affich,
.billet_tags .tag_web
	{
	background-position: -34px top;
	}
	
.tag_photo a.affich,
.billet_tags .tag_photo
	{
	background-position: -68px top;
	}
	
.tag_anim a.affich,
.billet_tags .tag_anim
	{
	background-position: -102px top;
	}
	
.tag_graphisme a.affich,
.billet_tags .tag_graphisme
	{
	background-position: -136px top;
	}
	
.tag_music a.affich,
.billet_tags .tag_music
	{
	background-position: -170px top;
	}
	
.tag_jeux a.affich,
.billet_tags .tag_jeux
	{
	background-position: -204px top;
	}
	
.tag_fun a.affich,
.billet_tags .tag_fun
	{
	background-position: -238px top;
	}
	
.tag_film a.affich,
.billet_tags .tag_film
	{
	background-position: -272px top;
	}
	
.tag_article a.affich,
.billet_tags .tag_article
	{
	background-position: -306px top;
	}
	
.tag_design a.affich,
.billet_tags .tag_design
	{
	background-position: -340px top;
	}
	
.tag_autre a.affich,
.billet_tags .tag_autre
	{
	background-position: -374px top;
	}

.tag_illu a.masq
	{
	background-position: 0px bottom;
	}
	
.tag_web a.masq
	{
	background-position: -34px bottom;
	}
	
.tag_photo a.masq
	{
	background-position: -68px bottom;
	}
.tag_anim a.masq
	{
	background-position: -102px bottom;
	}
	
.tag_graphisme a.masq
	{
	background-position: -136px bottom;
	}
	
.tag_music a.masq
	{
	background-position: -170px bottom;
	}
	
.tag_jeux a.masq
	{
	background-position: -204px bottom;
	}
	
.tag_fun a.masq
	{
	background-position: -238px bottom;
	}
	
.tag_film a.masq
	{
	background-position: -272px bottom;
	}
	
.tag_article a.masq	
	{
	background-position: -306px bottom;
	}
	
.tag_design a.masq
	{
	background-position: -340px bottom;
	}
	
.tag_autre a.masq
	{
	background-position: -374px bottom;
	}

.search
	{
	float:right;
	height:20px;
	padding:2px 0 0 0;
	width:250px;
	}
	
.input_search
	{
	background:#dedbdb;
	border:none;
	color:#666;
	float:left;
	height:15px;
	margin:3px 0 0 0;
	padding:0 0 0 3px;
	width:225px;
	}
	
.submit_search
	{
	background:url(../images/bt_search.png) no-repeat;
	border:none;
	cursor:pointer;
	float:right;
	height:22px;
	margin-top:0px;
	width:22px;
	}
	

/*________________________________Affichage droite___________________________________*/
.content_drt .barre_aff,
.content_drt a.aff_line,
.content_drt .content,
.content_drt .line,
.content_drt a.aff_cell,
.content_drt .aff_tags
	{
	float:right;
	}
	
.content_drt a.aff_cell
	{
	margin:0 0 0 10px;
	}
	
.content_drt .aff_tags
	{
	margin:0 80px 0 0;
	}
	
.content_drt .search
	{
	float:left;
	}


.content
	{
	float:left;
	width:726px;
	}
	

/*________________________________Cellules et lignes___________________________________*/
.cell,
.line
	{
	border-bottom:1px solid #dedbdb;
	color:#ec5f88;
	float:left;
	font-size:11px;
	margin: 0 15px 0 0;
	}

.cell
	{
	height:349px;
	width:227px;
	}

.line
	{
	width:711px;
	}

.top_line
	{
	background:#fff;
	padding:0 0 5px 0;
	}

.content_drt .cell,
.content_drt .line
	{
	margin: 0 0 0 15px;
	}

.cell_img
	{
	height:203px;
	overflow:hidden;
	width:227px;
	}
	
.line_img
	{
	float:left;
	margin:7px 15px 0 0;
	width:467px;
	}

.date,
.com_name,
.descr
	{
	margin:0;
	padding:4px 0;
	}
	
.date,
.com_name
	{
	color:#ec5f88;
	font-size:11px;
	}
	
.descr
	{
	color:#676767;
	font-size:12px;
	}
	
.cell .descr
	{
	height:68px;
	}
	
.billet_tags
	{
	background:#fff url(../images/tag.gif) no-repeat;
	color:#2ebdf0;
	float:left;
	height:24px;
	line-height:24px;
	padding:0 0 0 38px;
	text-decoration:none;
	width:152px;
	}
	
.line .billet_tags
	{
	width:636px;
	}
	
.comment_fd
	{
	background: url(../images/bg_arc.png) fixed top !important;
	float:right;
	height:24px;
	width:15px;
	}
	
.comment_img
	{
	background:url(../images/comment_t.png) no-repeat;
	border-bottom:6px solid #fff;
	border-top:5px solid #fff;
	float:right;
	height:13px;
	width:15px;
	}
	
.comment_link
	{
	float:right;
	font-size:11px;
	height:24px;
	line-height:24px;
	padding:0 3px 0 0;
	text-align:right;
	text-decoration:none;
	width:10px;
	}

.cell .blank
	{
	background:#fff;
	height:349px;
	}

.hr_sep
	{
	background: url(../images/bg_arc.png) fixed top !important;
	border-bottom:10px solid #fff;
	border-top:10px solid #fff;
	float:left;
	height:45px;
	margin: 0 15px 0 0;
	width:711px;
	}
	
.content_drt .hr_sep
	{
	margin:0 0 0 15px;
	}
	
.cover_sep
	{
	background:url(../images/sep.png) repeat-x;
	float:left;
	height:45px;
	width:726px;
	}
	

/*________________________________Colonne___________________________________*/
.side
	{
	color:#676767;
	float:right;
	font-size:12px;
	width:250px;
	}
	
.content_drt .side,
.bookmarks,
.coeur,
.bookmarks li,
.bookmarks li a,
.coeur li a
	{
	float:left;
	}
	
.bookmarks,
.coeur
	{
	padding:0 0 10px 0;
	}
	
.bookmarks li
	{
	height:16px;
	margin:0 0 6px 6px;
	padding:0;
	width:115px;
	}
	
.bookmarks li a,
.coeur li a
	{
	color:#676767;
	line-height:16px;
	}
	
.coeur li a
	{
	width:150px;
	}
	
.bookmarks li a:hover,
.coeur li a:hover,
.coeur li a.cat:hover
	{
	color:#ec5f88;
	}
	
.bookmarks li a img
	{
	float:left;
	margin:0 5px 0 0;
	}
	
.coeur li
	{
	background:url(../images/love.png) no-repeat;
	clear:both;
	color:#676767;
	float:left;
	font-size:12px;
	line-height:20px;
	margin:0 0 6px 6px;
	padding:0 0 0 20px;
	width:215px;
	}

.coeur li a.cat
	{
	color:#2ebdf0;
	font-weight:bold;
	margin:0 5px 0 0;
	float:left;
	width:60px;
	text-align:right;
	}

.twitter_illu,
.share
	{
	float:left;
	width:250px;	
	}
	
.twitter_illu
	{
	height:235px;
	background:url(../images/twitter.jpg) center no-repeat;
	}
	
.share
	{
	background:url(../images/share.png) top no-repeat;
	height:47px;
	}
	
.share:hover
	{
	background-position:0 -47px;
	}


/*________________________________Barre de navigation___________________________________*/
#nav_blog,
#nav_projets
	{
	float:left;
	height:40px;
	width:49%;
	}
	
.bt_blog,
.bt_projets
	{
	float:left;
	font-size:25px;
	line-height:30px;
	padding:5px;
	text-align:center;
	width:180px;
	}
	
.bt_blog
	{
	background:url(../images/fd_test.png) repeat 0 0;
	}
	
#nav_projets,
.bt_projets
	{
	float:right;
	}
	
.bt_projets
	{
	background:url(../images/fd_test_projets.png) repeat 0 0;
	}
	
.barre_nav
	{
	background:#dedbdb;
    color:white;
    font-size:20px;
    left:0;
    margin:0;
	position:relative;
	top:0;
	width:100%;
	}
	
.barre_nav a
	{
	color:#2ebdf0;
	font-weight:bold;
	}
	
.barre_nav a:hover
	{
	color:#fff;
	}
	
.barre_content
	{
	background:#dedbdb;
	border-bottom:1px solid #fff;
	float:left;
	width: 100%;
	}
	

/*________________________________Paginator___________________________________*/
.paginator
	{
	float:left;
	padding:10px;
	text-align:center;
	}
	
.paginator a
	{
	font-weight:normal;
	margin-left:4px;
	}
	
.paginator a:hover,
.paginator span.current
	{
	color:#ec5f88 !important;
	}
	
#nav_projets .paginator
	{
	float:right;
	}
	

/*________________________________footer___________________________________*/
.footer
	{
	background:#fff url(../images/citation.jpg) right no-repeat;
	border-top:1px solid #dedbdb;
	float:left;
	width:976px;
	}
	
.bloc_footer
	{
	float:left;
	margin:0 15px 0 0;
	width:227px;
	}
	
.last_post li,
.last_comment li
	{
	background:url(../images/puce.gif) 0px 5px no-repeat;
	height:16px;
	margin:0;
	padding:0 0 0 10px;
	}
	
.last_post li a,
.last_comment li a,
.about
	{
	color:#676767;
	font-size:11px;
	}
	
.last_post li:hover,
.last_comment li:hover
	{
	background-position:2px -145px;
	}
	
#twitter
	{
	font-size:12px;
	overflow:auto;
	width:240px;
	}
	
ul#twitter li
	{
	color: #676767;
	margin-bottom:10px;
	padding:0 0 10px 6px;
	}
	
.last_post li a:hover,
.last_comment li a:hover,
ul#twitter li a
	{
	color:#ec5f88;
	}
	
ul#twitter li span
	{
	display:block;
	}
	
ul#twitter li span a
	{
	color:#2ebdf0;
	}
	
.poptip
	{
 	background:#2ebdf0;
	color:#fff;
	display:none;
	font-size:12px;
	margin:0 auto; 
	padding:5px;
	position:absolute;
	text-align:center;
	z-index:999;
	}
	
	
/*________________________________billet___________________________________*/
.com_link
	{
	background:url(../images/com_link.png) right top no-repeat;
	float:right;
	padding-right:17px;
	}
	
.com_link:hover
	{
	background-position:right bottom;
	}
	
.billet_texte,
.billet_img,
.billet_lien,
.billet_doc,
.billet_comment
	{
	border-top:1px solid #dedbdb;
	clear:both;
	float:left;
	margin:10px 0 0 0;
	padding:20px 0 0 0;
	width:711px;
	}
	
.billet_texte
	{
	background:url(../images/texte.png) top right no-repeat;
	}
	
.billet_img
	{
	background:url(../images/image.png) top right no-repeat;
	}
	
.billet_img img
	{
	float:left;
	margin:0 5px 5px 0;
	}
	
.billet_lien
	{
	background:url(../images/link.png) top right no-repeat;
	}
	
.billet_lien a
	{
	font-size:16px;
	}
	
.billet_doc
	{
	background:url(../images/folder.png) top right no-repeat;
	}
	
.billet_comment
	{
	background:url(../images/comment.png) top right no-repeat;
	}
	
.com_nb
	{
	color:#ec5f88;
	font-size:14px;
	font-weight:bold;
	margin-bottom:5px;
	}
	
.com_div
	{
	border-top:1px dashed #dedbdb;
	padding:4px 0px;
	}
	
.com,
.com_info
	{
	color:#676767;	
	}

.com
	{
	font-size:12px;
	}
	
.com_info
	{
	text-align:right;
	}
	
.com_form
	{
	padding-left:100px;
	}
	

/*________________________________Form___________________________________*/
.com_form input,
.com_form textarea
	{
	border:1px solid #dedbdb;
	color:#676767;
	font-size:12px;
	margin: 5px;
	}
	
.com_form textarea
	{
	padding:2px;
	width:450px;
	}
	
.com_form .submit
	{
	background:#2ebdf0;
	border:none;
	color:#fff;
	cursor:pointer;
	font-weight:bold;
	padding:3px 3px 6px 3px;
	}
	
.com_form .submit:hover
	{
	background:#ec5f88;
	}
	
	
/*________________________________Page coups de coeur___________________________________*/
.page_coeur
	{
	background:url(../images/singe.png) center top no-repeat;
	float:left;
	padding:425px 0 20px 0;
	width:711px;
	}
	
.liste_coeur
	{
	float:left;
	padding:0 5px 0 0;
	width:137px;
	}
	
.liste_coeur p
	{
	border-bottom:1px solid #676767;
	font-size:14px;
	padding-bottom:3px;
	text-align:center;
	}
	
.liste_coeur li
	{
	background:url(../images/puce.gif) left -286px no-repeat;
	margin:0 0 2px 5px;
	padding-left:7px;
	}
	
.liste_coeur li:hover
	{
	background-position:left -141px;
	}
	
.liste_coeur li a
	{
	font-size:12px;
	}
	

/*________________________________Signature___________________________________*/
.signature
	{
	clear:both;
	color:#aaa;
	float:left;
	font-size:11px;
	margin:10px 0px;
	text-align:center;
	width:976px;
	}


/*________________________________RSS___________________________________*/
.rss,
.bt_rss
	{
	float:right;
	height:22px;
	}

.rss
	{
	padding-top:1px;
	width:40px;
	}

.bt_rss
	{
	font-size:10px;
	width:18px;
	}

.content_gch .rss
	{
	margin-right:15px;
	}

.content_gch .bt_rss
	{
	background:url(../images/rss.jpg) right no-repeat;
	padding-right:20px;
	}
	
.content_drt .rss,
.content_drt .bt_rss
	{
	float:left;
	}

.content_drt .rss
	{
	margin-left:15px;
	}

.content_drt .bt_rss
	{
	background:url(../images/rss.jpg) left no-repeat;
	padding-left:20px;
	}

/*________________________________Fin :)___________________________________*/