/* ------------------------------------------------------------------------------------- */
/*    		Design nawhack.fr							 */
/*  		le 12/05/2011								 */
/*  		http://www.nawhack.fr/content/css/nawhack.css				 */
/* ------------------------------------------------------------------------------------- */

body
{
	font-family:'Raleway', sans-serif;
	background-color : #222222;
}

h1, h2, h3, h4, h5, h6 
{
	line-height: 1.2em;
}

/* Supprime les bordures pointillees */ 
a:focus
{
outline:0;
text-decoration:none;
}

img
{
	border:0px;
}

h1
{
	font-family:'Raleway', sans-serif;
	font-size:2.2em;
	text-align:center;
}

p 
{
	line-height: 1.2em;
	margin:0;
	padding:0;
}


/* ----------------------------- */
/* 	En tête / Logo           */
/* ----------------------------- */

#html5icon {
	background: url("../../img/html5.png")  center top no-repeat;
	height:35px;
	width:35px;
        margin-top:-50px;
}

#html5icon:hover {
	background: url("../../img/html5hover.png")  center top no-repeat;
}

.entete
{
	margin-left:auto;
	margin-right:auto;
	width: 100%;
}

.logo-text
{
	font-family: 'Ubuntu', Charcoal, sans-serif;
	font-weight:700;	
        font-size:45px;
        color:#FFFFFF;
	text-decoration: none;
}

.logo-text p
{
	position: relative;
        text-decoration: none;
        text-align: center;

	
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.logo-text p:hover, .logo-text p:focus 
{
	text-decoration: none;
	text-shadow: 0px 0px 15px #FFFFFF;
}

.description
{
	font-family: 'Ubuntu', sans-serif;
        font-weight:400;
	font-size:20px;
        margin-top:15px;
        text-align: center;
}

.description p
{
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
	
	color:#FFFFFF;
	/*text-shadow: 0px 0px 5px #FFFFFF;*/
	text-decoration: none;
}

.description p:hover, .description p:focus 
{
	text-shadow: 0px 0px 20px #FFFFFF;
}

/* ----------------------------- */
/*  		Corp 	             */
/* ----------------------------- */

.corp
{
	margin-top:20px;
	background:white;
	padding-bottom:25px;
	padding-top:25px;
        
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	
	-moz-box-shadow: 1px 1px 35px #095581;  
	-webkit-box-shadow: 1px 1px 35px #095581;  
	box-shadow: 1px 1px 35px #FFFFFF; 
}

/* ----------------------------- */
/*  		Menu 	             */
/* ----------------------------- */

.menu 
{
	font-family: 'Raleway', sans-serif;
        font-size: 40px;
	margin-top:15px;
	margin-bottom:100px;
}

.menu a 
{
	position: relative;
	color: white;
	text-decoration: none;
	padding: 6px 12px;
	
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.menu a:hover, .menu a:focus 
{
	text-decoration: none;
	background-color: rgba(255,255,255,0.3);
	
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
}

.menu_droite
{
	float:right;
}

.element
{
	border:1px solid #DDDDDD;
	
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}

.element ul
{
	list-style: none;
}

.element a
{
	text-decoration: none;
	color:black;

	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.element .small
{
	font-size: 12px;
	margin-left:-15px;
}

.small a:hover, .small a:focus
{
	text-decoration: none;
	text-shadow: 1px 1px 5px #C3D4DA;
	color: #F99000;
	margin-left:-5px;
}

.big a:hover, .big a:focus
{
	text-decoration: none;
	text-shadow: 1px 1px 5px #C3D4DA;
	color: #F99000;
	margin-left:10px;
}

/* ----------------------------- */
/*  		Footer 	             */
/* ----------------------------- */

.footer
{
	margin-bottom:0px;
	background-color: white;
	margin-top:50px;
	min-height:50px;
	
	-moz-border-radius: 10px 10px 0 0;
	-webkit-border-radius: 10px 10px 0 0;  
	border-radius: 10px 10px 0 0;
	
	box-shadow: 1px 1px 35px #FFFFFF; 
}

.footer p
{
	text-align:center;
}

/* ----------------------------- */
/*  		Content / Article    */
/* ----------------------------- */

.image-float
{
   float: left;
   padding-left:10px;
}

.article
{	
	border:1px solid #DDDDDD;
	
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}

.titre-article
{
	border-bottom:1px solid #DDDDDD;
	margin-left:5px;
	text-decoration: none;
	color: #045990;
}

.titre-article a
{
	color: #045990;
	text-decoration:none;

	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.titre-article a:hover
{
	color: #F99000;
	
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.texte
{
	text-align:left;
	font-size: 0.9em;
}
.texte h3, .texte h4
{
        font-weight: bold;
        font-size:initial;
        margin-top:10px;


}
.texte p
{
	margin-top:10px;
	margin-bottom:5px;
	padding-right:15px;
}


.texte a
{
	color: #045990;
	text-decoration:none;

	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.texte a:hover
{
	color: #F99000;
	
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.texte pre
{
	background:#f5f2f0;
	border:1px dashed #CCC;
	padding:10px 10px 10px 20px;
	margin:5px 0;
        margin-right:10px;
	overflow: auto;
	font-size:12px;
	margin-bottom: 15px;
}

.texte img.effect
{
	display: inline-block;
	background:#fffff;
	padding:2px;
	margin: 0 28px 19px 0;

	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;

	-moz-box-shadow: 1px 1px 9px #999; 
	-webkit-box-shadow: 1px 1px 9px #999; 
	box-shadow: 1px 1px 9px #999;

	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.texte a:hover img.effect, .texte a:focus img.effect
{
	-moz-transform: scale(1.15);
	-webkit-transform: scale(1.15);
	transform: scale(1.15);
}

.texte blockquote { margin: .5em 1em; font: bold 1.2em/1.5em; color: #808080; font-style:italic;}

p.read-more
{
    	margin-top:25px;
	margin-bottom:25px;
	color: #045990;
	text-decoration:none;
	font-weight:bold;
        text-align: center;
}

p.read-more a
{
	margin-bottom:25px;
	color: #045990;
	text-decoration:none;
	font-weight:bold;
        text-align: center;
}

p.read-more a:hover
{
	color: #F99000;
}

p:hover .read-more a:after
{
	content:" »";
}

.info ul
{
	font-size:13px;
	padding:6px 35px 10px 0px;
	position:relative;
	text-align:right;
	list-style-type:none;
	border:1px solid #DDDDDD;
	
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	z-index:0;
}
.info li
{
        margin-right: 50px;
}
	
li.avatar
{
	background-image: url("../image/bulle.png");
	position:absolute;
	width:80px;
	height:80px;
	top:-30px;
	right:-50px;
}

img.avatar
{
        margin-top: 15px;
        margin-right: 15px;
}

.nbcomment
{
	margin-left:20px;
margin-top:15px;
	float:left;
	z-index:10;
}

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

.gplus
{
    display: inline; 
    float:right;
}

img.left {
	float: left;
	margin: 0em 1.8em 1.4em 0em;
}

img.right {
	float: right;
	margin-top:-30px;
}


.nav-a a
{
	color: #045990;
	text-decoration:none;

	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

.nav-a a:hover
{
	color: #F99000;
	
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}

/* ----------------------------- */
/*  		Searchbar	         */
/* ----------------------------- */

.searchbar
{
display:inline;
float:right;
margin-top:-70px;
}

.searchbar p
{
display:inline;
}

.searchform 
{
	display: inline-block;
	zoom: 1; /* ie7 hack for display:inline-block */
	/* display: inline; */
	border: solid 1px #d2d2d2;
	padding: 3px 5px;
	
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;

	-webkit-box-shadow: 0 1px 0px rgba(0,0,0,.1);
	-moz-box-shadow: 0 1px 0px rgba(0,0,0,.1);
	box-shadow: 0 1px 0px rgba(0,0,0,.1);

	background: #f1f1f1;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
	background: -moz-linear-gradient(top,  #fff,  #ededed);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed'); /* ie7 */
	-ms-filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed'); /* ie8 */
}

.searchform input 
{
	font: normal 12px/100% Arial, Helvetica, sans-serif;
}

.searchform .searchfield 
{
	background: #fff;
	padding: 6px 6px 6px 8px;
	width: 202px;
	border: solid 1px #bcbbbb;
	outline: none;

	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;

	-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
	box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
}

.searchform .searchbutton 
{
	color: #fff;
	border: solid 1px #494949;
	font-size: 11px;
	height: 27px;
	width: 27px;
	text-shadow: 0 1px 1px rgba(0,0,0,.6);

	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;

	background: #5f5f5f;
	background: -webkit-gradient(linear, left top, left bottom, from(#9e9e9e), to(#454545));
	background: -moz-linear-gradient(top,  #085581,  #C3D4DA);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#9e9e9e', endColorstr='#454545'); /* ie7 */
	-ms-filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#9e9e9e', endColorstr='#454545'); /* ie8 */
}

/* ----------------------------- */
/*  		Formulaire	         */
/* ----------------------------- */

.form form
{
	border:1px solid #DDDDDD;
	
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	
	margin: 25px 25px;
	padding:20px;
	width:440px;
}

.form form p
{
	margin-bottom:20px;
}

.form form .form p:last-child
{
	margin-bottom:0;
}

.form label
{
	cursor:pointer;
	display:block;
	float:left;
	font-size:13px;
	font-weight:bold;
	line-height:28px;
	margin-bottom:5px;
	width:120px;
}

.form form p:hover label
{
	color:#0459b7;
}

.form form p:hover label:after
{
	content:" »";
}

.form input[type=text],
.form input[type=password],
.form textarea
{
	background: rgba(255, 255, 255, 0.9);
	background:-moz-linear-gradient(90deg, #fff, #eee); /* Firefox */
	background:-webkit-gradient(linear, left top, left bottom, from(#eee), to(#fff), color-stop(0.2, #fff)); /* Webkit */
	border:1px solid #aaa;
	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	
	-moz-box-shadow:0 0 3px #aaa;
	-webkit-box-shadow:0 0 3px #aaa;
	
	padding:5px;
}

.form input[type=text]:focus,
.form input[type=password]:focus,
.form textarea:focus
{
	border-color:#093c75;
	-moz-box-shadow:0 0 3px #0459b7;
	-webkit-box-shadow:0 0 3px #0459b7;
	outline:none; /* Pour enlever le contour jaune lorsque l'on sélectionne un input dans Chrome */
}

.form input[type=submit],
a.submit
{
	background:#ddd;
	background: -webkit-gradient(linear, left top, left bottom, from(#9e9e9e), to(#454545));
	background: -moz-linear-gradient(top,  #085581,  #C3D4DA);
	border:1px solid #093c75;
	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	
	-moz-box-shadow:0 1px 0 #fff;
	-webkit-box-shadow:0 1px 0 #fff;
	
	color:#fff;
	cursor:pointer;
	font-family:Arial,sans-serif;
	font-size:12px;
	font-weight:bold;
	margin-left:120px;
	padding:5px 10px;
	text-decoration:none;
	text-shadow:0 1px 1px #333;
	text-transform:uppercase;
}

.form input[type=submit]:hover,
a.submit:hover
{
	background:#eee;
	background:-moz-linear-gradient(90deg, #067cd3, #0bcdff);
	background:-webkit-gradient(linear, left top, left bottom, from(#0bcdff), to(#067cd3));
	border-color:#093c75;
	text-decoration:none;
}

.form input[type=submit]:active,
.form input[type=submit]:focus,
a.submit:active,
a.submit:focus
{
	background:#ccc;
	background:-moz-linear-gradient(90deg, #0bcdff, #067cd3);
	background:-webkit-gradient(linear, left top, left bottom, from(#067cd3), to(#0bcdff));
	border-color:#093c75;
	outline:none;
}

.bloc-commentaire
{
	margin-left:45px;
}

.commentaire 
{
	position:relative;
	padding-top:1px;
	padding-bottom:1px;
	padding-left:15px;
	padding-right:15px;
	margin:1px 0 0.5em;
	color:#333;
	background:#eee;
	width:600px;
	
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}

.commentaire p {font-size:20px;}

.commentaire:after {
	content:"";
	position:absolute;
	top:-30px;
	left:50px;
	border:15px solid transparent;
	border-bottom-color:#eee;
	
    display:block; 
    width:0;
}

/*******************************
	Formulaire Originale
*******************************/

.connexion form{
	background:#f7f7f7;
	background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
	border:1px solid #aaa;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	-moz-box-shadow:0 0 15px #aaa;
	-webkit-box-shadow:0 0 15px #aaa;
	margin:60px auto 0;
	padding:20px;
	width:440px;
}
.connexion h1{
	border-bottom:1px solid #ccc;
	font-size:11px;
	font-weight:bold;
	letter-spacing:2px;
	margin-bottom:20px;
	text-transform:uppercase;
}
.connexion form p{
	margin-bottom:20px;
}
.connexion form p:last-child{ /* Sélecteur avancé pour sélectionner le dernier paragraphe du formulaire */
	margin-bottom:0;
}
.connexion label{
	cursor:pointer;
	display:block;
	float:left;
	font-size:13px;
	font-weight:bold;
	line-height:28px;
	margin-bottom:5px;
	width:120px;
}
.connexion form p:hover label{
	color:#0459b7;
}
.connexion form p:hover label:after{
	content:" »";
}
.connexion input[type=text],
.connexion input[type=password]{
	background: rgba(255, 255, 255, 0.9);
	background:-moz-linear-gradient(90deg, #fff, #eee); /* Firefox */
	background:-webkit-gradient(linear, left top, left bottom, from(#eee), to(#fff), color-stop(0.2, #fff)); /* Webkit */
	border:1px solid #aaa;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	-moz-box-shadow:0 0 3px #aaa;
	-webkit-box-shadow:0 0 3px #aaa;
	padding:5px;
}
.connexion input[type=text]:focus,
.connexion input[type=password]:focus{
	border-color:#093c75;
	-moz-box-shadow:0 0 3px #0459b7;
	-webkit-box-shadow:0 0 3px #0459b7;
	outline:none; /* Pour enlever le contour jaune lorsque l'on sélectionne un input dans Chrome */
}

.connexion input[type=submit],
.connexion a.submit{
	background:#ddd;
	background:-moz-linear-gradient(90deg, #0459b7, #08adff); /* Firefox */
	background:-webkit-gradient(linear, left top, left bottom, from(#08adff), to(#0459b7)); /* Webkit */
	border:1px solid #093c75;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	-moz-box-shadow:0 1px 0 #fff;
	-webkit-box-shadow:0 1px 0 #fff;
	color:#fff;
	cursor:pointer;
	font-family:Arial,sans-serif;
	font-size:12px;
	font-weight:bold;
	margin-left:120px;
	padding:5px 10px;
	text-decoration:none;
	text-shadow:0 1px 1px #333;
	text-transform:uppercase;
}
.connexion input[type=submit]:hover,
.connexion a.submit:hover{
	background:#eee;
	background:-moz-linear-gradient(90deg, #067cd3, #0bcdff);
	background:-webkit-gradient(linear, left top, left bottom, from(#0bcdff), to(#067cd3));
	border-color:#093c75;
	text-decoration:none;
}
.connexion input[type=submit]:active,
.connexion input[type=submit]:focus,
.connexion a.submit:active,
.connexion a.submit:focus{
	background:#ccc;
	background:-moz-linear-gradient(90deg, #0bcdff, #067cd3);
	background:-webkit-gradient(linear, left top, left bottom, from(#067cd3), to(#0bcdff));
	border-color:#093c75;
	outline:none;
}

#erreur
{
	background:rgba(255, 0, 0, 0.2);
	border:2px solid #FF0000;
	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	
	padding:5px 10px;
}

#erreur p
{
	margin:0; 
	padding:0;
	font-weight:bold;
}