/*
KNACSS.com @author : Raphael Goetter, Alsacreations
Licence CC-BY http://creativecommons.org/licenses/by/3.0/fr/
*/


/* ----------------------------- */
/* summary */
/* ----------------------------- */
/*
1- colors
2- reset
3- layout and modules
4- header
5- sidebar
6- footer
7- forms
8- main
9- iefix
10- print
11- mobile
*/

/* ----------------------------- */
/* ==colors */
/* ----------------------------- */


/* ----------------------------- */
/* ==reset */
/* ----------------------------- */

/* base font-size corresponds to 12px */
html {font-size: 75%;height:100%;


}
body {
    background-color: #c5c5c5;
    color: #000;
    font-family: "Century Gothic", arial, helvetica, sans-serif;
    line-height: 1.4; /* adapt to your design */
    height:100%;
   /* background-image: url('../images/accueil_background.jpg');
    background:url(../images/bg-high.jpg) 0 0 repeat;*/
    
      background: url(../images/bg-high.jpg) repeat; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
   /*   background-size:   cover;                     <------ 
    background-repeat: no-repeat;*/
          /* optionally, center the image */
}

/* HTML5 tags */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {display: block;}

/* soft reset */
html, body, blockquote, ul, ol, form {margin: 0; padding: 0;}
ul, ol {padding-left: 2em}
.mreset {margin: 0;}
.preset {padding: 0;}

/* font-sizing for content */
p, li, td, th, textarea {font-size: 1.4em;}
li li, li p, td p, th p, li h1, li h2, li h3, li h4, li h5, li h6, button, input, select {font-size: 100%;}
h1, .h1-like {font-size: 2.4em; } /* 24 pixels */
h2, .h2-like {font-size: 2.0em; } /* 20 pixels */
h3, .h3-like {font-size: 1.8em; } /* 18 pixels */
h4, .h4-like {font-size: 1.6em; } /* 16 pixels */
h5, .h5-like {font-size: 1.4em; } /* 14 pixels */

/* alternate font-sizing */
.smallest {font-size: .7em;}
.smaller {font-size: .8em;}
.small {font-size: .9em;}
.big {font-size: 1.07em;} /* 15 pixels */
.bigger {font-size: 1.14em;} /* 16 pixels */
.biggest {font-size: 1.28em;} /* 18 pixels */
.biggester {font-size: 2.3em;margin: 10px 0;text-align: center;} /* 18 pixels */
.biggest_recrutement {font-size: 2em; margin: 10px 0; text-align:center;}
/* avoid collapsing margins */
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, p:first-child {
    margin-top: 0;
}

/* avoid last paragraph bottom margin */
p:last-child {margin-bottom: 0;}

/* styling headings */
h1, .h1-like {margin: 0 0 10px 0}
h2, .h2-like {}
h3, .h3-like {}
h4, .h4-like {}
h5, .h5-like {}
h6, .h6-like {}

/* max values */
img, table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video {
    max-width: 100%; height: auto;
}

/* you shall not pass */
textarea, table, td, th, code, pre, samp, div, p {
    word-wrap: break-word;
}
code, pre, samp {
    white-space: pre-wrap;
}

/* links */
a img {border: 0;}

/* gradients */
/* http://www.colorzilla.com/gradient-editor/ */


/* ----------------------------- */
/* ==layout and modules */
/* ----------------------------- */

/* switching box model for all elements */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; 
}

/* float layout */
/* ----------- */

/* block that can contains several .mod , can contains floats */
.line {}
/* module, contains floats */
.mod {
    padding: 1em;
}

/* generaly inside .mod, can contains .item */
.items {}

/* fluid, contains floats, can be placed next to a float */
.item {
    overflow: hidden;
}

/* table layout */
/* ------------------ */
.row {
    display: table;
    table-layout: fixed;
    width: 100%;
}
.row > *, .col {
    display: table-cell;
    padding: 1em;
}

/* 1em gutter between elements if parent is .gut */
.line.gut > * + * {
    margin-left: 1em;
}
.row.gut > * + * {
    border-left: 1em solid #fff; /* must be color of parent background */
}

/* blocks that needs to be placed under floats */
.clear, .line, .row {
    clear: both;
}

/* blocks that can contains floats */
.clearfix:after, .line:after, .mod:after {
    content: "";
    display: table;
    clear: both;
}

/* alignments (blocks and inline) */
/* ----------------------------- */

/* left and 1em gutter */
.left {
    float: left; margin-right: 1em
}

/* right and 1em gutter */
.right {
    float: right; margin-left: 1em
}
.center {margin: auto;}
.txtleft {text-align: left;}
.txtright {text-align: right;}
.txtcenter {text-align: center;}

/* juste inline-block */
.inbl {display: inline-block;}

/* blocks widths (percentage and pixels) */
.w10 {width: 10%}
.w20 {width: 20%}
.w25 {width: 25%}
.w30 {width: 30%}
.w33 {width: 33.33%}
.w40 {width: 40%}
.w50 {width: 50%}
.w60 {width: 60%}
.w70 {width: 70%}
.w80 {width: 80%}
.w90 {width: 90%}
.w100 {width: 100%}

.w50p {width: 50px}
.w100p {width: 100px}
.w150p {width: 150px}
.w200p {width: 200px}
.w240p {width: 240px}
.w300p {width: 300px}
.w400p {width: 400px}
.w500p {width: 500px}
.w600p {width: 600px}
.w675p {width: 675px}
.w685p {width: 685px}
.w700p {width: 700px}
.w720p {width: 720px}
.w800p {width: 800px}
.w960p {width: 960px}
.mw960p {max-width: 960px}

/* margins */
.mt1 {margin-top: 1em}
.mt2 {margin-top: 2em}
.mr1 {margin-right: 1em}
.mr2 {margin-right: 2em}
.mb1 {margin-bottom: 1em}
.mb2 {margin-bottom: 2em}
.ml1 {margin-left: 1em}
.ml2 {margin-left: 2em}

/* paddings */
.pt1 {padding-top: 1em}
.pt2 {padding-top: 2em}
.pr1 {padding-right: 1em}
.pr2 {padding-right: 2em}
.pb1 {padding-bottom: 1em}
.pb2 {padding-bottom: 2em}
.pl1 {padding-left: 1em}
.pl2 {padding-left: 2em}

/* hiding content */
.visually-hidden { /* always hidden for screens */
    position: absolute; left:-7000px; text-indent:-7000px; overflow: hidden
}
.desktop-hidden {display: none;} /* hidden on desktop */
.mobile-hidden {} /* hidden on mobile */
.tablet-hidden {} /* hidden on tablets */
.phone-hidden {} /* hidden on smartphones */

/* ----------------------------- */
/* ==header */
/* ----------------------------- */
header {
  width: 100%;
  height: 136px;
 
 
  position:fixed;
  z-index: 20;
}

header nav {
  margin-left: auto;
  margin-right: auto;
  width: 960px;
  height: 148px;
 

 
}


header men {
  margin-left: auto;
  margin-right: auto;
  width: 960px;
  height: 36px;
  
}
/* ----------------------------- */
/* ==sidebar */
/* ----------------------------- */

/* ----------------------------- */
/* ==footer */
/* ----------------------------- */
footer {
  position:absolute;	
  margin-left: auto;
  margin-right: auto;
  margin-top: 30px;
  width: 100%;
  background-color: #000;
  color:#fff;
  word-spacing: 1.4em;
  padding:5px 0 0 0;
  height:25px;
  bottom:0;
}

.wrapno{ word-spacing: 0;}

footer a{
  color:#fff;
  text-decoration: none;
  font-family: Times, sans-serif;
	}

@font-face {font-family:"Lato Light Italic";src:url("../font/Lato-LightItalic.eot?") format("eot"),url("../font/Lato-LightItalic.woff") format("woff"),url("../font/Lato-LightItalic.ttf") format("truetype"),url("../font/Lato-LightItalic.svg#Lato-LightItalic") format("svg");font-weight:normal;font-style:normal;}

@font-face {font-family:"Lato Regular";src:url("../font/Lato-Regular.eot?") format("eot"),url("../font/Lato-Regular.woff") format("woff"),url("../font/Lato-Regular.ttf") format("truetype"),url("../font/Lato-Regular.svg#Lato-Regular") format("svg");font-weight:normal;font-style:normal;}

@font-face {font-family:"Lato Light";src:url("../font/Lato-Light.eot?") format("eot"),url("../font/Lato-Light.woff") format("woff"),url("../font/Lato-Light.ttf") format("truetype"),url("../font/Lato-Light.svg#Lato-Light") format("svg");font-weight:normal;font-style:normal;}

@font-face {font-family:"Lato Bold";src:url("../font/Lato-Bold.eot?") format("eot"),url("../font/Lato-Bold.woff") format("woff"),url("../font/Lato-Bold.ttf") format("truetype"),url("../font/Lato-Bold.svg#Lato-Bold") format("svg");font-weight:normal;font-style:normal;}

@font-face {font-family:"Lato Italic";src:url("../font/Lato-Italic.eot?") format("eot"),url("../font/Lato-Italic.woff") format("woff"),url("../font/Lato-Italic.ttf") format("truetype"),url("../font/Lato-Italic.svg#Lato-Italic") format("svg");font-weight:normal;font-style:normal;}

.gill{font-family: "Cabin", "Gill Sans", "Gill Sans MT", Calibri, sans-serif;}
.latoli{font-family: "Lato Light Italic", Calibri, sans-serif;}
.lator{font-family: "Lato Regular", Calibri, sans-serif;}
.latol{font-family: "Lato Light", Calibri, sans-serif;}
.latob{font-family: "Lato Bold", Calibri, sans-serif;}
.latoi{font-family: "Lato Italic", Calibri, sans-serif;}
.times{font-family: Times, sans-serif;}
/* ----------------------------- */
/* ==forms */
/* ----------------------------- */

form, fieldset {
  border: none;
}
input, button, select {
  vertical-align: middle; /* @bugfix alignment */
}

/* ----------------------------- */
/* ==main */
/* ----------------------------- */

/* ----------------------------- */
/* ==iefix */
/* ----------------------------- */

/* haslayout for IE6/IE7 */
.ie7 .clearfix,.ie7 .line, .ie7 .mod, .ie7 .row, .ie7 .col {
    zoom: 1;
}

/* inline-block and table-cell for IE6/IE7 */
/* warning : .col needs width on IE6/IE7 */
.ie7 .btn, .ie7 .col, .ie7 .inbl {
    display: inline;
    zoom: 1;
}

/* box-sizing for IE6/IE7 */
/* https://github.com/Schepp/box-sizing-polyfill
.ie7 * {
behavior: url(/js/boxsizing.htc);
}
*/

/* ----------------------------- */
/* ==print */
/* ----------------------------- */

/* quick print reset */
@media print {
    p, blockquote {orphans: 2; widows: 2;}
    blockquote, ul, ol {page-break-inside: avoid;}
    h1, h2, h3, caption { page-break-after: avoid;}
}

/* ----------------------------- */
/* ==mobile */
/* ----------------------------- */

/* quick smartphone reset */
@media (max-width: 640px) {
    .phone-hidden {display: none}
    .mod, .col {
     display: block !important;
     margin: 0 !important;
     border: 0 !important;
     float: none !important;
     width: auto !important;
    }
    [class*="mw"], [class*="w9"], [class*="w8"],
    [class*="w7"], [class*="w6"], [class*="w5"],
    [class*="w4"], [class*="w3"] {
        width: auto;
    }
}