a.reverse {
	color: white;
	background-color:  #b71921;}

a{color:#127e54;text-decoration:none}
a:hover{text-decoration:underline}

a.title { color:black;
	font-size:3em;}
h1,h3,h5,h2,h4,h6 {
	color:#127e54;
	}
h1 {
	text-transform: uppercase;
	/*
	color:white;
	background-color:  #b71921; */
}
h1.center,h2.center,h3.center,h4.center,h5.center,h6.center{text-align:center}
header,section {
	margin-left: 2em;
}

h1.reverse {
	color:white;
	background-color:  #b71921;}
h1.ligne {
	display: inline;
}
.livre {
	color: #127e54;
}
#logo {
	height: 2em;
	float:left;
	margin-right: 1em;
}

#logo-black {
	height: 2em;
	float:left;
	margin-right: 1em;
	background-color:black;
}
body {
	background-color:  #fff;
	color: black;
	font-family: Menlo, Consolas, DejaVu Sans Mono, monospace;
	margin-left:2em;
}

img.banner {
	width: 100%;
        height: auto;
}

div#content  {
	margin-left: 2em;
}

img.tutoriel {
	text-align: center;
	max-width: 700px;
}

img.photo {
	width: 100%;
	max-width: 10em;
        height: auto;
        
}
pre {
	background-color : lightyellow;
	padding: 2px;
	color: black;
	width: 700px;
	}
nav.title {
	margin-left: 4em;
	margin-bottom: 4em;
}

section.reverse {
	color:white;
	background-color:  #b71921;}

footer {clear:both; }
.footer a{color:#127e54}.footer a:hover{text-decoration:none}
.footer li{display:inline-block;list-style-type:none;margin-right:2em;padding:1em;font-size:0.8em;}

ul.left{
float:left;}

@media (min-width: 48em) {
    .content {
        margin-left: auto;
        margin-right: auto;
        max-width: 70em;   
    }

   .contentmail {
        margin-left: auto;
        margin-right: auto;
        max-width: 48em;   
    }
    div.right {
	margin-top:4em;
	padding-left: 17em;
	
     }
     
     img.banner {
	width: 100%;
        height: auto;
        max-width: 48em;
	}
    img.photo {
	width: 100%;
	max-width: 14em;
        height: auto;
        float:left;
        margin:2em;       
	}	
}