
.sr-only,
.visually-hidden {
    position: absolute !important;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    padding:0 !important;
    border:0 !important;
    height: 1px !important;
    width: 1px !important;
    overflow: hidden;
}



// structure
html { background: none; }
body {
  background: none;
  font-size: $font-size-base-px;
  font-family: $font-family-sans-serif;
  color: $texte;
}

.container {max-width: 1225px;}

div#page { max-width: 1225px; background: none; }

div#member,
div#new_member,
div#accessibility,
div#contact,
div#info,
div#help,
div#rub_agenda,
div#rub_annonce,
div#rub_consultation,
div#rub_service,
div#gauche + div#rub_service,
div#centre, div#profile {
   float: none; width: 100%;
}

.btn-back { clear: both;
  a { display: inline-block; font-family: $font-family-sans-serif; margin: 1em 0 0; border: 1px solid $blue; background: #FFF url("img/chevron-back.png") no-repeat 5px center; border-radius: 5px; color: $blue; padding: 0.5em 1.5em; height: auto; font-weight: normal; font-size: 1em; text-decoration: none;
    &:hover, &:focus { background-color: $blue; color: #FFF; }
  }
}

// COLONNE
div#gauche { float: none; width: 100%;
  div#side {
    li { display: inline-block;}
  }
}

// HEADER
  div#header { background: url('img/bg-header.png') no-repeat top left; }
  div#top { position: relative; padding-top: 1.2em;

    .logo-rf { display: inline-block; width: auto; margin: 0 1.2em 0 2em; vertical-align: middle; }
    h1 { display: inline-block; padding: 0; margin: 0; font-size: 100%; font-family: $font-family-sans-serif-light; line-height: 1; text-transform: none; ; vertical-align: middle;
      a { color: $blue; text-decoration: none; }

      .tt1 { font-size: em(26, $font-size-base); }
      .tt2 { display: block; font-family: $font-family-sans-serif-bold; font-size: em(44, $font-size-base); }
    }
  }
  div#toplinks { background: none; }

//= fin HEADER

// MAIN
  div#main-content { width: 815px; margin: 45px auto; }

  // lien retour en haut
  .nav-up { clear: both; display: block; border-top: 1px solid $gray-lighter; margin-top: 2em; margin-bottom: 1em; text-align: right; padding-top: 1.5em;
    a { position: relative; color: $texte; text-decoration: none; background: url('img/ico-arrow-top.png') no-repeat center right; padding-right: 25px;
      span { text-decoration: underline; }

      &:hover, &:focus { color: $blue; }
    }
  }


//= fin MAIN

// FOOTER
  div#footer-wrapper { min-height: auto; background: none; color: #FFF; text-align: center;
    a { color: #FFF; }
  }

  div#footer { max-width: 1225px; padding-top: 10px; padding-bottom: 10px; background: $blue;
    p { margin-bottom: 0; }
  }
//= fin FOOTER


// RESPONSIVE

@media (max-width: 992px) {}

@media (max-width: 768px) {

  div#rub_consultation h2,
  .form-content--title,
  div#rub_service h2,
  div#rub_annonce h2,
  div#rub_agenda h2,
  div#profile h2,
  div#services-2nd h3,
  div#member h2,
  div#help h2,
  div#info h2,
  div#accessibility h2,
  div#contact h2,
  div#gauche h3,
  div.gru-content div#rub_service h3,
  div#centre h3 {
    &.title_form { font-size: em(16, $font-size-base); }
  }

  div[id^="rub"] form.quixote.formulaire {
    .title { font-size: em(16, $font-size-base); }
    .title label { font-size: 16px; }
  }


  div#top { font-size: 0.7em;
    h1 { width: 70%; vertical-align: top; }
    .logo-rf { max-width: 20%; vertical-align: top; }
  }

  div#steps { position: static; width: 100%; font-size: 0.6em;  }

  div#main-content {
    width: auto;
    padding: 0 1em;
  }

  div[id^="rub"] div.buttons div {
    &.SubmitWidget { font-size: 0.8em; }
    &.previous-button { margin-right: .5em; }
  }

}

@media (max-width: 480px) {

  div#top { font-size: 0.5em; }
  div#header { height: auto; padding-bottom: 1em; }

  div#rub_service div.dataview {
    span.label,
    .value { display: block; width: 100%; text-align: left; }
  }

}

//= fin RESPONSIVE



