@charset "UTF-8";

@font-face {
	font-family:'favorit-std-extended-book';
	font-style:normal;
	src:local('favorit-std-extended-book'), url('font/favorit-std-extended-book.woff') format('woff');
}

html, html a, input, textarea, select, button { -webkit-font-smoothing:antialiased !important; }

body { width:100%; height:100vh; padding:0; margin:0; font-family:'favorit-std-extended-book'; font-size:8px; color:#000; }

a:hover img, a:hover img { color:transparent !important; }
p, form, ul, li, label, input, hr, select, img { padding:0; margin:0; }
input[type="text"]:focus, input[type="password"]:focus, textarea:focus{ outline:none; }
/*input { -webkit-appearance:none; }*/
	
.clearer { display:block; clear:both; }
.spacer08 { height:8px; display:block; clear:both; }
.spacer15 { height:15px; display:block; clear:both; }
.spacer25 { height:25px; display:block; clear:both; }


a { text-decoration:none; color:black; }
a img { border:0; padding:0; margin:0; }
a:hover, .active { color:#0000ff !important; }

#container { width:100vw; height:55vw; max-height:100vh; background-color:transparent; }
#container::before { height:100%; width:100%; content:" "; background-image:url(/img/fond-cercle.png); background-position:20vw center; background-repeat:no-repeat; background-size:cover; position:absolute; z-index:1; pointer-events:none; }

#lignes3 { height:60%; width:100%; background-image:url(/img/Vanijken-Jan.jpg); background-position:center center; background-repeat:no-repeat; background-size:cover; position:relative; z-index:0; }
#lignes2 { height:40%; width:100%; background-color:transparent; position:relative; z-index:0; }
#lignes2::before { height:calc(100vh - 150%); width:100%; content:" "; background-image:url(/img/Wolff-Barbara-mobile.jpg); background-position:top left; background-repeat:no-repeat; background-size:cover; position:absolute; z-index:0; }

#ligne1 { width:100%; height:calc(34% - 2px); border-bottom:2px solid white; position:relative; overflow:hidden; } 
#ligne2 { width:100%; height:calc(33% - 2px); border-bottom:2px solid white; position:relative; overflow:hidden; }
#ligne3 { width:100%; height:calc(33% - 2px); border-bottom:2px solid white; position:relative; overflow:hidden; }
#ligne4 { width:100%; height:calc(50% - 2px); border-bottom:2px solid white; position:relative; overflow:hidden; }
#ligne5 { width:100%; height:calc(50% - 2px); border-bottom:2px solid white; position:relative; overflow:hidden; }

.ligne { height:90%; width:96%; margin:0 2%; top:5%; position:relative; }
.ligne a img { height:100%; width:auto; }
.ligne a:hover img { filter: /* start #000 */ brightness(0) saturate(100%) /* end #000 */ invert(8%) sepia(100%) saturate(6751%) hue-rotate(248deg) brightness(103%) contrast(146%); }

#langues_mobile { display:none; }

ul#langues { position:absolute; top:0.2vh; right:calc(10px + 1vw); z-index:2; }
ul#langues li { display:inline-block; margin-left:0.6vw; }
ul#langues li a { color:#FFF; text-decoration:none; font-size:3em; }

#news { position:fixed; height:30px; width:100%; bottom:0; z-index:10; background-color:#0000ff; color:#fff; line-height:30px; font-size:3em; overflow:hidden; }
#news span { margin-right:200px; }

/************************************** PAGES ****************************************/

#titre { position:fixed; width:100%; background-color:white; z-index:10; }
#titre, #stitre, #artiste, #event { padding:calc(5px + 0.3vw) calc(10px + 1vw) calc(5px + 0.3vw) calc(10px + 1vw); border-bottom:1px solid black; overflow:hidden; }

#titre img { height:11vw; width:auto; float:left; }
#titre img:hover { filter:invert(8%) sepia(88%) saturate(6665%) hue-rotate(243deg) brightness(116%) contrast(154%); }

.retouche2 { height:9.4vw !important; width:auto !important; }

#menu_mobile { display:none; }

#menu { float:right; position:relative; right:calc(20px + 2vw); top:-4px; }
#menu a { font-size:2.2em; color:black; }

#stitre { top:calc(10px + 11.6vw); position:relative; }
#stitre, #artiste, #event { font-size:2.2em; padding-bottom:15px; overflow:hidden; }
#stitre div, #artiste_nom { position:absolute; }
#stitre p, #artiste_desc, #event_desc { position:relative; float:left; left:37%; padding-right:37%; text-align:justify; }
#stitre span { float:right; display:none; }

.retouche { top:calc(10px + 10vw) !important; }

#artistes, #liste_events, #blog, #infos, #cinqjpg { border-top:1px solid black; position:relative; top:calc(10px + 11.6vw); width:100%; }
#artistes { padding-bottom:50vh; }
#artistes li, #s_artistes, #liste_events li, #blog div, #infos div, #cinqjpg div { display:block; font-size:2.2em; border-bottom:1px solid black; padding:4px 0 4px calc(10px + 1vw); }
#artistes li span:last-child { float:right; padding-right:calc(10px + 1vw); display:none; }
#artistes li a, #liste_events li a, #blog div a { display:block; }
#artistes li br { display:none; }
#s_artistes { border:none; width:50%; position:relative; top:calc(10px + 11.6vw); }
input#s_artistes::placeholder { color:#0000ff; opacity:1; }

#artiste, #event { border-bottom:none; position:relative; top:calc(10px + 11.6vw); padding-bottom:60px; }
#artiste_infos, #event_infos { width:38%; float:left; font-size:0.6em; line-height:13px; text-align:left; overflow:hidden; }
#artiste img { float:right; width:45%; height:auto; }
#artiste p, #event p { margin-bottom:25px; }
#artiste p:last-child, #event p:last-child { bottom:-27px; position:absolute; width:24%; }

#artiste img {overflow:hidden;}
#artiste img.paysage { width:60%; height:auto; float:right; }
#artiste img.portrait { width:45%; height:auto; float:right; }

a#prev { position:absolute; width:37vw; height:calc(100vh - 12vw); top:11vw; left:0; bo ttom:0; z-index:5; overflow:hidden; cursor:url(/img/prev.png), pointer; }
a#next { position:absolute; width:37.5vw; height:calc(100vh - 12vw); top:11vw; left:61vw; bo ttom:0; z-index:5; overflow:hidden; cursor:url(/img/next.png), pointer; }

#event { margin-top:-40px; }
#liste_events { border-top:none; position:relative; padding-bottom:60px; }
#liste_events p { display:inline-block; overflow:hidden; }
#liste_events li { overflow:hidden; position:relative; min-height:43px; }
.date_event { position:absolute; width:14vw; vertical-align:top; }
.theme_event { position:absolute; width:10vw; left:19vw; vertical-align:top; color:#0000ff; }
.titre_event { position:relative; left:calc(36.5% - 2px); width:32vw; height:auto; }
.lieu_event { position:absolute; left:78vw; }
.lien_event { float:right; padding-right:calc(10px + 1vw); display:none !important; }

#event img {overflow:hidden;}
#event img.paysage { width:60%; height:auto; float:right; }
#event img.portrait { width:45%; height:auto; float:right; }

#blog div p { overflow:hidden; }
#blog, #infos, #cinqjpg { overflow:hidden; position:absolute; padding-bottom:60px; }
#blog div, #infos div, #cinqjpg div { overflow:hidden; position:relative; padding-bottom:15px; }
.blog_left { position:absolute; width:30%; }
#blog div:first-child .blog_titre, .infos_titre, .cinqjpg_titre { width:30%; position:absolute; padding-bottom:5px; }
.blog_infos { font-size:0.6em; margin-top:20px; }
.partage { font-size:0.6em; margin-top:20px; }
.blog_desc, .infos_desc, .cinqjpg_desc { width:calc(64% - 10px); left:35%; padding-right:100px; position:relative; text-align:justify; }
.infos_desc img { width:80%;margin-top:-20px !important;height:auto;margin-bottom:-18px; }
#blog img, .youtube, .credit { width:calc(64% - 10px); height:auto; left:35%; position:relative; margin-top:10px; margin-bottom:12px; }
.youtube { height:40vw; }
.soundcloud { height:166px !important; }
.credit { margin-bottom:40px; font-size:0.6em; }

#infos div:nth-child(2), #infos div:nth-child(4) { padding-bottom:15px; min-height:20px; line-height:20px; }