@import url(reset.css);
@import url(fonts.css);

#header a[href="#"] { cursor:default; }

html { font-size:100%; }

body { font-size: 12px; line-height:1.4; color:#231f20; margin:0 0; }
body { background:#fff; font-family:Arial; }

.coverlayer { width: 100%; height: 100%; background: rgba(255,255,255,0.9); position: fixed; top: 0; left: 0; z-index: 3; display: none; }

header {
	width:100%;
	height:170px;
	/*
	left:0;
	top:0;
	*/
	position:relative;
	z-index: 2;
	background:
		linear-gradient(to bottom, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 50% ),
		linear-gradient(to bottom, rgba(0,0,0,0) 50%, rgba(0,0,0,0.5) 100%),
		url('../img/header_background/mauriceRavel.jpg') 50% 100%;
    background-size:cover;
	padding:42px;
	box-sizing:border-box;
	/*
	transition:
		opacity 0.4s ease-in-out,
		left 0.4s ease-in-out,
		top 1s ease-in-out,
		height 1s ease-in-out;
	*/
}

header.actualite { background-image: url(../img/header_background/actualite.jpg); }
header.publication { background-image: url(../img/header_background/publication.jpg); }

	header #logo {

		display:inline-block;

	}

		header #logo img {
			width:186px;
			height:30px;
		}

	header h1 {
		font-family:"Merriweather";
		color:#fff;
		font-size:3em;
		position:absolute;
		bottom:12px;
	}

		header h1 span {
			font-weight:400;
			font-size:0.5em;
		}

		header h1 small {
			font-weight:300;
			font-size:1em;
		}

nav {
	width:266px;
	height:100%;
	position:fixed;
	box-sizing:border-box;
	background:#414141;
	top:0;
	right:-266px;
	transition:all 0.4s ease-in-out;
	padding:90px 0 70px 0;
	z-index:999;
}

	nav > ul { overflow-y:auto; height:100%; }
	nav > ul > li { padding:11px 24px; }
	nav ul li a { text-decoration:none; font-family:"Merriweather"; transition:all 0.2s ease-in-out; }
	nav ul li a:hover { color:#fff; }

    nav > ul > li ul { display: none; }
	
	nav > ul > li.current-menu-item > a,
    nav > ul > li.current-menu-ancestor > a { color:#fff; }
    nav > ul > li.current-menu-item ul,
    nav > ul > li.current-menu-ancestor ul { display: block; }
	nav > ul > li.current-menu-item,
    nav > ul > li.current-menu-ancestor { background:linear-gradient(to bottom, rgba(52,52,52,1) 0%,rgba(52,52,52,0.5) 100%); }
	nav > ul > li > ul > li.current-menu-item > a,
    nav > ul > li > ul > li.current-menu-ancestor > a { color:#fff; }
	nav > ul > li > ul > li > ul > li.current-menu-item > a,
    nav > ul > li > ul > li > ul > li.current-menu-ancestor > a { color:#fff; }
    nav > ul > li > ul > li > ul > li > ul > li.current-menu-item > a,
    nav > ul > li > ul > li > ul > li > ul > li.current-menu-ancestor > a { color:#fff; }

	nav > ul > li + li { border-top:1px solid #505050; }
	nav > ul > li > a { font-size:1.33em; color:#8a8a8a; }

	nav > ul > li > ul > li { padding:13px 0 0 0; }
	nav > ul > li > ul > li > a { font-size:1.16em; color:#b4b4b4; }

	nav > ul > li > ul > li > ul { padding:8px 0; }
	nav > ul > li > ul > li > ul > li { padding:8px 8px; }
	nav > ul > li > ul > li > ul > li > a { font-size:1em; color:#b6b6b6; font-style:italic; }

	nav > ul > li > ul > li > ul > li > ul { padding:8px 0; }
	nav > ul > li > ul > li > ul > li > ul > li { padding:5px 5px; }
	nav > ul > li > ul > li > ul > li > ul > li > a { font-size:1em; color:#b6b6b6; font-style:italic; }

	nav li.don { background:#fff; }
	nav li.don a { color:#c91202; }
	nav li.don a:hover { color:#c91202; opacity:0.8; }
    nav > ul > li.don.current-menu-item > a,
    nav > ul > li.don > ul > li.current-menu-item > a,
    nav > ul > li.don.current-menu-ancestor > a { color: #c91202; opacity: 1; }
    nav > ul > li.don > ul > li > a { opacity: 0.5; }
    nav > ul > li.don.current-menu-item, nav > ul > li.don.current-menu-ancestor { background: #fff; }

    .menu-anchor{
		display: block;
		transition: all 0.4s ease-in-out;
		width: 25px;
		height: 40px;
		background: url(../img/menu-anchor.png);
		position: absolute;
		top: 42px;
		right: 42px;
        color: #fff;
        background-position: center 15px;
        background-repeat: no-repeat;
        font-size: 0.7em;
        text-decoration: none;
        overflow: hidden;
        z-index: 4;
	}

	nav a.menu-anchor { right: auto; transform: rotate(90deg); left: 24px; }
    .menu-anchor:hover { transform:rotate(90deg); }

	nav .social { position:absolute; bottom:24px; left:24px; transition:all 0.2s ease-in-out; }
	nav .social a { display:inline-block; width: 30px; height: 29px; background:#6e6f71; border-radius:24px; text-indent:-9999px; margin:0 10px 0 0; transition:all 0.2s ease-in-out; background-position: center; } 
    nav .social a.facebook { background-image: url(../img/facebook.png); }
    nav .social a.youtube { background-image: url(../img/youtube.png); }
    nav .social a.twitter { background-image: url(../img/twitter.png); }

	nav .social:hover a { opacity:0.3; }
	nav .social a:hover { opacity:1; }


body.nav-active nav { right:0; }	
body.nav-active header,
body.nav-active footer,
body.nav-active section { /*left:-42px;*/ /*opacity:0.2;*/ }
/*body.nav-active a.menu-anchor { right:220px; transform:rotate(90deg); }*/

body.switch header { height:80%; }
body.switch section { opacity:0; }

footer {
	width:100%;
	height:100px;
	left:0;
	bottom:0;
	position: absolute;
	z-index:99;
	padding:42px;
	box-sizing:border-box;
	line-height:22px;
	transition:all 0.4s ease-in-out;
	color:#9e9e9e; 
}
	
	footer a { color:#9e9e9e; text-decoration:none; transition:all 0.4s ease-in-out; }
	footer a:hover { color:#6a6260 }
	footer strong { color:#6a6260; font-weight:400; }

	footer img { width:50px; height:22px; vertical-align: middle; }

	footer ul,
	footer ul li { display:inline; }

	footer ul li { padding:0 10px; }

section {
	width:100%;
	height: auto;
    min-height: 100%;
	box-sizing:border-box;
	transition:all 0.4s ease-in-out;
	position: absolute;
	left:0;
	top:0;
	z-index:0;
	padding:202px 0 100px 0;
}

.frontpage header { top:-200px; }

.frontpage section {
	background:url(../visuels/homepage.jpg) 50% 50% no-repeat;
	background-size:cover;
}

	.frontpage section h1 img {
		position:absolute;
		top:32%;
		left:42px;
	}

section article {
	padding:0 42px;
}












/* page intro */

.wrapper { width: 960px; margin: 40px auto 0 auto; position: relative; }
.button { display: block; width: 500px; background: #a7a7a7; color: #fff; text-align: center; font-family: "Merriweather"; font-size: 1.4em; text-decoration: none; padding: 15px 0; }

#intro { overflow: hidden; height: 340px; }
#intro img { display: block; float: left; height: 340px; }
#intro .text_area { float: right; width: 525px; text-align: center; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); }
#intro .text_area p { font-family: "Helvetica Neue LT Std", sans-serif; color: #808080; font-size: 1.2em; margin-bottom: 30px; text-align: justify; }
#intro .button { margin: auto; margin-top: 15px; }
#intro .button span { font-size: 0.8em; }

/* page popin */

.popin_content { background: #2b2a2a; padding: 40px 50px; max-width: 800px; max-height: 500px; box-sizing: border-box; }
.popin_content h1 { font-family: "Merriweather"; font-size: 2em; color: #fff; }
.popin_content h1.center { text-align: center; }
.popin_content h1 span { font-size: 0.6em; }
.popin_content p { font-family: "Helvetica Neue LT Std", sans-serif; font-size: 1.083em; color: #bebebe; line-height: 2; margin-top: 30px; text-align: justify; }
.popin_content ul li { padding-left: 37px; position: relative; }
.popin_content ul li:before { display: block; content: ""; width: 4px; height: 4px; border-radius: 2px; background: #bebebe; position: absolute; top: 10px; left: 0; }
.popin_content ul li p { margin-top: 10px; }

.popinskin .fancybox-skin .fancybox-close, .popinskin-devices .fancybox-skin .fancybox-close { top: 40px; right: 20px; background: url(../img/fancybox_close.jpg) no-repeat center; }
.popinskin .fancybox-nav { width: 0; }
.popinskin .fancybox-next span { background-image: url(../img/goright_white.png); width: 19px; height: 31px; margin-top: -15px; background-position: 0 0; visibility: visible; background-size: 19px; }
.popinskin .fancybox-prev span { background-image: url(../img/goleft_white.png); width: 19px; height: 31px; margin-top: -15px; background-position: 0 0; visibility: visible; background-size: 19px; }

/* page timeline */

section.timeline { background: #fff; }
section.timeline article { padding: 0; }

/* page temoignages */

#submenu { position: absolute; right: 0; top: 170px; width: 70%; display: table; box-sizing: border-box; border-bottom: solid 1px #cccccc;  }
#submenu li { display: inline-block; margin-right: 50px; }
#submenu li a { font-family: "Merriweather"; font-size: 1.25em; text-transform: uppercase; padding: 20px 0 10px 0; color: #cccccc; transition: all 0.4s ease-in-out; text-decoration: none; display: block; }
#submenu li a:hover,
#submenu li.current-menu-item a { color: #6b6b6b; }
#submenu li:last-child { padding-right: 100px; }

ul.two_columns { overflow: hidden; }
ul.two_columns li { width: 50%; float: left; color: #6b6b6b; padding-right: 50px; box-sizing: border-box; margin-top: 30px; line-height: 1.6; height: auto; overflow: hidden; }
ul.two_columns li:nth-child(2n) { padding-right: 0; padding-left: 50px; }
ul.two_columns li h2 { font-family: "Merriweather"; font-size: 1.33em; font-weight: 700; }
ul.two_columns li p { font-family: "Helvetica Neue LT Std", sans-serif; font-weight: 300; text-align: justify; overflow: hidden; }
ul.two_columns li p.title { font-size: 1.2em; text-decoration: underline; }
ul.two_columns li p.small { margin-bottom: 5px; }
ul.two_columns li a { text-decoration: none; color: inherit; transition: all 0.2s ease-in-out; }
ul.two_columns li a:hover { color: #000; }

ul.two_columns#temoignages_ecrits_list li { padding: 0 25px; min-height: 74px; }
ul.two_columns#temoignages_ecrits_list li:nth-child(2n) { padding: 0 25px; }

/* page videos */

#videos { position: relative; margin-top: 80px; }
#videos ul { margin: 40px auto 100px auto; height: 500px; overflow: hidden; }
#videos .goup { position: absolute; top: -40px; cursor: pointer; width: 100%; height: 29px; text-align: center; z-index: 3; }
#videos .godown { position: absolute; top: 400px; cursor: pointer; width: 100%; height: 29px; text-align: center; z-index: 3; }
#videos .layout { position: absolute; top: 0; width: 100%; height: 100%; box-sizing: border-box; padding-top: 370px; background: rgba(255,255,255,0.9); z-index: 2; }

ul.three_columns { overflow: hidden; }
ul.three_columns li { width: 30%; float: left; margin-top: 40px; color: #5a5c61; height: 330px; overflow: hidden; }
ul.three_columns li.active { position: relative; z-index: 3; }
ul.three_columns li:nth-child(3n), 
ul.three_columns li:nth-child(3n-1) { margin-left: 5%; }
ul.three_columns li iframe { width: 100%; height: 240px; }
ul.three_columns li h2 { font-family: "Merriweather"; font-size: 1.8em; font-weight: 700; margin-top: 10px; }
ul.three_columns li p { font-family: "Helvetica Neue LT Std", sans-serif; font-size: 1.07em; }

/* page galery */

#galery { position: relative; margin: 40px auto; }
#galery .goleft { position: absolute; top: 190px; left: 0; width: 29px; height: 48px; cursor: pointer; }
#galery .goright { position: absolute; top: 190px; right: 0; width: 29px; height: 48px; cursor: pointer; }

#galery ul { width: 1050px; margin: auto; height: 422px; position: relative; overflow: hidden; }
#galery ul li { width: 100%; height: 100%; margin-left: 100%; position: absolute; top: 0; left: 0; }
#galery ul li.active { margin-left: 0; }
#galery ul li > div { margin: 10px; display: inline-block; width: 240px; height: 191px; vertical-align: middle; overflow: hidden; }
#galery ul li > div img { width: 100%; min-height: 100%; }

.galery_content { background: #2b2a2a; padding: 60px 50px; box-sizing: border-box; max-width: 573px; text-align: center; display: none; }
.galery_content p { font-family: "Merriweather"; font-size: 1.083; color: #bebebe; margin-top: 20px; }
/*.galery_content img { max-width: 300px; padding: 0 20px; }*/

/* page documents */

#documents { margin: 40px auto; overflow: hidden; }
#documents > div { float: left; box-sizing: border-box; }
#documents > div.title_area { width: 30%; }
#documents > div.documents_area { width: 70%; }

#documents .title_area { color: #808080; padding-right: 50px; height: 346px; }
#documents .title_area h2 { font-family: "Merriweather"; font-size: 1.67em; font-weight: 700; margin: 30px auto 20px auto; }
#documents .title_area p { font-family: "Helvetica Neue LT Std", sans-serif; }
#documents .title_area div { position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); }
#documents .title_area a { color: inherit; }

#documents .documents_area { 
    padding-left: 80px;
    background: -moz-linear-gradient(left,  rgba(204,204,204,0.1) 0%, rgba(0,0,0,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(204,204,204,0.1)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(204,204,204,0.1) 0%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(204,204,204,0.1) 0%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(204,204,204,0.1) 0%,rgba(0,0,0,0) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(204,204,204,0.1) 0%,rgba(0,0,0,0) 100%); /* W3C */
}
#documents .documents_area ul { width: 100%; overflow: hidden; /*height: 346px;*/ }
#documents .documents_area ul li { float: left; margin: 20px 15px; position: relative; }
#documents .documents_area ul li .title_bottom { text-align: center; width: 100%; position: absolute; bottom: 0; padding: 5px 0; background-color: rgba(0,0,0,0.6); color: #fff; }
#documents .documents_area img { max-height: 127px; }
#documents .galery_content { max-width: 1000px; }
.galery_content { max-width: 1200px; overflow: hidden; padding: 0 }
.galery_content > div { padding: 60px 50px; min-height: 500px; }
.galery_content .image_area { width: 1020px; text-align: center; }
.galery_content img { height: 500px; max-width: 100%; padding: 0; }

/* page liens */

#liens { margin: 40px auto 0 auto; }
#liens.inside { margin-top: 70px; }
#liens p a { font-family: "Helvetica Neue LT Std", sans-serif; text-decoration: none; color: inherit; transition:  }
#liens p a:hover { text-decoration: underline; transition: all 0.4s ease-in-out; }
#liens p.title { font-family: "Merriweather"; font-weight: 300; font-size: 1.167em; color: #6b6b6b; }
#liens p+p { margin-top: 10px; }

/* page oeuvres */

#oeuvres { position: relative; margin-top: 70px; }
#oeuvres p, #oeuvres li { font-family: "Helvetica Neue LT Std", sans-serif; color: #808080; line-height: 1.6; margin-top: 10px; text-align: justify; }
#oeuvres span { color: red; }
#oeuvres ul { margin: 10px 0; }
#oeuvres li { margin-top: 5px; padding-left: 20px; position: relative; }
#oeuvres li:before { content: ""; position: absolute; top: 6px; left: 0; width: 6px; height: 6px; border-radius: 3px; background: #808080; display: block; }
#oeuvres h2 { font-family: "Merriweather"; font-size: 1.5em; color: #000000; text-transform: uppercase; margin: 20px 0; }
#oeuvres h2.big { margin-top: 0; font-size: 2em; margin-bottom: 40px; }
#oeuvres a { color: inherit; }
/*#oeuvres ul { overflow: hidden; margin: 40px auto 0 auto; height: 500px; overflow: hidden; }
#oeuvres li { width: 20%; margin: 40px 2.5%; float: left; box-sizing: border-box; }
#oeuvres li.active { position: relative; z-index: 3; }
#oeuvres li iframe { width: 100%; height: 240px; }
#oeuvres li h2 { font-family: "Merriweather"; font-size: 1.167em; color: #2f3137; margin-top: 10px; height: 38px; overflow: hidden; }

#oeuvres .goup { position: absolute; top: -40px; cursor: pointer; width: 100%; height: 29px; text-align: center; z-index: 3; }
#oeuvres .godown { position: absolute; top: 400px; cursor: pointer; width: 100%; height: 29px; text-align: center; z-index: 3; }
#oeuvres .layout { position: absolute; top: 0; width: 100%; height: 100%; box-sizing: border-box; padding-top: 370px; background: rgba(255,255,255,0.9); z-index: 2; }*/

/* page cahiers */

.cahier_content { background: #2b2a2a; padding: 60px 50px; box-sizing: border-box; max-width: 573px; display: none; }
.cahier_content h3 { font-family: "Merriweather"; font-size: 2em; color: #ffffff; }
.cahier_content .button { font-size: 1.083em; width: 372px; height: 45px; line-height: 45px; margin: 20px 0; background: #626261; }
.cahier_content p { font-family: "Helvetica Neue LT Std", sans-serif; color: #bebebe; }

/* page publications */

#publications { margin: 70px auto; }
#publications h2 { font-family: "Merriweather"; font-size: 2em; color: #000000; text-transform: uppercase; }

#publications ul.two_columns li { overflow: hidden; height: 160px; }
#publications ul.two_columns li img { height: 100%; width: 110px; }
#publications ul.two_columns li > div { float: left; height: 100%; }
#publications ul.two_columns li > div.text_content { margin-left: 20px; color: #6b6b6b; width: 249px; }
#publications ul.two_columns li > div.text_content h3 { font-family: "Merriweather"; font-weight: 700; font-size: 1.33em; }
#publications ul.two_columns li > div.text_content p { font-family: "Merriweather"; font-weight: 300;  }
#publications ul.two_columns li > div.text_content p a { color: inherit; font-size: 1.167em; }
#publications ul.two_columns li > div.text_content p.main_content { margin-top: 5px; font-family: "Helvetica Neue LT Std", sans-serif; line-height: 1.4; }

/* form style */

input[type="text"], input[type="email"], input[type="date"], select { height: 45px; width: 100%; box-sizing: border-box; padding: 10px; border: solid 1px #cccccc; color: #cccccc; font-family: "Merriweather"; font-size: 1.5em; font-weight: 700; }
input::-webkit-input-placeholder { color: #cccccc; }
input:-moz-placeholder { color: #cccccc; opacity: 1; }
input::-moz-placeholder { color: #cccccc; opacity: 1; }
input:-ms-input-placeholder { color: #cccccc; }
textarea::-webkit-input-placeholder { color: #cccccc; }
textarea:-moz-placeholder { color: #cccccc; opacity: 1; }
textarea::-moz-placeholder { color: #cccccc; opacity: 1; }
textarea:-ms-input-placeholder { color: #cccccc; }
label.error { color: red; display: block; position: absolute; bottom: -20px; left: 0; }

/* page formulaire */

#formulaire h2 { font-family: "Merriweather"; font-size: 2em; font-weight: 700; text-transform: uppercase; color: #000000; margin-bottom: 30px; }
#formulaire p { font-family: "Helvetica Neue LT Std", sans-serif; font-size: 1.167em; color: #808080; }
#formulaire p.small { font-family: "Merriweather"; font-weight: 700; font-size: 0.83em; line-height: 1.4; margin-bottom: 0; padding-left: 20px; color: #808080; }

#traveux ul.two_columns li { height: 45px; padding-right: 20px; position: relative; overflow: initial; }
#traveux ul.two_columns li:nth-child(2n) { padding-left: 20px; }
#traveux ul.two_columns li:nth-child(2n) label.error { padding-left: 20px; }
#traveux input,
#traveux select,
#traveux textarea { height: 100%; width: 100%; box-sizing: border-box; padding: 10px; border: solid 1px #cccccc; color: #cccccc; font-family: "Merriweather"; font-size: 1.5em; font-weight: 400; background: #fff; }

#traveux ul.two_columns li.long { height: 120px; }
#traveux ul.two_columns li.long ul.two_columns li { margin-top: 0; margin-bottom: 30px; padding-right: 5px; }
#traveux ul.two_columns li.long ul.two_columns li:nth-child(2n) { padding-left: 5px; }
#traveux ul.two_columns li.long ul.two_columns li:nth-child(2n) label.error { padding-left: 5px; }
#traveux ul.two_columns li.long > div { width: 100%; height: auto; }

div.file { position: relative; }
div.file input { position: absolute; top: 0; left: 0; opacity: 0; cursor: pointer; }
div.file div { width: 100%; height: 45px; border: solid 1px #cccccc; color: #cccccc; font-family: "Merriweather"; font-size: 1.5em; font-weight: 400; line-height: 45px; box-sizing: border-box; padding: 0 10px; overflow: hidden; }

#traveux ul.two_columns li.notice { height: 70px; position: relative; }
#traveux ul.two_columns li.notice div { position: absolute; top: 0; left: 0; font-family: "Merriweather"; font-size: 1.2em; font-weight: 700; }
#traveux button { float: right; color: #cccccc; font-family: "Merriweather"; font-size: 1.5em; font-weight: 700; border: 0; background: transparent; text-transform: uppercase; padding: 0 35px; cursor: pointer; }

#formulaire #thanks li { height: auto; }
#thanks { display: none; }
#thanks h3 { font-family: "Merriweather"; font-size: 1.5em; color: #c9a64f; text-transform: uppercase; margin-bottom: 20px; }
#formulaire #thanks li p { font-family: "Helvetica Neue LT Std", sans-serif; font-size: 1em; color: #6b6b6b; margin-top: 10px; }
#formulaire #thanks li p.special { color: #cccccc; }

#newletter_sidebar h4 { font-family: "Merriweather"; font-size: 1.33em; color: #6b6b6b; }
#newletter_sidebar p.special { font-family: "Helvetica Neue LT Std", sans-serif; font-size: 1em; color: #cccccc; margin-top: 0px; }
#formulaire #newletter_sidebar p.special { margin-top: 0px; }
#newletter_sidebar form { padding: 30px 0 20px 0; border-bottom: solid 4px #d6c8a6; overflow: hidden; position: relative; }
#newletter_sidebar form label.error { bottom: 5px; left: 15px; }
#newletter_sidebar form input { float: left; width: 60%; height: 33px; border: 0; font-family: "Helvetica Neue LT Std", sans-serif; font-size: 1.083em; color: #6b6b6b; box-sizing: border-box; padding-left: 15px; font-weight: 400; }
#newletter_sidebar form button { float: left; width: 40%; height: 33px; box-sizing: border-box; border: 0; background: #c9a64f; color: #fff; font-family: "Merriweather"; font-size: 1.167em; cursor: pointer; position: relative; }
#newletter_sidebar form button:before { content: ""; width: 9px; height: 100%; background: #ae914e; position: absolute; top: 0; left: 0; }
#newletter_sidebar form button:after { content: "\f138"; font-family: "Fontawesome"; font-size: 1.2em; position: absolute; right: 15px; top: 8px; }
#newletter_sidebar .social_inside h4 { margin-top: 23px; }
#newletter_sidebar .social_inside ul { overflow: hidden; }
#newletter_sidebar .social_inside li { margin-top: 20px; height: auto; min-height: 31px; }
#newletter_sidebar .social_inside li a { display: table; text-decoration: none; }
#newletter_sidebar .social_inside li a img { display: table-cell; vertical-align: middle; }
#newletter_sidebar .social_inside li a span { display: table-cell; vertical-align: middle; padding-left: 12px; font-family: "Helvetica Neue LT Std", sans-serif; color: #808080; }

/* page fondation */

#fondation { margin: 40px auto; overflow: hidden; }
#fondation > div { float: left; box-sizing: border-box; }

#fondation > div.title_area { width: 30%; color: #808080; padding-right: 30px; }
#fondation > div.title_area h2 { font-family: "Merriweather"; font-weight: 700; font-size: 1.67em; margin-bottom: 20px; }
#fondation > div.title_area p { font-family: "Helvetica Neue LT Std", sans-serif; margin-bottom: 10px; text-align: justify; }

#fondation > div.content_area { width: 70%; text-align: center; }
#fondation > div.content_area > div { margin: auto; overflow: hidden; display: inline-block; }
#fondation > div.content_area .image_block { float: left; width: 220px; height: 220px; padding: 10px; box-sizing: border-box; }

.image_block { overflow: hidden; position: relative; cursor: pointer; display: block; }
.image_block .image_area { width: 100%; height: 100%; transition: all 0.4s ease-in-out; background: #ececec; text-align: center; }
.image_block .image_area img { max-width: 80%; max-height: 80%; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); }
.image_block .text_area { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #909090; color: #fff; padding: 40px; box-sizing: border-box; font-family: "Merriweather"; font-size: 1.67em; opacity: 0; transition: all 0.4s ease-in-out; }
.image_block:hover .image_area { margin-top: -100%; }
.image_block:hover .text_area { opacity: 1; }

/* page fondation detail */

#fondation_details { margin: 25px auto; }
#fondation_details > div { float: left; box-sizing: border-box; }

#fondation_details > div.title_area { width: 30%; padding-right: 100px; color: #808080; }
#fondation_details > div.title_area > img { max-width: 200px; max-height: 100px; }
#fondation_details > div.title_area h2 { font-family: "Merriweather"; font-weight: 700; font-size: 1.67em; margin: 20px 0; }
#fondation_details > div.title_area p { font-family: "Helvetica Neue LT Std", sans-serif; margin-bottom: 10px; text-align: justify; }
#fondation_details > div.title_area p a { text-decoration: none; color: inherit; transition: all 0.3s ease-in-out; }
#fondation_details > div.title_area p a:hover { text-decoration: underline; }

#fondation_details > div.content_area { width: 70%; position: relative; height: 600px; }
#fondation_details div.content_area > div { position: absolute; top: 0; left: 0; width: 100%; display: none; padding: 50px 20px 20px 0px; }
#fondation_details div.content_area > div.active { display: block; width: 80%; }

#fondation_details > div.content_area > div#fondation_video { padding-top: 20px; }
#fondation_video div.top { overflow: hidden; }
#fondation_video div.top > div { float: left; box-sizing: border-box; }
#fondation_video div.top > div.video_area { width: 70%; min-height: 300px; background: #808080; }
#fondation_video div.top > div.video_area iframe { width: 100%; height: 300px; }
#fondation_video div.top > div.text_area { width: 30%; padding: 20px; }

#fondation_details h3 { font-family: "Merriweather"; font-size: 2em; color: #2f3137; margin-bottom: 30px; }
#fondation_details p, #fondation_details li { color: #808080; font-family: "Helvetica Neue LT Std", sans-serif; text-align: justify; }

#fondation_video .video_list { overflow: hidden; margin: 20px -10px; }
#fondation_video .video_list li { width: 260px; height: 130px; margin: 10px; float: left; background: #808080; }
#fondation_video .video_list li iframe { width: 100%; height: 100%; }

#fondation_details .edit_area { width: 90%; padding-right: 20px; }
#fondation_details .edit_area p+p { margin-top: 10px; }
#fondation_details .edit_area p+h3 { margin-top: 20px; }
#fondation_details .edit_area ul { margin: 10px auto; padding-left: 20px; }
#fondation_details .edit_area li { margin-top: 10px; }
#fondation_details .edit_area p.title { font-weight: 700; font-size: 1.167em; margin: 15px 0; }
#fondation_details .edit_area a { text-decoration: none; color: inherit; transition: all 0.3s ease-in-out; }
#fondation_details .edit_area a:hover { text-decoration: underline; }
#fondation_details .edit_area strong { /*color: #000; font-weight: 500;*/ }

/* page actualité calendrier */

#actualite_calendrier { margin: 70px auto; }
#actualite_calendrier > div { overflow: hidden; }
#actualite_calendrier > div > div { float: left; width: 50%; box-sizing: border-box; }
#actualite_calendrier > div > div.image_area img { width: 100%; height: 100%; }

#actualite_calendrier > div > div.text_area { padding: 60px; }
#actualite_calendrier > div > div.text_area h2 { font-family: "Merriweather"; font-size: 2em; color: #000000; margin-bottom: 40px; }
#actualite_calendrier > div > div.text_area p { font-family: "Helvetica Neue LT Std", sans-serif; font-size: 1em; color: #cccccc; line-height: 1.6; }
#actualite_calendrier > div > div.text_area p span { color: #6b6b6b; }
#actualite_calendrier > div > div.text_area a { text-decoration: none; color: #6b6b6b; transition: all 0.3s ease-in-out; font-family: "Helvetica Neue LT Std", sans-serif; font-size: 1em; line-height: 1.6; }
#actualite_calendrier > div > div.text_area a:hover { text-decoration: underline; }
#actualite_calendrier > div > div.text_area div+div { margin-top: 40px; }

#actualite_calendrier .image_list { overflow: hidden; margin: 20px -25px; }
#actualite_calendrier .image_list li { float: left; width: 250px; padding: 25px; text-align: center; }
#actualite_calendrier .image_list li img { width: 100%; }
#actualite_calendrier .image_list li h3 { font-family: "Merriweather"; font-size: 1.25em; color: #000000; margin:  30px 0 20px 0; }
#actualite_calendrier .image_list li p { font-family: "Merriweather"; color: #6b6b6b; height: auto; margin-bottom: 5px; }
#actualite_calendrier .image_list li a { color: inherit; text-decoration: none; color: #6b6b6b; }
#actualite_calendrier .image_list li a:hover { text-decoration: underline; }
#actualite_calendrier .image_list li ul li { float: none; padding: 0; }

/* page actualite event */

#actualite_event { position: relative; }
#actualite_event p { text-align: justify; font-family: "Helvetica Neue LT Std", sans-serif; color: #808080; margin-top: 10px; }
#actualite_event h2 { font-family: "Merriweather"; font-size: 1.83em; color: #000000; margin-bottom: 60px; text-transform: uppercase; margin-top: 70px; }
#actualite_event h3 { font-family: "Merriweather"; font-size: 1.5em; font-weight: 300; margin-bottom: 20px; margin-top: 30px; }
#actualite_event a { color: inherit; text-decoration: none; transition: all 0.3s ease-in-out; }
#actualite_event a:hover { text-decoration: underline; }

#actualite_event .two_columns { overflow: hidden; }
#actualite_event .two_columns > div { width: 45%; box-sizing: border-box; border: solid 1px #ccc; float: left; padding: 20px 10px; min-height: 855px; }
#actualite_event .two_columns > div+div { margin-left: 10%; }
#actualite_event .two_columns > div p { text-align: center; line-height: 1.6; margin-top: 0; }
#actualite_event .two_columns > div p.title { font-family: "Merriweather"; font-size: 1.5em; font-weight: 700; color: #000; }
#actualite_event .two_columns > div p.small_title, #actualite_event .two_columns > div p strong { font-weight: 700; color: #000; font-size: 1.2em; }
#actualite_event .two_columns > div .top_space { margin-top: 20px; }

#actualite_event .image_text_block { overflow: hidden; }
#actualite_event .image_text_block > div { float: left; }
#actualite_event .image_text_block > div.text_area { width: 290px; box-sizing: border-box; padding: 30px 30px 30px 30px; height: 434px; border-style: solid; border-color: #ccc; border-width: 1px; }

#actualite_event .event_calendar_table { border-top: solid 1px #ccc; }
#actualite_event .event_calendar_table ul { overflow: hidden; padding: 10px 0; border-bottom: solid 1px #ccc; }
#actualite_event .event_calendar_table ul li { float: left; width: 33%; }
#actualite_event .event_calendar_table ul li p strong { color: #000; font-size: 1.2em; }

.actualite_tourne li { float: left; width: 33%; color: #cccccc; text-transform: capitalize; }
.actualite_tourne li strong { color: #6b6b6b; text-transform: uppercase; font-weight: 400; }
.actualite_tourne { overflow: hidden; }

/* page atualite tourne */

#actualite_tourne { margin-top: 70px; }
#actualite_tourne .top { position: relative; height: 374px; }
#actualite_tourne .top > img { display: block; width: 310px; height: 374px; position: absolute; top: 0; left: 0; }
#actualite_tourne .top .text_area { padding-left: 350px; box-sizing: border-box; text-align: center; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); }

#actualite_tourne h2 { font-family: "Merriweather"; font-size: 2em; color: #000; margin-bottom: 30px; text-transform: uppercase; }
#actualite_tourne p { font-family: "Helvetica Neue LT Std", sans-serif; color: #808080; margin-top: 10px; text-align: justify; }

#actualite_tourne .list { margin-top: 40px; }
#actualite_tourne .list li { color: #cccccc; text-transform: capitalize; }
#actualite_tourne .list li strong { color: #6b6b6b; text-transform: uppercase; font-weight: 400; }
#actualite_tourne .list ul { overflow: hidden; }
#actualite_tourne .list ul li { float: left; width: 33%; }

/* page contact */

header.contact { background: none; }
section.contact { background-image: url(../img/contact_back.png); background-size: cover; }

#layer_contact { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); }

#contact { margin: auto; text-align: center; }
#contact label.error { text-shadow: 5px 0px 10px #fff; }
#contact h1 { color: #fff; font-family: "Merriweather"; font-weight: 700; font-size: 3em; }
#contact ul.two_columns li { height: 40px; padding-right: 5px; position: relative; overflow: initial; }
#contact ul.two_columns li:nth-child(2n) { padding-left: 5px; padding-right: 0; }
#contact ul.two_columns li:nth-child(2n) label.error { padding-left: 5px; }
#contact ul.two_columns li.short { width: 32%; padding: 0; }
#contact ul.two_columns li.short + li.short { margin-left: 2%; }
#contact ul.two_columns li.long { width: 100%; padding: 0; }
#contact ul.two_columns li.long.text { height: auto; }

#contact form input, textarea { height: 40px; box-sizing: border-box; padding: 20px; font-family: "Merriweather"; font-weight: 700; font-size: 1.5em; color: #cccccc; width: 100%; border: 0; }
#contact form textarea { height: 170px; }
#contact form button { float: right; font-family: "Merriweather"; font-size: 1.5em; border: 0; background: none; color: #fff; font-weight: 700; cursor: pointer; }

/* page pourquoi donner */

#pourquoi_donner h2 { font-family: "Merriweather"; font-size: 2em; color: #000; text-transform: uppercase; margin-bottom: 40px; }
#pourquoi_donner > ul > li { height: 490px; }
#pourquoi_donner > ul > li:first-child p { font-family: "Helvetica Neue LT Std", sans-serif; font-size: 1.167em; color: #808080; margin-top: 20px; }
#pourquoi_donner > ul > li:first-child p.signature { /*font-family: "shelterMe";*/ font-size: 2.6em; color: #cccccc; }

#pourquoi_donner > ul > li:first-child a { box-sizing: border-box; border: 0; background: #c9a64f; color: #fff; font-family: "Merriweather"; font-size: 1em; cursor: pointer; position: relative; text-transform: capitalize; padding: 0 50px; float: right; height: 33px; line-height: 33px; }
#pourquoi_donner > ul > li:first-child a:before { content: ""; width: 9px; height: 100%; background: #ae914e; position: absolute; top: 0; left: 0; }
#pourquoi_donner > ul > li:first-child a:after { content: "\f138"; font-family: "Fontawesome"; font-size: 1.2em; position: absolute; right: 15px; top: 0px; }

#pourquoi_donner > ul > li:last-child { padding-top: 80px; }

/* page 404 */

#error404 { text-align: center; }
#error404 h2 { font-family: "Merriweather"; font-weight: 700; font-size: 3em; color: #000; margin-bottom: 30px; }
#error404 p { font-family: "Helvetica Neue LT Std", sans-serif; font-size: 2em; color: #ccc; }

/* page faire un don */

#faire_un_don { margin-top: 70px; }
#faire_un_don h2 { font-family: "Merriweather"; font-size: 2em; color: #000; text-transform: uppercase; margin-bottom: 30px; }
#faire_un_don label { font-family: "Merriweather"; font-size: 1.083em; color: #6b6b6b; }
#faire_un_don label span { color: #c9a64f; }
#faire_un_don input[type="radio"] { margin: 0 10px; vertical-align: middle; }
#faire_un_don ul.three_columns li { height: auto; margin-top: 0; }

.tags_title { text-align: center; }
.tags_title li { display: inline-block; font-family: "Merriweather"; font-size: 0.75em; color: #c9a64f; padding: 35px; opacity: 0.5; position: relative; }
.tags_title li.active { opacity: 1; }
.tags_title li div { position: absolute; width: 20px; height: 20px; border: solid 1px #c9a64f; border-radius: 11px; line-height: 20px; font-size: 1.1em; top: 0; left: 50%; margin-left: -11px; }

#faire_un_don form button.form_step_submit { float: right; width: 189px; height: 33px; box-sizing: border-box; border: 0; background: #c9a64f; color: #fff; font-family: "Merriweather"; font-size: 1.167em; cursor: pointer; position: relative; text-transform: capitalize; }
#faire_un_don form button.form_step_submit:before { content: ""; width: 9px; height: 100%; background: #ae914e; position: absolute; top: 0; left: 0; }
#faire_un_don form button.form_step_submit:after { content: "\f138"; font-family: "Fontawesome"; font-size: 1.2em; position: absolute; right: 15px; top: 8px; }

form#step1 .one_row label { opacity: 0.5; cursor: pointer; }
form#step1 .one_row label.active { opacity: 1; }
form#step1 .child_checkbox .three_columns { position: relative; }
form#step1 .child_checkbox .three_columns li { margin-top: 5px; position: relative; }
form#step1 .child_checkbox .three_columns li .coverlay { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(255,255,255,0.5); border: 0; }
form#step1 .child_checkbox .three_columns li.active .coverlay { display: none; }
form#step1 .child_checkbox .three_columns li label { display: block; width: 100%; box-sizing: border-box; padding: 5px 10px; border: solid 1px #ccc; margin-top: 5px; cursor: pointer; }
form#step1 .child_checkbox .three_columns li label.active { border: 0; padding: 6px 10px; background: #c9a64f; }
form#step1 .child_checkbox .three_columns li label:hover { border: 0; padding: 6px 10px;  background: #c9a64f; }
form#step1 .child_checkbox .address { padding: 0 10px; box-sizing: border-box; }
form#step1 .child_checkbox .address > div { border: solid 1px #ccc; padding: 20px 40px; margin-top: 5px; font-family: "Merriweather"; font-size: 1.083em; color: #6b6b6b; }
form#step1 .child_checkbox .address p.notice { font-family: "Merriweather"; color: #6b6b6b; font-size: 0.67em; margin-top: 10px; text-align: justify; }
form#step1 .child_checkbox .three_columns button { position: absolute; right: 0; bottom: 0; }


#faire_un_don ul.two_columns li { height: 60px; margin-top: 0; position: relative; overflow: initial; }
#faire_un_don ul.two_columns li input, select { padding: 5px 10px; height: 34px; }
#faire_un_don ul.two_columns li ul.two_columns li { padding-right: 5px; } 
#faire_un_don ul.two_columns li ul.two_columns li:nth-child(2n) { padding-right: 0; padding-left: 5px; }
#faire_un_don ul.two_columns li:nth-child(2n) > label.error { padding-left: 50px; }
#faire_un_don ul.two_columns li ul.two_columns li:nth-child(2n) > label.error { padding-left: 5px; }

form#step3 .top { overflow: hidden; margin-bottom: 50px; }
form#step3 .top > div { float: left; }
form#step3 .top > div:first-child { padding-right: 130px; }
form#step3 .top > div p { font-family: "Merriweather"; font-weight: 700; font-size: 0.7em; color: #ccc; line-height: 2; }
form#step3 .top > div p.title { font-size: 1.5em; margin-bottom: 10px; }
form#step3 .top > div label { margin-right: 10px; display: inline-block; position: relative; cursor: pointer; opacity: 0.5; transition:all 0.3s ease-in-out; }
form#step3 .top > div label:hover, form#step3 .top > div label.active { opacity: 1; }
form#step3 .top > div label input { position: absolute; top: 0; left: 0; opacity: 0; }

#faire_un_don #step_4 ul.two_columns li { height: auto; }
#step_4 h3 { font-family: "Merriweather"; font-size: 1.5em; color: #c9a64f; margin-bottom: 10px; }
#step_4 ul > li:first-child p { font-family: "Helvetica Neue LT Std", sans-serif; color: #6b6b6b; margin-top: 10px; }
#step_4 ul > li:first-child p span { color: #ccc; }

#faire_un_don label.error { bottom: 5px; font-size: 1em; color: red; }

/* timeline css */

#my-timeline .vco-slider .nav-next .icon { background-image: url(../img/goright.png); width: 29px; height: 48px; background-position: center; }
#my-timeline .vco-slider .nav-previous .icon { background-image: url(../img/goleft.png); width: 29px; height: 48px; background-position: center; }
#my-timeline .vco-slider .nav-next .date, 
#my-timeline .vco-slider .nav-next .title,
#my-timeline .vco-slider .nav-previous .date,
#my-timeline .vco-slider .nav-previous .title { display: none; }

/* page venir visiter */

#venir_visiter a { color: inherit; text-decoration: none; transition:all 0.3s ease-in-out; }
#venir_visiter a:hover { text-decoration: underline; }
#venir_visiter p { font-family: "Helvetica Neue LT Std", sans-serif; color: #808080; line-height: 1.6; text-align: justify; }
#venir_visiter p+p { margin-top: 10px; }
#venir_visiter p.title { font-size: 1.167em; font-weight: 700; text-transform: uppercase; }
#venir_visiter p span { font-weight: 700; text-transform: uppercase; }
#venir_visiter h2 { font-family: "Merriweather"; color: #000; font-size: 2em; text-transform: uppercase; margin-top: 50px; }

#venir_visiter .top { overflow: hidden; }
#venir_visiter .top > div { float: left; }
#venir_visiter .top > div:first-child { width: 400px; height: 270px; overflow: hidden; }
#venir_visiter .top > div:first-child img { max-height: 100%; max-width: 100%; }
#venir_visiter .top > div:last-child { width: 560px; box-sizing: border-box; padding-left: 114px; }

#venir_visiter ul.two_columns li { height: auto; }
#venir_visiter ul.two_columns li > ul li { float: none; width: auto; padding: 0; }
#venir_visiter ul.two_columns li > ul li:nth-child(2n) { padding: 0; }

#map_info { width: 100%; height: 264px; margin-top: 30px; }

/* page technique et innovation */

#technique { margin-top: 70px; }
#technique h2 { font-family: "Merriweather"; font-size: 2em; color: #000; text-transform: uppercase; margin-bottom: 40px; }
#technique p { font-family: "Helvetica Neue LT Std", sans-serif; color: #808080; line-height: 1.6; margin-top: 10px; text-align: justify; }
#technique p.right { text-align: right; }


/* css timeline */
#my-timeline .vco-slider .slider-item .content .content-container .text .container h2.date { font-size: 25px; font-weight: 700; margin-bottom: 15px; line-height: 25px; }
#my-timeline .vco-storyjs strong { color: #666; display: block; margin-top: 20px; line-height: 1.4; }
#my-timeline .vco-slider .slider-item .content .content-container .text .container p { text-align: justify; }

/* style mobile */

@media all and (max-width : 1200px){
    /* general style */
    footer { display: none; }
    section article { padding: 0 10%; }
    .wrapper { width: 100%; margin: 70px auto 0 auto; }
    #submenu { width: 90%; }
    #submenu li a { font-size: 1.1em; }
    ul.two_columns li { width: 100%; float: none; padding: 0; height: auto; }
    ul.two_columns li:nth-child(2n) { padding: 0; }
    ul.three_columns li { width: 100%; float: none; }
    ul.three_columns li:nth-child(3n), ul.three_columns li:nth-child(3n-1) { margin-left: 0; }
    ul.three_columns li iframe { max-width: 500px; }
    /* page home */
    .frontpage section h1 { display: block; width: 80%; margin: auto; position: relative; }
    .frontpage section h1 img { position: relative; top: auto; left: auto; max-width: 100%; }
    .frontpage section h1:before { content: ""; width: 100%; height: 0; box-shadow: 0px 0px 80px 50px #fff; position: absolute; top: 50%; left: 0; }
    /* menu */
    nav { width: 100%; right: -100%; }
    /* page inside header */
    .menu-anchor { right: 10%; }
    header { padding: 42px 10%; }
    header h1 { font-size: 1.6em; }
    header h1 span, header #logo { display: none; }
    /* page intro */
    #intro { height: auto; margin-top: 0; }
    #intro img { float: none; max-width: 100%; margin: auto; height: auto; min-height: 327px; }
    #intro .text_area { float: none; top: auto; width: 100%; margin-top: 20px; -webkit-transform: none; -ms-transform: none; -moz-transform: none; transform: none; }
    #intro .text_area p { text-align: left; }
    #intro .button { width: 100%; font-size: 1.1em; }
    #intro .button:last-child { font-size: 0.85em; }
    /* page popin */
    .popin_content { padding: 50px 20px; }
    .popin_content h1 { font-size: 1.4em; }
    .popinskin .fancybox-skin .fancybox-close, .popinskin-devices .fancybox-skin .fancybox-close { top: 5px; }
    .cahier_content { padding: 50px 20px; }
    .cahier_content h3 { font-size: 1.4em; }
    .cahier_content .button { width: 100%; height: auto; line-height: 22px; padding: 5px 0; box-sizing: border-box; }
    /* page témoignages ecrits */
    #submenu li { display: block; margin-right: 0; }
    #submenu li:last-child { padding-right: 0; }
    /* page témoignages vidéos */
    #videos ul { height: auto; }
    #videos .goup, #videos .godown, #videos .layout { display: none; }
    /* page galeries */
    #galery { margin-top: 0; }
    #galery .goleft, #galery .goright { display: none; }
    #galery ul { width: 100%; height: auto; }
    #galery ul li { position: relative; top: auto; left: auto; margin-left: 0; }
    #galery ul li > div { display: block; margin: 10px auto; }
    .galery_content img { padding: 0; max-width: 100%; }
    /* page document rares */
    #documents, #liens { margin-top: 0; }
    #documents > div { float: none; }
    #documents > div.title_area { width: 100%; height: auto; margin-bottom: 20px; padding: 0; }
    #documents .title_area div { top: auto; -webkit-transform: none; -ms-transform: none; -moz-transform: none; transform: none; }
    #documents > div.documents_area { width: 100%; padding: 0; }
    /* page technique */
    #technique { margin-top: 150px; }
    #technique h2 { font-size: 1.5em; }
    /* page oeuvres */
    #oeuvres { margin-top: 120px; }
    #oeuvres .goup, #oeuvres .godown, #oeuvres .layout { display: none; }
    #oeuvres ul { height: auto; }
    #oeuvres li { width: 100%; float: none; margin: 20px 0; }
    #oeuvres li iframe { max-width: 500px; }
    /* page liens */
    #liens.inside { margin-top: 150px; }
    /* page venir */
    #venir_visiter { margin-top: 0; }
    #venir_visiter .top > div:first-child { display: none; }
    #venir_visiter .top > div:last-child { width: 100%; padding: 0; }
    #venir_visiter h2 { font-size: 1.4em; margin-bottom: 10px; }
    #venir_visiter ul.two_columns li { margin-top: 0; }
    #venir_visiter ul.two_columns li > ul li:nth-child(2n) { margin-top: 10px; }
    /* page cahiers */
    #documents.inside { margin-top: 180px; }
    /* page publications */
    #publications { margin-top: 160px; }
    #publications h2 { display: none; }
    #publications ul.two_columns li { height: auto; width: 80%; margin: 50px auto; }
    #publications ul.two_columns li > div { float: none; height: auto; }
    #publications ul.two_columns li img { width: 100%; height: auto; max-width: 150px; }
    #publications ul.two_columns li > div.text_content { width: 100%; margin-left: 0; margin-top: 10px; }
    /* page formulaire */
    #formulaire { margin-top: 0; }
    #formulaire h2 { font-size: 1.4em; }
    #traveux ul.two_columns li,
    #traveux ul.two_columns li:nth-child(2n),
    #traveux ul.two_columns li.long ul.two_columns li,
    #traveux ul.two_columns li.long ul.two_columns li:nth-child(2n),
    #traveux ul.two_columns li:nth-child(2n) label.error,
    #traveux ul.two_columns li.long ul.two_columns li:nth-child(2n) label.error { padding: 0; }
    #traveux ul.two_columns li.notice { height: auto; }
    /* page fondation */
    #fondation { margin-top: 0; }
    #fondation > div { float: none; }
    #fondation > div.title_area { width: 100%; padding: 0; }
    #fondation > div.content_area { width: 100%; }
    #fondation > div.content_area .image_block { float: none; }
    /* page fondation details */
    #fondation_details { margin-top: 200px; }
    #fondation_details > div { float: none; }
    #fondation_details > div.title_area { width: 100%; padding: 0; }
    #fondation_details > div.content_area { width: 100%; height: auto; }
    #fondation_details div.content_area > div { padding: 50px 0; }
    #fondation_video div.top > div { float: none; }
    #fondation_video div.top > div.video_area { width: 100%; }
    #fondation_video div.top > div.text_area { width: 100%; padding: 0; margin-top: 10px; }
    #fondation_details h3 { font-size: 1.4em; margin-bottom: 10px; }
    /* page calendrier */
    #actualite_calendrier { margin-top: 150px; }
    #actualite_calendrier > div > div { float: none; width: 100%; }
    #actualite_calendrier > div > div.text_area { padding: 0; margin-top: 10px; }
    #actualite_calendrier > div > div.text_area h2 { font-size: 1.5em; margin-bottom: 10px; }
    #actualite_calendrier > div > div.text_area div+div { margin-top: 10px; }
    #actualite_calendrier .image_list { margin: 50px 0; }
    #actualite_calendrier .image_list li { float: none; padding: 0; width: 100%; margin-bottom: 20px; text-align: left; }
    #actualite_calendrier .image_list li p { height: auto; }
    #actualite_calendrier .image_list li h3 { margin-top: 10px; margin-bottom: 10px; }
    #actualite_calendrier > div > div.image_area img { max-width: 500px; }
    #actualite_calendrier .image_list li img { max-width: 200px; }
    /* page evénement */
    #actualite_event { margin-top: 160px; }
    #actualite_event > img { max-width: 100%; height: auto; position: relative; top: auto; left: auto; margin: auto; }
    #actualite_event .text_area { padding: 0; /*margin-top: 50px;*/ }
    #actualite_event .text_area h2 { font-size: 1.5em; }
    /* page tournée américaine */
    #actualite_tourne { margin-top: 160px; }
    #actualite_tourne .top { height: auto; }
    #actualite_tourne .top > img { max-width: 100%; height: auto; position: relative; top: auto; left: auto; margin: auto; }
    #actualite_tourne .top .text_area { padding: 0; top: auto; text-align: left; margin-top: 20px; -webkit-transform: none; -ms-transform: none; -moz-transform: none; transform: none; }
    #actualite_tourne h2 { font-size: 1.4em; margin-bottom: 20px; }
    #actualite_tourne .list ul li { float: none; width: 100%; }
    #actualite_tourne .list ul li+li { margin-top: 10px; }
    /* page contact */
    #contact ul.two_columns li.short { width: 100%; }
    #contact ul.two_columns li.short + li.short { margin-left: 0; }
    #contact ul.two_columns li:nth-child(2n) { padding: 0; }
    #contact form button { float: none; margin: auto; }
    #contact form input, textarea { font-size: 1.3em; }
    /* page pourquoi donner */
    #pourquoi_donner { margin-top: 120px; }
    #pourquoi_donner h2 { font-size: 1.5em; }
    #pourquoi_donner > ul > li { height: auto; }
    #newletter_sidebar form { border: 0; }
    #newletter_sidebar form input { width: 100%; border-top: solid 4px #d6c8a6; }
    #newletter_sidebar form button { float: right; width: 150px; margin-top: 20px; }
    /* page faire un don */
    #faire_un_don { margin-top: 150px; }
    #faire_un_don h2 { font-size: 1.5em; }
    .tags_title li { padding: 35px 5px; }
    #faire_un_don form#step1 ul.three_columns li { margin-top: 10px; }
    form#step1 .one_row label.active { margin-bottom: 250px; display: block; }
    form#step1 > ul { position: relative; }
    form#step1 .child_checkbox .three_columns { position: initial; }
    form#step1 .child_checkbox .three_columns li { position: absolute; top: 30px; left: 10%; width: 80%; margin-top: 0; display: none; }
    form#step1 .child_checkbox .three_columns li.active { display: block; }
    form#step1 .child_checkbox .three_columns li:nth-child(2) { top: 60px; }
    form#step1 .child_checkbox .three_columns li:nth-child(3) { top: 90px; }
    #faire_un_don .one_row ul.three_columns li:nth-child(3) { padding-bottom: 50px; }
    #faire_un_don ul.two_columns li { height: auto; }
    #faire_un_don ul.two_columns li ul.two_columns li,
    #faire_un_don ul.two_columns li ul.two_columns li:nth-child(2n),
    #faire_un_don ul.two_columns li ul.two_columns li:nth-child(2n) > label.error,
    #faire_un_don ul.two_columns li:nth-child(2n) > label.error { padding: 0; }
    #faire_un_don form#step2 input, select { margin-bottom: 25px; }
    form#step3 .top > div:first-child { padding: 0; }
    form#step3 .top > div:last-child { margin-top: 20px; }
    form#step3 .top > div label { margin-top: 10px; }
    form#step3 .top { margin-bottom: 20px; }
    form#step3 input { margin-bottom: 25px; }
    #faire_un_don #step_4 ul.two_columns > li { margin-bottom: 40px; }
    #faire_un_don #step_4 #newletter_sidebar .social_inside li { margin-top: 20px; }
    .galery_content.documents img { max-width: 100%; }
    .galery_content .image_area { width: 100%; }
    .galery_content > div { min-height: 0; }
}

@media all and (max-width : 480px){
    .galery_content img { height: auto; }
}