/* @override http://fondationpierrebellon.org/themes/default/screen.css */

@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700);
@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,700,500,500italic);

/**
 * Feuille de style FondatationPierreBellon.org
 *
 */

/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
	color: #222;
}

html {
	font-size: 1em;
	line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
	background: #b3d4fc;
	text-shadow: none;
}

::selection {
	background: #b3d4fc;
	text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
	vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
	resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
	margin: 0.2em 0;
	background: #ccc;
	color: #000;
	padding: 0.2em 0;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
	background-color: transparent;
	border: 0;
	overflow: hidden;
	/* IE 6/7 fallback */
	*text-indent: -9999px;
}

.ir:before {
	content: "";
	display: block;
	width: 0;
	height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
	display: none !important;
	visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
	visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *	`contenteditable` attribute is included anywhere else in the document.
 *	Otherwise it causes space to appear at the top and bottom of elements
 *	that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *	`:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}

.clearfix:after {
	clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
	*zoom: 1;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* FONTS DEFINITIONS */
/*@import url(http://fonts.googleapis.com/css?family=Lato:400,700,900italic,900,700italic,400italic);*/

/* BODY DEFAULTS */
html {
	margin-bottom: 1px;
	min-height: 100%;
}

body {
	color: #6d6e71;
	font: 14px/1.42857 Roboto, Arial, Verdana, sans-serif;
	background-color: #ededee;
	margin: 0;
}

html, body {
	height: 100%;
	min-width: 970px;
}

/* LINKS */
a, a:visited {
	color: #717275;
	text-decoration: none;
	outline: 0;
}

a:hover {
	color: #717275;
	text-decoration: none;
}

a:active,
a:focus {
	text-decoration: none;
	color: #717275;
	outline: 0;
}

button,
input[type=submit] {
	outline: 0;
}

/* HELPERS */
.text-left {
	text-align: left !important;
}

.text-right {
	text-align: right !important;
}

.text-center {
	text-align: center !important;
}

.pull-right {
	float: right !important;
}

.pull-left {
	float: left !important;
}

.hide {
	display: none !important;
}

.show {
	display: block !important;
}

.invisible {
	visibility: hidden !important;
}

.affix {
	position: fixed !important;
}

/* DIVERS */
* {
	box-sizing: border-box;
}

*:before,
*:after {
	box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0 0 10px;
	font-family: inherit;
	font-weight: bold;
	color: inherit;
	text-rendering: optimizelegibility;
}

p {
	margin: 0 0 10px;
}

ul,
ol,
dl {
	padding: 0;
	margin: 0;
}

li {
	list-style: none;
}

dd {
	margin: 0;
}

label {
	display: inline-block;
	max-width: 100%;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

input,
button,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

input[type="radio"],
input[type="checkbox"] {
	margin: 4px 0 0;
	margin-top: 1px \9;
	line-height: normal;
}

input[type="radio"]:focus,
input[type="checkbox"]:focus {
	outline: thin dotted;
	outline: 5px auto -webkit-focus-ring-color;
	outline-offset: -2px;
}

.radio,
.checkbox {
	position: relative;
	display: block;
	min-height: 20px;
	margin-top: 20px;
	margin-bottom: 10px;
}

.radio label,
.checkbox label {
	padding-left: 20px;
	margin-bottom: 0;
	font-weight: normal;
	cursor: pointer;
}

.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
	position: absolute;
	margin-top: 4px \9;
	margin-left: -20px;
}

select.input-sm {
	height: 30px;
	line-height: 30px;
}

.form-group {
	margin-bottom: 15px;
}

.controls {
	float: left;
}

.form-control {
	display: block;
	width: 100%;
	height: 34px;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #777;
	border-radius: 4px;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
	transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-control:focus {
	border-color: #66afe9;
	outline: 0;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
}

.alert {
	padding: 20px 45px;
	margin-bottom: 20px;
	border: 2px solid transparent;
	background-color: #fff;
}

.alert h4 {
	margin-top: 0;
	color: inherit;
	font-size: 24px;
}

.alert .alert-link {
	font-weight: bold;
}

.alert div > p, .alert div > ul {
	margin-bottom: 0;
}

.alert div > p + p {
	margin-top: 5px;
}

.alert-dismissable, .alert-dismissible {}

.alert-dismissable .close, .alert-dismissible .close {
	position: relative;
	top: -4px;
	right: -25px;
	color: #00abd3;
	width: 29px;
	height: 29px;
	text-align: center;
	font-size: 29px;
	font-weight: 300;
	line-height: 0;
	border-radius: 20px;
	padding-bottom: 5px !important;
}

.alert-success {
	color: #3c763d;
	background-color: #dff0d8;
	border-color: #d6e9c6;
}

.alert-success hr {
	border-top-color: #c9e2b3;
}

.alert-success .alert-link {
	color: #2b542c;
}

.alert-info {
	color: #31708f;
	background-color: #d9edf7;
	border-color: #bce8f1;
}

.alert-info hr {
	border-top-color: #a6e1ec;
}

.alert-info .alert-link {
	color: #245269;
}

.alert-warning {
	color: #8a6d3b;
	background-color: #fcf8e3;
	border-color: #faebcc;
}

.alert-warning hr {
	border-top-color: #f7e1b5;
}

.alert-warning .alert-link {
	color: #66512c;
}

.alert-danger {
	border-color: #d76560;
}

.alert-danger hr {
	border-top-color: #e4b9c0;
}

.alert-danger .alert-link {
	color: #843534;
}

.close {
	color: #000;
	float: right;
	font-size: 21px;
	font-weight: 700;
	line-height: 1;
	border: 0 none;
	cursor: pointer;
}

.alert .close {
	/*background-color: #636363;*/
	background-color: transparent;
	border: 2px solid #00abd3;
	padding: 0;
}

.sr-only {
	border: 0 none;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.form-group:before,
.form-group:after {
	display: table;
	content: " ";
}

/* ------------------------ STRUCTURE ---------------------------- */
#wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 0 -160px; /* HAUTEUR DU FOOTER ET DU FOOTER PUSH */
}

.container {
	width: 930px;
	margin: 0 auto;
	position: relative;
}

#wrapper .site {
	background-color: #ededee;
	width: 930px;
	margin: 0 auto;
	padding: 186px 0 20px;
}

.content {}

#footer-push {
	clear: both;
	height: 160px;
}

.top-anchor {
	position: fixed;
	background: url("./images/go-top.png") no-repeat 0 0;
	width: 55px;
	height: 55px;
	margin-left: 967px;
	bottom: 245px;
	display: none;
}

/* ------------------------------ GENERIC --------------------------------------------- */
.page h1:after {
	position: absolute;
	content: "—";
	bottom: 20px;
	left: 410px;
}

.page .pictures {
	margin: 20px -45px;
}

.page .pictures img {
	width: 306px;
	height: 198px;
	background-color: #6d6e71;
	margin-right: 6px;
	float: left;
}

.page .pictures img:last-child {
	margin: 0;
}

.page {
	position: relative;
	background-color: #fff;
	padding: 45px;
}

.page h1 {
	position: relative;
	text-align: center;
	color: #00abd3;
	font: 300 30px/1em Roboto;
	padding: 10px 0 55px;
	margin: 0;
}
.page .yeah dt span,
.page h3 span,
.page h4 span {
	position: relative;
	margin-left: 20px;
}
.page .yeah dt span:after,
.page .yeah dt span:before,
.page h3 span:after,
.page h3 span:before,
.page h4 span:after,
.page h4 span:before {
	position: absolute;
	content: "—";
	top: 0;
}
.page .yeah dt span:before,
.page h3 span:before,
.page h4 span:before {
	left: -20px;
}
.page .yeah dt span:after,
.page h3 span:after,
.page h4 span:after {
	right: -20px;
}

.page .list li:before,
.page .list > p:before {
	content: "— ";
	font-weight: 400;
	color: #00ABD3;
}

.footer-text {
	font-weight: 300;
	font-size: 21px;
	margin: 40px 0 0;
	color: #093075;
	text-align: center;
}

/* ------------------------------ BREADCRUMB --------------------------------------------- */
.breadcrumb {
	font-size: 12px;
	line-height: 52px;
}

.breadcrumb li {
	float: left;
	font-weight: 700;
	color: #093075;
}

.breadcrumb li .divider {
	margin: 0 3px;
}

.breadcrumb li a {
	color: #093075;
}

.breadcrumb li:first-child a {
	text-transform: uppercase;
	font-weight: 300;
}

/* ------------------------------ HEADER --------------------------------------------- */
header {
	background-color: #fff;
	height: 186px;
	position: absolute;
	width: 100%;
	z-index: 999;
}

.header-top {
	height: 140px;
}

header .title {
	position: absolute;
	left: 0;
	top: 17px;
	width: 255px;
	height: 78px;
	background: url('./images/logo_header.png') scroll no-repeat 0 0;
	text-indent: -999em;
	margin: 0;
	padding: 0;
}

header .title h1,
header .title h2 {
	text-indent: -999em;
}

ul.nav ul:before {
	position: absolute;
	content: "";
	width: 0;
	height: 0;
	border-bottom: 16px solid #093075;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	top: -10px;
	left: 10px;
}

ul.nav {}

ul.nav li {
	float: left;
	position: relative;
	list-style: none;
}

ul.nav > li > a {
	font-family: 'Roboto Condensed';
	width: 150px;
	height: 41px;
	line-height: 41px;
	text-align: center;
	display: block;
	background-color: #e6e6e6;
	margin: 0 6px 20px 0;
	text-transform: uppercase;
}

ul.nav a,
ul.nav a:visited {
	color: #093075;
}

ul.nav > li:last-child a {
	margin-right: 0;
}

ul.nav li ul li a {
	margin: 0;
}

ul.nav > li:hover > a,
ul.nav > li > a.active {
	color: #fff;
	background-color: #093075;
}

ul.nav li:hover > ul {
	display: block;
}

ul.nav li li,
ul.nav li li a,
ul.nav li li a:visited {
	color: #fff;
}

ul.nav li li a.active,
ul.nav li li a:hover {
	color: #00abd3;
}

ul.nav a:hover,
ul.nav a.active {
	color: #fff;
	background-color: #093075;
}

ul.nav ul {
	background: #093075;
	opacity: 0.8;
	display: none;
	margin: 0;
	padding: 15px;
	position: absolute;
	top: 50px;
	left: 0;
}

ul.nav ul li {
	float: none;
	margin: 0;
	padding: 0;
	white-space: nowrap;
}

ul.nav:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

ul.nav {}

html[xmlns] ul.nav {
	display: block;
}

* html ul.nav {
	height: 1%;
}

.links {
	float: right;
	width: 600px;
	margin-top: 80px;
}

.links > a,
.links input,
.links .languages,
.links .sep,
.magnifier {
	float: right;
	margin-left: 10px;
}

.links .sep {
	border-left: 1px solid #093075;
	height: 19px;
	width: 0;
}

.links .languages {
	border-left: 1px solid #093075;
	border-right: 1px solid #093075;
	line-height: 1em;
	padding: 2px 10px;
}

.languages a {
	width: 23px;
	height: 15px;
	background-image: url(./images/sprite-flags.png);
	background-repeat: no-repeat;
	float: left;
	text-indent: -999em;
}

.languages a.en.active,
.languages a.en:hover {
	background-position: -10px -10px;
}

.languages a.en {
	background-position: -10px -45px;
	margin-left: 10px;
}

.languages a.fr.active,
.languages a.fr:hover {
	background-position: -10px -80px;
}

.languages a.fr {
	background-position: -10px -115px;
}

.links input {
	position: relative;
	border: 0 none;
	color: #6D6E71;
	font-family: 'Roboto Condensed';
	font-size: 12px;
	width: 75px;
	height: 17px;
	line-height: 17px;
	margin: 1px 0 0 10px;
}

#___gcse_0 {
    float: right;
    position: relative;
    top: -5px;
}

#___gcse_0 * {
	box-sizing: content-box;
}

.gsc-control-cse {
    padding: 0 !important;
}

.magnifier {
	background: url('./images/magnifier.png') no-repeat top right;
	width: 26px;
	height: 19px;
	border-left: 1px solid #093075;
	padding-left: 10px;
}

.links > a {
	font-family: 'Roboto Condensed';
	border-left: 1px solid #093075;
	border-right: 1px solid #093075;
	color: #093075;
	height: 19px;
	line-height: 19px;
	padding: 0 10px;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 700;
}

/* ------------------------------ FOOTER --------------------------------------------- */
footer {
	background-color: #093075;
}

footer .container {
	height: 160px;
	padding: 40px 0 0;
}

footer .logo {
	float: left;
	background: url('./images/logo_footer.png');
	text-indent: -999em;
	width: 258px;
	height: 78px;
}

footer address {
	float: left;
	border-top: 2px solid #fff;
	font-style: normal;
	color: #fff;
	font-size: 16px;
	font-weight: 300;
	font-family: 'Roboto Condensed';
	margin-left: 78px;
	padding-top: 10px;
}

footer nav {
	float: left;
	border-top: 2px solid #fff;
	margin-left: 78px;
	padding-top: 10px;
}

footer nav p {
	margin: 0;
}

footer nav p a,
footer nav p a:hover,
footer nav p a:visited {
	color: #fff;
}
footer nav p a {
	font-size: 16px;
	font-weight: 300;
	font-family: 'Roboto Condensed';
}

footer .newsletter {
	float: left;
	border-top: 2px solid #fff;
	margin-left: 78px;
	padding-top: 10px;
}

footer .newsletter p {
	margin: 0 0 5px;
	color: #fff;
	font-size: 16px;
	font-weight: 300;
}

footer .newsletter input {
	float: left;
	background-color: #fff;
	border: 0 none;
	color: #6D6E71;
	font-size: 12px;
	padding: 0 5px;
	width: 115px;
	height: 23px;
	line-height: 23px;
}

footer .newsletter button {
	float: left;
	background-color: #fff;
	border: 0 none;
	color: #093075;
	font-size: 16px;
	font-weight: 300;
	width: 35px;
	height: 23px;
}

.mt20 {
	margin-top: 20px;
}

.news-txt p a {
	color: #00abd3;
	text-decoration: none;
}