/* https://developer.mozilla.org/fr/docs/Web/CSS/Requ%C3%AAtes_m%C3%A9dia/Utiliser_les_Media_queries */
@media screen
{
html {
/*	font-size: 15px;*/
}

body {
/*font-size: 1.1 em;*/
background-color: #ecf0f1; 
font-family: Arial;
color: #006699 !important;
link: #006699;
/*scrollbar-face-color: #3399CC !important;
scrollbar-shadow-color: #000000 !important;
scrollbar-highlight-color: #FFFFFF !important;
scrollbar-3dlight-color: #FF8040 !important;
scrollbar-darkshadow-color: #000000 !important;
scrollbar-track-color: #006699 !important;
scrollbar-arrow-color: #FFCC00 !important;*/
}
iframe {
  border: 0px;
  width: 100%; /* takes precedence over the width set with the HTML width attribute */
}

.onglet {
	overflow-x: auto;
	overflow-y: auto;
/*		scrollbar-color: #007 red; */
/*	scrollbar-color: #007 #bada55; */
	}

.bodyframe {
margin:0;
overflow: hidden;
}

.bodyoeuvre {
/*font-size: 1.1 em;*/
background-color: #ecf0f1; /*#5D6D7E; /*#009999;  #006699; */
color: black;
/*scrollbar-face-color: #3399CC !important;
scrollbar-shadow-color: #000000 !important;
scrollbar-highlight-color: #FFFFFF !important;
scrollbar-3dlight-color: #FF8040 !important;
scrollbar-darkshadow-color: #000000 !important;
scrollbar-track-color: #006699 !important;
scrollbar-arrow-color: #FFCC00 !important;*/
}
.bodysommaire {
background-color: #ecf0f1; 
margin : 0px;
overflow-x: hidden; /* pour enlever la scrollbar */
overflow-y: hidden; /* pour enlever la scrollbar */
}
.bodytexte {
background-color: #ecf0f1; 
color : red;
link: #006699;
margin-left : 25;
margin-top : 0;
}
/*
::-webkit-scrollbar {
  background:  #3399CC !important; 
  }
::-webkit-scrollbar-thumb {
  background: green; 
}
::-webkit-scrollbar-track {
  background: red; 
}
::-webkit-scrollbar-thumb {
  background: green; 
}
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}*/

/*Code pour internet explorer
scrollbar-face-color :couleur du dessus des boutons et de la barre de défilement
scrollbar-shadow-color : couleur sombre du relief des boutons
scrollbar-highlight-color :couleur claire du relief des boutons
scrollbar-3dlight-color : couleur claire du relief des boutons quand ceux-ci ne sont pas enfoncés
scrollbar-darkshadow-color :couleur sombre du relief des boutons quand ceux-ci ne sont pas enfoncés
scrollbar-track-color : couleur du fond de la barre
scrollbar-arrow-color :couleur des flèches*/
/* code pour Chrome
/* width 
/*::-webkit-scrollbar {
  width: 10px;
}
*/
/* Track 
::-webkit-scrollbar-track {
  background: red; 
}*/
 
/* Handle 
::-webkit-scrollbar-thumb nom_artiste_detail
  background: green; 
}*/

/* Handle on hover 
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}*/
/* pour firefox */


a:link { text-decoration: none; color:black;}
/*a:visited { text-decoration: none; color:red; }*/
a:visited { text-decoration: none; color:black; }
a:hover { text-decoration: none; color:black; font-weight: bold;}
a:active { text-decoration: none; color:black; }

.nom_theme a:link {text-decoration: none; color: black; }
.nom_theme a:visited {text-decoration: none; color: black; }
.nom_theme a:hover {text-decoration: none; font-weight: bold; }

a.nom_artiste:link {font-family: Arial; color:black; font-weight: normal;}
a.nom_artiste:visited {font-family: Arial; color:black; font-weight: normal;}
a.nom_artiste_gras:link {font-family: Arial; color:black; font-weight: normal;}
a.nom_artiste_gras:visited {font-family: Arial; color:black; font-weight: normal;}

a.lettre_artiste:link {font-family: Arial; color:black;}
a.lettre_artiste:visited {font-family: Arial; color:black;}

.noticeoeuvredetail a:link { text-decoration: none; color:white; }
.noticeoeuvredetail a:visited { text-decoration: none; color:white; }
.noticeoeuvredetail a:hover { text-decoration: none; color:white; }
.noticeoeuvredetail a:active { text-decoration: none; color:white; }
.nom_oeuvre a:link { text-decoration: none; color:black;}
.nom_oeuvre a:visited { text-decoration: none; color:black;}
.nom_oeuvre a:hover { text-decoration: none; font-weight: bold; } /* color:#CCFFFF;  */
.nom_oeuvre a:active { text-decoration: none; color:white;}
.nom_oeuvre_recap a:link { text-decoration: none; color:black;}
.nom_oeuvre_recap a:visited { text-decoration: none; color:black;}
.nom_oeuvre_recap a:hover { text-decoration: none; font-weight: bold; }
.nom_oeuvre_recap a:active { text-decoration: none; color:black;}
/*The four links states are:
a:link - a normal, unvisited link
a:visited - a link the user has visited
a:hover - a link when the user mouses over it
a:active - a link the moment it is clicked*/

h1{
	margin-bottom:.0001pt;
	page-break-after:avoid;
	font-size:10.0pt;
	font-family: Arial;
/*	text-decoration:underline;
	text-underline:single; */
	margin-left:0cm; margin-right:0cm; margin-top:0cm}

h2{
	font-family: Arial;
	font-size: 10.0pt;
	line-height: 130%;
	page-break-after:avoid;	
    margin-top:0px;
	margin-left : 0px;
	margin-bottom : .0001pt;
	margin-right : 0px;
}
p{
	font-family: Arial;
	margin:0px 0px 0em 0;
}
ul {
 padding:0;
 margin:0;
 list-style-type:none;

 }
li {
 margin-left:2px;
 float:left; /*pour IE*/
 display:block;  
 width:280px;
 line-height:25px;
 }

 /* libis : classe utilisée pour la liste générale des artistes */
.libis{
 float:none;
 display:block;  
 line-height:60px;
}
.txt_notice{
	font-family: Arial;
	font-size: 0.8 em;
	line-height: 130%;
	margin-top: 5px;
	margin-left: 5px;
	margin-bottom : 5px;
	margin-right: 5px;
}
.nom_artiste_gras{    /* affichage des noms d'artiste en gras */
	font-family: Arial regular;
	font-size: 1.2em;
	font-weight: bold;
/*	font-size: 4 em;*/
	color: black;
	margin-left: 15px;
	white-space: nowrap; /*bloque le retour à la ligne */
	line-height: 0,5;
	height: 10px;
}
.label_oeuvre {
	font-family: Arial;
	font-weight: bold;
	color: black;
	margin-left: 150px;
	margin-bottom: 15px;
}
.nom_oeuvre{
	font-family: Arial;
	font-size: .4 em;
/*	font-style: italic;*/
	color : black;
	/*background-color: black;*/
	margin-left: 150px;
	margin-bottom: 10px;
}
.nom_oeuvre_recap{
	font-family: Arial;
	font-size: .4 em;
	font-style: italic;
	color : black;
	/*background-color: black;*/
	margin-left: 170px;
}
.nom_theme {
	font-family: Arial;
	font-size: 1em;
	color: black;
/*	background-color: #ecf0f1;*/
	margin-left: 6px;	
	line-height: 25px;
	}
.hautoeuvredetail{
	margin-top: 15px;
	margin-bottom: 15px;
	color: black;
	font-family: Arial;
	font-size: 20px;
	}
.titreoeuvredetail{
	font-weight: bold;
	}
.dateoeuvredetail{
	}
.collecoeuvredetail{
	font-family: Arial;
	font-size: 0.4 px;
	color: black;
	margin-left: 0px;
	}
.noticeoeuvredetail{
	font-family: Arial;
	font-size: 0.8 em;
	color: black;
	margin-left: 12px;
	}	
.noticebio {
	font-family: Arial;
	color: black;
	margin-left: 12px;
	}
.noticeoeuvrecadre {
  display: block;
  width: 100%;
  max-height: 800px;
 /* padding: 15px;*/
 /* border: 1px solid black;  */  
  color : black;
  overflow-y: auto;
  margin-bottom : 40px;
  padding-left : 25px;
  padding-right : 25px;
  scrollbar-color: white #ecf0f1;
  scrollbar-width: thin;
}
.slider {
    position: relative;
    width: 100px;
    height: 80px; 
    overflow: hidden;
	}
.slides {
/*    -webkit-animation: slider 16s infinite ease-in-out; */
    animation: slider 16s infinite ease-in-out; /* nombre de slide * temps par slide, ici on choissis de passer 4s par slide donc 4 slides * 4s = 16s*/
    position: absolute;
    left:0; top:0;
    width: 700%; /* nombre de slides * 100%, ici 4 donc 400% */
	}
.slides img {
    display: inline-block;
	}

.frameliste {
width : 100%;
height : 100%;
margin-left : 0px;
margin-top : 0px;
padding-left : 0px;
padding-top: 0px;
border:none;
}
.alphabetV {
background-color: #292929;
font-size: 15px;
margin:0;
padding:0;
border:0;
display: flex;
flex-wrap: wrap;
font-family: Arial;
}
.alphabetV a:hover {
background-color: #0047bb;
}
.alphabetV a {
color : white;
}
.alphabetB {
background-color: #292929;
font-size: 15px;
margin:0;
padding:0;
border:0;
display: flex;
flex-wrap: wrap;
font-family: Arial;
}
.alphabetB a:hover {
background-color: #0047bb;
}
.alphabetB a {
color : white;
}
.alphabetbleue {
background-color: #003399;
margin:0;
padding:0;
border:0;
}
a.lientitart:link {
	color : white;
	font-weight: bold;
	text-decoration : none;
	background-color : #292929;
	font-size: 20px;
	font-family: arial;
	margin-left: 10px;
	}
a.lientitart:hover {
	color : white;
	font-weight: bold;
	background-color : #0047bb;
	margin-left: 10px;
	font-family: arial;
	}
a.lientitart:visited {
	color : white;
	font-weight: bold;
	text-decoration : none;
	background-color : #292929;
	font-size: 16px;
	font-family: arial;
	margin-left: 10px;
	}
	
a.liendec:link {
	color : white;
	font-weight: bold;
	text-decoration : none;
	background-color : #292929;
	font-size: 15px;
	font-family: arial;
	margin-left: 10px;
	}
a.liendec:hover {
	color : white;
	font-weight: bold;
	background-color : #0047bb;
	margin-left: 10px;
	font-family: arial;
	}
a.liendec:visited {
	color : white;
	font-weight: bold;
	text-decoration : none;
	background-color : #292929;
	font-size: 16px;
	font-family: arial;
	margin-left: 10px;
	}

/*.videooeu {
  margin: 0 auto;
  float: left;
}*/

@keyframes slider {
    0%, 20%, 100%   { left: 0%; }  
    25%, 45%        { left: -100%; }  
    50%, 70%        { left: -200%; }
    75%, 95%        { left: -300%; }  
	}
}
@media (min-width: 768px) /*and (max-width: 1388px)*/
{
.wrap {
   display: table;
   width: 100%; /*largeur totale que les 3 "colonnes" doivent occuper, ici : tout*/
	}
.wrap1, .wrap2 {
	display: table-cell;
	}
.wrap1 {
	width: 50px;
	}
.wrap2 {
	vertical-align: top;
	}
.affmedia768 {
	width: 768px;
	margin-bottom: 5px;
	}
.affmedia1024 {
	width: 1024px;
	}
	
.wrapper {
  display: grid;
  grid-template-columns: 350px 350px 350px; 
  display: table-cell;
	}
* {box-sizing: border-box;}
.wrapper {
/*  border: 2px solid #f76707; */
  border-radius: 5px;
/*  background-color: #fff4e6;*/
}
.wrapper > div {
/*  border: 2px solid #ffa94d; */
  border-radius: 5px;
/*  background-color: #ffd8a8;*/
  padding: 1em;
  color: #d9480f;
}

.lettre_artiste{    /* affichage des lettres d'artiste */
	font-family: Arial regular;
	font-size: 1.8em;
/*	font-size: 4 em;*/
	color: black;
	margin-left: 15px;
/*	white-space: nowrap; bloque le retour à la ligne */
	line-height: 0,5;
	height: 10px;
}

.nom_artiste{    /* affichage des noms d'artiste */
	font-family: Arial regular;
	font-size: 1.2em;
/*	font-weight: bold;*/
/*	font-size: 4 em;*/
	color: black;
	margin-left: 15px;
	white-space: nowrap; /*bloque le retour à la ligne */
	line-height: 0,5;
	height: 10px;
}

.nom_artiste_detail{
	font-family: Arial;
	font-size: 0.8 em;
	color: black;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
}

.tabbio {
	border: 0px;
	table-layout: fixed;

}
.tabbio td {
	width: 140px;
	margin-left: 0px;
	margin-top: 0px;
	padding: 0px;
}

.container{
	display: none;
	}
.slides {
	display: none;
	}
.slider {
	display: none;
	}
}
@media (max-width: 767px)
{
/*.paragrahevideo {
    float:left;
  }*/
 .affmedia768 {
	width: 350px;
	margin-bottom: 5px;
	}
 .affmedia1024 {
	width: 350px;
	}
.nom_artiste{
	font-family: Arial;
	font-size: 1.4 em;
	color: black;
	margin-left: 2px;
}
.nom_artiste_detail{
	font-family: Arial;
	font-size: 0.8 em;
	color: black;
}
.nom_oeuvre{
	font-family: Arial;
	font-size: 1.4 em;
	font-style: italic;
	margin-left: 25px;
	color : black;
}
.nom_oeuvre_recap{
	font-family: Arial;
	font-size: .4 em;
	font-style: italic;
	color : black;
	/*background-color: black;*/
	margin-left: 40px;
}
.noticeoeuvrecadre {
  height: 180px;
}
.nom_oeuvre img {margin-left: 25px;}

.noslides {
	display: none;
	}
}