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

audio, canvas, video {
  display: inline-block;
  *display: inline;
  *zoom: 1; }

audio:not([controls]) {
  display: none;
  height: 0; }

[hidden] {
  display: none; }

html {
  background: #fff;
  color: #000;
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

html, button, input, select, textarea {
  font-family: sans-serif; }

body {
  margin: 0; }

a:focus {
  outline: thin dotted; }

a:active, a:hover {
  outline: 0; }

h1 {
  font-size: 2em;
  margin: 0.67em 0; }

h2 {
  font-size: 1.5em;
  margin: 0.83em 0; }

h3 {
  font-size: 1.17em;
  margin: 1em 0; }

h4 {
  font-size: 1em;
  margin: 1.33em 0; }

h5 {
  font-size: 0.83em;
  margin: 1.67em 0; }

h6 {
  font-size: 0.67em;
  margin: 2.33em 0; }

abbr[title] {
  border-bottom: 1px dotted; }

b, strong {
  font-weight: bold; }

blockquote {
  margin: 1em 40px; }

dfn {
  font-style: italic; }

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

mark {
  background: #ff0;
  color: #000; }

p, pre {
  margin: 1em 0; }

code, kbd, pre, samp {
  font-family: monospace, serif;
  _font-family: 'courier new', monospace;
  font-size: 1em; }

pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word; }

q {
  quotes: none; }

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

small {
  font-size: 80%; }

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

dl, menu, ol, ul {
  margin: 1em 0; }

dd {
  margin: 0 0 0 40px; }

menu, ol, ul {
  padding: 0 0 0 40px; }

nav ul, nav ol {
  list-style: none;
  list-style-image: none; }

img {
  border: 0;
  -ms-interpolation-mode: bicubic; }

svg:not(:root) {
  overflow: hidden; }

figure {
  margin: 0; }

form {
  margin: 0; }

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

legend {
  border: 0;
  padding: 0;
  white-space: normal;
  *margin-left: -7px; }

button, input, select, textarea {
  font-size: 100%;
  margin: 0;
  vertical-align: baseline;
  *vertical-align: middle; }

button, input {
  line-height: normal; }

button, select {
  text-transform: none; }

button, html input[type="button"], input[type="reset"], input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
  *overflow: visible; }

button[disabled], html input[disabled] {
  cursor: default; }

input[type="checkbox"], input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
  *height: 13px;
  *width: 13px; }

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0; }

textarea {
  overflow: auto;
  vertical-align: top; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 10px; }

.row {
  width: 100%;
  overflow: hidden;
  clear: both;
  position: relative; }

[class*="col"] {
  margin: 0;
  margin-right: 4.43217%;
  *margin-right: 4.38831%;
  float: left; }

[class*="col"] .row {
  margin: 0; }

.row .last {
  margin-right: 0; }

[class*="col"] img {
  max-width: 100%;
  height: auto;
  width: auto;
  box-sizing: border-box;
  vertical-align: middle; }

.col-1 {
  width: 7.1714%;
  *width: 7.12754%; }

.col-2 {
  width: 18.77498%;
  *width: 18.73112%; }

.col-3 {
  width: 30.37855%;
  *width: 30.33469%; }

.col-4 {
  width: 41.98213%;
  *width: 41.93827%; }

.col-5 {
  width: 53.5857%;
  *width: 53.54184%; }

.col-6 {
  width: 65.18928%;
  *width: 65.14542%; }

.col-7 {
  width: 76.79285%;
  *width: 76.74899%; }

.col-8 {
  width: 88.39643%;
  *width: 88.35257%; }

.col-9 {
  width: 100%;
  *width: 99.95614%; }

.offset-1 {
  margin-left: 11.60357%;
  *margin-left: 11.55971%; }

.offset-2 {
  margin-left: 23.20715%;
  *margin-left: 23.16329%; }

.offset-3 {
  margin-left: 34.81072%;
  *margin-left: 34.76686%; }

.offset-4 {
  margin-left: 46.4143%;
  *margin-left: 46.37044%; }

.offset-5 {
  margin-left: 58.01787%;
  *margin-left: 57.97401%; }

.offset-6 {
  margin-left: 69.62145%;
  *margin-left: 69.57759%; }

.offset-7 {
  margin-left: 81.22502%;
  *margin-left: 81.18116%; }

.offset-8 {
  margin-left: 92.8286%;
  *margin-left: 92.78474%; }

@media handheld, only screen and (max-width: 767px) {
  .row {
    width: 100%;
    min-width: 0;
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 0px;
    padding-right: 0px; }
  .row [class*="col"] {
    width: auto;
    float: none;
    margin: 4.43217% 0; }
  .row [class*="offset"] {
    margin-left: 0; } }

@media screen and (max-width: 950px) {
  .lt-ie9 .row {
    width: 100%;
    min-width: 0;
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 0px;
    padding-right: 0px; }
  .lt-ie9 .row [class*="col"] {
    width: auto;
    float: none;
    margin: 4.43217% 0; }
  .lt-ie9 .row [class*="offset"] {
    margin-left: 0; } }

/*
  ## Colors
  ````
  <div style="text-align:center;">
    <div class="row">
      <div class="col-2" style="background:#000000;color:#ffffff;"><br>black<br><br></div>
      <div class="col-2" style="background:#2a2a2a;color:#ffffff;"><br>mine<br><br></div>
      <div class="col-2" style="background:#666666;color:#ffffff;"><br>gray<br><br></div>
      <div class="col-2" style="background:#959595;"><br>silver<br><br></div>
      <div class="col-2" style="background:#e6e6e6;"><br>dust<br><br></div>
      <div class="col-2 last" style="background:#ffffff;"><br>white<br><br></div>
    </div>
    <div class="row" style="color:#ffffff;">
      <div class="col-2" style="background:#80c35f;"><br>mantis<br><br></div>
      <div class="col-2" style="background:#6f965c;"><br>highland<br><br></div>
      <div class="col-2" style="background:#4dbb17;"><br>apple<br><br></div>
    </div>
  </div>

  ````
 */
@font-face {
  font-family: 'Proxima Nova Regular';
  src: url('../fonts/ProximaNova-Regular.eot?v2');
  src: url('../fonts/ProximaNova-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-Regular.woff?v2') format('woff'), url('../fonts/ProximaNova-Regular.ttf?v2') format('truetype'), url('../fonts/ProximaNova-Regular.svg#museo') format('svg');
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Proxima Nova Italic';
  src: url('../fonts/ProximaNova-RegularIt.eot?v2');
  src: url('../fonts/ProximaNova-RegularIt.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-RegularIt.woff?v2') format('woff'), url('../fonts/ProximaNova-RegularIt.ttf?v2') format('truetype'), url('../fonts/ProximaNova-RegularIt.svg#museo') format('svg');
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Proxima Nova Semibold';
  src: url('../fonts/ProximaNova-Semibold.eot?v2');
  src: url('../fonts/ProximaNova-Semibold.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-Semibold.woff?v2') format('woff'), url('../fonts/ProximaNova-Semibold.ttf?v2') format('truetype'), url('../fonts/ProximaNova-Semibold.svg#museo') format('svg');
  font-weight: normal;
  font-style: normal; }

/*
  ## Fonts
  ````
  <p style="font-family:'Proxima Nova Regular';">The quick brown fox jumps over the lazy dog.</p>
  <p style="font-family:'Proxima Nova Italic';">The quick brown fox jumps over the lazy dog.</p>
  <p style="font-family:'Proxima Nova Semibold';">The quick brown fox jumps over the lazy dog.</p>
  ````
*/
/*
  # Text components
  -----------------
*/
body {
  font-size: 16px;
  line-height: 1.4em;
  color: #2a2a2a;
  font-family: 'Proxima Nova Regular', Helvetica Neue, Helvetica, Arial, sans-serif; }
  @media only screen and (max-width: 767px) {
    body {
      font-size: 13px; } }

/*
  ## Titles
  ````
  <h1>My title number 1</h1>
  <h2>My title number 2</h2>
  <h3>My title number 3</h3>
  <h4>My title number 4</h4>
  <h5>My title number 5</h5>
  <h6>My title number 6</h6>
  ````
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  line-height: 1.1em;
  margin: 0.4em 0; }

h1 {
  font-size: 48px; }
  @media only screen and (max-width: 768px) {
    h1 {
      font-size: 40px; } }
  @media only screen and (max-width: 767px) {
    h1 {
      margin-top: 30px; } }
  @media only screen and (max-width: 480px) {
    h1 {
      font-size: 30px; } }

h2 {
  font-size: 32px; }
  @media only screen and (max-width: 768px) {
    h2 {
      font-size: 28px; } }
  @media only screen and (max-width: 480px) {
    h2 {
      font-size: 22px; } }

h3 {
  font-size: 24px; }
  @media only screen and (max-width: 768px) {
    h3 {
      font-size: 21px; } }
  @media only screen and (max-width: 480px) {
    h3 {
      font-size: 18px; } }

h4 {
  font-size: 21px; }
  @media only screen and (max-width: 768px) {
    h4 {
      font-size: 18px; } }
  @media only screen and (max-width: 480px) {
    h4 {
      font-size: 16px; } }

h5 {
  color: #959595;
  margin-top: -10px; }

/*
  ## Paragraphs
  ````
  <p class="lead">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullus est igitur cuiusquam dies natalis. Huius ego nunc auctoritatem sequens idem faciam. Diodorus, eius auditor, adiungit ad honestatem vacuitatem doloris. Si est nihil nisi corpus, summa erunt illa: valitudo, vacuitas doloris, pulchritudo, cetera.
  </p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullus est igitur cuiusquam dies natalis. Huius ego nunc auctoritatem sequens idem faciam. Diodorus, eius auditor, adiungit ad honestatem vacuitatem doloris. Si est nihil nisi corpus, summa erunt illa: valitudo, vacuitas doloris, pulchritudo, cetera.
  </p>
  ````
*/
.lead {
  font-family: 'Proxima Nova Italic', Helvetica Neue, Helvetica, Arial, sans-serif;
  font-size: 20px;
  line-height: 1.6em; }

/*
  ## Links
  ````
  <a href="#">My link</a>
  ````
*/
a {
  text-decoration: underline;
  transition: color 0.3s;
  -webkit-transition: color 0.3s;
  -moz-transition: color 0.3s;
  color: #000000; }
  a small, a p, a h1, a h2, a h3, a h4, a h5, a h6 {
    transition: color 0.3s;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s; }
  a:hover {
    color: #80c35f; }
    a:hover small, a:hover p, a:hover h1, a:hover h2, a:hover h3, a:hover h4, a:hover h5, a:hover h6 {
      color: #80c35f !important; }

.no-underline {
  text-decoration: none; }

.text-underline {
  text-decoration: underline; }

.publications img {
  padding: 10px 0; }

/*
  ## Box link
  ````
  <a href="/etude.html" class="box-link">
    <h2>Etude</h2>
    <p>Une structure de taille humaine</p>
  </a>
  ````
*/
.box-link {
  text-decoration: none;
  margin: 30px 0;
  display: block; }
  .box-link h1, .box-link h2, .box-link h3, .box-link h4, .box-link h5, .box-link h6 {
    text-decoration: underline;
    margin: 0;
    line-height: 1em; }
  .box-link p {
    margin: 5px 0; }
  .box-link:hover h1, .box-link:hover h2, .box-link:hover h3, .box-link:hover h4, .box-link:hover h5, .box-link:hover h6 {
    text-decoration: none; }

/*
  ## Italic
  ````
  <em>Lorem ipsum dolor sit amet, consectetur adipiscing elit</em>
  ````
*/
em, i {
  font-family: 'Proxima Nova Italic', Helvetica Neue, Helvetica, Arial, sans-serif;
  font-style: normal; }

/*
  ## Small
  ````
  <small>Lorem ipsum dolor sit amet, consectetur adipiscing elit</small>
  ````
*/
small {
  font-size: 14px; }

/*
  ## Bold
  ````
  <strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong>
  ````
*/
strong, b {
  font-family: 'Proxima Nova Semibold', Helvetica Neue, Helvetica, Arial, sans-serif;
  font-weight: normal; }

/*
  ## Text colors
  ````
  <div class="text-mantis">
    <h2>Text-mantis</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  </div>
  <div class="text-apple">
    <h2>Text-apple</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  </div>
  <div class="text-highland">
    <h2>Text-highland</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  </div>
  <div class="text-black">
    <h2>Text-black</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  </div>
  <div class="text-gray">
    <h2>Text-gray</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  </div>
  <div class="text-silver">
    <h2>Text-silver</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  </div>
  ````
*/
.text-mantis {
  color: #80c35f !important; }
  .text-mantis h1, .text-mantis h2, .text-mantis h3, .text-mantis h4, .text-mantis h5, .text-mantis h6 {
    color: #80c35f; }

.text-apple {
  color: #4dbb17 !important; }
  .text-apple h1, .text-apple h2, .text-apple h3, .text-apple h4, .text-apple h5, .text-apple h6 {
    color: #4dbb17; }

.text-highland {
  color: #6f965c !important; }
  .text-highland h1, .text-highland h2, .text-highland h3, .text-highland h4, .text-highland h5, .text-highland h6 {
    color: #6f965c; }

.text-black {
  color: #000000 !important; }
  .text-black h1, .text-black h2, .text-black h3, .text-black h4, .text-black h5, .text-black h6 {
    color: #000000; }

.text-gray {
  color: #666666 !important; }
  .text-gray h1, .text-gray h2, .text-gray h3, .text-gray h4, .text-gray h5, .text-gray h6 {
    color: #666666; }

.text-silver {
  color: #959595 !important; }
  .text-silver h1, .text-silver h2, .text-silver h3, .text-silver h4, .text-silver h5, .text-silver h6 {
    color: #959595; }

/*
  ## Text alignement
  ````
  <p class="text-right">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Itaque vides, quo modo loquantur, nova verba fingunt, deserunt usitata. Itaque rursus eadem ratione, qua sum paulo ante usus, haerebitis. Hic ambiguo ludimur. Aeque enim contingit omnibus fidibus, ut incontentae sint. Quod quidem nobis non saepe contingit.
  </p>
  <p class="text-center">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Itaque vides, quo modo loquantur, nova verba fingunt, deserunt usitata. Itaque rursus eadem ratione, qua sum paulo ante usus, haerebitis. Hic ambiguo ludimur. Aeque enim contingit omnibus fidibus, ut incontentae sint. Quod quidem nobis non saepe contingit.
  </p>
  <p class="text-uppercase">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Itaque vides, quo modo loquantur, nova verba fingunt, deserunt usitata. Itaque rursus eadem ratione, qua sum paulo ante usus, haerebitis. Hic ambiguo ludimur. Aeque enim contingit omnibus fidibus, ut incontentae sint. Quod quidem nobis non saepe contingit.
  </p>
  ````
*/
.text-right {
  text-align: right; }

.text-center {
  text-align: center; }

.text-uppercase {
  text-transform: uppercase; }

/*
  ## Button
  ````
  <a class="btn btn-default" href="#">Default button</a>
  ````
*/
.btn {
  display: inline-block;
  padding: 15px 30px;
  text-decoration: none; }

.btn-default {
  color: #ffffff;
  background: #2a2a2a;
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s; }
  .btn-default:hover {
    color: #ffffff;
    background: #80c35f; }
  .btn-default:active {
    color: #ffffff;
    background: #6f965c; }

body {
  margin: 0;
  padding: 0; }

.main-container {
  padding-top: 20px;
  padding-bottom: 20px; }
  @media only screen and (max-width: 767px) {
    .main-container {
      padding-top: 0px;
      padding-bottom: 0px; } }

/*
  ## Separators
  ````
  <hr>
  <hr class="simple-separator">
  <hr class="tiny-separator">
  ````
*/
hr {
  border: none;
  height: 1px;
  background: #e6e6e6;
  width: 105%;
  position: relative;
  left: -2.5%;
  margin: 30px 0; }

.simple-separator {
  width: 100%;
  left: 0;
  margin: 20px 0 30px 0; }
  @media only screen and (max-width: 767px) {
    .simple-separator {
      display: none; } }

.tiny-separator {
  width: 10%; }

.lt-ie9 .tiny-separator {
  width: 105%; }

/*
  ## Alignement
  ````
  <div class="pull-right"></div>
  <div class="pull-left"></div>
  ````
*/
.pull-right {
  float: right; }

.pull-left {
  float: left; }

/*
  ## Spacer
  ````
  <div class="spacer"></div>
  ````
*/
.spacer {
  height: 60px; }
  @media only screen and (max-width: 767px) {
    .spacer {
      display: none; } }

.spacer-header {
  height: 88px; }

/*
  ## Isolated
  ````
  <div class="isolated"></div>
  ````
*/
.isolated {
  margin: 20px 0; }
  @media only screen and (max-width: 767px) {
    .isolated {
      margin: 0; } }

/*
  ## No overflow
  ````
  <div class="no-overflow"></div>
  ````
*/
.no-overflow {
  overflow: visible; }

/*
  ## Clear
  ````
  <div class="clear"></div>
  ````
*/
.clear {
  clear: both; }

/*
  ## Foggy
  ````
  <div class="foggy"></div>
  ````
*/
.foggy {
  background-color: #f3f3f3; }

/*
  ## Utility
  ````
  <div class="hidden-mobile"></div>
  <div class="hidden-desktop"></div>
  ````
*/
@media only screen and (max-width: 767px) {
  .hidden-mobile {
    display: none; } }

@media only screen and (min-width: 768px) {
  .hidden-desktop {
    display: none; } }
@media only screen and (max-width: 767px) {
  .hidden-desktop {
    display: block; } }

@media only print {
  .hidden-print {
    display: none; } }

header {
  min-height: 662px;
  background-size: 1600px 662px;
  background-position: bottom center;
  background-repeat: no-repeat;
  behavior: url('/themes/rodondi-joye/js/vendor/backgroundsize.min.htc');
  -ms-behavior: url('/themes/rodondi-joye/js/vendor/backgroundsize.min.htc'); }
  header .container {
    position: relative; }
  body.etude header {
    min-height: 600px;
    background-size: 1600px 600px; }
  @media only screen and (max-width: 768px) {
    header {
      background-size: 767px 317px;
      min-height: 317px; }
      body.etude header {
        background-size: 767px 317px;
        min-height: 317px; } }
  @media only screen and (max-width: 767px) {
    header {
      background-size: 480px 198px;
      min-height: 290px;
      padding-top: 0px;
      background-position: bottom center; }
      body.etude header {
        background-size: 480px 198px;
        min-height: 290px; }
      header.header-minimal {
        padding-top: 0; }
      header.foggy {
        background-color: #ffffff; }
      header .pull-left, header .pull-right {
        float: none; }
      header nav {
        padding-top: 5px; }
      header nav a {
        margin: 0px 20px 0 0; } }

.header-minimal {
  min-height: 0; }
  @media only screen and (max-width: 767px) {
    .header-minimal div[class*="col"], .header-minimal ul {
      margin: 0; } }

img.brand {
  margin-top: 40px; }
  @media only screen and (max-width: 767px) {
    img.brand {
      width: 80%;
      max-width: 110px;
      margin-top: 20px; } }

@media only screen and (max-width: 767px) {
  .brand-wrapper {
    float: none; } }

.sticky-header {
  display: none;
  width: 100%;
  position: fixed;
  top: 0px;
  left: 0;
  padding-top: 15px;
  padding-bottom: 5px;
  background: #ffffff; }
  .sticky-header img {
    margin-left: 25px; }
  .sticky-header nav {
    margin-right: 10px; }
  .sticky-header ul {
    margin-top: 10px; }

/*
  ## Navigation
  ````
  <nav>
    <ul>
      <li><a href="#" class="active">Etude</a></li>
      <li><a href="#">Avocats</a></li>
      <li><a href="#">Activites</a></li>
      <li><a href="#">Contact</a></li>
    </ul>
  </nav>
  ````
*/
nav ul {
  padding: 0; }
nav li {
  display: inline; }
nav a {
  text-decoration: none;
  margin-left: 30px; }
nav a.active {
  color: #6f965c; }
nav a:hover {
  color: #666666; }

.row nav.pull-right.isolated {
  margin-right: 10px; }

/*
  ## Lang navigation
  ````
  <header>
    <nav class="lang-nav pull-right">
      <ul>
        <li><a href="#" class="active">FR</a></li>
        <li><a href="#">EN</a></li>
      </ul>
    </nav>
  </header>
  ````
*/
.lang-nav {
  position: absolute;
  margin: 0;
  top: -17px;
  right: 10px; }
  .lang-nav a {
    margin: 0;
    display: block;
    float: left;
    width: 25px;
    height: 20px;
    line-height: 20px;
    font-size: 12px;
    color: #ffffff;
    background: #666666;
    text-align: center;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s; }
    .lang-nav a.active {
      background: #959595;
      color: #ffffff; }
    .lang-nav a:hover {
      background: #2a2a2a;
      color: #ffffff; }

/*
  ## Breadcrumb
  ````
  <div class="breadcrumb">
    <a href="http://rodondi.dev:8102/" title="Accueil">Accueil</a>
    <span class="breadcrumb-separator">-&gt;</span> 
    <a href="http://rodondi.dev:8102/avocats.html" title="Avocats">Avocats</a>
    <span class="breadcrumb-separator">-&gt;</span>
    <span class="breadcrumb-current">Charles Joye</span>
  </div>
  ````
*/
@media only screen and (max-width: 767px) {
  .breadcrumb {
    display: none; } }

.breadcrumb a {
  color: #666666; }
  .breadcrumb a:hover {
    color: #80c35f;
    text-decoration: underline; }

.side-nav {
  line-height: 1.8em; }
  .side-nav a.active {
    color: #80c35f;
    text-decoration: none; }
  @media only screen and (max-width: 767px) {
    .side-nav {
      display: none; } }

/*
  ## Footer
  ````
  <footer>
    <div class="container">
      <div class="row">
        <div class="col-9 text-gray">
          C 2013 Rodondi Joye avocats
          <span class="pull-right">Realisation : <a class="no-underline" href="http://antistatique.net">Antistatique</a></span>
        </div>
      </div>
    </div>
  </footer>
  ````
*/
footer {
  background: #e6e6e6;
  height: 40px;
  line-height: 40px;
  font-size: 14px; }
  @media only screen and (max-width: 767px) {
    footer {
      height: auto; }
      footer .col-9 {
        margin: 0 !important; } }
  @media only screen and (max-width: 480px) {
    footer {
      margin-top: 30px;
      padding: 10px 0;
      line-height: 2em;
      text-align: center; }
      footer .pull-right {
        float: none; }
        footer .pull-right:before {
          content: '\A';
          white-space: pre; } }

.lawyer-item {
  width: 33.33%;
  float: left;
  position: relative; }
  .lawyer-item img {
    transition: opacity 0.3s;
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s; }
  .lawyer-item:hover img {
    opacity: 0.8; }
  .lawyer-item:hover .lawyer-item-content {
    opacity: 1; }
  @media only screen and (max-width: 1140px) {
    .lawyer-item {
      width: 50%; } }
  @media only screen and (max-width: 480px) {
    .lawyer-item {
      width: 100%; } }

.lawyer-disable img, .lawyer-disable:hover img {
  opacity: 0.4; }

@media only screen and (max-width: 1140px) {
  .lawyer-item-container {
    padding: 0; } }

a:hover .lawyer-item h1, a:hover .lawyer-item h2, a:hover .lawyer-item h3, a:hover .lawyer-item h4, a:hover .lawyer-item h5, a:hover .lawyer-item h6, a:hover .lawyer-item p {
  color: #2a2a2a !important; }
a:hover .lawyer-item p.text-underline {
  color: #80c35f !important; }

.lawyer-item-content {
  opacity: 0;
  position: absolute;
  left: 5%;
  bottom: 5%;
  width: 74%;
  background: #ffffff;
  padding: 10px 8%;
  transition: opacity 0.3s;
  -webkit-transition: opacity 0.3s;
  -moz-transition: opacity 0.3s; }
  @media only screen and (max-width: 768px) {
    .lawyer-item-content {
      opacity: 1; } }

.lt-ie9 .lawyer-item-content {
  display: none; }
.lt-ie9 .lawyer-item:hover .lawyer-item-content {
  display: block; }

.blog-item {
  text-decoration: none; }
  .blog-item:hover {
    color: #2a2a2a; }
    .blog-item:hover small, .blog-item:hover p {
      color: #2a2a2a !important; }
    .blog-item:hover h1, .blog-item:hover h2, .blog-item:hover h3, .blog-item:hover h4, .blog-item:hover h5, .blog-item:hover h6 {
      color: #80c35f; }