/* All styles specific to netbooks & tablets */
/* As a rule of thumb, I'd reset all the structural/large pixel widths declared
  in the main stylesheet to percentages. That way, even somebody with as small
  a resolution as 800px wide would get to view your content without the need
  for horizontal scrolling.
  
  
/* Basic Structure ============================================================= */
#wrap{
    margin: 0 auto;
    position: relative;
    width: 100%;
	}
	
	
	 /* Footer */
    footer{
		clear:both;
		margin: 0 auto;
		position: relative;
		width: 100%;        
		border-top:1px solid #fff;
		font: 11px/11px 'BebasRegular', Arial, sans-serif;
		color:#666;
		text-align:center;		
	}
	
/* Project specifics =========================================================== */

h1,h1 a{
	font: 24px/28px 'BebasRegular', Arial, sans-serif;
	letter-spacing: 0;
	color:#666;
	text-align:center;
	text-shadow: 0px 3px 5px #fff;
	text-decoration:none;
}

h2{
	font: 12px/14px '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{height:16px;width:100%;text-align:center;border-bottom:1px dashed #ccc;padding:5px 0;}
nav ul li.lastlist{border-bottom:0;}
nav ul li a{
	font: 12px/14px '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:70px;
  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{  
  text-align:left;
  margin:45px 0 0 20%;
}
  
#navlinks a.next{
  float:right;
  text-align:right;
  margin:10px 20% 0 0;
}

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

/* Search bar*/
fieldset.search {
	border: none;
	margin:0 0 0 20%;	
}
.search input, .search button {
	border: none;
	float: left;
	margin-top:-3px;
}
.search input.box {
	font-size: 20px;
	width: 60%;
	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{
	display:block;
	width:60%;
	height:40px;
	background:transparent;
	margin:0 0 5px 20%;
	padding:0;
	
}

ul#linkz li a{
	display:block;
	font:normal 12px arial,verdana,sans-serif;
	color:#333;
	width:auto;
	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 10%;}
.subpubamaz{margin:20px 0 20px 10%;}
#link{margin-top:20px;margin-left:10%;}
#link a{
	display:block;
	font:normal 20px arial,verdana,sans-serif;
	color:#333;
	width:80%;
	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 40%;
}



/* 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; 
}