/*
  Fluid Baseline Grid v1.0.0
  Designed & Built by Josh Hopkins and 40 Horse, http://40horse.com  
  Licensed under Unlicense, http://unlicense.org/
  
  Base stylesheet with CSS normalization, typographic baseline grid and progressive responsiveness
*/

/* HTML5 DECLARATIONS */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, dialog {display: block}
audio[controls],canvas,video {display: inline-block; *display: inline; zoom: 1}

/* BASE */
html {height: 100%; font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%} /* Force scrollbar in non-IE and Remove iOS text size adjust without disabling user zoom */
body {margin: 0; min-height: 100%; -webkit-font-smoothing:antialiased; font-smoothing:antialiased; text-rendering:optimizeLegibility;} /* Improve default text rendering, handling of kerning pairs and ligatures */











/* LISTS */
dl dd {margin-left: 1.5em}
dt {font-family:Futura, "Century Gothic", AppleGothic, sans-serif}



/* ABBREVIATION */
abbr[title], dfn[title] {border-bottom: 1px dotted #333; cursor: help}



/* OTHERS */
strong, b, dt { font-weight: bold}
dfn {font-style: italic}
var, address {font-style: normal}
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline} /* Position 'sub' and 'sup' without affecting line-height */
sup {top: -0.5em} /* Move superscripted text up */
sub {bottom: -0.25em} /* Move subscripted text down */
span.amp{font-family:Adobe Caslon Pro,Baskerville,"Goudy Old Style","Palatino","Palatino Linotype","Book Antiqua",Georgia,"Times New Roman",Times,serif;font-style:italic;font-size:110%;line-height:0;position:relative;vertical-align:baseline} /* Best available ampersand */

/* MICRO CLEARFIX HACK */
.cf:before, .cf:after {content:"";display:table} /* For modern browsers */
.cf:after {clear:both}
.cf {zoom:1} /* For IE 6/7 (trigger hasLayout) */

/* DEFAULT MOBILE STYLE */
body {width: 100%; margin: 0 auto} /* Center page without wrapper */
/* column grid */
.g1,.g2,.g3{display:block; position: relative; margin-left: 1%; margin-right: 1%}
/* 1 column grid */
.g1,.g2,.g3{width:98.0%}


/**** PIV Mobile ****/
#piv {
  position:relative;
  background:url(../images/bg-piv.png) left 62px repeat-x;
  box-shadow:0 1px 1px #cfcfcf;
}

#piv_mo a {
  position:absolute;
  top:-30px;
  left:0px;
  display:block;
  width:200px;
  height:80px;
  background:url(../images/MSPwsig.gif) left top no-repeat;
  text-indent:-9999px;
  outline:none;
}

#piv_btnMenu {
  position:absolute;
  top:6px;
  right:81px;
  display:block;
  width:50px;
  height:56px;
  background:url(../images/btn-piv-menu.png) left top no-repeat;
  text-indent:-9999px;
  outline:none;
}
#piv_btnMenu:hover, #piv_btnMenu:focus {background-position:left -65px;}
.menu #piv_btnMenu {background-position:left -144px;}


#piv_btnRecherche {
  position:absolute;
  top:6px;
  right:22px;
  display:block;
  width:50px;
  height:56px;
  background:url(../images/btn-piv-search.png) left top no-repeat;
  text-indent:-9999px;
  outline:none;
}
#piv_btnRecherche:hover, #piv_btnRecherche:focus {background-position:left -65px;}
.recherche #piv_btnRecherche {background-position:left -144px;}

.piv_menu, .piv_recherche {display:none;}
.menu .piv_menu, .recherche .piv_recherche {display:block;}

.piv_menu {}
.piv_menu ul {list-style:none;background:#003399; padding-left:0;}
.piv_menu li {border-top:1px solid #fff;}
.piv_menu li:first-child {border-top:none;}
.piv_menu a {display:block;padding:9px 15px; font-size:1.125em;color:#fff;text-decoration:none;}
.piv_menu a:hover, .piv_menu a:focus, .piv_menu a:active {background:#54504a;}
.piv_menu .align-right   {float: auto;  cursor: default; color: #039;  height: auto; font-size: 0.7em;}
.piv_menu .align-right a   {font-size: 1.5em;}

.piv_recherche {background:#003399;padding:10px 5% 18px;}
.piv_recherche label {display:none;font-size:1.125em;color:#fff; }
.piv_recherche input {display: inline;padding: 5px;margin: 0px 0px 5px;border: #d3d3d3 2px solid; height:34px; width:93%;}
.piv_recherche button {display:block;width:93%;padding:5px;margin:0 0 5px;background:#787878;color:#fff;border:none;border-radius:3px;}



@media (min-width: 700px) {
  .piv_recherche {display:inline-block;float: right;  padding: 15px 18px 0px 55px;  text-align: right;  width: 100%;}
  input[type="search"] {border:#d3d3d3 solid 2px;  display: inline-block;  padding-right: 30px;  width: auto;   }
  .piv_recherche button { background: url(../images/btn_search.jpg) no-repeat; border-radius: 0;  display: inline-block;   height: 21px;  margin-left: 5px; vertical-align: top;  width: 21px; }
  .piv_recherche input { border: #F1B105 1px solid;  height: 24px; vertical-align: top; width:auto;}
  .piv_recherche .fa-search { display:none;}
  .piv_menu .align-right a   {font-size: 1.1em;}
}


@media (min-width: 700px) and (max-width: 992px) {
    .piv_menu{
        width: 100%;
        margin: 30px 0 0 0!important;
    }
}


/* media Queries

FOLDING FLUID GRID
< 767px      - 1-Column Fluid Grid
768px - 1023px  - 2-Column Fluid Grid
> 1024px      - 3-Column Fluid Grid
Change widths as necessary
------------------------------------------- */

/* MOBILE PORTRAIT */
@media only screen and (min-width: 320px) {
    #piv_mo a {
        background-size: 95%;
        top:-20px;
    }
}

/* MOBILE LANDSCAPE */
@media only screen and (min-width: 480px) {
  body {
    
  }
}

/* SMALL TABLET */
@media only screen and (min-width: 700px) {
  /**** PIV Tout ce qui est plus grand que Mobile ****/

  #piv {
    padding:15px 15px 5px 15px;
    background:none;
    box-shadow:none;
  }

  #piv_mo a {
    top:0px;
    left:0px;
    width:200px;
    height:80px;
    background:url(../images/MSPwsig.gif) left -top no-repeat;
  }
  #piv_btnMenu, #piv_btnRecherche, .recherche .piv_recherche {display:none;}
  
  .piv_menu {display:block;margin:0 17px 0 192px;}
  .piv_menu ul {padding:0 0 0 30px;}
  .piv_menu li {border-top:none;float:left;}
  .piv_menu a {display:block;padding:2px 8px;font-size:0.8em; line-height:1em;color:#fff;text-decoration:none;}

  .piv_recherche {
    background:none;
  }
    .piv_menu .align-right   {float: right;}


}

/* TABLET/NETBOOK */
@media only screen and (min-width: 768px) { 
  body {
    
  }
  
  /* COLUMN GRID */
  .g1,.g2,.g3 {display:inline; float: left}
  
  /* 2 COLUMN GRID */
  .g1 {width:48.0%}
  .g2 {width:48.0%}
  .g3 {width:98.0%}
}

/* LANDSCAPE TABLET/NETBOOK/LAPTOP */
@media only screen and (min-width: 1024px) { 
  body {

  }
  
  /* 3 COLUMN GRID */
  .g1 {width:31.333%}
  .g2 {width:64.667%;}
  .g3 {width:98.0%}
}

@media only screen and (min-width: 1280px) { 
/* DESKTOP */
  body {}
  
}

/* WIDESCREEN */
/* Increased body size for legibility */
/*@media only screen and (min-width: 1400px) { 
  body {font-size:116.75%; max-width:1440px} 
}*/


/* PRINT */
@media print {
  * {background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important} /* Black prints faster */
  a, a:visited {color: #444 !important; text-decoration: underline}
  a[href]:after {content: " (" attr(href) ")"}
  abbr[title]:after {content: " (" attr(title) ")"}
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {content: ""}  /* Don't print links for images, javascript or internal links */
  pre, blockquote {border: 1px solid #999; page-break-inside: avoid; }
  thead {display: table-header-group; } /* Repeat header row at top of each printed page */
  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}
}





