/* COLORS 

//soft grey   #eee 
//hard grey   #999
//dark grey   #666
//blue        #29ABE2
*/
/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

@font-face {
	font-family: 'Lobster1.1Regular';
	src: url('../fonts/Lobster_1.1_-webfont.eot');
	src: local('?'), url('../fonts/Lobster_1.1_-webfont.woff') format('woff'), url('../fonts/Lobster_1.1_-webfont.ttf') format('truetype'), url('../fonts/Lobster_1.1_-webfont.svg#webfont30G9S4nm') format('svg');
	font-weight: normal;
	font-style: normal; }
    
@font-face {
	font-family: 'RalewayThin';
	src: url('../fonts/raleway_thin-webfont.eot');
	src: local('?'), url('../fonts/raleway_thin-webfont.woff') format('woff'), url('../fonts/raleway_thin-webfont.ttf') format('truetype'), url('../fonts/raleway_thin-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal; }
@font-face {
	font-family: 'BebasRegular';
	src: url('../fonts/BEBAS___-webfont.eot');
	src: local('?'), url('../fonts/BEBAS___-webfont.woff') format('woff'), url('../fonts/BEBAS___-webfont.ttf') format('truetype'), url('../fonts/BEBAS___-webfont.svg#webfontSRj8j0PE') format('svg');
	font-weight: normal;
	font-style: normal; }


/* Site-wide properties ======================================================== */
body{
    font: normal normal 10px/10px Tahoma, Arial, Helvetica, Verdana, sans-serif; 
	background:#eee; 
	}
    
    /* Fibonacci based heading scale ratio */
    h1{ font-size: 4.4em; font-weight: normal; }
    h2{ font-size: 2.8em; font-weight: bold; }
    h3{ font-size: 1.6em; font-weight: bold; }
    h4{ font-size: 1.2em; font-weight: bold; }

/* Reusable classes ============================================================ */

/* Left & Right alignment */
.left{ float: left; }
.right{ float: right; }

/* The inside class provides consistent padding. To be used often! */
.inside{ padding: 20px; }

/* The fraction classes are useful for column lists */
.half, .third, .quarter, .fifth, .sixth{ width: 100%; }
.half li, .third li, .quarter li, .fifth li, .sixth li{ float: left; }
.half li{ padding-right: 5%; width: 45% }
.third li{  padding-right: 5%; width: 28.3% }
.quarter li{  padding-right: 5%; width: 20% }
.fifth li{  padding-right: 5%; width: 15% }

/* For when a <br /> just ain't enough */
.separator{
    clear: both;
    float: left;
    height: 1px;
    width: 100%; }

/* Basic Structure ============================================================= */
#wrap{
    margin: 0 auto;
    position: relative;
    width: 960px;
	}

    /* Header */
    header{
        float: left;
        width: 100%;
		border-bottom:1px solid #ccc;
		margin:0;
		padding:0;
	}

	/* Nav */
    nav{
        float: left;
        width: 100%;
		border-top:1px solid #fff;
		border-bottom:1px solid #ccc;
		background: -moz-radial-gradient(50% 50%, farthest-side, #f2f2f2, #eee);
  		background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#f2f2f2), to(#eee));
	}
    
    /* Content */
    article{
        float: left;
        width: 100%; 
		border-top:1px solid #fff;
		border-bottom:1px solid #ccc;
		background:transparent;
		padding-bottom:20px;
	}
	
	section{display:block;}
    
    /* Sidebar */
    aside{
        float: left;
        width: 33.3%; 
		border-top:1px solid #fff;
		border-bottom:1px solid #ccc;
		background:transparent;	
	}
        
    /* Footer */
    footer{
		clear:both;
		margin: 0 auto;
		position: relative;
		width: 960px;        
		border-top:1px solid #fff;
		font: 12px/12px 'BebasRegular', Arial, sans-serif;
		color:#666;
		text-align:center;
		
		
	}
    
/* Project specifics =========================================================== */
/* Pour some CSS below ========================================================= */

/* The H1 declarations - for @font-face presentational purposes only */
h1,h1 a{
	font: 60px/68px 'BebasRegular', Arial, sans-serif;
	letter-spacing: 0;
	color:#666;
	text-align:center;
	text-shadow: 0px 3px 5px #fff;
	text-decoration:none;
}



h2{
	font: 14px/18px 'Lobster1.1Regular', Arial, sans-serif;
	letter-spacing: 1px;
	color:#29ABE2;
	text-align:center;
	text-shadow: 0px 1px 1px #fff;
}

nav ul {list-style:none;}
nav ul li{float:left;padding:10px 18px;}
nav ul li a{
	font: 20px/24px 'Lobster1.1Regular', Arial, sans-serif;	
	text-shadow: 0px 1px 1px #fff;
	letter-spacing: 0;
	color:#666;
	text-align:center;
	text-decoration:none;
}
nav ul li a:hover,
nav ul li a.active{
	color:#29ABE2;
}


/* prev - next*/
#prenavlinks{
  display:block;
  width:100%;
  height:20px;
  margin-top:0;
    }
  
#navlinks{
  display:block;
  width:100%;
  height:50px;
  margin-top:0;
  border-bottom:1px solid #ccc;
  background:transparent;
  background: -moz-radial-gradient(50% 50%, farthest-side, #f2f2f2, #eee);
  background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#f2f2f2), to(#eee));
  }
  
#navlinks a{
  display:block;
  text-decoration:none;
  color:#ccc;
  text-transform:uppercase;
  font-style:bold;  
  font: 12px/14px 'BebasRegular', Arial, sans-serif;
	letter-spacing: 0;
	text-align:center;
	text-shadow: 0px 1px 1px #fff;
}

#navlinks a.prev{
  float:left;
  text-align:left;
  margin:8px 0 0 40px;
}
  
#navlinks a.next{
  float:right;
  text-align:right;
  margin:-25px 50px 0 0;
}

#navlinks a:hover{
	color:#29ABE2;
}

/* Search bar*/
fieldset.search {
	border: none;
	margin:0 0 0 200px;	
}
.search input, .search button {
	border: none;
	float: left;
	margin-top:-3px;
}
.search input.box {
	font-size: 20px;
	width: 510px;
	height: 25px;
	padding: 5px;
	background: #f9f9f9;
	border:1px solid #ccc;
	-moz-border-radius:5px;
	border-radius:5px;
	color:#ccc;
	-webkit-box-shadow: inset 0 2px 3px rgba(0,0,0,.1);
	-moz-box-shadow: inset 0 2px 3px rgba(0,0,0,.1);
	box-shadow: inset 0 2px 3px rgba(0,0,0,.1);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-appearance: none; 
}
.search input.box:focus {
	background: #fff;
	outline: none;
	color:#29ABE2;
	border:1px solid #ccc;
}
.search input.submit {
	width:60px;
	height:37px;
	padding:5px;
	cursor:pointer;
	background:#ccc;
	border:1px solid #c1c1c1;
	-moz-border-radius:5px;
	border-radius:5px;
	color:#fff;
	margin-left:3px;
	outline: none; 
	font: 20px/24px 'Lobster1.1Regular', Arial, sans-serif;
	text-shadow: 0px 1px 1px #999;
}
.search input.submit:hover {
	color:#fff;
	background:#29ABE2;	
	border:#FFF;
}

/* linkzzz*/

section{
	border-top:1px solid #fff;
	display:block;
	width:100%;
	height:auto;
	float:left;
}
ul#linkz {list-style:none;margin:20px 0 0 0;display:block;}
ul#linkz li{
	float:left;
	display:block;
	width:300px;
	height:40px;
	background:transparent;
	margin:0 0 5px 13px;
	padding:0;
	
}

ul#linkz li a{
	display:block;
	font:normal 12px arial,verdana,sans-serif;
	color:#333;
	width:260px;
	height:20px;
	text-decoration:none;
	padding:10px 10px 10px 30px;
	line-height:20px;
	border:1px solid #f1f1f1;
	-moz-border-radius: 7px;
	border-radius:7px;
}

ul#linkz li a:hover{color:#fff;}

#linkz a.inspiration{background:#F2f2f2 url(../img/fav.png) 7px center no-repeat;}
#linkz a.graphic{background:#F2f2f2 url(../img/graphic.png) 7px center no-repeat;}
#linkz a.css{background:#F2f2f2 url(../img/css.png) 7px center no-repeat;}
#linkz a.js{background:#F2f2f2 url(../img/js.png) 7px center no-repeat;}
#linkz a.font{background:#F2f2f2 url(../img/font.png) 7px center no-repeat;}
#linkz a.icon{background:#F2f2f2 url(../img/icon.png) 7px center no-repeat;}
#linkz a.html{background:#F2f2f2 url(../img/html.png) 7px center no-repeat;}
#linkz a.misc{background:#F2f2f2 url(../img/misc.png) 7px center no-repeat;}

#linkz a.inspiration:hover{background:#29ABE2 url(../img/fav2.png) 7px center no-repeat;}
#linkz a.graphic:hover{background:#29ABE2 url(../img/graphic2.png) 7px center no-repeat;}
#linkz a.css:hover{background:#29ABE2 url(../img/css2.png) 7px center no-repeat;}
#linkz a.js:hover{background:#29ABE2 url(../img/js2.png) 7px center no-repeat;}
#linkz a.font:hover{background:#29ABE2 url(../img/font2.png) 7px center no-repeat;}
#linkz a.icon:hover{background:#29ABE2 url(../img/icon2.png) 7px center no-repeat;}
#linkz a.html:hover{background:#29ABE2 url(../img/html2.png) 7px center no-repeat;}
#linkz a.misc:hover{background:#29ABE2 url(../img/misc2.png) 7px center no-repeat;}

.newlink{
	vertical-align:middle;
	padding-left:1px;
}
/*page link*/
.subpub{margin:20px 0 20px 255px;}
.subpubamaz{margin:20px 0 20px 200px;}
#link{margin-top:20px;margin-left:200px;}
#link a{
	display:block;
	font:normal 20px arial,verdana,sans-serif;
	color:#333;
	width:565px;
	height:auto;
	text-decoration:none;
	padding:72px 10px 10px 10px;
	line-height:40px;
	border:1px solid #f1f1f1;
	-moz-border-radius: 7px;
	border-radius:7px;
	text-align:center;
}

#link  a:hover{color:#fff;}

#link a.inspiration{background:#F2f2f2 url(../img/big/fav.png) center 20px no-repeat;}
#link a.graphic{background:#F2f2f2 url(../img/big/graphic.png) center 20px no-repeat;}
#link a.css{background:#F2f2f2 url(../img/big/css.png) center 20px no-repeat;}
#link a.js{background:#F2f2f2 url(../img/big/js.png) center 20px no-repeat;}
#link a.font{background:#F2f2f2 url(../img/big/font.png) center 20px no-repeat;}
#link a.icon{background:#F2f2f2 url(../img/big/icon.png) center 20px no-repeat;}
#link a.html{background:#F2f2f2 url(../img/big/html.png) center 20px no-repeat;}
#link a.misc{background:#F2f2f2 url(../img/big/misc.png)  center 20px no-repeat;}

#link a.inspiration:hover{background:#29ABE2 url(../img/big/fav2.png) center 20px no-repeat;}
#link a.graphic:hover{background:#29ABE2 url(../img/big/graphic2.png) center 20px no-repeat;}
#link a.css:hover{background:#29ABE2 url(../img/big/css2.png) center 20px no-repeat;}
#link a.js:hover{background:#29ABE2 url(../img/big/js2.png) center 20px no-repeat;}
#link a.font:hover{background:#29ABE2 url(../img/big/font2.png) center 20px no-repeat;}
#link a.icon:hover{background:#29ABE2 url(../img/big/icon2.png) center 20px no-repeat;}
#link a.html:hover{background:#29ABE2 url(../img/big/html2.png) center 20px no-repeat;}
#link a.misc:hover{background:#29ABE2 url(../img/big/misc2.png) center 20px no-repeat;}

#link a span {
	font:italic 13px arial;
	color:#ccc;	
}
footer a{color:#666;text-decoration:none;}

#partenaires{
	text-indent:-9999px;
}

.addthis_toolbox{
	margin:5px 0 0 420px;
}



/* paging */

#paging_button{
	text-align:center;
	margin:0 115px;
	display:block;
	clear:both;
	float:left;
	padding-top:20px;
}

#paging_button ul{ width: 100%; padding:0; margin-top:0; }

#paging_button ul li { 
    background: none repeat scroll 0 0 #ccc;
    float: left;
    margin: 2px;
    padding: 5px;
    text-align: center;
    text-decoration: none;
    text-shadow: none;
	list-style-type:none; 
	width: 20px;
    cursor:pointer;    
    border:1px solid #c1c1c1;
	-moz-border-radius:5px;
	border-radius:5px;
	color:#fff;
	outline: none; 
	font: 12px/14px 'Lobster1.1Regular', Arial, sans-serif;
	text-shadow: 0px 1px 1px #666;
	}
	
#paging_button ul li:hover, #paging_button ul li.selected{background:#29ABE2;border:1px solid #fff;}

li:hover{ color: #CC0000; cursor: pointer; }

#paging_button ul li a {
  	display:block;
  	width: 20px;
	color:#fff;
	text-decoration:none;
}


#pub02{text-align:center;margin-top:10px;}




/*_panel_______________________________*/

.panel_button {
	margin-left:800px;
	margin-right: auto;
	position: relative;
	width: 140px;
	height: 20px;
	background:#999;
	border:0px solid #f1f1f1;
	-moz-border-radius: 0 0 7px 7px;
	border-radius: 0 0 7px 7px;
	cursor: pointer;
	text-align:left;
}
.panel_button img {
	position: relative;
	top:2px;
	border: none;
}
.panel_button a {
	text-decoration: none;
	color:#EAEAEA;
	font:bold 12px Arial, Helvetica, sans-serif;
	position: relative;
	top: -1px;
	left: 5px;
}
.panel_button a:hover {
	color:#FF952B;
}
#wrapper {
	margin-left: auto;
	margin-right: auto;
	width:100%;
	text-align: center;
}
#toppanel {
	position: relative;
	width:100%;
	left:0;
	z-index: 25;
	text-align: center;

}
#panel {
	width:100%;
	position: relative;
	top: 0px;
	height: 0px;
	margin-left: auto;
	margin-right: auto;
	z-index: 10;
	overflow: hidden;
	text-align: left;
	padding:0;
}
#panel_contents {
	background:#27221e;
	height: 100%;
	width:100%;
	position: absolute;
	z-index: -1;
}

#panel form {
	text-align:left;
	height:120px;
	width:800px;
	position: relative;
	margin:5px 50px;
}
#panel table {
	width:100%;
}

#panel td.titre {
	height:20px;
	width:100px;
	color:#FF952B;
}

#panel label {
	height:20px;
	width:100px;
	margin:5px 0 0 0;
}

#panel input {
	float:left;
	height:20px;
	width:300px;
	background:#fff;
	border:1px solid #ccc;
}

#panel input#submitBt {
	display:block;
	float:left;
	height:20px;
	margin-top:2px;
	width:302px;
	background:#2e2a27;
	border:1px solid #ccc;
	color:#FF952B;
	cursor:pointer;
}

#panel input#submitBt:hover {
	background:#FF952B;
	color:#383838;
	border:1px solid #ccc;

}

#panel label.error { 
	font-weight:normal;
	color:#FF952B;
	text-align:left;
	width:140px; 
	padding-left:20px;
	background:transparent url(img2/uncheck2.png) no-repeat ; 
}

label#link_error { position:relative;}
label#email_error { position:relative;}
#message { 
	text-align:left;
	height:120px;
	width:650px;
	position: relative;
	margin:20px auto; 
}

#message p	{ color:white;font-weight:bold;margin:10px 0px; }
#checkmark	{
	position:relative;
	top:-46px;
	left:-30px; 
}