/*
	HTML5 Reset :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:
	Eric Meyer					:: http://meyerweb.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com
-------------------------------------------------------------------------------*/
/* Let's default this puppy out
-------------------------------------------------------------------------------*/
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic);
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-weight: inherit;
  vertical-align: baseline;
  background: transparent; }

article, aside, figure, footer, header, nav, section, details, summary {
  display: block; }

/* Handle box-sizing while better addressing child elements:
   http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
html {
  box-sizing: border-box; }

*,
*:before,
*:after {
  box-sizing: inherit; }

/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */
/* Responsive images and other embedded objects
*/
img,
object,
embed {
  max-width: 100%; }

/*
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
	 In fact, it *will* cause problems with Google Maps' controls at small size.
	If this is the case for you, try uncommenting the following:
#map img {
		max-width: none;
}
*/
/* force a vertical scrollbar to prevent a jumpy page */
html {
  overflow-y: scroll; }

/* we use a lot of ULs that aren't bulleted.
	don't forget to restore the bullets within content. */
ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help; }

/* tables still need cellspacing="0" in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0; }

th {
  font-weight: bold;
  vertical-align: bottom; }

td {
  font-weight: normal;
  vertical-align: top; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

pre {
  white-space: pre;
  /* CSS2 */
  white-space: pre-wrap;
  /* CSS 2.1 */
  white-space: pre-line;
  /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word;
  /* IE */ }

input[type="radio"] {
  vertical-align: text-bottom; }

input[type="checkbox"] {
  vertical-align: bottom; }

.ie7 input[type="checkbox"] {
  vertical-align: baseline; }

.ie6 input {
  vertical-align: text-bottom; }

select, input, textarea {
  font: 99% sans-serif; }

table {
  font-size: inherit;
  font: 100%; }

small {
  font-size: 85%; }

strong {
  font-weight: bold; }

td, td img {
  vertical-align: top; }

/* Make sure sup and sub don't mess with your line-heights http://gist.github.com/413930 */
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* standardize any monospaced elements */
pre, code, kbd, samp {
  font-family: monospace, sans-serif; }

/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button {
  cursor: pointer; }

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {
  margin: 0; }

/* make buttons play nice in IE */
button,
input[type=button] {
  width: auto;
  overflow: visible; }

/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic; }

/* prevent BG image flicker upon hover
   (commented out as usage is rare, and the filter syntax messes with some pre-processors)
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}
*/
/* let's clear some floats */
.clearfix:before, .clearfix:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden; }

.clearfix:after {
  clear: both; }

.clearfix {
  zoom: 1; }

.body {
  position: relative; }

.header {
  position: relative; }
  .header .trigger-mobile {
    display: none;
    color: #ffffff;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: left top;
    -moz-transform-origin: left top;
    transform-origin: left top;
    position: absolute;
    text-transform: uppercase;
    left: 0;
    top: 110px;
    font-size: 140%;
    width: 110px;
    height: 40px;
    padding: 5px;
    cursor: pointer; }
    @media screen and (max-width: 640px) {
      .header .trigger-mobile {
        display: block; } }
    .header .trigger-mobile .image-trigger {
      width: 20px;
      height: 20px;
      background: url("images/croix.png");
      background-size: cover;
      float: right;
      margin: 3px 0; }
  .header .top-menu {
    background: #0a273a;
    color: #ffffff;
    padding: 20px 0;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto; }
    .header .top-menu:after {
      content: " ";
      display: block;
      clear: both; }
    @media screen and (max-width: 640px) {
      .header .top-menu {
        padding: 0; } }
    .header .top-menu .edit-url {
      width: 11.39241%;
      float: left;
      margin-right: 1.26582%;
      padding-left: 20px;
      font-size: 80%;
      line-height: 25px; }
      .header .top-menu .edit-url a {
        color: #fff;
        font-size: 70%;
        text-transform: uppercase; }
      @media screen and (max-width: 930px) {
        .header .top-menu .edit-url {
          width: 100%;
          float: right;
          margin-right: 0;
          text-align: center;
          margin-bottom: 10px;
          padding: 0; } }
    .header .top-menu .menu {
      text-align: right;
      width: 87.34177%;
      float: right;
      margin-right: 0; }
      @media screen and (max-width: 930px) {
        .header .top-menu .menu {
          width: 100%;
          float: right;
          margin-right: 0; } }
      @media screen and (max-width: 820px) {
        .header .top-menu .menu {
          margin: auto;
          text-align: center;
          max-width: 600px;
          float: none; } }
      @media screen and (max-width: 640px) {
        .header .top-menu .menu {
          text-align: center;
          position: absolute;
          top: 220px;
          left: -80%;
          padding: 0;
          width: 80%;
          border-top: 5px solid #0a273a;
          z-index: 9999; } }
      .header .top-menu .menu a {
        padding: 10px;
        margin: 10px;
        text-transform: uppercase;
        font-size: 70%; }
        .header .top-menu .menu a::after {
          display: none !important; }
        .header .top-menu .menu a:hover {
          text-decoration: underline; }
        @media screen and (max-width: 820px) {
          .header .top-menu .menu a {
            display: inline-block; } }
        @media screen and (max-width: 640px) {
          .header .top-menu .menu a {
            padding: 20px;
            background: #2e2e2e;
            display: block;
            margin: 0; } }
        .header .top-menu .menu a.membres {
          background: #0073b5;
          border-radius: 5px; }
          @media screen and (max-width: 640px) {
            .header .top-menu .menu a.membres {
              border-radius: 0; } }
        .header .top-menu .menu a.site-normal {
          background: #0073b5;
          border-radius: 5px; }
          @media screen and (max-width: 640px) {
            .header .top-menu .menu a.site-normal {
              border-radius: 0; } }
        .header .top-menu .menu a.deconnexion {
          background: #0073b5;
          border-radius: 5px; }
          @media screen and (max-width: 640px) {
            .header .top-menu .menu a.deconnexion {
              border-radius: 0; } }
  .header .main-menu {
    background: #104263;
    color: #ffffff;
    height: 150px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto; }
    .header .main-menu:after {
      content: " ";
      display: block;
      clear: both; }
    .header .main-menu .logo {
      width: 17.72152%;
      float: left;
      margin-right: 1.26582%; }
      .header .main-menu .logo img {
        height: 100px;
        width: auto;
        margin: 20px; }
      @media screen and (max-width: 640px) {
        .header .main-menu .logo {
          width: 100%;
          float: right;
          margin-right: 0;
          text-align: center; } }
    .header .main-menu .menu {
      width: 81.01266%;
      float: right;
      margin-right: 0;
      text-align: right;
      padding: 30px 0;
      line-height: 87px; }
      @media screen and (max-width: 640px) {
        .header .main-menu .menu {
          text-align: center;
          position: absolute;
          top: 0;
          left: -80%;
          padding: 0;
          width: 80%;
          height: 220px;
          line-height: 15px;
          z-index: 9999; } }
      .header .main-menu .menu a {
        padding: 66px 10px;
        margin: 0 10px;
        text-transform: uppercase;
        font-size: 90%; }
        .header .main-menu .menu a:hover {
          background: rgba(255, 255, 255, 0.1); }
          @media screen and (max-width: 640px) {
            .header .main-menu .menu a:hover {
              background: #104263; } }
        .header .main-menu .menu a::after {
          display: none !important; }
        @media screen and (max-width: 640px) {
          .header .main-menu .menu a {
            padding: 20px;
            background: #104263;
            display: block;
            margin: 0; } }
    @media screen and (max-width: 640px) {
      .header .main-menu {
        width: 100%; } }

/* IMAGE HEADER */
.home .cover-image .wrapper {
  height: 400px;
  position: relative; }
  .home .cover-image .wrapper .texte-entete {
    background: rgba(46, 46, 46, 0.8);
    width: auto;
    display: inline-block;
    color: #d7d7d7;
    padding: 20px;
    position: absolute;
    bottom: 20px;
    left: 20px;
    max-width: 400px; }
    .home .cover-image .wrapper .texte-entete h1 {
      font-size: 150%; }

.cover-image .wrapper {
  background: url("images/quebec.png");
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 250px; }

/* ARTICLES */
.article {
  background: #efefef;
  margin: 30px auto 0; }
  .article h1 {
    background: none;
    font-size: 130%;
    color: #0a273a;
    text-transform: uppercase;
    padding: 0 20px; }
    .article h1:after {
      display: none; }
  .article .content {
    padding: 25px 0; }
  .article .bar {
    background: #0a273a;
    color: #ffffff;
    padding: 20px; }
    .article .bar .tags {
      float: right; }
      @media screen and (max-width: 640px) {
        .article .bar .tags {
          display: block;
          margin: 10px 0;
          float: none; } }
  .article .lire-plus {
    display: block;
    padding: 10px 20px;
    text-align: right; }
    .article .lire-plus a {
      text-transform: uppercase; }

.main .container .article-single .text {
  padding: 0 20px; }
  .main .container .article-single .text p {
    text-align: justify;
    padding: 0;
    margin-bottom: 20px; }
  .main .container .article-single .text a {
    text-decoration: underline; }
  .main .container .article-single .text h2, .main .container .article-single .text h3, .main .container .article-single .text h4 {
    margin: 20px 0 10px; }
  .main .container .article-single .text h2 {
    font-size: 130%;
    font-weight: bold; }
  .main .container .article-single .text h3 {
    font-size: 115%;
    font-weight: bold; }
  .main .container .article-single .text h4 {
    font-size: 105%;
    font-weight: bold; }
  .main .container .article-single .text ul {
    padding-left: 20px; }
    .main .container .article-single .text ul li {
      list-style-type: disc; }
.main .container .article-single .bar {
  background: #0a273a;
  color: #ffffff;
  padding: 10px 20px; }
  .main .container .article-single .bar .tags {
    float: right; }
    @media screen and (max-width: 640px) {
      .main .container .article-single .bar .tags {
        display: block;
        margin: 10px 0;
        float: none; } }

.comites-liste {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 20px; }
  .comites-liste:after {
    content: " ";
    display: block;
    clear: both; }
  .comites-liste .comite {
    width: 28.57143%;
    float: left;
    text-align: center; }
    @media screen and (max-width: 740px) {
      .comites-liste .comite {
        width: 100%;
        float: left; } }
    .comites-liste .comite a {
      text-transform: uppercase; }

.membres .membre {
  margin: 20px 0;
  clear: both; }
  .membres .membre .infos {
    display: block; }
    .membres .membre .infos .position {
      margin: 0 10px; }
  .membres .membre h2 {
    color: #0a273a; }
  .membres .membre .description {
    margin: 20px; }
    .membres .membre .description img {
      float: left;
      margin-right: 10px;
      margin-bottom: 20px;
      width: 35%;
      display: inline-block; }
    .membres .membre .description .body {
      position: relative;
      display: inline-block;
      vertical-align: top;
      max-width: 63%; }
      .membres .membre .description .body ul {
        list-style-type: initial; }
        .membres .membre .description .body ul li {
          margin: 5px 0 5px 40px; }
    .membres .membre .description .comite {
      margin: 0; }
.membres a {
  text-decoration: underline; }

.page-comite .entete-comite a {
  float: right;
  padding: 20px;
  line-height: 40px; }
  @media screen and (max-width: 740px) {
    .page-comite .entete-comite a {
      float: none;
      padding: 0 20px;
      display: block; } }
.page-comite h2 {
  padding: 10px 20px;
  font-size: 120%; }
.page-comite .email {
  margin: 10px 20px; }
.page-comite .membres {
  margin: 10px 20px; }
  .page-comite .membres li {
    margin-bottom: 10px; }
    .page-comite .membres li a {
      text-decoration: none; }
      .page-comite .membres li a:hover {
        text-decoration: underline; }

/* MEMBRES */
.section-membres .texte ul{
  padding-left:40px;
  margin:16px 0px;
  list-style-type: initial;
}
.section-membres h1 {
  background: none;
  font-size: 120%;
  color: #ffffff;
  background: #0a273a;
  text-transform: uppercase;
  display: inline-block;
  margin: 10px 0;
  padding: 20px; }
.section-membres .main-menu {
  background: #2e2e2e; }
.section-membres .wrapper .header-membres h1 {
  font-size: 150%;
  color: #ffffff;
  background: #2e2e2e;
  padding: 15px;
  position: relative;
  display: inline-block;
  margin-top: -30px;
  text-transform: uppercase; }
  .section-membres .wrapper .header-membres h1:after {
    content: url("images/extrude-gris.png");
    position: absolute;
    z-index: 100000;
    left: -50px;
    top: 0; }
.section-membres .acces-section div {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto; }
  .section-membres .acces-section div:after {
    content: " ";
    display: block;
    clear: both; }
  .section-membres .acces-section div h2 {
    width: 32.20339%;
    float: left;
    margin-right: 1.69492%;
    background: #0a273a;
    color: #ffffff;
    font-size: 110%;
    padding: 20px; }
    @media screen and (max-width: 740px) {
      .section-membres .acces-section div h2 {
        width: 75%;
        float: left;
        margin-right: 5.26316%; } }
  .section-membres .acces-section div a {
    width: 66.10169%;
    float: right;
    margin-right: 0;
    padding: 20px; }
    @media screen and (max-width: 740px) {
      .section-membres .acces-section div a {
        width: 100%;
        float: right;
        margin-right: 0; } }
.section-membres .document {
  background: #2e2e2e;
  color: #ffffff;
  margin: 15px 0;
  padding: 10px; }
  @media screen and (max-width: 640px) {
    .section-membres .document {
      float: none; } }
  .section-membres .document h1 {
    background: none;
    padding: 0;
    text-transform: initial;
    margin: 0;
    margin-bottom: 10px;
    display: block; }
  .section-membres .document .date {
    margin: 0;
    font-size: 80%; }
  .section-membres .document .extension {
    margin: 0;
    text-transform: uppercase;
    font-size: 80%; }
  .section-membres .document .ouvrir {
    color: #ffffff;
    text-transform: uppercase;
    float: right; }
    @media screen and (max-width: 640px) {
      .section-membres .document .ouvrir {
        float: none;
        display: block;
        padding: 10px 0; } }

/* FORUM */
.discussion {
  background: #2e2e2e;
  margin: 20px auto;
  color: #ffffff;
  padding: 15px; }
  .discussion .infos {
    display: inline-block;
    width: 60%;
    font-size: 85%; }
    @media screen and (max-width: 640px) {
      .discussion .infos {
        width: 100%;
        font-size: 100%; } }
    .discussion .infos h1 {
      background: none;
      font-size: 150%;
      color: #ffffff;
      padding: 0;
      display: block;
      margin: 0 0 10px; }
      @media screen and (max-width: 640px) {
        .discussion .infos h1 {
          font-size: 120%; } }
      .discussion .infos h1 a {
        float: none;
        text-transform: none;
        padding: 0; }
  .discussion a {
    color: #ffffff;
    display: inline-block;
    float: right;
    text-transform: uppercase; }
    @media screen and (max-width: 640px) {
      .discussion a {
        display: block;
        margin: 20px 0;
        float: none; } }
  .discussion .content {
    padding: 25px 10px; }
  .discussion .bar {
    background: #0a273a;
    color: #ffffff;
    padding: 20px; }
    .discussion .bar .tags {
      float: right; }

.forum .entete-forum a {
  float: right;
  margin: 20px; }
  @media screen and (max-width: 640px) {
    .forum .entete-forum a {
      float: none;
      display: block; } }
.forum .entete {
  background: #2e2e2e;
  color: #ffffff;
  padding: 20px;
  margin-bottom: 20px; }
  .forum .entete .infos {
    display: inline-block;
    font-size: 80%; }
    .forum .entete .infos h1 {
      background: none;
      margin: 0;
      padding: 0;
      display: block;
      font-size: 125%; }
  .forum .entete a {
    color: #ffffff;
    float: right; }
    @media screen and (max-width: 640px) {
      .forum .entete a {
        float: none;
        margin-top: 10px;
        display: block; } }
.forum .survey {
  padding: 20px; }
  .forum .survey .option {
    padding: 10px 0; }
    .forum .survey .option input {
      float: left; }
    .forum .survey .option .proposition {
      display: inline-block;
      width: 90%; }

.commentaires {
  margin: 20px 0; }
  .commentaires .entete {
    padding: 0;
    background: #0a273a;
    margin-bottom: 0; }
    .commentaires .entete h2 {
      font-size: 150%;
      color: #ffffff;
      background: #0a273a;
      padding: 15px;
      position: relative;
      display: inline-block;
      text-transform: uppercase; }
      .commentaires .entete h2:after {
        content: url("images/extrude.png");
        position: absolute;
        z-index: 100000;
        left: -50px;
        top: 0; }
    .commentaires .entete a {
      float: right;
      padding: 20px; }
      @media screen and (max-width: 740px) {
        .commentaires .entete a {
          float: none;
          display: block;
          padding-top: 0; } }
  .commentaires .CommentList li {
    background: #e1e1e1;
    color: #5c5c5c;
    padding: 20px 0 0;
    border-top: 2px solid #2e2e2e; }
    .commentaires .CommentList li:first-child {
      border-top: none; }
    .commentaires .CommentList li .CommentHeader {
      color: #5c5c5c; }
    .commentaires .CommentList li li {
      background: #fafafa;
      color: #5c5c5c;
      border-top: none;
      border-top: 2px solid #e1e1e1; }
      .commentaires .CommentList li li .CommentVotes a {
        color: #5c5c5c;
        text-transform: uppercase; }
      .commentaires .CommentList li li:after {
        content: url("images/fleche-reponse.png");
        position: absolute;
        z-index: 100;
        left: 10px;
        top: 15px; }
    .commentaires .CommentList li .CommentFooter a, .commentaires .CommentList li .CommentVotes a {
      color: #5c5c5c;
      text-transform: uppercase; }
    .commentaires .CommentList li a.CommentActionReply {
      color: #5c5c5c; }
      .commentaires .CommentList li a.CommentActionReply:hover {
        color: black; }
  .commentaires .CommentForm {
    margin-top: 20px; }
    .commentaires .CommentForm .CommentFormCite, .commentaires .CommentForm .CommentFormEmail {
      display: none; }
    .commentaires .CommentForm .CommentFormNotify input {
      margin: 0 5px;
      display: inline-block;
      width: auto; }
    @media screen and (max-width: 740px) {
      .commentaires .CommentForm .CommentFormNotify label {
        display: block;
        margin: 10px 0; } }

/*** COMMENT FORM ********************************************/
.CommentFormCite input,
.CommentFormEmail input,
.CommentFormWebsite input,
.CommentFormText textarea {
  box-sizing: border-box;
  display: block;
  width: 100%; }

.CommentFormCite,
.CommentFormEmail,
.CommentFormWebsite {
  box-sizing: border-box;
  float: left;
  width: 33%; }

.CommentFormCite,
.CommentFormEmail {
  padding-right: 1em; }

.CommentFormWebsite {
  width: 34%; }

.CommentFormNotify label {
  padding-right: 0.5em;
  white-space: nowrap; }

.CommentFormText {
  clear: both; }

@media only screen and (max-width: 767px) {
  .CommentFormCite,
  .CommentFormEmail,
  .CommentFormWebsite,
  .CommentFormNotify {
    float: none;
    width: 100%;
    padding-right: 0; } }
/*** COMMENT LIST ********************************************/
.CommentList,
.CommentListItem {
  list-style: none;
  /*margin: 1em 0;*/
  padding: 0; }

.CommentListItem {
  position: relative; }

.CommentHeader {
  font-weight: bold; }

.CommentHeader .CommentCreated {
  font-weight: normal;
  padding-left: 0.5em; }

.CommentListNormal .CommentListItem {
  border-bottom: 1px solid #ddd; }

.CommentFooter {
  padding-bottom: 1em; }

/*** COMMENT LIST WITH GRAVATAR ******************************/
.CommentGravatar {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  float: left;
  width: 40px;
  height: 40px;
  padding: 1px;
  border: 1px solid #ddd; }

.CommentListHasGravatar .CommentHeader,
.CommentListNormal.CommentListHasGravatar .CommentText {
  margin-left: 55px; }

.CommentListHasGravatar .CommentText,
.CommentListHasGravatar .CommentAction,
.CommentListHasGravatar form {
  clear: both;
  margin-left: 0; }

@media only screen and (max-width: 767px) {
  .CommentListHasGravatar .CommentHeader,
  .CommentListNormal.CommentListHasGravatar .CommentText {
    margin-left: 35px; }

  .CommentGravatar {
    width: 25px;
    height: 25px; } }
/*** COMMENT LIST WITH DEPTH (THREADED) ***********************/
.CommentList .CommentList {
  /*margin-bottom: 2em;*/ }

.CommentList .CommentList .CommentGravatar {
  left: 1em;
  /* should match the padding-left in item below */ }

.CommentList .CommentList .CommentListItem {
  padding-left: 20px;
  border-color: #ddd; }

.CommentAction {
  margin-bottom: 0; }

.CommentList .CommentList .CommentListItem + .CommentListItem {
  /* provides extra space between adjacent comments on same level */
  /*margin-top: 2em;*/ }

/*** COMMENT VOTES ********************************************/
.CommentList .CommentVotes {
  float: right; }

.CommentList .CommentVotes a {
  text-decoration: none;
  padding: 3px 0.5em;
  font-weight: bold;
  border-bottom: none; }

.CommentList .CommentVotes a.CommentVoted {
  background-color: #eee; }

.CommentList .CommentActionDownvote {
  border-left: 1px solid #ddd;
  color: red; }

.CommentList .CommentVotes .CommentUpvoteCnt,
.CommentList .CommentVotes .CommentDownvoteCnt {
  padding-left: 2px; }

/* SONDAGE */
.survey h1 {
  margin: 0; }
.survey .result {
  background-color: #e8e8e8;
  border-bottom: 1px solid #2e2e2e;
  position: relative;
  height: 30px;
  vertical-align: middle; }
  .survey .result .title {
    position: absolute;
    left: 10px;
    height: 100%;
    line-height: 30px; }
  .survey .result .count {
    position: absolute;
    right: 10px;
    height: 100%;
    top: 5px;
    line-height: 20px; }
  .survey .result .bar {
    height: 100%;
    background: #a9bcc9; }
  .survey .result :last-child {
    border-bottom: none; }
.survey .num-votes {
  padding: 10px 0; }

/* FORMULAIRES */
input, textarea {
  background: #292929;
  color: #d7d7d7;
  border: 0;
  padding: 10px; }

input {
  display: block;
  margin: 10px 0;
  width: 100%; }
  input[type="submit"] {
    width: auto;
    background: #0073b5;
    border-radius: 5px;
    color: #ffffff;
    padding: 10px 20px; }
  input[type="radio"] {
    width: auto;
    display: inline-block;
    margin: 5px; }

textarea {
  display: block;
  margin: 10px 0;
  width: 100%;
  resize: none;
  height: 100px; }

button {
  border-radius: 10px;
  border-radius: 5px;
  padding: 5px 20px;
  border: 0; }

.form-connexion {
  padding: 20px; }
  .form-connexion input {
    display: block;
    margin: 10px 0; }

.erreur, .error, .envoi-echec {
  background: #dc143c;
  padding: 10px;
  display: block;
  margin: 0 20px;
  color: #fff;
  border: 2px solid #b20028;
  text-align: center; }
  .erreur .bloc, .error .bloc, .envoi-echec .bloc {
    display: block;
    text-align: center;
    font-size: 160%;
    margin: 5px 0; }

.reussite, .envoi-reussi {
  background: #89b600;
  padding: 10px;
  display: block;
  margin: 0 20px;
  color: #fff;
  border: 2px solid #759a05;
  text-align: center; }
  .reussite .bloc, .envoi-reussi .bloc {
    display: block;
    text-align: center;
    font-size: 160%;
    margin: 5px 0; }

.lien-devenir-membre {
  color: #0073b5; }

.sidebar {
  background: #ffffff;
  box-shadow: 0 5px 5px #2e2e2e;
  padding-bottom: 10px;
  min-height: 300px;
  font-size: 85%; }
  @media screen and (max-width: 740px) {
    .sidebar {
      margin: 20px 0; } }
  .sidebar h2 {
    color: #104263;
    padding: 20px;
    text-align: left;
    font-size: 150%; }
  .sidebar .article {
    background: none;
    margin: 0 0 20px;
    border-top: 3px solid #d7d7d7; }
    .sidebar .article .content {
      padding: 0; }
      .sidebar .article .content h1 {
        color: #2e2e2e;
        background: none;
        padding: 10px 20px;
        font-size: 110%; }
      .sidebar .article .content p {
        padding: 0 20px; }
    .sidebar .article .bar {
      background: #efefef;
      color: #5c5c5c;
      margin-top: 10px; }
      .sidebar .article .bar .lire-plus {
        padding: 0;
        float: right; }
        .sidebar .article .bar .lire-plus a {
          color: #5c5c5c; }
  .sidebar .actualites-fppvq, .sidebar .actualite-fpmq, .sidebar .partenaires {
    border-bottom: 5px solid #104263; }
  .sidebar .partenaires {
    text-align: center; }
    .sidebar .partenaires img {
      width: 90%;
      height: auto;
      margin-bottom: 10px; }
  .sidebar .reseaux-sociaux {
    text-align: center; }
    .sidebar .reseaux-sociaux img {
      margin: 0 10px 10px; }

.liste-liens-utiles {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 20px; }
  .liste-liens-utiles:after {
    content: " ";
    display: block;
    clear: both; }
  .liste-liens-utiles .lien {
    width: 28.57143%;
    float: left;
    text-align: center; }
    .liste-liens-utiles .lien:nth-child(3n + 1) {
      margin-left: 0;
      margin-right: -100%;
      clear: both;
      margin-left: 0; }
    .liste-liens-utiles .lien:nth-child(3n + 2) {
      margin-left: 35.71429%;
      margin-right: -100%;
      clear: none; }
    .liste-liens-utiles .lien:nth-child(3n + 3) {
      margin-left: 71.42857%;
      margin-right: -100%;
      clear: none; }
    .liste-liens-utiles .lien .image {
      display: table-cell;
      height: 140px;
      vertical-align: middle; }
    @media screen and (max-width: 740px) {
      .liste-liens-utiles .lien {
        width: 100%;
        float: left;
        margin-left: 0;
        margin-right: 0;
        text-align: left; }
        .liste-liens-utiles .lien .image img {
          height: 90px; } }
    .liste-liens-utiles .lien a {
      text-transform: uppercase; }

.contact {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto; }
  .contact:after {
    content: " ";
    display: block;
    clear: both; }
  .contact .adresse-formulaire {
    width: 58.33333%;
    float: left;
    margin-right: 4.16667%; }
    .contact .adresse-formulaire form {
      padding: 10px 20px; }
    @media screen and (max-width: 740px) {
      .contact .adresse-formulaire {
        width: 100%;
        float: right;
        margin-right: 0; } }
  .contact .infos-supplementaires {
    width: 37.5%;
    float: right;
    margin-right: 0;
    text-align: right;
    padding: 0 20px 0 0; }
    @media screen and (max-width: 740px) {
      .contact .infos-supplementaires {
        width: 100%;
        float: right;
        margin-right: 0;
        margin: 10px 0;
        text-align: left; } }
    .contact .infos-supplementaires h1 {
      color: #104263;
      font-size: 110%;
      text-transform: uppercase; }
    .contact .infos-supplementaires h2 {
      color: #5c5c5c;
      font-size: 105%;
      text-transform: uppercase; }
    .contact .infos-supplementaires a {
      color: #104263; }

.push, .footer {
  height: 375px;
  clear: both; }

.footer {
  background: #2e2e2e;
  color: #ffffff;
  padding: 20px 0;
  margin-top: 20px;
  color: #d7d7d7; }
  @media screen and (max-width: 640px) {
    .footer {
      height: auto; } }
  .footer .wrapper {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: 960px;
    width: 100; }
    .footer .wrapper:after {
      content: " ";
      display: block;
      clear: both; }
    @media screen and (max-width: 640px) {
      .footer .wrapper {
        height: auto; } }
    .footer .wrapper .formulaire {
      padding: 20px;
      width: 28.57143%;
      float: left;
      margin-right: 7.14286%; }
      @media screen and (max-width: 640px) {
        .footer .wrapper .formulaire {
          width: 100%;
          float: right;
          margin-right: 0; } }
      .footer .wrapper .formulaire h1 {
        color: #0073b5;
        font-size: 110%;
        margin-bottom: 20px;
        background: none;
        padding: 0;
        display: block; }
    .footer .wrapper .plan-site {
      padding: 20px;
      width: 28.57143%;
      float: left;
      margin-right: 7.14286%; }
      @media screen and (max-width: 640px) {
        .footer .wrapper .plan-site {
          width: 100%;
          float: right;
          margin-right: 0; } }
      .footer .wrapper .plan-site h1 {
        color: #0073b5;
        font-size: 110%;
        margin-bottom: 20px;
        background: none;
        padding: 0;
        display: block; }
      .footer .wrapper .plan-site .general {
        display: inline-block;
        width: 40%;
        vertical-align: top; }
        @media screen and (max-width: 640px) {
          .footer .wrapper .plan-site .general {
            width: 100%; } }
        .footer .wrapper .plan-site .general a {
          color: #d7d7d7;
          display: block;
          margin-bottom: 10px; }
          .footer .wrapper .plan-site .general a:hover {
            text-decoration: underline; }
      .footer .wrapper .plan-site .membres-footer {
        display: inline-block;
        width: 55%;
        vertical-align: top; }
        @media screen and (max-width: 640px) {
          .footer .wrapper .plan-site .membres-footer {
            width: 100%; } }
        .footer .wrapper .plan-site .membres-footer a {
          color: #d7d7d7;
          text-decoration: none;
          display: block;
          margin-bottom: 10px; }
          .footer .wrapper .plan-site .membres-footer a:hover {
            text-decoration: underline; }
    .footer .wrapper .reseaux-sociaux {
      padding: 20px;
      width: 28.57143%;
      float: right;
      margin-right: 0; }
      @media screen and (max-width: 640px) {
        .footer .wrapper .reseaux-sociaux {
          width: 100%;
          float: right;
          margin-right: 0; } }
      .footer .wrapper .reseaux-sociaux h1 {
        color: #0073b5;
        font-size: 110%;
        margin-bottom: 20px;
        background: none;
        padding: 0;
        display: block; }
      .footer .wrapper .reseaux-sociaux .facebook {
        color: #d7d7d7;
        display: block;
        margin-bottom: 20px; }
      .footer .wrapper .reseaux-sociaux .twitter {
        color: #d7d7d7;
        display: block; }

.password-reset label {
  font-weight: bold; }
.password-reset .display-password {
  line-height: 30px;
  font-size: 90%;
  display: inline-block; }
  .password-reset .display-password input {
    display: inline-block;
    margin-right: 10px;
    width: auto; }
.password-reset .error {
  background: #dc143c;
  padding: 10px;
  display: block;
  margin: 0 0 20px 0;
  color: #fff;
  border: 2px solid #b20028;
  text-align: center; }

html, body {
  height: 100%; }

body {
  background: #e8e8e8;
  color: #2e2e2e;
  font-family: 'Lato', sans-serif;
  font-weight: 400; }

a {
  text-decoration: none;
  color: #0a273a; }

.menu a {
  color: #ffffff;
  text-decoration: none; }

.wrapper {
  max-width: 960px;
  margin: 0 auto; }

.clearout {
  clear: both;
  float: none; }

/* TITRES */
.entete-page {
  margin-bottom: 20px; }
  .entete-page h1 {
    font-size: 150%;
    color: #ffffff;
    background: #2e2e2e;
    padding: 15px;
    position: relative;
    display: inline-block;
    margin-top: -30px;
    text-transform: uppercase; }
    .entete-page h1:after {
      content: url("images/extrude-gris.png");
      position: absolute;
      z-index: 100000;
      left: -50px;
      top: 0; }

.top-acceuil .lien-archives {
  text-transform: uppercase;
  display: inline-block;
  padding: 0 20px; }
  @media screen and (max-width: 640px) {
    .top-acceuil .lien-archives {
      margin: 20px 20px 0; } }
.top-acceuil h1 {
  font-size: 150%;
  color: #ffffff;
  background: #0a273a;
  padding: 15px;
  position: relative;
  display: inline-block;
  margin-top: 20px; }
  .top-acceuil h1:after {
    content: url("images/extrude.png");
    position: absolute;
    z-index: 100000;
    left: -50px;
    top: 0; }

/* COLONNES */
.main {
  width: 100%;
  max-width: 960px;
  min-height: 100%;
  height: auto !important;
  margin: 0 auto -300px;
  /* the bottom margin is the negative value of the footer's height */ }
  .main .container {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto; }
    .main .container:after {
      content: " ";
      display: block;
      clear: both; }
    .main .container .wrapper {
      width: 67.74194%;
      float: left;
      margin: 0 auto;
      background: #ffffff;
      box-shadow: 0 5px 5px #2e2e2e;
      min-height: 300px; }
      .main .container .wrapper p {
        padding: 0 20px 20px; }
      @media screen and (max-width: 740px) {
        .main .container .wrapper {
          width: 100%;
          float: right; } }
    .main .container .sidebar {
      width: 29.03226%;
      float: right; }
      @media screen and (max-width: 740px) {
        .main .container .sidebar {
          width: 100%;
          float: right; } }

/*# sourceMappingURL=main.css.map */