body
{
background-color:#f8f8f8;
margin:0;
}

header
{
background-color:white;
margin-left:auto;
margin-right:auto;
border-collapse:collapse;
font-family:Calibri,Arial,sans-serif;
font-weight:lighter;
font-size:large;
color:#595959;
}

nav
{
width:100%;
margin-left:auto;
margin-right:auto;
border-collapse:collapse;
font-family:Calibri,Arial,sans-serif;
font-weight:lighter;
font-size:large;
color:#595959;
}

article
{
width:100%;
margin-left:auto;
margin-right:auto;
padding-top:30px;
padding-bottom:50px;
border-collapse:collapse;
font-family:Calibri,Arial,sans-serif;
font-weight:lighter;
font-size:large;
color:#595959;
text-align:justify;
}

footer
{
width:100%;
margin-left:auto;
margin-right:auto;
padding-top:30px;
padding-bottom:50px;
border-collapse:collapse;
font-family:Calibri,Arial,sans-serif;
font-weight:lighter;
font-size:large;
color:#595959;
}

img,a,tr,td,ul,li,div
{
margin:0px;
padding:0px;
border:0px;
}

.image
{
padding:0px 20px;
margin:0;
border:0;
text-align:center;
width:100%;
box-sizing:border-box;
}

* {
  box-sizing: border-box;
}

/* Create two equal columns that floats next to each other */
.column {
  float: left;
  padding: 10px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

a:link {color:#595959;text-decoration:none;}
a:visited {color:#595959;text-decoration:none;}
a:hover {text-decoration:underline;}

h1 {font-size:larger;font-weight:lighter;color:black;padding:15px 10px 0px 10px;margin:0;text-align:left}
h2 {font-size:larger;font-weight:lighter;padding:25px 10px 0px 10px;margin:0;text-align:left}
p {font-weight:lighter;padding:0px 10px 0px 10px;}

p a:link {color:#790000;text-decoration:none;}
p a:visited {color:#790000}
p a:hover {background-color:yellow}
p a:active {background-color:pink}

.floatLeft{float:left;}
#logo {margin:3px 10px 3px 5px}
#nom {margin:12px 0px 0px 0px}
#contact {float:right;margin:12px 10px 0px 0px;}

@media (max-width: 450px)
{
#nom {margin:5px 0px 0px 0px;width:150px;}
}

ul
{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}

li {display:inline;text-align:center;}

#navbar:link
{
float:left;
width:16%;
text-decoration:none;
color:white;
padding-top:15px;
padding-bottom:15px;
border-right:0px solid white;
}

#navbar:visited
{
float:left;
width:16%;
text-decoration:none;
color:white;
padding-top:15px;
padding-bottom:15px;
border-right:0px;
}
#navbar:hover {background-color:#ff3300;}

#navbar-end
{
float:left;
width:16%;
text-decoration:none;
color:white;
background-color:#750D06;
padding-top:15px;
padding-bottom:15px;
}
#navbar-end:hover {background-color:#ff3300;}

#bas-de-page{
background-color:#f8f8f8;
}

#bas-de-page .vignette {
margin:0px 15px
}

.vignette{
float:left;
width:230px;
text-align:center;
}

#cadre{
width:230px;
border:1px solid #cbcbcb;
margin:0px;
}

#bas-de-page .vignette img{
margin:10px;
vertical-align:middle;
}

#bas-de-page .vignette h3{
color:#595959;
text-shadow:2px 2px #cbcbcb;
text-weight:bold;
letter-spacing:1px;
margin-top:15px;
margin-bottom:10px
}

#bas-de-page .vignette h3 a{
text-decoration:none;color:#595959;
}

#bas-de-page .vignette p{font-size:16px}

#bottom {height:100px;}

#footer
{
text-align:center;
color:#cbcbcb;
font-family:Calibri,Arial,sans-serif;
font-weight:lighter;
font-size:16px;
margin-top:50px;
margin-bottom:0px;
}