/** #####################################################
* CSS RESET
* http://meyerweb.com/eric/tools/css/reset/index.html
** ##################################################### */
html,
body {
	height: 100%
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
em,
img,
small,
strike,
strong,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent
}

blockquote,
q {
	quotes: none
}

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

:focus {
	outline: 0
}

ins {
	text-decoration: none
}

del {
	text-decoration: line-through
}

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

img {
	vertical-align: bottom
}

a img {
	vertical-align: bottom
}

input::-moz-focus-inner {
	padding: 0 !important;
	border: none !important
}

abbr {
	cursor: help !important;
	border-bottom: 1px dotted #393939
}

*:last-child,
.mb0 {
	margin-bottom: 0
}

hr,
.hr {
	border: 0;
	border-top: 1px solid #ddd;
	clear: both;
	height: 0;
	margin: 1.250em 0;
	font-size: 1px
}

li {
	list-style: none
}

/* Clearfix https://css-tricks.com/snippets/css/clear-fix/ */
.cf:after {
	content: "";
	display: table;
	clear: both;
}

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


/** #####################################################
* HELPERS
** ##################################################### */
.inline {
	display: inline;
}

.ib {
	display: inline-block !important
}

ul.inline {
	list-style: none;
	display: block;
}

ul.inline > li {
	list-style: none;
	display: inline-block
}

.left {
	float: left
}

.right {
	float: right
}

.center {
	margin-left: auto;
	margin-right: auto
}


.lowercase {
	text-transform: lowercase
}

.maj,
.uppercase {
	text-transform: uppercase
}

.noselect {
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none
}

.taCenter {
	text-align: center;
}

.big {
	font-size: 140%
}

.bigger {
	font-size: 180%
}

.red {
	color: red
}

.boxed {
	background: #F7F7F7;
	border: 1px solid #eee;
	padding: 6%
}

.bg_black {
	background: #000 !important
}

.bg_EEE {
	background: #ddd !important
}

.bg_FFF {
	background: #FFF !important
}

.bg_F7 {
	background: #F7F7F7 !important
}

.bg_gris_moyen_charte {
	background: #4E5860 !important;
}

.bg_gris_clair_charte {
	background: #616d77 !important;
}

.bg_facebook {
	background: #3B5998 !important
}

.bg_twitter {
	background: #4099FF !important
}

.bg_google {
	background: #D50F25 !important
}

.greybox {
	padding: 1em;
	background: #f7f7f7;
	border: 1px solid #ddd;
	margin-top: 15px
}

.p5pct {
	padding: 5%;
}

.p50 {
	padding: 50px;
}

.h2 {
	font: bold 1rem/1.3em Open Sans, Arial, Helvetica, sans-serif;
	margin-bottom: 1em;
}

.mobile_only {
	display: none !important;
}

@media screen and (max-width:600px) {
	.nomobile {
		display: none !important;
	}

	.mobile_only {
		display: block !important;
	}
}