body {
  font-family: 'Rubik', serif;	
  margin:0px;
  padding:0px;
}
textarea {
	margin-top:0.5em;
	margin-bottom:0.5em;
}

.ng-menu{
	background-color:#005d8b;	
	color:white;
	height:3em;
	display:flex;
	flex-direction:row;
	position:fixed;
	width:100%;
}

.ng-wait{
    animation:spin 4s linear infinite;
	image-rendering:pixelated;
}
@keyframes spin { 100% {transform:rotate(360deg);}}


.ng-userinfo{
	color:yellow;
	margin-left:2em;
	margin-right:2em;
}

.ng-login-erreur{
	color:black;
	background-color:orange;
	border:2px solid red;
	border-radius:3px;
}

.ng-menuitem{
	color:white;
	/*margin:0.5em;*/
	/*padding:0.5em;*/
	margin-left:1px;
	margin-right:1px;
	margin-top:1px;
	margin-bottom:1px;
	/*padding-left:0.5em;*/
	/*padding-right:0.5em;*/
	cursor:pointer;
	/*background-color:#16F;*/
	/*border:1px solid #AAA;*/
	border-radius:1px;	
}

.ng-menuitem:hover{
	background-color:lightblue;
}

.ng-menuitem-admin{
	color:white;
	/*margin:0.5em;*/
	/*padding:0.5em;*/
	margin-left:0.2em;
	margin-right:0.2em;
	margin-top:0.1em;
	margin-bottom:0.1em;
	padding-left:0.5em;
	padding-right:0.5em;
	cursor:pointer;
	background-color:#1A1;
	border:0px solid #AAA;
	border-radius:5px;	
	font-size:0.9em;
}

.ng-menuitem-encode{
	color:white;
	/*margin:0.5em;*/
	/*padding:0.5em;*/
	margin-left:0.2em;
	margin-right:0.2em;
	margin-top:0.1em;
	margin-bottom:0.1em;
	padding-left:0.5em;
	padding-right:0.5em;
	cursor:pointer;
	background-color:#119CAA;
	border:0px solid #AAA;
	border-radius:5px;	
	font-size:0.9em;
}

.ng-menu A{
	color:white;
}

.ng-bandeau-sous-menu{
	background-color:#DA0;
	color:white;
	font-size:1.5em;
}

.ng-cadre {
	border:1px solid gray;
	margin-top:1em;
	background-color:#f0f4c3;
	width:80%;
	margin-left:auto;
	margin-right:auto;
}

.ng-cadre-invisible {
	border:1px solid gray;
	margin-top:1em;
	width:80%;
	margin-left:auto;
	margin-right:auto;
}

.ng-tetecadre {
	color:black;
	background-color:#75a478;
}
.ng-radio {
	color:blue;
}
.ng-soustitre {
	color:#003d00;
	margin-top:0.5em;
}
.ng-enc-groupedetail {
	background-color:#EEE;
	color:#AAA;
}

.ng-enc-groupedetail .ng-soustitre {
	color:#AAA;
}
.ng-sousinput {
	color:#AAA;
	font-size:0.7em;
}
.ng-rechresult {
	background-color:#9fa8da;
	color:black;
	cursor:pointer;
}

.ng-connais {
	text-decoration: underline;
	color:blue;
	border:1px solid blue;
	cursor:pointer;
	border-radius:2px;
	margin-left:1em;
}

.ng-rechresult:hover {
	color:white;
	background-color:#6f79a8;
}



.ng-face {
	background-color:#a5d6a7;
	margin-left:3em;
	margin-right:3em;	
}
.ng-numface {
	color:#33691e;
	font-size:2em;
}
.ng-piste {
	background-color:lightyellow;
	margin-left:3em;
	margin-right:3em;
}
.ng-piste-lignerech {
	color:green;
	cursor:pointer;
}
.ng-piste-lignerech:hover {
	background-color:lightblue;
}
.ng-numpiste {
	color:#33691e;
	font-size:1em;
}

.grandeannee {
	font-size:1em;
    font-weight:600;
	color:#00F;
	cursor:pointer;
    width:4em;
}
.grandeannee:hover {
	background-color:#CCF;
    width:4em;
}
.petiteannee {
	font-size:1em;
	color:#33F;
	cursor:pointer;
    width:4em;
}
.petiteannee:hover {
	background-color:#CCF;
}
.selectannee {
	font-size:1em;
	color:darkblue;
	font-weight:600;
	border:1px solid blue;
	border-radius:2px;
	background-color:#CCF;
}
#select-annees {
	border:1px solid blue;
	border-radius:2px;
	background-color:white;
    z-index:100;
}
#annees{
	border:1px solid lightblue;
	border-radius:5px;
}	
.petitpays {
	font-size:1em;
	color:#33F;
	cursor:pointer;
    width:8em;
}
.petitpays:hover {
	background-color:#CCF;
}
.selectpays {
	font-size:1em;
	color:darkblue;
	font-weight:600;
	border:1px solid blue;
	border-radius:2px;
	background-color:#CCF;
}
#select-pays {
	border:1px solid blue;
	border-radius:2px;
	background-color:white;
    z-index:100;
}
#pays{
	border:1px solid lightblue;
	border-radius:5px;
}	
.artiste{
	display:flex;
	flex-direction:row;
}
.typeartiste {
	font-size:1em;
	color:gray;
	cursor:pointer;
    width:4em;	
}
.typeartiste:hover {
	background-color:#a5d6a7;
	color:#33691e;
}
.typeartiste.aselect{
	font-size:1em;
	color:#33691e;
	font-weight:600;
	border:1px solid blue;
	border-radius:2px;
	background-color:#a5d6a7;
}
.typeartiste.aselect2{
	background-color:pink;
}
.couvselect {
	border:3px dotted red;
}	
.imcouv {
	margin:3px;
}

/* liste participations */
.ng-particip-preview {
	display:flex;
	flex-direction:row;
}
.ng-particip-preview-json {
	font-size:0.5em;
	color:lightgrey;
	word-wrap:break-word;
}

.ng-particip-preview-json:hover {
	font-size:0.5em;
	color:black;
	word-wrap:break-word;
}

.ng-vignette17 {
	width: 100px;
	height: 100px;
	margin:5px;
	filter: drop-shadow(5px 5px 5px #AAA);
	background-color:lightblue;
	cursor:pointer;
}
.ng-vignette25 {
	width: 110px;
	height: 110px;
	margin:5px;
	filter: drop-shadow(5px 5px 5px #AAA);
	background-color:lightblue;
	cursor:pointer;
}
.ng-vignette30 {
	width: 120px;
	height: 120px;
	margin:5px;
	filter: drop-shadow(5px 5px 5px #AAA);
	background-color:lightblue;
	cursor:pointer;
}	
.ng-cadre25 {
	width: 110px;
	height: 110px;		
	margin:5px;
	border: 1px dotted #DDD;
}
.ng-cadre30 {
	width: 120px;
	height: 120px;	
	margin:5px;		
	border: 1px dotted #DDD;
}	
.ng-flex-h{
	display:flex;
	flex-direction:row;
	/*height: 100%;	*/
}
.ng-flex-hh{
	display:flex;
	flex-direction:row;
	flex-wrap: wrap;
}
.ng-flex-w{
	display:flex;
	flex-direction:row;
	flex-wrap: wrap;
}	
.ng-flex-v{
	display:flex;
	flex-direction:column;
}	
.ng-lignetags{
	display:flex;
	flex-direction:column;
	flex-wrap: wrap;
	width:150px;
	padding:0.5em;
	border:1px solid black;
}	
.ng-flex-jb{
	justify-content:space-between;
}		
.ng-topmenu{
	background-color:#005d8b;
	height:3em;
	padding-top:0.5em;
	padding-left:0.5em;
	padding-bottom:0.5em;
	color:white;
	display:flex;
	flex-direction:row;	
}

.ng-topmenu A{
	color:white;
}

.ng-cadreleger{
	border: 1px solid #AAA;
}
.ng-serie{
	font-size:2em;
	font-weight:700;
}
.ng-titre{
	font-size:1.5em;
	font-weight:700;
	font-style:italic;
}	
.ng-serie-ltag{
	font-size:0.7em;
	font-weight:700;
}
.ng-titre-ltag{
	font-size:0.7em;
	font-weight:700;
	font-style:italic;
	color:blue;
}	
.ng-tag:before{
	 content: "#";
}
.ng-tag{
	border:0px solid black;
	border-radius:3px;
	background-color:#b6c8ff;
	color:black;
	height:auto;
	width:auto;
	margin:0.2em;
	padding:0.05em;
	display:inline-block;
}

.ng-tag-actif{
	background-color:#b6c8ff;
	border:1px solid black;
	color:black;
}

.ng-tag-inactif{
	background-color:#e1e1e1;
	border:1px solid #e1e1e1;
	color:#666;
}

.ng-inbu{
	width:auto;
}

.ng-pointer{
	cursor:pointer;
}
.ng-tag-courant:before{
	 content: "#";
}
.ng-tag-courant{
	border:1px solid black;
	border-radius:3px;
	background-color:#e98df5;
	color:black;
	height:1em;
	margin:0.2em;
	padding:0.2em;
}
.ng-groupe-h-1{
	/* height:1.5em; */
	border-top:1px solid grey;
	border-bottom:1px solid grey;
}	
.ng-editeur{
	font-size:1em;
}
.ng-reference{
	font-size:1em;
}		
.ng-pays{
	font-size:1em;
}	
.ng-annee{
	font-size:1em;
}	
.ng-support{
	font-size:1em;
}	
.ng-taille{
	font-size:1em;
}	
.ng-vitesse{
	font-size:1em;
}	
.ng-type-pochette{
	font-size:1em;
}		
.ng-listepistes{
	counter-reset: compteur;
}
.ng-titrepiste{
	font-weight:700;
}	
.ng-artistes{
	display:none;
	padding-left:1em;;
}	
.ng-vig-serie{
	font-size:0.7em;
	padding-left:5px;
	font-weight:700;
}	
.ng-vig-titre{
	font-size:0.7em;
	font-style:italic;
	padding-left:5px;
}
.ng-vig-info{
	font-size:0.7em;
	color:green;
	padding-left:5px;
}	
.ng-vig-cata{
	font-size:0.7em;
	color:red;
	padding-left:5px;
}	
.ng-vig-tags{
	font-size:0.7em;
	color:#d03b00;
	padding-left:5px;
}	
.ng-det-tags{
	font-size:1em;
	color:#d03b00;
}	
.ng-bouton{
	border:1px solid #AAA;
	border-radius:5px;
	color:black;
	background-color:lightblue;
	cursor:pointer;
}

.ng-listepistes .ng-titrepiste:before{
	content: counter(compteur);
	counter-increment: compteur;
}	
.ng-face{
	font-size:1em;
	font-weight:700;
	color:blue;
	padding-top:0.2em;
	padding-bottom:0.2em;
}		
.ng-artiste{
	font-size:0.7em;
}	
	
.ng-grande-pochette{
	width:100%;
}	

#zone-tout{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
}
#zone-horsmenu{
	margin:5px;
	flex-grow: 1;
	min-height: 0; /* pour Firefox */
}
#zone-filtre+vignettes{
	height:100%;
	display:flex;
}
#zone-vignettes{
	flex-grow: 1;
	overflow: auto;
	min-height: 0; /* pour Firefox */
}	

#zone-lignes{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
}	

.ng-lt-groupetags{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
}

#zone-details{
	padding:1em;
	padding-top:0.2em;
	flex-grow: 1;
	overflow: auto;
	min-height: 0; /* pour Firefox */
	border-left:1px solid grey
}		
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 1em;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}	

.ng-detail-face{
	color:green;
	font-weight:600;
	margin-top:0.5em;
}
.ng-detail-intitule{
	margin-top:0.5em;
	color:black;
	font-weight:600;
}
.ng-detail-artgroupe{
	font-size:0.8em;
}
.ng-detail-arttype{
	color:cornflowerblue;
	font-weight:600;	
}

.ng-valid{
	color:green;
}
.ng-invalid{
	color:red;
}

.ng-detail-remarque{
	margin-top:0.5em;
	color:#333;
	padding:0.5em;
	background-color:lightblue;
	border-radius:5px;
	/* border:1px solid lightblue; */
}

.ng-nom-particip{
	margin-top:0.5em;
	color:red;
}

/* LIGNE COLLECTION ------------------------------------------------ */
.ng-coll-ligne{
	/*height:1em;*/
	border-bottom:1px solid #eeeef7;
	padding:1px;
	margin:1px;
	border-radius:2px;
	
}
.ng-coll-cadre{
	border:1px solid #AAA;
	background-color:#EEE;
	border-radius:2px;
	height:1em;
	padding-left:2px;
	padding-right:2px;
}
.ng-coll-ai{
	color:green;
	font-weight:600;
	cursor:pointer;
	font-family: 'BenchNine', sans-serif;
}
.ng-coll-cherche{
	color:red;
	font-weight:600;
	cursor:pointer;
	font-family: 'BenchNine', sans-serif;
}
.ng-coll-vends{
	color:blue;
	font-weight:600;
	cursor:pointer;
	font-family: 'BenchNine', sans-serif;
}
.ng-coll-echange{
	color:magenta;
	font-weight:600;
	cursor:pointer;
	font-family: 'BenchNine', sans-serif;
}
.ng-coll-etat-poch{
	color:black;
	font-weight:600;
	cursor:pointer;
}
.ng-coll-etat-disque{
	color:black;
	font-weight:600;
	cursor:pointer;
}
.ng-coll-etat-prix{
	color:black;
	font-weight:600;
}
.ng-coll-surligne{
	background-color:yellow;
}
.ng-coll-etat-item{
	z-index:999;
	background-color:white;
	cursor:pointer;
}
.ng-coll-etat-item:hover{
	background-color:lightblue;
}
.ng-coll-rubanetat{

}

.ng-bouton-alpha {
	width:120px;
	height:120px;
	background-color:lightblue;
	/*
	text-align:center;
	vertical-align:middle;
	*/
	margin-top:5px;
	font-size:80px;
	border-radius: 5px;
	box-shadow: inset 5px 5px 5px rgba(128, 128, 128, 0.8);
	text-shadow: 5px 5px 5px rgba(128, 128, 128, 0.8);
	
	/*centrage du contenu*/
	display: flex;
	justify-content: center;
	align-items: center;
}
.ng-bouton-onglet {
	height:1em;
	margin:1px;
	background-color:lightblue;
	font-size:1em;
	padding:2px;
	border-left:1px solid white;
	cursor:pointer;
}
#zone-onglets{
	background-color:lightblue;
	display:flex;
	flex-direction:row;
}
.ng-select-vig {
	background-color:yellow;
}

.ng-intercalaire2-visible {
	height:150px;
	width:2px;
	background-color:lightblue;
	margin-left:2px;
	margin-right:2px;
}

/* RECHERCHE AVANCEE ------------------------------------------------ */

.ng-boite-rech{
	display:flex;
	flex-direction:column;
	background-color:lightblue;
	border:0px solid white;
	width:100%;
	padding:0.1em;
}
.ng-boite-rech INPUT{
	height:2em;
}
#ng-zone-recherche{
	display:none;
	background-color:#eff5f9;
} 
.ng-resultrech{
	background-color:#92b9ff;
	color:blue;
	cursor:pointer;
}
.ng-resultrech:hover{
	background-color:yellow;
}
.ng-rech-label{
	font-size: 0.8em;
	color:green;
	font-style:italic;
}

#in-recherche:focus{
	border:none;
	outline:none;
}
	
/* MATERIAL ICONS ------------------------------------------------ */
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}

/* VUE GENERALE COLLECTION ------------------------------------------------ */
.ng-coll-section{
	background-color:lightblue;
	color:black;
	border-radius:3px;
	height:2em;
	border-top:1px solid gray;
}