.SideBands {
padding-right: 16px;
padding-left: 16px;
height: 100%;
min-height: 100%;
}

.MainArea {
background-color: #FFFFFF;
max-width: 1000px;
margin-right: auto;
margin-left: auto;
min-height: 100%;
position: relative;
}

.MainArea > footer {
position: absolute;
left: 0;
right: 0;
bottom: 0;
padding-top: 16px;
padding-bottom: 16px;
}

.MainArea > footer,
.MainArea > footer > a,
.MainArea > footer > span {
font-size: 10px;
text-transform: uppercase;
text-align: center;
color: #A69695;
text-decoration: none;
}

.MainArea > footer > a:hover {
text-decoration: underline;
}

header {
position: relative;
height: 64px;
}

header .Logo {
height: 100%;
background-image: url('../img/title.192x64.svg');
}

header #MenuBt,
header #Menu {
position: absolute;
right: 0;
background-color: #CFCCCC;
}

header #MenuBt {
top: 0;
}

header #Menu {
position: absolute;
right: 0;
top: 44px;
background-color: #CFCCCC;
left: 0;
}

header #MenuBt {
max-width: 240px;
}

header #MenuBt > .Bt:hover {
background-color: #695E5C;
color: #F3F1F1;
}

header #MenuBt > .Bt:hover,
header #MenuBt > .Bt:hover span {
color: #F3F1F1;
}

header #MenuBt > .Bt,
header #Menu > div {
height: 44px;
line-height: 44px;
vertical-align: middle;
padding-left: 8px;
padding-right: 44px;
font-size: 13px;
text-align: right;
cursor: pointer;
}

header #MenuBt > .Bt,
header #Menu > div,
header #MenuBt > .Bt > span {
color: #7C6F6E;
}

header #MenuBt > .Bt::after,
header #Menu > div::after {
content: "";
display: block;
position: absolute;
right: 0;
width: 44px;
height: 44px;
background-position: center;
background-size: contain;
}

header #MenuBt > .Bt::after {
background-image: url('../img/user.44x44.18x18-7C6F6E.svg');
}

header #Menu > div:nth-child(1)::after {
background-image: url('../img/polls.44x44.18x18-7C6F6E.svg');
}

header #Menu > div:nth-child(2)::after {
background-image: url('../img/profil.44x44.18x18-7C6F6E.svg');
}

header #Menu > div:nth-child(3)::after {
background-image: url('../img/disconnect.44x44.18x18-7C6F6E.svg');
}

header #Menu > div:nth-child(1):hover::after {
background-image: url('../img/polls.44x44.18x18-FFFFFF.svg');
}

header #Menu > div:nth-child(2):hover::after {
background-image: url('../img/profil.44x44.18x18-FFFFFF.svg');
}

header #Menu > div:nth-child(3):hover::after {
background-image: url('../img/disconnect.44x44.18x18-FFFFFF.svg');
}

header #MenuBt > .Bt:hover::after {
background-image: url('../img/user.44x44.18x18-FFFFFF.svg');
}

header #MenuBt > .Bt::after {
top: 0;
}

header #Menu > div:nth-child(1)::after {
top: 0;
}

header #Menu > div:nth-child(2)::after {
top: 44px;
}

header #Menu > div:nth-child(3)::after {
top: 88px;
}

header #Menu > div {
border-top: 1px solid #F3F1F1;
}

header #Menu > div:hover {
background-color: #695E5C;
color: #FFFFFF;
}

.Main {
padding-right: 50px;
padding-left: 50px;
padding-bottom: 86px;
}

.BottomLnk {
background-color: #CFCCCC;
color: #A69695;
padding-top: 30px;
padding-bottom: 30px;
padding-left: 50px;
padding-right: 50px;
margin-bottom: 44px;
}

.BottomLnk > div {
display: inline-block;
vertical-align: top;
width: 25%;
}

.BottomLnk > div > div,
.BottomLnk > div > div > div,
.BottomLnk > div > div > div > a {
line-height: 18px;
}

.BottomLnk > div > div > div > a {
text-decoration: none;
color: #695E5C;
font-size: 13px;
}

.BottomLnk > div > div > div > a:hover {
text-decoration: underline;
}

.BottomLnk > div > div > div:first-child > a {
font-weight: bold;
font-size: 15px;
}

@media (max-width: 1000px) {

  .BottomLnk {
  margin-bottom: 16px;
  }
}

@media (max-width: 700px) {

  .SideBands {
  padding-right: 0;
  padding-left: 0;
  }

  .MainArea {
  margin-right: 0;
  margin-left: 0;
  }

  header {
  height: 64px;
  }

  header .Logo {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: auto;
  right: 64px;
  }

  header #MenuBt {
  width: 64px;
  max-width: 64px;
  }

  header #MenuBt > .Bt {
  height: 64px;
  }

  header #MenuBt > .Bt > span {
  visibility: hidden;
  }

  header #MenuBt > .Bt::after {
  right: 0;
  width: 64px;
  height: 64px;
  }

  header #Menu {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 135px;
  }

  .Main {
  padding-right: 20px;
  padding-left: 20px;
  }

  .BottomLnk {
  margin-bottom: 0;
  }
}

@media (max-width: 800px) {
      
  .BottomLnk {
  background-color: #CFCCCC;
  padding-top: 8px;
  padding-bottom: 12px;
  padding-left: 0;
  padding-right: 0;
  }

  .BottomLnk > div {
  display: block;
  margin-right: auto;
  margin-left: auto;
  width: 200px;
  padding-top: 10px;
  padding-bottom: 10px;
  }

  .BottomLnk > div:not(:last-child) {
  border-bottom: 1px solid #E0DDDD;
  }

  .BottomLnk > div > div > div {
  text-align: center;
  }
}

@media (max-width: 320px) {

  header #Menu {
    width: 100%;
    max-width: 100%;
  }
}

article > h1 {
font-family: 'Merriweather', serif;
font-size: 32px;
color: #695E5C;
line-height: 38px;
font-weight: 300;
margin-bottom: 4px;
}

article > .Details {
font-size: 12px;
color: #695E5C;
font-weight: 300;
text-transform: uppercase;
}

article > .Details+.Pict {
height: 300px;
}

article > h3 {
font-size: 16px;
line-height: 20px;
color: #695E5C;
font-weight: bold;
margin-top: 30px;
text-transform: uppercase;
}

article > p,
article > p a,
article ul,
article li {
font-size: 16px;
line-height: 22px;
margin-top: 8px;
color: #7C6F6E;
font-weight: 300;
text-align: left;
}

article > h2 {
font-family: 'Merriweather', serif;
font-style: italic;
font-weight: bold;
font-size: 16px;
color: #A69695;
line-height: 22px;
margin-bottom: 16px;
margin-top: 40px;
}

article > h2 sup {
font-family: 'Merriweather', serif;
font-style: italic;
font-weight: bold;
color: #A69695;
}

article > p:last-child::after {
content: "";
display: inline-block;
vertical-align: baseline;
width: 10px;
height: 10px;
margin-left: 5px;
background-image: url('../img/article.end.16x16-A69695.svg');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}

article.Mini {
color: #7C6F6E;
cursor: pointer;
}

article.Mini h1 {
color: #7C6F6E;
margin-bottom: 1px;
}

article.Mini > h2 {
font-family: "Open Sans", sans-serif;
font-style: normal;
font-size: 14px;
line-height: 20px;
margin-top: 16px;
color: #7C6F6E;
font-weight: 300;
border: none;
padding-bottom: 0;
}

article.Mini > .Ellipsis::after {
content: "lire la suite >";
display: block;
text-align: left;
font-family: "Open Sans", sans-serif;
font-style: normal;
line-height: 20px;
color: #7C6F6E;
text-decoration: underline;
margin-top: 10px;
}

article.Mini:hover > .Ellipsis::after {
color: #695E5C;
font-weight: bold;
}

article.Mini:hover h1,
article.Mini:hover h2 {
color: #695E5C;
}

article.Mini {
margin-top: 0;
}

article.Mini * {
display: none;
}

article.Mini h1,
article.Mini .Ellipsis,
article.Mini .Details,
article.Mini .Details+.Pict {
display: inherit;
}

.Form.Editor .Input {
height: 40px;
}

.Form.Editor .Input .Icon {
width: 40px;
height: 40px;
}

.Form.Editor .Input .Edit {
left: 40px;
}

.Form.Editor .Input .Edit input {
line-height: 40px;
}

.Form.Editor .Head {
position: relative;
min-height: 20px;
}

.Form.Editor .Head .Title {
position: absolute;
bottom: 0;
left: 0;
width: auto;
padding-left: 4px;
padding-right: 4px;
background-color: #C4B6B6;
text-transform: uppercase;
color: #FFFFFF;
font-size: 11px;
height: 20px;
line-height: 20px;
vertical-align: middle;
}

.Form.Editor .Head .Info {
margin-right: 0;
text-align: right;
font-size: 11px;
color: #DC352A;
}

.Form.Editor .Head .Info[disabled="disabled"] {
color: #C4B6B6;
}

.Form.Editor .Input {
border-top: 1px solid #C4B6B6;
border-bottom: 1px solid #C4B6B6;
margin-bottom: 40px;
}

.Form.Editor .Input.Calendar {
height: auto;
}