html {
	overflow-x:hidden;
	margin-left : 20px;
	margin-right : 20px;
}

body>header h1 {
  font: 400 70px/0.8 'AmericanaRegular', Helvetica, sans-serif;
  color: #000;
  /*text-shadow: 4px 4px 3px rgba(10,10,10,0.5);*/
  text-transform : uppercase;  
}
body>header h2 {
  font: 400 37px/0.8 'Cookie', Helvetica, sans-serif;
  color: #000;
  text-shadow: 4px 4px 3px rgba(10,10,10,0.1); 
}
body>header h3 {
  font: 400 130px/0.8 'Great Vibes', Helvetica, sans-serif;
  color: #AAA;
  text-shadow: 4px 4px 3px rgba(30,30,30,0.1); 
}

body>header h4 {
  font: 400 100px/1.3 'Arizonia', Helvetica, sans-serif;
  color: #2b2b2b;
  text-shadow: 4px 4px 0px rgba(0,0,0,0.1); 
}

body>header h1, body>header h2 {
	margin : 0;
	text-align:right;	
}
body>header #menu { 
	border-top: 1px dashed;
	border-bottom: 1px dashed;
	text-align:right;
	padding-top: 10px;
	padding-bottom: 10px;
}
body>header #menu li {
	border-radius : 5px;
	padding-top : 3px;
	padding-bottom : 3px;
	padding-left : 10px;
	padding-right : 10px;
	background-color : black;
	display: inline;	
	color : white;

}
body>header a:link {
	text-decoration : none;
	color : black;
	border : none;
 }


a:link {
	color : black;
	text-decoration : none;
	border-bottom : 1px dotted black; 
}
a:visited {
	color:black;
	text-decoration : none;
	border-bottom : 1px dotted black; 
}
a:active, a:hover {
	text-decoration : underline;
	border-bottom : none;  
}
header #menu li a {
	color : white;
}
header #menu li a:link {
	color : white;
}
header #menu li a:visited {
	color : white;
}

header #menu li:hover {
	background-color:lightgray;
	border : 1px solid gray;
	font:black;
}

h1 {  }

body { 
	background-image : url(../bg.png); 
}
main { 
	width:85%;
	margin : auto;
}
article {
	margin-left : 5%;
	border-left :  1px solid grey;
	padding-left : 10px;
}
article header {
	margin-top: 15px;
}

article header h1 {
  	font: 400 40px/0.8  Helvetica, sans-serif;
	text-weight : bold;
	font-variant: small-caps;
	font-stretch : extra-expanded;
	display : inline;
	
}
article header h1 a, 
article header h1 a:link, 
article header h1 a:hover, 
article header h1 a:active
{ 
	border-bottom : none;
	text-decoration : none;
}
/*
article header h2 {
  	font: 400 70px/0.8 'AmericanaRegular', Helvetica, sans-serif;
	text-weight : bold;
	font-variant: small-caps;
	font-stretch : extra-expanded;
	font-size : 35px;
}
*/
a.readmore {
	background-color : black;
	border-radius : 5px;
	color:white;
	text-decoration:none;
	margin-left, margin-right : 3px;
} 
a.readmore:active {
	text-decoration:none;
}
a.readmore:hover {
	background-color:lightgray;
	border : 1px solid gray;
	font-color:black;
}
/* Sticky footer trick */
body {
	display : table;
	width : 100%;
}
body>footer {
	display : table-row;
	height : 100px;
}
/* end Sticky footer trick */


body>footer p { 
	border-top : 1px dashed black; 
	padding-top : 8px;
	text-align: center;	
}


main h2 footer {
	font-family : Arial;
	font-size : small;
	display : inline;
	padding : 2%;
}
#photo { 
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	border : 10px solid white;
	border-bottom : 30px solid white;
	/*margin-left : 50px;*/
	/*float : left;*/
	left : 50px;
	position : absolute;
	-webkit-transform: scale(0.3) rotate(11deg) translate(80px, 0px) ;
	-moz-transform: scale(0.3) rotate(11deg) translate(80px, 0px) ;
	-o-transform: scale(0.3) rotate(11deg) translate(80px, 0px) ;

	-moz-transform-origin : 10px 10px;
	-webkit-transform-origin : 10px 10px;
	-o-transform-origin : 10px 10px;
	filter:grayscale(1);
	-webkit-filter:grayscale(1);

}
#photo:hover {
	-webkit-transform: scale(0.75) rotate(0deg) translate(0px, 0px) ;
	-moz-transform: scale(0.75) rotate(0deg) translate(0px, 0px) ;
	-o-transform: scale(0.75) rotate(0deg) translate(0px, 0px) ;
	filter:grayscale(0);
	-webkit-filter:grayscale(0);
}

address { 
	display: inline;
	font-style : normal;
}


/* index page */
#content-index > h1 {
	text-align : center;
}
/*#content-index a:hover, #content-index a:active {
	border : 1px dashed black;
	text-decoration : none;
	
}
*/


/* social */
	.social {
		position:relative;
		float:right;
	}
	.social a {
		background-repeat: no-repeat;
		background-position: 3px 6px;
	}
	.social a, .social a:link{
		border-bottom: none;
	}
	.social li {
		list-style-type: none;		
	}
	
		/* Icons */
		.social a[href*='delicious.com']:before {content: url('../images/icons/delicious.png'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='digg.com']:before {content: url('../images/icons/digg.png'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='facebook.com']:before {content: url('../images/icons/facebook.png'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='atom.xml']:before {content: url('../images/icons/rss.png'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='last.fm']:before, .social a[href*='lastfm.']:before {content: url('../images/icons/rss.png'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='jamendo.com']:before {content: url('../images/icons/jamendo.png'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='stackoverflow.com']:before {content: url('../images/icons/stackoverflow.png'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='rss.xml']:before {content: url('../images/icons/rss.png'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='twitter.com']:before {content: url('../images/icons/twitter.png'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='framapiaf.org']:before {content: url('../images/icons/mastodon.svg'); margin-right: 2px; vertical-align: -3px;}
		.social a[href*='linkedin.com']:before {content: url('../images/icons/linkedin.png'); margin-right: 2px; vertical-align: -3px;}
        .social a[href*='gitorious.org']:before {content: url('../images/icons/gitorious.png'); margin-right: 2px; vertical-align: -3px;}
        .social a[href*='gitorious.org']:before {content: url('../images/icons/gitorious.png'); margin-right: 2px; vertical-align: -3px;}
        .social a[href*='github.com']:before {content: url('../images/icons/github.png'); margin-right: 2px; vertical-align: -3px;}