/* RESET MEYER */

*/

*
{
	margin: 0;
	padding: 0;
}

:focus {
outline: 0;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* -------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------- */


/* BASE : Règle d'équivalence em/px */
html {
	font-size: 62.5%;
}

body {
	/*background-color: #454545;*/
	background-color: white;
	color: #231F20;
	font-family: helvetica, arial, sans-serif;/* "Century Gothic",  */
	font-size: 1.4em; /* equivaut à 14px / ligne à supprimer si l'on veut que 1.1em=11px 2.4em=24px etc... */
	line-height: 1.5; /* Adapté selon design */
}

/* TYPO */
p,
ul,
ol,
dl,
blockquote,
pre,
td,
th,
label,
textarea,
caption,
details, 
figure, 
hgroup {
	font-size: 1em; /* equiv 14px */
	line-height: 1.2;
}
h1, .h1-like {
	font-size: 1.8571em; /* equiv 26px */
	font-weight: normal;
	line-height: 1.6154em;
}
h2, .h2-like {
	font-size: 1.7143em; /* equiv 24px */
	font-weight: normal;
	line-height: 1.75em;
}
h3, .h3-like {
	font-size: 1.5714em; /* equiv 22px */
	font-weight: normal;
	line-height: 1.909em;
}
h4, .h4-like {
	font-size: 1.4286em; /* equiv 20px */
	font-weight: normal;
	line-height: 1.05em;
}
h5, .h5-like {
	font-size: 1.2857em; /* equiv 18px */
	font-weight: normal;
	line-height: 1.1667em;
}
h6, .h6-like {
	font-size: 1.1429em; /* equiv 16px */
	font-weight: normal;
	line-height: 1.3125em;
}

/* TYPO ALTERNATIVE */
.smaller {
	font-size: .7143em; /* equiv 10px */
}
.small {
	font-size: .8571em; /* equiv 12px */
}
.big {
	font-size: 1.1429em; /* equiv 16px */
}
.bigger {
	font-size: 1.2857em; /* equiv 18px */
}
.biggest {
	font-size: 1.4286em; /* equiv 20px */
}

/* SOFT RESET */
html,
body,
textarea,
figure,
label {
	margin: 0;
	padding: 0;
}
ul,
ol {
	padding-left: 2em;
}
code, 
pre,
samp {
	white-space: pre-wrap;
	font-family: consolas, 'DejaVu Sans Mono', courier, monospace;
}
code { line-height: 1em; }
table { margin-bottom: 1.5em; }


/* -------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------- */

/* On évite les marges hautes impactant celles de leur parent (fusion de marges) afin d'obtenir des alignements verticaux parfaits (exemple).
Et on supprime également la marge de certains éléments imbriqués tels que listes et paragraphes. */
p:first-child,
ul:first-child,
ol:first-child,
dl:first-child,
blockquote:first-child,
pre:first-child,
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
	margin-top: 0;
}

/* Éviter les marges sur les éléments imbriqués */
li p,
li ul,
li ol {
	margin-top: 0;
	margin-bottom: 0;
}

/* max-width: 100% impose une largeur maximale de celle du parent. Idéal pour empêcher les blocs et images de déborder. */
img, table, td, blockquote, code, pre, textarea, input, video {
	max-width: 100%;
}

/* IMAGES */
/* On traite l'alignement particulier des images ainsi que les bordures non souhaitées dans les liens */
img {
	height: auto;
	vertical-align: middle;
}
a img { 
	border: 0; 
}


/* -------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------- */

/* SCRIPTS */
/* Sécurité pour être sûr que les script JS ne s'affichent pas */
body > script {display: none !important;}


/* -------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------- */

/* TRANSFORMATION DES DIV EN TABLE */
/* Div transformé en ligne */
/* ------------------ */
.row {
	display: table;
	table-layout: fixed;
	width: 100%;
}

/* Div transformé en cellule 
.row > *,
.col {
	display: table-cell;
	vertical-align: top;
}*/

/* Blocs à placer sous un élément "float" */
.clear,
.line,
.row {
	clear: both;
}


/* -------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------- */

/* ALIGNEMENTS */
/* Les alignements horizontaux sont gérés ainsi : .left et .right sont flottants, .center est un bloc centré avec marges auto et les contenus inline sont alignés via .txtleft, .txtright et .txtcenter */
/* ------------------------------ */

/* Left */
.left {
	float: left;
}
img.left {
	margin-right: 1em;
}

/* Right */
.right {
	float: right;
}
img.right {
	margin-left: 1em;
}

img.left, img.right {
	margin-bottom: 5px;
}

.center    { margin-left: auto; margin-right: auto; }
.txtleft   { text-align: left; }
.txtright  { text-align: right; }
.txtcenter { text-align: center; }

/* INLINE-BLOCK */
.inbl {
	display: inline-block;
	vertical-align: top;
	margin-right: -.25em;
}


/* -------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------- */

/* ALIGNEMENT FORMULAIRE */
/* Quelques particularités concernant les alignements des formulaires. */
form,
fieldset {
	border: none;
}
input,
button,
select,
label,
.btn {
	vertical-align: middle; /* @bugfix alignment */
	font-family: inherit;
}
textarea {
	resize: vertical;
	font-family: inherit;
}


/* -------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------- */

/* ----------------------------- */
/* IE FIX */
/* ----------------------------- */

/* haslayout for IE6/IE7 */
/* Quelques bidouilles pour assurer la compatibilité d'IE6 et IE7 pour les inline-block et pour les débordements de flottants.
La syntaxe nécessite que votre fichier HTML dispose de classes conditionnelles et de cibler IE via .ie6, .ie7, .ie67, etc. */
.ie67 .clearfix,
.ie67 .line,
.ie67 .mod,
.ie67 .row,
.ie67 .col {
	zoom: 1;
}

/* inline-block and table-cell for IE6/IE7 */
/* warning: .col needs width on IE6/IE7 */
.ie67 .btn,
.ie67 .col,
.ie67 .inbl {
	display: inline;
	zoom: 1;
}
.ie8 img {
	width: auto; /* @bugfix for IE8 */
}

/* Active box-sizing for IE6/IE7 */
/* On passe en box-sizing: border-box sur IE6/IE7 grâce à un fichier complémentaire (polyfill). */
/* @source https://github.com/Schepp/box-sizing-polyfill */
/*
.ie67 * {
	behavior: url(/js/boxsizing.htc);
}
*/