@charset "utf-8";

.inf1110 {display:none;}
.sup1110 {display:block;}

@media all and (max-width:1110px) {

	/* Global */
	#global-contenu {padding:0 15px;}
	.inf1110 {display:block !important;}
	.sup1110 {display:none !important;}
	
	/* Accueil */
	#accueil .slide {width: 100%; height:auto;}
	#accueil .slide .photo {height: auto;}
	#accueil .slide .texte {padding-top:20px;}
	#accueil .flexslider .slides img {max-width:100%; height:auto;}
	
	/* Artistes */
	#artistes .apercu { display:none !important; }
	
	/* Travaux */
	#travaux .travail .previews {height:auto;}
	#travaux .travail .previews .oeuvre,
	#travaux .travail .oeuvres .oeuvre {
		display:inline-block;
		float: none;
		width: 33%;
		max-width: 236px;
		max-height: 170px;
		vertical-align: top;
	}
	#travaux .travail .overview {
		position:static;
		display:block;
		margin-top:10px;
	}
	
	/* Travaux détail */
	#travaux .detailtravail .oeuvres .row {height: auto; margin: 0px; display:inline;}
	#travaux .detailtravail .oeuvres .oeuvre { float: none; display:inline-block; vertical-align:top; width:auto; margin:9px; max-width:222px;}
	#travaux .detailtravail .oeuvres .legende { height: auto; min-height:30px;}
	
	/* Biographie */
	#biographie .gauche {width:59%;}
	#biographie .droite {width:calc(41% - 34px);}
	#biographie .supplements .colg {width:59%;}
	#biographie .supplements .colg .colg-contenu {width:auto;}
	#biographie .supplements .cold {width:calc(41% - 34px);}
	
	#biographie .supplement {}
	#biographie .supplement .expositionspolka,
	#biographie .supplement .publications {font-size:0px;}
	#biographie .supplement .row {height: auto; display:inline;}
	#biographie .supplement .item {display:inline-block; float:none; font-size:14.4px; min-height:200px; height:auto; margin:4px; vertical-align:top;}
	#biographie .supplement .photo {}
	#biographie .cleart385 {display:none;}
	#biographie .publications {font-size:0px;}
	
	/* Expositions */
	#expos .expositionlarge .photo {width:auto; height:auto;}
	#expos .expositionlarge .photo img {display:block; max-width:100%; height:auto;}
	#expos .exposition-contenu {font-size:0px; overflow:hidden;}
	#expos .exposition {float:none; display:inline-block; vertical-align:top; margin:0 17px; font-size: 14.4px;}
	
	/* Exposition présentation */
	#expo .gauche {width:51%;}
	#expo .droite {width:calc(49% - 34px);}
	
	/* Exposition les oeuvres */
	#expo .mosaique .oeuvres .row {height: auto; margin: 0px; display:inline;}
	#expo .mosaique .oeuvres .oeuvre { float: none; display:inline-block; vertical-align:top; width:auto; margin:9px; max-width:222px;}
	#expo .mosaique .oeuvres .legende { height: auto; min-height:30px;}
	
	/* Foires */
	#foires {}
	#foires .foire {}
	#foires .foire .logo {float: none; display:inline-block; width: 195px; height: 59px; vertical-align:top;}
	#foires .foire .infos {float: none; display:inline-block; width: 232px; min-height: 59px; vertical-align:top;}
	#foires .foire .intro {display:inline-block; margin-left:0px; min-height: 59px; vertical-align:top; width:calc(100% - 427px); vertical-align:top;}
	
	/* Actualités */
	#actualites .flexslider {width: calc(100% - 165px); height: 450px; position: relative; margin-left: 165px;}
	#actualites .flexslider .slide .slideg {}
	#actualites .flexslider .slide .slided {width:calc(100% - 390px);}
	#actualites .flexslider .slides img {max-width:100%; height:auto;}
	#actualites .flexcontrols {width:100%;}
	
	#actualites .liste {width:auto;}
	#actualites .liste .gauche,
	#actualites .liste .droite { display:inline-block; vertical-align:top; width: calc(50% - 18px); margin: 0 9px; float: none; }
	#actualites .photo img {max-width:100%; height:auto;}
	
	/* Contact */
	#contact .gauche {float: none; display:inline-block; vertical-align:top;}
	#contact .contenu { margin-left: 0px; width: calc(100% - 300px); display:inline-block; vertical-align:top; overflow: hidden;}
	#contact .contenu ul {width: 100%; height: auto;}
	#contact .contenu ul li { width: 100%; height: auto}
	#contact .slides li img {display: block; float: none; max-width: 100%; height: auto;}
	
	/* Recrutement */
	#recrutement {}
	
	/* Defaut */
	#defaut {width:100%; max-width:475px;}
	
	/* Qui sommes-nous ? */
	#quisommesnous {width:100%; max-width:475px;}
	
	/* Wide oeuvre */
	#wide .templateOeuvres .oeuvres .current {width:100%; min-width:100%;}
	#wide .templateOeuvres .oeuvres {width:100%; min-width:100%;}
	#wide .templateOeuvres .oeuvres .current a.photo > img {height:auto !important; max-height:100%;}
	#wide .templateOeuvres .oeuvres .current .photoconteneur {height:auto;}
	#wide .templateOeuvres .oeuvres .suiv,
	#wide .templateOeuvres .oeuvres .prec {top: calc(50% - 89px) !important;}
	#wide .templateOeuvres .oeuvres #position {top: calc(50% - 55px) !important;}
	
	/* Newsletter */
	#newsletter {width: calc(100% - 165px); max-width:718px;}
	#newsletter .text {width:calc(100% - 79px);}
	
	/* Presse */
	#presse {width:calc(100% - 165px);}
	#presse img {max-width:100%; height:auto;}
}

@media all and (max-width:980px) {
	#fancybox-wrap {width:calc(100% - 80px) !important;}
	
	/* Bandeau */
	
	/* Pied */
	#pied {}
	#pied .social {float: none; width: 100%; display: block; height: 14px; margin-bottom: 20px;}
	
	/* Travaux */
	#travaux .travail .previews {
		height: auto;
	}
	#travaux .travail .previews .oeuvre,
	#travaux .travail .oeuvres .oeuvre {
		width:auto;
		margin:10px;
		height:auto;
	}	
	
	/* Travaux détail */
	#travaux .detailtravail .droitecol {
		float: none;
		width: auto;
		text-align: right;
	}
	
	/* Biograplhie */
	#biographie .gauche {width:100%; display:block;}
	#biographie .texte {min-height:auto;}
	#biographie .droite {width:calc(100% - 165px); max-width:426px;  padding-left:0px; display:block; margin-top:0px; margin-left:165px;}
	#biographie .droite .photo {}
	#biographie .supplements .colg {width:auto; display:block;}
	#biographie .supplements .cold {width:auto; display:block; margin-left:165px;}
	
	/* Exposition présentation */
	#expo .gauche {width:100%; max-width:485px; display:block;}
	#expo .droite {width:100%; max-width:426px; padding-left:0px; display:block; margin-top:0px;}
	
	/* Foires */
	#foires .foire .intro {display:block; width:100%; }
	#foires .foire .infos {width:calc(100% - 195px);}
	
	/* Actualités */
	#actualites .flexslider .slide .slideg {width:275px;}
	#actualites .flexslider .slide .slided {width:calc(100% - 310px);}
	
	/* Contact */
	#contact .gauche {width:260px;}
	#contact .contenu {width:calc(100% - 260px);}
	
}

@media all and (max-width:780px) {
	/* Bandeau */
	#global.page #logo {width:auto;}
	
	/* Pied */
	#global #pied {margin-left:0px;}
	
	/* Artistes */
	#artistes {margin-left:0px;}
	
	/* Foires */
	#foires {margin-left:0px;}
	
	/* Actualités */
	#actualites {}
	#actualites .flexslider {margin-left:0px; width:100%;}
	#actualites .search {margin-left:0px;}
	#actualites .liste {margin-left:0px;}
	
	/* Contact */
	#contact {margin-left: 0px;}
	
	/* Recrutement */
	#recrutement {margin-left:0px;}
	
	/* Defaut */
	#defaut {margin-left:0px;}
	
	/* Qui sommes-nous ? */
	#quisommesnous {margin-left:0px;}

	/* Newsletter */	
	#newsletter {width: 100%; max-width:718px; margin-left:0px;}
	
	/* Presse */
	#presse {margin-left:0px; width:100%;}
	
	/* Expo */
	#expo .centre-contenu {margin-left: 0px !important;}
	#expo .header {margin-left: 0px !important;}
	#exposition-navigation .element {margin: 5px 10px;}
	#expo #exposition-navigation {}

	#expo #exposition-navigation {
		width: 100%;
		background: #fff;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		height: 40px;
		float:none;
	}
	
	#expo .gauche {margin: 0 auto;}
	
	#expo .flexslider-conteneur {padding:0px; margin-left:auto; margin-right:auto; width:100%; /*max-width:435px;*/}
	#expo .flexslider-conteneur .controls {display:none !important;}
	#expo .flexslider-conteneur {background-color: #fff;}
	
	.f-nav { top: 0px;}
}

@media all and (max-width:620px) {
	
	#global-contenu {padding:0px;}
	#bandeau-contenu {padding:0 15px; }
	#centre {padding:80px 15px 0 15px;}
	#wide #centre {padding:0px 15px 0 15px;}
	#global #pied {padding-left:15px; padding-right:15px;}
	
	#global.index #logo,
	#global.page #logo {float:none; display:inline-block; vertical-align:middle; padding:0px;}
	#global.index #bandeau,
	#global.page #bandeau {width:100%; background:#fff; padding-top:8px; padding-bottom:5px; position:fixed; z-index:1000; top:0px; left:0px; height:36px; -webkit-box-shadow: 0px 3px 5px 0px rgba(132,132,132,0.6); -moz-box-shadow: 0px 3px 5px 0px rgba(132,132,132,0.6); box-shadow: 0px 3px 5px 0px rgba(132,132,132,0.6);}
	#global.index #menu-icone,
	#global.page #menu-icone {display:inline-block; vertical-align:top; float:none; margin-left:20px;}
	#global #langues {display:inline-block; vertical-align:top; float:none; line-height:23px;}
	#global.index #menu,
	#global.page #menu {width:220px; background: #ffffff; position:fixed; top:51px; left:-230px; z-index:999; height:100%; overflow:hidden; padding:0px; -webkit-box-shadow: 3px 0px 5px 0px rgba(132,132,132,0.6); -moz-box-shadow: 3px 0px 5px 0px rgba(132,132,132,0.6); box-shadow: 3px 0px 5px 0px rgba(132,132,132,0.6); transition: all 0.4s ease-in; margin-left:0px;}
	#global.index #menu.visible,
	#global.page #menu.visible {left:0px;}
	.menu-element {float:none; margin: 12px 0; font-size: 18px; padding-left: 15px; line-height: 18px;}
	#bandeau .g {text-align:right; width:calc(100% - 36px); display:inline-block; vertical-align:top;}
	#global.index #bandeau .g {width:calc(100% - 120px);}
	
	.f-nav { top: 49px;}
}

@media all and (max-width:580px) {
	
	/* Global */
	#exposition-navigation,
	#artiste-navigation {width: 75px; padding-right:20px;}
	#pied .social {height:auto;}
	#pied .nav span {margin:0px;}
	#pied .nav a.mentionslegales, #pied
	.nav a.mentionslegales:visited {display:block; margin:10px 0 5px;}
	#pied .nav div {display:block; margin:5px 0;}
	#pied .nav a,
	#pied .nav a:visited {margin-left:0px;}
	#pied .social .partagez,
	#pied .social .suivez {float:none;}
	#pied .social .partagez {margin-left:0px; margin-bottom:10px;}
	
	/* Accueil */
	#accueil .flex-control-nav {position: fixed; top: auto; bottom: 30px; right: 30px;}
	
	/* Travaux */
	#travaux .header {margin-left:95px;}
	#travaux .contenu {margin-left:95px;}
	#travaux .travail .lien {}
	
	/* Travaux détail */
	#travaux .detailtravail img {width:auto; max-width: 100%; height:auto;}
	
	/* Biographie */
	#biographie .header {margin-left:95px;}
	#biographie .contenu {margin-left:95px;}
	#biographie .droite {margin-left:95px; width:calc(100% - 95px);}
	
	#biographie .supplements .colg .colg-contenu {margin-left:95px;}
	#biographie .supplements .cold {margin-left:95px;}
	
	/* Expositions */
	#expos .contenu {margin-left:95px;}
	#expos .exposition {margin:0; width:100%;}
	#expos .exposition .photo {width:auto; height:auto;}
	#expos .exposition .photo img {display:block; max-width:100%; height:auto;}
	
	/* Exposition présentation */
	#expo .header {margin-left:95px;}
	#expo .centre-contenu {margin-left:95px;}
	#expo .header .details {float:none;}
	
	/* Exposition oeuvres */
	#expo .mosaique {margin-left:95px;}
	#expo .mosaique img {width:auto; max-width: 100%; height:auto;}
	
	/* Foires */
	#foires .foire .infos {display:block; width:auto; text-align:right;}
	
	/* Actualités */
	#actualites .flexslider {height:auto; padding-bottom:55px;}
	#actualites .flexslider .slide {height:auto;}
	#actualites .flexslider .slide .slideg {display:block; width:auto;}
	#actualites .flexslider .slide .slided {display:block; width:auto; padding-left:0px; padding-top:35px;}
	
	/* Contact */
	#contact .gauche {display:block; width:auto; margin-bottom: 20px;}
	#contact .contenu {display:block; width:auto;}
}

@media all and (max-width:380px) {

	#fancybox-wrap {left:0 !important; width:calc(100% - 30px) !important; padding:10px !important;}
	
}