/*! Made with Bones: http://themble.com/bones :) */
/******************************************************************
Site Name: Ballast
Author: Najio Tohme
Update 1.1 : Dan d'Auge for responsive parameters

Stylesheet: Main Stylesheet

Here's where the magic happens. Here, you'll see we are calling in
the separate media queries. The base mobile goes outside any query
and is called at the beginning, after that we call the rest
of the styles inside media queries.

Helpful articles on Sass file organization:
http://thesassway.com/advanced/modular-css-naming-conventions

******************************************************************/
/*********************
IMPORTING PARTIALS
These files are needed at the beginning so that we establish all
our mixins, functions, and variables that we'll be using across
the whole project.
*********************/
/* normalize.css 2012-07-07T09:50 UTC - http://github.com/necolas/normalize.css */
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 8/9.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
section,
summary {
  display: block; }
  
nav {
  display: block; 
  background: url('../images/nav.png');  
  }

navr {
	background: none;
}

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
  display: inline-block; }

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0; }

/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none; }

/* ==========================================================================
   Base
   ========================================================================== */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  /*font-family: sans-serif;*/
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/**
 * Remove default margin.
 */
body {
  margin: 0; }

/* ==========================================================================
   Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background: transparent; }

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted; }

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0; }


/* ==========================================================================
   Typography
   ========================================================================== */

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */
h1 {}

h2 {}

/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted; }

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong,
.strong {
  font-weight: bold; }

/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn,
em,
.em {
  font-style: italic; }

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
  opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */ }

/*
 * proper formatting (http://blog.fontdeck.com/post/9037028497/hyphens)
*/
p {
  -webkit-hyphens: auto;
  -epub-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto; }

/*
 * Addresses margins set differently in IE6/7.
 */
pre {
  margin: 0; }

/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em; }

/**
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre-wrap; }

/**
 * Set consistent quote types.
 */
q {
  quotes: "\201C" "\201D" "\2018" "\2019"; }

/**
 * Address inconsistent and variable font size in all browsers.
 */
q:before,
q:after {
  content: '';
  content: none; }

small, .small {
  font-size: 75%; }

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }


/*===== Content Box =====*/
#content{
  margin: auto;
  max-width: 960px;
  padding-top: 18px;
}

/* ==========================================================================
   Header
   ========================================================================== */

#main-header{
  width: 100%;
  height: 430px;
  background-position: center;
  background-size: cover;
}

.big-logo{
  margin: 60px auto;
  display: block;
}

/* ==========================================================================
  Home Page
========================================================================== */

#Rubriques-Menu {
	max-width: 960px;
	margin: auto;
}

.block-image{
  width: 280px;
  height: 257px;
  margin: 28px 20px 0px 0px;
  display: inline-block;
  vertical-align: top;
}

.block-text{
  width: 636px;
  display: inline-block;
}

.entry-category a{
  font-size: 16px;
  text-decoration: none;
  margin: 70px 0 0;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
  color: #0099ac;
}

.entry-category a:hover{
   color: #00B3CA;
}

.entry-title a{

  font-size: 24px;
  margin: 20px 0 0;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
  text-decoration: none;
  color: #000000;
}

.article-header a:hover{
  color: #555555;
  }

.entry-content p{

  font-family: 'Open Sans', Verdana, sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 18px;
  line-height: 32px;
  margin: 10px 0 0;
  color: #7f7f7f;
}

.entry-content p a{
  text-decoration: none;
  color: #0099ac;
  font-weight: 700;
}

.article-footer{

  font-family: 'Open Sans', Verdana, sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 16px;
  margin: 40px 0 30px;
  color: #A0A0A0;
}

/* ==========================================================================
  Page-Navigation (For the WP-PAGENAV Plugin)
========================================================================== */

.navigation{
  font-family: 'Open Sans', Verdana, sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 16px;
  margin: 40px 0 40px;
}

.wp-paginate .current {
 }

.wp-paginate a {
}

.wp-paginate a:hover {
}

/* ==========================================================================
  NAV MENU
========================================================================== */

 .menu-main-container{
    max-width: 960px;
    margin: auto;
    padding: 1px 0px;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

.nav-menu li {
  display: inline-block;
}

.nav-menu li a{
  font-family: 'Montserrat',Helvetica,Verdana,sans-serif;
  font-size: 12px;
  line-height: 20px;
  margin: 5px 100px 0px 0px; /*25px quand il y q toutes les pqges*/
  text-decoration: none;
  text-transform: uppercase;
  color: #dcdcdc;
  display: inline-block;
  text-align:left;
  }

.nav-menu1 li {
  display: inline-block;
}

.nav-menu1 li a {
    font-family: 'Montserrat',Helvetica,Verdana,sans-serif;
    font-size: 12px;
    line-height: 10px;
    margin: 5px 10px 0px 0px;
    text-decoration: none;
    text-transform: uppercase;
    color: #0099ac;
    display: inline-block;
    text-align: left;
}  

.nav-menu1 li a:hover{
  color: #6d6d6d;
  border-bottom: solid 2px;

}

.nav-menu1 li a:focus {
  text-decoration: none;
  color: #6d6d6d;
}

.nav-menu li a:hover{
  color: #ffffff;
  border-bottom: solid 2px;

}

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

/* Lien accueil */
li.menu-item-20 a {
  background: url('../images/logo_mini.png')no-repeat top left;
  text-indent: -9999px;
  width: 50px;
  height: 30px;
  opacity: 0.85;
  filter: alpha(opacity=56); /* For IE8 and earlier */
}

li.menu-item-20 a:hover {
  opacity: 1.0;
  filter: alpha(opacity=100); /* For IE8 and earlier */
  border: none;
}


/* ==========================================================================
  FOOTER
========================================================================== */


.footer{
    max-width: 960px;
    margin: 40px auto;
}

.copyright {
  float: left;
  margin-top: 2px;
  font-family: 'Open Sans', Verdana, sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 16px;
  color: #b5b5b5;
}

.social {
  float: right;
  height: 40px;
}

.social a {
  padding: 0 0 0 15px;
  opacity: 0.86;
  filter: alpha(opacity=56); /* For IE8 and earlier */
}

.social a:hover {
  opacity: 1.0;
  filter: alpha(opacity=100); /* For IE8 and earlier */
}

/* ==========================================================================
  Single Post Page
========================================================================== */

.postpage-header {
  max-width: 960px;
  margin: 90px auto;
}

.postpage-header h1{
  font-size: 36px;
  margin: 40px 0 0;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
  color: #ffffff;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.75);
}

.post-content p{
  font-size: 18px;
  font-family: 'Open Sans', Verdana,sans-serif;
  line-height: 29px;
  text-align: justify;
  text-justify: inter-word;
  opacity: 0.9;
  filter: alpha(opacity=90); /* For IE8 and earlier */
}

.post-content p a{
  text-decoration: none;
  color: #0099ac;
}

.post-content h2{
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
}

.post-content h5{
   font-family: 'Lora';
}

.post-content h6{
   font-family: 'Lora';
   font-size: 14px;
}


.post-content {
   margin-bottom: 60px;
}


blockquote{
 width: 400px;
text-align: right;
float: right;
margin: -20px 0px -20px 20px;
}

blockquote p span{

  font-size: 24px;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: 30px;
}

.alignement{
  margin: -40px 100px 0px;
  color: #000000;
}

.avatar_img{
  border-radius: 50px;
  height:65px;
  width: 65px;
}

.biography{
  margin-top: 40px;
}

/* ==========================================================================
  Contact Page
========================================================================== */

.ballast-title{
  font-size: 58px;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
  margin: 0px 0px 0px -4px;
  color: #000000;
}

.contact-adress p{

  font-family: 'Open Sans', Verdana, sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 20px;
  line-height: 24px;
  margin: 10px 0 0;
  color: #7f7f7f;
}

/* ==========================================================================
  "Ou nous trouver" Page
========================================================================== */

.librairies dl{

  margin: 50px 0 50px;
}

.librairies dt{
  font-size: 16px;
  margin: 70px 0 0;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
  color: #a3a3a3;
}

.librairies dt p{

  font-size: 38px;
  margin: 0px -4px 0;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
  text-decoration: none;
  color: #000000;
}

.nmbr {

  font-size: 30px;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 300;
  color: #c2c2c2;
}

.librairies dd{

  font-family: 'Open Sans', Verdana, sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 24px;
  color: #000000;
  width: 49%;
  display: inline-block;
  margin: 40px 0 50px;
}

.librairies dd p{

  font-family: 'Open Sans', Verdana, sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 20px;
  color: #7f7f7f;

}

.librairies dd p a{

  color: #000000;
}

.librairies dd p a:hover{

  color: #7f7f7f;
}

/* ==========================================================================
  Search Page & Search Form
========================================================================== */

.search-box-text {

  width: 100%;
  height: 120px;
  padding: 0;
  border: none;
  overflow: hidden;
  outline: none;
  background: transparent;

  font-size: 52px;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
  color: #ffffff;
}


.search-box-button {

  display: none;
}

.archive-title{

  font-size: 36px;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
  margin: 40px 0 70px;
  color: #a3a3a3;
}

.archive-title span{

  color: #000000;
}

.no-result{
  font-size: 24px;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
}

/* ==========================================================================
  Error - 404
========================================================================== */

.error{

  font-size: 36px;
  font-family: 'Open Sans', Verdana,sans-serif;
  font-style: normal;
  font-weight: 700;
}

/* ==========================================================================
  Lists
========================================================================== */
/*
 * Addresses margins set differently in IE6/7.
 */
dl,
menu,
ol,
ul {
  /*margin: 1em 0;*/ }

dd {
  margin: 0; }

/*
 * Addresses paddings set differently in IE6/7.
 */
menu {
  padding: 0 0 0 40px; }

ol,
ul {
  padding: 0;
  list-style-type: none; }

/*
 * Corrects list images handled incorrectly in IE7.
 */
nav ul,
nav ol {
  list-style: none;
  list-style-image: none; }

/* ==========================================================================
  Embedded content
========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0;}

/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden; }

img.alignright { float: right; margin: 30px 0 1em 1.5em; }
img.alignleft { float: left; margin: 30px 1.5em 1em 0; }
img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright { float: right; }
.alignleft { float: left; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

/* ==========================================================================
   Figures
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 0; }

/* ==========================================================================
   Forms
   ========================================================================== */
/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 2 */
  margin: 0;
  /* 3 */ }

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal; }

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none; }

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */ }

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default; }

/**
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box; }

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */ }

/* ==========================================================================
   Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0; }

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.image-replacement,
.ir {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden; }

.clearfix, .cf, .comment-respond {
  zoom: 1; }
  .clearfix:before, .clearfix:after, .cf:before, .comment-respond:before, .cf:after, .comment-respond:after {
    content: "";
    display: table; }
  .clearfix:after, .cf:after, .comment-respond:after {
    clear: both; }

/*
use the best ampersand
http://simplebits.com/notebook/2008/08/14/ampersands-2/
*/
span.amp {
  font-family: Baskerville,'Goudy Old Style',Palatino,'Book Antiqua',serif !important;
  font-style: italic; }

/******************************************************************
Site Name:
Author:

Stylesheet: Variables

Here is where we declare all our variables like colors, fonts,
base values, and defaults. We want to make sure this file ONLY
contains variables that way our files don't get all messy.
No one likes a mess.

******************************************************************/
/*********************
COLORS
Need help w/ choosing your colors? Try this site out:
http://0to255.com/
*********************/
/*
Here's a great tutorial on how to
use color variables properly:
http://sachagreif.com/sass-color-variables/
*/
/******************************************************************
Site Name: BALLAST
Author: Najio, Dan d'Auge (for responsives parameters)

Stylesheet: Typography
******************************************************************/



/*********************
FONT FACE (IN YOUR FACE)
*********************/
/*  To embed your own fonts, use this syntax
  and place your fonts inside the
  library/fonts folder. For more information
  on embedding fonts, go to:
  http://www.fontsquirrel.com/
  Be sure to remove the comment brackets.
*/
/*  @font-face {
      font-family: 'Font Name';
      src: url('library/fonts/font-name.eot');
      src: url('library/fonts/font-name.eot?#iefix') format('embedded-opentype'),
             url('library/fonts/font-name.woff') format('woff'),
             url('library/fonts/font-name.ttf') format('truetype'),
             url('library/fonts/font-name.svg#font-name') format('svg');
      font-weight: normal;
      font-style: normal;
  }
*/
/*
The following is based of Typebase:
https://github.com/devinhunt/typebase.css
I've edited it a bit, but it's a nice starting point.
*/
/*
 i imported this one in the functions file so bones would look sweet.
 don't forget to remove it for your site.
*/
/*
some nice typographical defaults
more here: http://www.newnet-soft.com/blog/csstypography
*/
p {
 /* -ms-word-break: break-all;
  -ms-word-wrap: break-all;*/
  word-break: break-word;
  word-break: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
  -webkit-hyphenate-before: 2;
  -webkit-hyphenate-after: 3;
  hyphenate-lines: 3;
  -webkit-font-feature-settings: "liga", "dlig";
 /*  -moz-font-feature-settings: "liga=1, dlig=1";*/
  -ms-font-feature-settings: "liga", "dlig";
  -o-font-feature-settings: "liga", "dlig";
  font-feature-settings: "liga", "dlig"; }

/*********************
PRINT STYLESHEET
Feel free to customize this. Remember to add things that won't make
sense to print at the bottom. Things like nav, ads, and forms should
be set to display none.
*********************/
@media print {
  /******************************************************************
  Site Name:
  Author:
  
  Stylesheet: Print Stylesheet
  
  This is the print stylesheet. There's probably not a lot
  of reasons to edit this stylesheet. If you want to
  though, go for it.
  
  ******************************************************************/
  * {
    background: transparent !important;
    color: black !important;
    text-shadow: none !important;
    filter: none !important;
    -ms-filter: none !important; }

  a, a:visited {
    /*color: #444 !important;
    text-decoration: underline;*/ }
    a:after, a:visited:after {
      content: " (" attr(href) ")"; }
    a abbr[title]:after, a:visited abbr[title]:after {
      content: " (" attr(title) ")"; }

  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: ""; }

  pre, blockquote {
    border: 1px solid #999;
    page-break-inside: avoid; }

  thead {
    display: table-header-group; }

  tr, img {
    page-break-inside: avoid; }

  img {
    max-width: 100% !important; }

  @page {
    margin: 0.5cm; }
  p, h2, h3 {
    orphans: 3;
    widows: 3; }

  h2,
  h3 {
    page-break-after: avoid; }

  .sidebar,
  .page-navigation,
  .wp-prev-next,
  .respond-form,
  nav {
    display: none; } }
    
/*********************
Responsive paramètres
*********************/    

@media screen and (max-width: 980px) {

#content{
  margin: auto;
  max-width: 970px;
  padding-top: 18px;
}

.menu-main-container{
    max-width: 970px;
	 margin-left: 20px;
    padding: 1px 0px;
    text-align: center;
    }

#Rubriques-Menu {
	max-width: 970px;
	margin-left: 20px;
}	
	
.nav-menu li a{
  font-family: 'Montserrat',Helvetica,Verdana,sans-serif;
  font-size: 12px;
  line-height: 20px;
  margin: 5px 65px 0px 0px; /*25px quand il y q toutes les pqges*/
  text-decoration: none;
  text-transform: uppercase;
  color: #dcdcdc;
  display: inline-block;
  text-align:center;
  }

.nav-menu1 li a {
    font-size: 11px;
    text-align: center;
}

.postpage-header h1 {
    font-size: 36px;
    margin: 40px 0px 0px 20px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #FFF;
}

.block-image{
  width: 280px;
  height: 257px;
  margin: 18px 20px 0px 20px;
  display: inline-block;
  vertical-align: top;
}

.block-text{
  width: 440px;
  display: inline-block;
}

.entry-title a {
    line-height: 28px;
}

.entry-content p {
    line-height: 22px;
    margin: 0px;
}

.article-footer {
    margin: 20px 0px 30px;
}

.post-content {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

blockquote {
    margin: -20px 0px -20px 20px;
}

img.alignleft {
    margin: 10px 20px 0px 0px;
}

.postpage-header {
    max-width: 910px;
    margin: 80px auto;
}

dl, menu, ol, ul {
    max-width: 910px;
}

.wp-caption alignnone {
    max-width: 910px;
}

.wp-caption-dt {
    max-width: 910px;
    height: auto;
}

dd.wp-caption-dd {
    max-width: 910px;
    height: auto;
}

img {
    max-width: 100%;
    height: auto;
}

.avatar_img {
    margin-left: 20px;
}

.biography {
    margin-top: 40px;
    padding-left: 20px;
    padding-right: 20px;
}

.copyright {
    padding-left: 20px;
}

.social {
    padding-right: 20px;
}
	
}

@media screen and (max-width: 800px) {

.menu-main-container{
    max-width: 790px;
	 margin-left: 20px;
    padding: 1px 0px;
    text-align: center;
    }

#Rubriques-Menu {
	max-width: 790px;
	margin-left: 20px;
}	

.nav-menu li a{
  margin: 5px 55px 0px 0px; /*25px quand il y q toutes les pqges*/
  }

.block-text {
    width: 410px;
    display: inline-block;
}

.postpage-header {
    max-width: 725px;
    margin: 80px auto;
}

dl, menu, ol, ul {
    max-width: 725px;
}

.wp-caption alignnone {
    max-width: 725px;
}

.wp-caption-dt {
    max-width: 725px;
    height: auto;
}

dd.wp-caption-dd {
    max-width: 725px;
    height: auto;
}

img {
    max-width: 100%;
    height: auto;
}


}
	
@media screen and (max-width: 768px) {

#content{
  margin: auto;
  max-width: 740px;
  padding-top: 18px;
}

#main-header{
  width: 100%;
  height: 420px;
  background-position: center;
  background-size: cover;
}

#Rubriques-Menu {
	max-width: 740px;
	margin-left: 20px;
}	
	 .menu-main-container{
    max-width: 745px;
	 margin-left: 20px;
    padding: 1px 0px;
    text-align: center;
    }

.nav-menu li a{
  font-family: 'Montserrat',Helvetica,Verdana,sans-serif;
  font-size: 12px;
  line-height: 20px;
  margin: 5px 40px 0px 0px; /*25px quand il y q toutes les pqges*/
  text-decoration: none;
  text-transform: uppercase;
  color: #dcdcdc;
  display: inline-block;
  text-align:center;
  }

.postpage-header h1 {
    font-size: 34px;
    margin: 40px 0px 0px 20px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #FFF;
}

.block-image{
  width: 260px;
  height: 239px;
  margin: 20px 20px 0px 20px;
  display: inline-block;
  vertical-align: top;
}

.block-text{
  width: 340px;
  display: inline-block;
}

.entry-title a {
    line-height: 30px;
}

.entry-content p {
    font-size: 16px;
    line-height: 20px;
    margin: 0px;
}

.article-footer {
    margin: 20px 0px 20px;
}

blockquote {
    width: 380px;
    margin: -20px 0px -20px 20px;
}

.post-content {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

.postpage-header {
    max-width: 700px;
    margin: 80px auto;
}

dl, menu, ol, ul {
    max-width: 700px;
}

.wp-caption alignnone {
    max-width: 700px;
}

.wp-caption-dt {
    max-width: 700px;
    height: auto;
}

dd.wp-caption-dd {
    max-width: 700px;
    height: auto;
}

img {
    max-width: 100%;
    height: auto;
}


.avatar_img {
    margin-left: 20px;
}
    
}	

@media screen and (max-width: 668px) {

.postpage-header {
    max-width: 610px;
    margin: 80px auto;
}

dl, menu, ol, ul {
    max-width: 610px;
}

.wp-caption alignnone {
    max-width: 610px;
}

.wp-caption-dt {
    max-width: 610px;
    height: auto;
}

dd.wp-caption-dd {
    max-width: 610px;
    height: auto;
}

}    

@media screen and (max-width: 650px) {

#content{
  margin: auto;
  max-width: 640px;
  padding-top: 18px;
}

#main-header{
  width: 100%;
  height: 400px;
  background-position: center;
  background-size: cover;
}

#Rubriques-Menu {
	max-width: 640px;
	margin-left: 20px;
}
	
 .menu-main-container{
    max-width: 640px;
    margin-left: 20px;
    padding: 1px 0px;
    text-align: center;
    }

.nav-menu li a{
  font-family: 'Montserrat',Helvetica,Verdana,sans-serif;
  font-size: 12px;
  line-height: 20px;
  margin: 5px 25px 0px 0px; /*25px quand il y q toutes les pqges*/
  text-decoration: none;
  text-transform: uppercase;
  color: #dcdcdc;
  display: inline-block;
  text-align:center;
  }

.postpage-header h1 {
    font-size: 34px;
    margin: 40px 0px 0px 20px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #FFF;
}

.block-image{
  width: 220px;
  height: 202px;
  margin: 20px 20px 0px 15px;
  display: inline-block;
  vertical-align: top;
}

.block-text{
  width: 320px;
  display: inline-block;
}

.entry-title a {
    line-height: 28px;
}

.entry-content p {
    font-size: 16px;
    line-height: 20px;
    margin: 0px;
}

.article-footer {
    font-size: 16px;
    margin: 20px 0px 20px;
}

.post-content {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

img.alignleft {
    float: left;
    margin: 10px 20px 0px 0px;
    max-width: 220px;
    height: auto;
}

blockquote {
    max-width: 325px;
    text-align: right;
    float: right;
    margin: -20px 0px -20px 20px;
}

.postpage-header {
    max-width: 565px;
    margin: 80px auto;
}

dl, menu, ol, ul {
    max-width: 565px;
}

.wp-caption alignnone {
    max-width: 565px;
}

.wp-caption-dt {
    max-width: 565px;
    height: auto;
}

dd.wp-caption-dd {
    max-width: 565px;
    height: auto;
}

img {
    max-width: 100%;
    height: auto;
}

.footer {
    max-width: 650px;
    margin-top: 10px;
}

.biography {
    margin-top: 40px;
    padding-left: 20px;
    padding-right: 20px;
}

.wp-paginate {
    margin-left: 20px;
}

.copyright {
	 float: none; 
	 margin-top: 0px;
    font-size: 16px;
	 width: 100%;
	 text-align: center;
	 display: block;
	 margin-left: 0px;
}

.avatar_img {
    margin-left: 20px;
}

.social {
    float: none;
	 text-align: center;
	 width: 100%;
	 display: block;
	 margin-left: 0px;
	 margin-top: 10px;
}
  
}

@media screen and (max-width: 600px) {

.big-logo {
    margin: 60px auto;
    display: block;
    width: 90%;
}

.postpage-header h1 {
    font-size: 32px;
    margin: 40px 0px 0px 20px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #FFF;
}

#content{
  margin: auto;
  max-width: 590px;
  padding-top: 18px;
}

#main-header{
  width: 100%;
  height: 380px;
  background-position: center;
  background-size: cover;
}

#Rubriques-Menu {
	max-width: 590px;
	margin-left: 20px;
}
	
 .menu-main-container{
    max-width: 590px;
    margin-left: 20px;
    padding: 1px 0px;
    text-align: center;
    }

.nav-menu li a{
  font-family: 'Montserrat',Helvetica,Verdana,sans-serif;
  font-size: 11px;
  line-height: 20px;
  margin: 5px 10px 0px 0px; /*25px quand il y q toutes les pqges*/
  text-decoration: none;
  text-transform: uppercase;
  color: #dcdcdc;
  display: inline-block;
  text-align:center;
  }

.entry-category {
	margin-top: 5px;
	margin-bottom: 10px;
}

.entry-content p {
    font-size: 16px;
    line-height: 20px;
    margin: 0px;
}

.block-image{
  width: 200px;
  height: 184px;
  margin: 10px 20px 0px 20px;
  display: inline-block;
  vertical-align: top;
}

.block-text{
  max-width: 280px;
  display: inline-block;
}

.entry-title a {
    font-size: 22px;
    margin: 20px 0px 0px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    text-decoration: none;
    color: #000;
}

.post-content {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

blockquote {
    max-width: 300px;
    text-align: right;
    float: right;
    margin: -20px 0px -20px 20px;
}

blockquote p span {
    font-size: 22px;
    line-height: 26px;
}

img.alignleft {
    float: left;
    margin: 10px 20px 0px 0px;
    max-width: 200px;
    height: auto;
}

.postpage-header {
    max-width: 505px;
    margin: 80px auto;
}

dl, menu, ol, ul {
    max-width: 505px;
}

.wp-caption alignnone {
    max-width: 505px;
}

.wp-caption-dt {
    max-width: 505px;
    height: auto;
}

dd.wp-caption-dd {
    max-width: 505px;
    height: auto;
}

img {
    max-width: 100%;
    height: auto;
}

.article-footer {
    font-size: 15px;
    margin: 0px;
    max-width: 100%;
    margin-top: 10px;
    padding-left: 0px;
    padding-right: 0px;
}

.biography {
    margin-top: 40px;
    padding-left: 20px;
    padding-right: 20px;
}

.wp-paginate {
    margin-left: 20px;
}

.footer {
    max-width: 600px;
    margin-top: 10px;
}

.copyright {
	 float: none; 
	 margin-top: 0px;
    font-size: 14px;
	 width: 100%;
	 text-align: center;
	 display: block;
	 margin-left: 0px;
}

.social {
    float: none;
	 text-align: center;
	 width: 100%;
	 display: block;
	 margin-left: 0px;
	 margin-top: 10px;
}
  
}

@media screen and (max-width: 480px) {

.big-logo {
    margin: 20px auto;
    display: block;
    width: 75%;
}

/* Lien Recherche */
li.menu-item-21 a {
  background: url('../images/search-icon2.png')no-repeat left;
  text-indent: -9999px;
  width: 15px;
  height: 15px;
  opacity: 0.85;
  filter: alpha(opacity=56); /* For IE8 and earlier */
}

li.menu-item-21 a:hover {
  opacity: 1.0;
  filter: alpha(opacity=100); /* For IE8 and earlier */
  border: none;
}

#content{
  margin: auto;
  max-width: 480px;
  padding-top: 18px;
}

#main-header{
  width: 100%;
  height: 350px;
  background-position: center;
  background-size: cover;
}

 .menu-main-container{
    max-width: 480px;
    margin-left: 20px;
    padding: 1px 0px;
    text-align: center;
    }

#Rubriques-Menu {
	max-width: 480px;
	margin-left: 20px;
}

.nav-menu li a{
  font-family: 'Montserrat',Helvetica,Verdana,sans-serif;
  font-size: 10px;
  line-height: 20px;
  margin: 5px 5px 0px 0px; /*25px quand il y q toutes les pqges*/
  text-decoration: none;
  text-transform: uppercase;
  color: #dcdcdc;
  display: inline-block;
  text-align:center;
  }

.block-image{
  width: 90%;
  height: auto;
  margin: 20px 20px 0px 20px;
  vertical-align: top;
}

.block-text{
  max-width: 440px;
  margin-left: 20px;
  margin-right: 20px;
  display: inline-block;
}

.entry-title a {
    font-size: 20px;
    margin: 0px 0px 0px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    text-decoration: none;
    color: #000;
}

.entry-content p {
    font-size: 16px;
    line-height: 20px;
    margin: 0px 0px 0px;
}

.post-content {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

blockquote {
    max-width: 100%;
    text-align: right;
    float: none;
    margin: 0px;
    display: block;
}

blockquote p span {
    font-size: 20px;
    line-height: 24px;
}

img.alignleft {
    float: left;
    margin: 10px 20px 0px 0px;
    max-width: 150px;
    height: auto;
}

.postpage-header {
    max-width: 330px;
    margin: 90px auto;
}

.postpage-header h1 {
    font-size: 30px;
    margin: 20px 0px 0px 20px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #FFF;
    line-height:32px;
}

dl, menu, ol, ul {
    max-width: 330px;
}

.wp-caption alignnone {
    max-width: 330px;
}

.wp-caption-dt {
    max-width: 330px;
    height: auto;
}

dd.wp-caption-dd {
    max-width: 330px;
    height: auto;
}

img {
    max-width: 100%;
    height: auto;
}

.article-footer {
    font-size: 14px;
    margin: 0px;
    max-width: 100%;
    padding-left: 0px;
    padding-right: 20px;
}

.wp-paginate {
    margin-left: 20px;
}

.footer {
    max-width: 480px;
    margin-top: 10px;
}

.copyright {
	 margin-top: 0px;
    font-size: 14px;
	 width: 100%;
	 text-align: center;
	 display: block;
	 margin-left: 0px;
}

.social {
    float: none;
	 text-align: center;
	 width: 100%;
	 display: block;
	 margin-left: 0px;
	 margin-top: 10px;
}

}

@media screen and (max-width: 320px) {

#content{
  margin: auto;
  max-width: 310px;
  padding-top: 18px;
}

#main-header{
  width: 100%;
  height: 310px;
  background-position: center;
  background-size: cover;
}

li.menu-item-20 a {
  margin-left: -10px;
}

#Rubriques-Menu {
	max-width: 310px;
	margin-left: 20px;
}

.nav-menu li a{
  font-family: 'Montserrat',Helvetica,Verdana,sans-serif;
  font-size: 9px;
  line-height: 20px;
  margin: 5px 5px 0px 0px; /*25px quand il y q toutes les pqges*/
  text-decoration: none;
  text-transform: uppercase;
  color: #dcdcdc;
  display: inline-block;
  text-align:center;
  }

.block-image{
  width: 85%;
  height: auto;
  margin: 20px 20px 0px 20px;
  vertical-align: top;
}

.block-text{
  max-width: 85%;
  margin-left: 20px;
  display: inline-block;
}

.entry-title a {
    font-size: 18px;
    margin: 20px 0px 0px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    text-decoration: none;
    color: #000;
}

.postpage-header h1 {
    font-size: 28px;
    margin: -30px 0px 0px 20px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #FFF;
    line-height:30px;
}

.entry-content p {
    font-size: 14px;
    line-height: 18px;
    margin: 0px 0px 0px;
}

blockquote p span {
    font-size: 18px;
    line-height: 22px;
}

img.alignleft {
    float: left;
    margin: 10px 20px 0px 0px;
    max-width: 100%;
    height: auto;
}

.post-content p {
    font-size: 16px;
    font-family: "Open Sans",Verdana,sans-serif;
    line-height: 20px;
    text-align: justify;
    opacity: 0.9;
}

.postpage-header {
    max-width: 280px;
    margin: 70px auto;
}

dl, menu, ol, ul {
    max-width: 280px;
}

.wp-caption alignnone {
    max-width: 280px;
}

.wp-caption-dt {
    max-width: 280px;
    height: auto;
}

dd.wp-caption-dd {
    max-width: 280px;
    height: auto;
}

.article-footer {
    font-size: 13px;
    margin: 10px 0px 10px;
    }

.footer {
    max-width: 320px;
    margin-top: 10px;
}

}

@media screen and (max-width: 240px) {

#content{
  margin: auto;
  max-width: 230px;
  padding-top: 18px;
}

#main-header{
  width: 100%;
  height: 280px;
  background-position: center;
  background-size: cover;
}

 .menu-main-container{
    max-width: 230px;
    margin-left: 10px;
    padding: 1px 0px;
    text-align: center;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.75);
    }

.nav-menu li a{
  font-family: 'Montserrat',Helvetica,Verdana,sans-serif;
  font-size: 8px;
  line-height: 20px;
  margin: 5px 5px 0px 0px; /*25px quand il y q toutes les pqges*/
  text-decoration: none;
  text-transform: uppercase;
  color: #dcdcdc;
  display: inline-block;
  text-align:center;
  }

#Rubriques-Menu {
	max-width: 230px;
	margin-left: 10px;
}

.postpage-header h1 {
    font-size: 24px;
    line-height: 28px;
}

.block-image{
  width: 80%;
  height: auto;
  margin: 20px 20px 0px 20px;
  vertical-align: top;
}

.block-text{
  max-width: 80%;
  display: inline-block;
  margin-left: 20px;
}

.entry-title a {
    font-size: 14px;
    margin: 20px 0px 0px;
    font-family: "Open Sans",Verdana,sans-serif;
    font-style: normal;
    font-weight: 700;
    text-decoration: none;
    color: #000;
}

.postpage-header h1 {
    font-size: 20px;
    line-height:24px;
}

.entry-content p {
    font-size: 12px;
    line-height: 14px;
    margin: 0px 0px 0px;
}

blockquote p span {
    font-size: 16px;
    line-height: 20px;
}

.article-footer {
    font-size: 14px;
    margin: 10px 0px 10px;
    }

.postpage-header {
    max-width: 220px;
    margin: 70px auto;
}

dl, menu, ol, ul {
    max-width: 200px;
}

.wp-caption alignnone {
    max-width: 200px;
}

.wp-caption-dt {
    max-width: 200px;
    height: auto;
}

dd.wp-caption-dd {
    max-width: 200px;
    height: auto;
}    
    
.footer {
    max-width: 240px;
    margin-top: 10px;
}
    
}