html, body {
	margin: 0;
}

pre {
	background-color:#444444;
	color: #ffffff;
	padding: 5px;
	border-radius: 3px;
}

.tuto {
	min-width: 600px;
	width: 50%;
	padding: 1px 15px;
	margin: 15px auto;
	background-color: #e5e5e5;
	border-radius: 10px;
	font-size: 1.2em;
	font-family: calibri, sans-serif;
	text-overflow: ellipsis;
	word-wrap: break-word;
}

.green {
	background-color: #f2ffe8;
	padding: 0 5px;
	border-radius: 15px 15px 0px 0px;
	border: solid #309030 2px;
}

.red {
	background-color: #fff2e2;
	margin-top: 5px;
	padding: 0 5px;
	border-radius: 0px 0px 15px 15px;
	border: solid #c04040 2px;
}

.red_font {
	color: #c04040;
	font-weight: bold;
	text-decoration: underline;
}

.green_font {
	color: #156015;
	font-weight: bold;
	text-decoration: underline;
}

.touche {
	background-color: #444444;
	border-radius: 5px;
	border: solid #cccccc 2px; 
	color: #ffffff;
	padding: 1px 8px;
	box-shadow: #000000 2px 2px 3px;
}

#tutoMacOS {
	text-align: justify;
}

#Lock {
	width:24px;
	height:28px;
	display: bloc;
	margin-bottom: -5px;
}

#plus {
	font-family: courrier news;
	font-size: 1.2em;
	padding: 0px 6px;
	background-color: #ffffff;
	border: solid #cccccc 1px;
	border-radius: 6px 0 0 6px;
	color: #666666;
}


@media only screen and (max-width: 1200px) {
	.tuto {
		margin: 0;
		width: 100%;
		min-width: 800px;
		padding: auto 10px;

	}
}

@media only screen and (max-width: 1024px) {
	.tuto {
		margin: 0;
		width: 100%;
		min-width: 600px;
		padding: auto 5px;

	}
}