@font-face /*Police*/
{
	font-family: "DejaVu";
	src: url('/DejaVuSansMono.ttf');
}
* {
	font-family: DejaVu, courier;
	margin: 0;
	padding: 0;
}

/*Pour écrans paysage*/
@media only screen and (min-width: 900px) {
	html
	{
		background-color: cadetblue;
	}

	body {
        width: 60%;
    }

    header, main, footer {
        width: 90%;
        margin: 0 auto;
    }

    /*Couleurs des menus du nav*/
	nav ul li:nth-of-type(1) a:hover
	{
		color: #FE0002;
		transition: all 0.3s ease 0s;
	}
	nav ul li:nth-of-type(2) a:hover
	{
		color: #FEFC00;
		transition: all 0.3s ease 0s;
	}
	nav ul li:nth-of-type(3) a:hover
	{
		color: #01BD43;
		transition: all 0.3s ease 0s;
	}
	/*on garde les autres couleurs au cas où*/
	nav ul li:nth-of-type(4) a:hover
	{
		color: #01BD43;
		transition: all 0.3s ease 0s;
	}
	nav ul li:nth-of-type(5) a:hover
	{
		color: #056AFB;
		transition: all 0.3s ease 0s;
	}

	.dns code:hover {/*Survol des IP des DNS*/
		background-color: #007d81;
		transition: 500ms;
	}

	pre {
		margin-top: .8em;
		padding: 1em;
	}

	/*jpp*/
	h1#portrait {
		display: none;
	}
}

/*Pour écran intermédiaire*/
@media only screen and (max-width: 900px) {
	body {
        width: 96%;
    }
	/*jpp*/
	h1#paysage {
		display: none;
	}
}

/*Pour écran portrait*/
@media only screen and (max-width: 500px) {
	body {
        width: 90%;
    }

	pre {
		margin-top: .8em;
		padding: .2em;
	}

	/*jpp*/
	h1#paysage {
		display: none;
	}
}

html
	{
		height: 100%;
	}

body {
    background-color: black;
    color: white;
	margin: 0 auto;
	min-height: 100%;
    display: flex;
    flex-direction: column;
}
a {
    color: white;
}

header, footer {
	text-align: center;
}

header a
{
	text-decoration: none;
}

h1
{
	margin-top: .9em;
	margin-bottom: .5em;
	font-weight: lighter;
}

h2
{
	margin-top: .8em;
	margin-bottom: .4em;
}

h3
{
	margin-top: .7em;
	margin-bottom: .3em;
}

nav {
    overflow: auto;
	max-width: 100%;
}

nav ul {
	list-style: none;
}
nav ul li {
	display: inline-block;
}

/*Ajout des :: dans le nav*/ 
nav ul li:after {
	content: " :: "
}
nav ul li:last-child:after {
	content: "";
}

main
{
	background: black;
	flex-grow: 1;
}

p {
	margin-top: .6em;
	margin-bottom: 1.2em;
}

#services {
	width: 96%;
    margin-top: 3em;
	padding: 1em 2%;
    border-top: 2px dotted white;
    border-bottom: 2px dotted white;
}


#services li {
	margin: .4em .4em;
}

code {/*Les IP et URL*/
	font-family: monospace;
	padding: .2em .3em;
	background-color: rgb(49, 48, 48);
}


pre {
	background-color: rgb(49, 48, 48);
	border-radius: 2px;
	overflow: auto;
}

footer {
	margin-top: 4em;
    margin-bottom: 1em;
}

header, footer {
    flex-grow: 0;
    flex-shrink: 0;
}

/*Spécifique à la page d'accueil*/
#services.home ul {
	list-style-type: none;
}

/*Spécifique à la page dns*/
#services.dns ul {
	list-style-type: none;
	margin: .8em 0;
}
#services.dns li {
	margin-left: .4em;
}
#services.dns li>ul>li {
	margin-left: .4em;
}

h1 a {
	text-decoration: underline;
}

/*Spécifique à la page dns/network*/
#services.network li>ul>li {
	margin-left:1em;
}

/*Spécifique à la page mail*/
#services.mail li {
	margin-left: 2em;
}