/*
 * les couleurs
 * rose : F088B6
 * vert : 3AAA35
 * jaune : F3E600
*/
/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.visuallyhidden, .arbo, header.main h1 {
    border:      0;
    clip:        rect(0 0 0 0);
    clip-path:   inset(50%);
    height:      1px;
    margin:      0;
    overflow:    hidden;
    padding:     0;
    position:    absolute;
    width:       1px;
    white-space: nowrap; /* 1 */
}
    /*
     * Extends the .visuallyhidden class to allow the element
     * to be focusable when navigated to via the keyboard:
     * https://www.drupal.org/node/897638
     */
.visuallyhidden .focusable:active,
.visuallyhidden .focusable:focus {
	clip:        auto;
	clip-path:   none;
	height:      auto;
	margin:      0;
	overflow:    visible;
	position:    static;
	width:       auto;
	white-space: inherit;
}

/*@font-face {
	font-family: Capture It;
	font-style: normal;
	font-weight: 500;
	src: url('../webfonts/acherus_militant_light.woff') format('woff'), url('../webfonts/acherus_militant_light.woff2') format("woff2");
}*/
@font-face {
	font-family: 'Quicksand';
	font-style: normal;
	font-weight: 400;
	src: url('../webfonts/Quicksand-Regular.woff') format('woff'), url('../webfonts/Quicksand-Regular.woff2') format("woff2");
}
@font-face {
	font-family: 'Quicksand';
	font-style: italic;
	font-weight: 400;
	src: url('../webfonts/Quicksand-Italic.woff') format('woff'), url('../webfonts/Quicksand-Italic.woff2') format("woff2");
}
@font-face {
	font-family: 'Quicksand';
	font-style: normal;
	font-weight: 200;
	src: url('../webfonts/Quicksand-Light.woff') format('woff'), url('../webfonts/Quicksand-Light.woff2') format("woff2");
}
@font-face {
	font-family: 'Quicksand';
	font-style: italic;
	font-weight: 200;
	src: url('../webfonts/Quicksand-LightItalic.woff') format('woff'), url('../webfonts/Quicksand-LightItalic.woff2') format("woff2");
}
@font-face {
	font-family: 'Quicksand';
	font-style: normal;
	font-weight: 700;
	src: url('../webfonts/Quicksand-Bold.woff') format('woff'), url('../webfonts/Quicksand-Bold.woff2') format("woff2");
}
@font-face {
	font-family: 'Quicksand';
	font-style: italic;
	font-weight: 700;
	src: url('../webfonts/Quicksand-BoldItalic.woff') format('woff'), url('../webfonts/Quicksand-BoldItalic.woff2') format("woff2");
}




body {
	background: white url('../images/trames-page_t.png');
	color: #000;
	font-family: 'Quicksand', sans-serif;
}
a {
	color: #000;
}

h1, h2, h3, h4 {
	color: #000;
}

h1, h2, h3, #sidebar #menu a, .pop .identity, #menu ul a.opener, #menu ul span.opener {
	font-family:'Quicksand', sans-serif;
	letter-spacing: 0;
    font-size: 190%;
}

table tbody tr:nth-child(2n+1) {
	background:white;
}
table tbody tr {
	border:0;
}
table td {
    padding: 3.5em .75em;
	width:33%;
}

#sidebar {
	color: #161616;
	background: url('../images/trames-menu_t.png');
	@media (max-width: 1280px) {
		background-color: white;
	}
}
#sidebar #menu {
}
#sidebar #menu a, #menu ul span.opener {
	display: inline-block;
	color: #000;
	font-size: 1rem;
	padding: 0 .2em;
	font-weight: 700;
	text-transform: none;
}
#sidebar #menu > ul > li > a {
	font-size: 1.5rem;
}
#sidebar #menu .article_lien a {
	font-weight: 400;
}
#sidebar #menu a.accueil {
	display: none;
}
#sidebar #menu li li a:before {
/* 	display: inline-block; */
/* 	content: '+'; */
}
/*#sidebar #menu li.on a, */#sidebar #menu a:hover, #sidebar #menu li.on a:hover, #menu ul a.opener:hover, #menu ul span.opener:hover {
/* 	color:#fff; */
	background: white;
}
#sidebar #menu a.on, #sidebar #menu li.on a.on {
/* 	color:#F3E600; */
/* 	background: #000; */
/* 	text-decoration: underline; */
}
#sidebar h2, #sidebar h3 {
/* 	color:#3AAA35; */
	border:0;
	margin:0;
}
#sidebar h2, #sidebar #menu h2 a {
/* 	font-size: 3rem; */
	font-weight:700;
/* 	margin-bottom:0.5rem; */
/* 	color: #3AAA35; */
}
#sidebar .major h2 {
	font-size: 1rem;
	width: 100px;
	line-height: 1;
}
#sidebar h3 {
	font-size: 1rem;
}
#sidebar ul.icons li .icon::before {
    font-size: 1em;
}
#sidebar .major {
	margin-bottom:2rem;
}
#sidebar > .inner > #menu {
	border:0;
}
#sidebar .toggle {
	z-index:990;
}

#menu > ul > li {
	border: 0;
	text-align: right;
}
#menu ul a.opener, #menu ul span.opener {
	cursor: pointer;
}
#menu ul a.opener:before, #menu ul span.opener:before {
	display: none;
}

#menu > ul > li > ul, #menu > ul > li > ul > li, #menu > ul > li {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}
#sidebar #menu li li a {
	font-size: 1rem;
}
#menu > ul > li.on > ul {
	display: block;
}


.pop {
	position:fixed;
	top:0;
	left:0;
	right:0;
	height:100vh;
	width:100vw;
	z-index:9988;
	transition:all 0.3s ease-in-out;
	background-color:#000;
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
}
.pop.ouverture {
	background-image:none;
}
.pop.cache {
	top:-100vh;
}
.pop > a.nobox {
	display:block;
	width:100%;
	height:100%;
	background-size:cover;
	background-position:center;
	z-index:9989;
}
.pop > a.popout {
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	top:0;
	font-size:5rem;
	color:#000;
/* 	margin-left:-50px; */
/* 	width:100px; */
	text-align:center;
	line-height:100vh;
	display:block;
	cursor:pointer;
/* 	text-shadow: 0 0 20px white; */
	transition:all 0.3s ease-in-out;
/* 	background-color:#000; */
	animation-duration: 6s;
	animation-name: popin;
}
.pop > a.popout.opaque {
	background:#000;
}

@keyframes popin {
	0% {
		background-color:#000;
	}
	30% {
		background-color:#000;
	}
	80% {
		background-color:transparent;
	}
}


.pop .identity {
	position:absolute;
	left:50%;
	top:50%;
	width:250px;
	min-height:250px;
	margin-left:-125px;
	margin-top:-125px;
	z-index:9989;
	color:#fff;
	font-size:2.5rem;
	text-align:center;
	font-weight:700;
	line-height:1.2;
	padding:4.5rem 0 0;
	border-radius:50%;
/* 	text-shadow: 0 0 10px white; */
	background:#000;
	opacity:0;
	animation-name: popidentity;
	animation-duration:60s;
}
.pop .identity .slogan_site {
	font-size:80%;
}
@keyframes popidentity {
	0% {
		opacity:0;
	}
	7% {
		opacity:0;
	}
	8% {
		opacity:1;
	}
	100% {
		opacity:1;
	}
}

.pop .brand {
	position:absolute;
	left:50%;
	top:50%;
/* 	width:150px; */
	margin-left:-125px;
	margin-top:-125px;
	z-index:9989;
	opacity:0;
	animation-name: popbrand;
	animation-duration:6s;
}

@keyframes popbrand {
	0% {
		opacity:0;
	}
	30% {
		opacity:1;
	}
	85% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}

#sidebar > .inner {
	min-height: 97vh;
	padding-bottom: 3em;
}
#footer {
/* 	position: absolute; */
/* 	bottom: 0; */
}
#footer .copyright {
	color: #000;
	font-size: 0.9em;
}


/* contenu */
header.main p {
	text-transform: none;
	font-size: 0.8em
}
#header {
	padding:0;
}
#main > .inner > section {
/*     padding:0; */
}

.composition_galerie #main {
/* 	background:#000; */
/* 	color:white; */
}
.composition_galerie h2, .composition_galerie h3 {
/* 	color:white; */
}

.documents_portfolio .row > * {
	padding:0;
}
.image, .image img {
	border-radius:0;
}
.image.fit {
	margin:0;
}
.oeuvre {
	position:relative;
	margin:1rem 1rem 2rem;
}
/*.oeuvre .spip_out {
	position:absolute;
	display:inline-block;
	bottom:-25px;
	left:50%;
	margin-left:-25px;
	width:50px;
	height:50px;
	opacity:0;
	background:url('../images/behance50.png') center;
	background-size:cover;
	text-indent:100px;
	overflow:hidden;
}*/
.oeuvre .titre_doc {
	opacity:0;
	color:#fff;
	font-weight:700;
	font-size:1.2rem;
	background:rgba(0,0,0,0.3);
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:                flex;
	flex-direction:         column;
	-webkit-flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align:center;

}
.oeuvre:hover .spip_out {
	opacity:1;
}
.oeuvre:hover .titre_doc {
	opacity:1;
}
body.overflowhidden {
	overflow:hidden;
}

@media (max-width:640px) {
	.row > .col-4 {
		width: 100%;
	}
}


/* .imagesenligne */
.imagesenligne {
	display: flex;
}
.imagesenligne span {
	margin:0 0.5rem;
	text-align:center;
}
.imagesenligne i {
	font-weight:700;

}

.spip_document_icone {
	max-width: 100px;
	display: block;
}

.banner_content {
    padding: 6em 0 4em 0;
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
}


#main > .inner {
	padding:0;
}
#main > .inner > section {
	padding:0 5rem 5rem;
}
#main > .inner > section:first-of-type {
	display:block;
	padding:0;

}
#main > .inner > section {
	border:0;
}
.demifond {
	margin:-0.3rem 0 150px;
	width:100%;
	height:50vh;
	position:relative;
	background-size:cover;
	background-position:center;
}
.portrait {
	position:absolute;
	width:250px;
	height:250px;
	left:50%;
	margin-left:-125px;
	bottom:-125px;
}

.content {
	padding:0 5rem;
}

.posts article .image {
	margin: 0;
}
.posts article h3 {
	margin: 0;
	font-size: 1rem;
}
.posts article p {
	margin: 0;
}
input[type="submit"], input[type="reset"], input[type="button"], button, .button {
	line-height: 2em;
	height: 2em;
	border-top: 1px solid;
	border-bottom: 1px solid;
	border-radius: 0;
	box-shadow: none;
	padding: 0;
	color: #aaa !important;
}

.page_article #main > .inner > section:first-of-type {
	padding-top:5rem;
}
.page_article #main > .inner > section .texte {
/* 	padding:0 5rem; */
}
.page_article .demifond {
	margin-top:-5.3rem;
}

.box_mediabox .lity-content {
	max-width: 600px;
}
/*.box_mediabox .lity-content, .box_mediabox.lity-inline .lity-content, .box_mediabox.lity-ajax .lity-content {
	background: #ddd;
	color: #000;
}*/
.lity-content #banner {
	padding: 0;
}
.box_mediabox .lity-content h1,
.box_mediabox .lity-content h2,
.box_mediabox .lity-content h3 {
	color: #000;
}


html .pswp__caption__center {
	text-align:center;
}

body .pswp__bg, body .pswp__img  {
	background: white;
}



@media (max-width:768px) {


}
@media screen and (max-width: 736px) {
	#sidebar .toggle::after {
		background-color: transparent;
	}