/* RESET
---------------------------------------- */

*	{
	margin:0; padding:0; border:0;
	background:transparent;
	}
html, body
	{
	width:100%;
	background:#fff;
	}

.left	{float: left;}
.right	{float: right;}
.clear	{clear: both;}

#page
	{
	display:block; position:relative;
	width:100%; min-width:800px;
	}

/* PAGE / TOP
-------------------------------------------------------- */

#top
	{
	display:block; position:relative;
	width:100%; height:130px;
	background: url(img/back_1x130.png) repeat-x left top;
	}
#top h1
	{
	display:block; position: relative;
	width:300px; height:100%;
	overflow:hidden;
	}
#top h1 span
	{
	display:block; position:absolute;
	width:100%; height:100%;
	background: #c2568e url(img/logo_300x130.png) no-repeat left top;
	}
#topcats
	{
	display:block; position:absolute;
	left:290px; top:93px;
	overflow:hidden;
	}
#topcats ul
	{
	list-style:none;
	display:block; position:relative;
	float:left;
	}
#topcats ul li
	{
	list-style-image:none;
	display:block; position:relative;
	float:left;
	margin-left:10px;
	}
#topcats ul .toplevelcatselected
	{
	border-bottom: 8px solid #fff;
	}
	
#topprojects
	{
	display:block; position:absolute;
	left:290px; top:58px;
	}
#topprojects ul
	{
	list-style:none;
	display:block; position:relative;
	float:left;
	}
#topprojects ul li
	{
	list-style-image:none;
	display:block; position:relative;
	float:left;
	margin-left:15px;
	width: 20px;
	height: 20px;
	overflow:hidden;
	}
#topprojects ul li span
	{
	display:block; position:relative;
	width:20px; height:20px;
	}
#topprojects ul li span.Wordalizer {background: #000 url(img/project_wz_20x20.png) center center no-repeat;}
#topprojects ul li span.InGutter {background: #000 url(img/project_ig_20x20.png) center center no-repeat;}
#topprojects ul li span.Equalizer {background: #000 url(img/project_eq_20x20.png) center center no-repeat;}
#topprojects ul li span.BookBarcode {background: #000 url(img/project_bb_20x20.png) center center no-repeat;}
#topprojects ul li span.Claquos {background: #000 url(img/project_cq_20x20.png) center center no-repeat;}
#topprojects ul li span.YALT {background: #000 url(img/project_ya_20x20.png) center center no-repeat;}

#topprojects ul li span.HurryCover {background: #000 url(img/project_hc_20x20.png) center center no-repeat;}
#topprojects ul li span.IndexMatic {background: #000 url(img/project_ix_20x20.png) center center no-repeat;}
#topprojects ul li span.IndyFont {background: #000 url(img/project_if_20x20.png) center center no-repeat;}
#topprojects ul li span.FontMixer {background: #000 url(img/project_fm_20x20.png) center center no-repeat;}
#topprojects ul li span.RagingHull {background: #000 url(img/project_rh_20x20.png) center center no-repeat;}
#topprojects ul li span.StyLighter {background: #000 url(img/project_sl_20x20.png) center center no-repeat;}


/* PAGE / WRAPPER
-------------------------------------------------------- */

#banner
	{
	display:block; position:absolute;
	width:200px;
	top:130px;
	left:50px;
	background: #ccc;
	color: #fff;
	}
#wrapper
	{
	display:block; position:relative;
	float:left; clear:both;
	width:100%;
	padding:50px 0;
	/*min-height hack*/
	min-height:450px;
	height:auto !important;
	height:450px;
	}
#jscript
	{
	display:block; position:absolute;
	left:18px; top:25px;
	height:32px;
	}
#jscript a
	{
	display:block; position:relative;
	width:32px; height:32px;
	background: transparent url(img/download_2x32x32.png) left center no-repeat;
	}
#jscript a:hover
	{
	background-position: right center;
	text-decoration: none;
	}
#jscript a span
	{
	display:block; position:absolute;
	left:32px; top:0;
	width:400px; /*height: 32px;*/
	padding:2px 10px; text-align:left;
	}
#jscriptplus
	{
	display:block; position:absolute;
	left:500px; top:24px;
	height:34px;
	}
#jscriptplus a
	{
	display:block; position:relative;
	width:32px; height:32px;
	background: transparent url(img/pack_pro_2x32x32.png) left center no-repeat;
	}
#jscriptplus a:hover
	{
	background-position: right center;
	text-decoration: none;
	}
#jscriptplus a span
	{
	display:block; position:absolute;
	left:32px; top:0;
	width:182px;
	padding:3px 10px; text-align:left;
	}
#main
	{
	display:block; position:relative;
	width:550px;
	margin: 0 auto 0 50px;
	overflow:hidden; /* Absorbe les eventuels debordements de DIV */
	}

/* PROJECT and PACKAGE
-------------------------------------------------------- */

#content
	{
	}
#content .prj
	{
	margin-right: 150px;
	margin-bottom:40px;
	}
#content .prj img
	{
	display:block; position:relative;
	margin-top:20px;
	}
#package
	{
	display:block; position:absolute;
	left:420px; top:0;
	width:140px; height:120px;
	}
#package a
	{
	display:block; position:relative;
	float:left;
	width:50px; height:50px;
	margin-right: 20px;
	}
#package a.free
	{
	background: transparent url(img/pack_free_2x50x50.png) left center no-repeat;
	}
#package a.try
	{
	background: transparent url(img/pack_try_2x50x50.png) left center no-repeat;
	}
#package a.beta
	{
	background: transparent url(img/pack_beta_2x50x50.png) left center no-repeat;
	}
#package a.pro
	{
	background: transparent url(img/pack_pro_2x50x50.png) left center no-repeat;
	}
#package a:hover
	{
	background-position: right center;
	text-decoration: none;
	}
#package a span
	{
	display:none;
	}
#package a:hover span
	{
	display:block; position:absolute;
	top:50px;
	width:110px;
	}
#package a.pro:hover span
	{
	right:0;
	}

a.pdfdoc
	{
	display:block; position:relative;
	}
a.pdfdoc:hover span
	{
	background: #666;
	}
a.pdfdoc span
	{
	display:block; position:absolute;
	background: #aaa;
	padding-top: 10px;
	padding-bottom: 10px;
	left:420px;
	bottom:0;
	width:120px;
	}

/* CONTENT
-------------------------------------------------------- */

.post-content img
	{
	display:block; position:relative;
	margin: 0 auto;
	}
img.leftsided
	{
	float:left;
	margin: 0 15px 0 0;
	}
img.rightsided
	{
	float:right;
	margin: 0 0 0 15px;
	}
.post-content p span.clickme
	{
	display:block; position:relative;
	float:right;
	margin-top: -20px;
	width:16px; height:16px;
	background: transparent url(img/zoom.png) left bottom no-repeat;
	}

/* ICONS
-------------------------------------------------------- */

span.ico
	{ 
	display: inline-block; position: relative;
	background: transparent left center no-repeat;
	height: 16px;
	margin: 0 5px -4px 2px;
	width: 16px;
	}

span.DE { background-image: url(img/flagDE.png); }
span.EN { background-image: url(img/flagEN.png); }
span.ES { background-image: url(img/flagES.png); }
span.FR { background-image: url(img/flagFR.png); }
span.JP { background-image: url(img/flagJP.png); }
span.RU { background-image: url(img/flagRU.png); }

span.AI { background-image: url(img/adoAI.png); }
span.JSX { background-image: url(img/adoJSX.png); }
span.FL { background-image: url(img/adoFL.png); }
span.IC { background-image: url(img/adoIC.png); }
span.ID { background-image: url(img/adoID.png); }
span.PN{ background-image: url(img/adoPN.png); }
span.PDF{ background-image: url(img/adoPDF.png); }
span.PS	{ background-image: url(img/adoPS.png); }
span.ZXP	{ background-image: url(img/adoZXP.png); }

span.GEAR	{ background-image: url(img/icoGEAR.png); }
span.GOTO	{ background-image: url(img/icoGOTO.png); }
span.PLUG	{ background-image: url(img/icoPLUG.png); }
span.PLUS	{ background-image: url(img/icoPLUS.png); }
span.SCPT	{ background-image: url(img/icoSCPT.png); }
span.TAG	{ background-image: url(img/icoTAG.png); }
span.TOOL	{ background-image: url(img/icoTOOL.png); }
span.VIDEO	{ background-image: url(img/icoVIDEO.png); }
span.ZIP	{ background-image: url(img/icoZIP.png); }
span.ZOOM	{ background-image: url(img/icoZOOM.png); }


#subcategories
	{
	}
#subcategories ul li
	{
	display:block; position:relative;
	list-style-image:none;
	padding: 10px 0;
	border-bottom: 1px solid #ccc;
	}
#subcategories ul li a
	{
	display:block; position:relative;
	padding-left:60px;
	padding-bottom:2px;
	}
#subcategories ul li a.BookBarcode {background: transparent url(img/project_bb_40x40.png) 5px center no-repeat;}
#subcategories ul li a.Wordalizer {background: transparent url(img/project_wz_40x40.png) 5px center no-repeat;}
#subcategories ul li a.Equalizer {background: transparent url(img/project_eq_40x40.png) 5px center no-repeat;}
#subcategories ul li a.InGutter {background: transparent url(img/project_ig_40x40.png) 5px center no-repeat;}
#subcategories ul li a.Claquos {background: transparent url(img/project_cq_40x40.png) 5px center no-repeat;}
#subcategories ul li a.YALT {background: transparent url(img/project_ya_40x40.png) 5px center no-repeat;}
#subcategories ul li a.IndexMatic {background: transparent url(img/project_ix_40x40.png) 5px center no-repeat;}
#subcategories ul li a.HurryCover {background: transparent url(img/project_hc_40x40.png) 5px center no-repeat;}
#subcategories ul li a.IndyFont {background: transparent url(img/project_if_40x40.png) 5px center no-repeat;}
#subcategories ul li a.FontMixer {background: transparent url(img/project_fm_40x40.png) 5px center no-repeat;}
#subcategories ul li a.RagingHull {background: transparent url(img/project_rh_40x40.png) 5px center no-repeat;}
#subcategories ul li a.StyLighter {background: transparent url(img/project_sl_40x40.png) 5px center no-repeat;}

/* PAGE / WRAPPER / SIDEBAR
-------------------------------------------------------- */
#sidebar
	{
	}
#blognav
	{
	display:block; position:absolute;
	left:600px; top:-36px;
	width:200px;
	}
#search
	{
	display:block; position:relative;
	width: 160px;
	float: right;
	}
#blogextra
	{
	display:block; position:absolute;
	left:600px; top:20px;
	width:200px;
	}
.vspaced
	{
	margin-top:35px;
	}
	
#blogextra .links
	{
	display:block; position:relative;
	width: 160px;
	margin-top: 35px;
	float: right;
	}

#blogextra .twitter
	{
	display:block; position:relative;
	width: 160px;
	margin-top: 35px;
	float: right;
	}

#blogextra .sticky
	{
	display:block; position:relative;
	width: 160px;
	margin-top: 5px;
	float: right;
	}


/* PAGE / FOOTER
-------------------------------------------------------- */

#footer
	{
	display:block; position:relative;
	float:left; width:100%;
	clear: both;
	background: #333 url(img/avatar_40x40.png) no-repeat 13px 59px;
	/*min-height hack*/
	min-height:380px;
	height:auto !important;
	height:380px;
	}
#footline
	{
	display:block; position:relative;
	padding:6px 0;
	border-top: 1px solid #bbb;
	border-bottom: 1px solid #fff;
	background: #8b245b url(img/back_1x25.png) repeat-x left top;
	}
#footline p
	{
	display:block; position:relative;
	list-style:none;
	margin-left: 55px;
	clear:both;
	}
#footline p span
	{
	margin: 0 12px;
	}
#footer .footpanel
	{
	display:block; position:relative;
	float:left; width:240px;
	left:50px;
	margin:20px 15px;
	}
