@font-face {font-family: 'Agatha'; src: url('../font/Agatha.ttf'); }
@font-face {font-family: 'Aladin'; src: url('../font/Aladin.ttf'); }
@font-face {font-family: 'Baskerville'; src: url('../font/Baskerville.ttf'); }
@font-face {font-family: 'Battelstar'; src: url('../font/Battelstar.ttf'); }
@font-face {font-family: 'Celtiquedeco'; src: url('../font/Celtiquedeco.ttf'); }
@font-face {font-family: 'Chevalier'; src: url('../font/Chevalier.ttf'); }
@font-face {font-family: 'Cloisterblack'; src: url('../font/Cloisterblack.ttf'); }
@font-face {font-family: 'Digiface'; src: url('../font/Digiface.ttf'); }
@font-face {font-family: 'Disco'; src: url('../font/Disco.ttf'); }
@font-face {font-family: 'Elegant'; src: url('../font/Elegant.ttf'); }
@font-face {font-family: 'Georgia'; src: url('../font/Georgia.ttf'); }
@font-face {font-family: 'Gotham'; src: url('../font/Gotham.ttf'); }
@font-face {font-family: 'Highlight'; src: url('../font/Highlight.ttf'); }
@font-face {font-family: 'Impact'; src: url('../font/Impact.ttf'); }
@font-face {font-family: 'Jedi'; src: url('../font/Jedi.ttf'); }
@font-face {font-family: 'Luminari'; src: url('../font/Luminari.ttf'); }
@font-face {font-family: 'Minster'; src: url('../font/Minster.ttf'); }
@font-face {font-family: 'MORPHEUS'; src: url('../font/MORPHEUS.ttf'); }
@font-face {font-family: 'OLDENGL'; src: url('../font/OLDENGL.ttf'); }
@font-face {font-family: 'Palatino'; src: url('../font/Palatino.ttf'); }
@font-face {font-family: 'Starfleet'; src: url('../font/Starfleet.ttf'); }
@font-face {font-family: 'SW'; src: url('../font/SW.ttf'); }
@font-face {font-family: 'tngan'; src: url('../font/tngan.ttf'); }
@font-face {font-family: 'Tolkien'; src: url('../font/Tolkien.ttf'); }
@font-face {font-family: 'Wanted'; src: url('../font/Wanted.ttf'); }
@font-face {font-family: 'Bradley'; src: url('../font/Bradley.ttf'); }
@font-face {font-family: 'Donny'; src: url('../font/Donny.ttf'); }
@font-face {font-family: 'Herrick'; src: url('../font/Herrick.ttf'); }
@font-face {font-family: 'Kyle'; src: url('../font/Kyle.ttf'); }
@font-face {font-family: 'Lucida'; src: url('../font/Lucida.ttf'); }
@font-face {font-family: 'Monica'; src: url('../font/Monica.ttf'); }
@font-face {font-family: 'Nelly'; src: url('../font/Nelly.ttf'); }
@font-face {font-family: 'Saffron'; src: url('../font/Saffron.ttf'); }
@font-face {font-family: 'WINGDNG3'; src: url('../font/WINGDNG3.TTF'); }

/*----------------------------------------------------------------------------Menus------------------------------------------------
------------------------Barre de menus--------------------------*/


.canvaex{
	height:500px;
	width:700px;
}

.divcanevas{
	height:400px;
	width:600px;
	border:medium;
	border-color:fuchsia;
	border-style:solid;
	overflow:hidden;
	
	}


.test1{
	background-color:aqua;
}
.test2{
	background-color:fuchsia;
}
.test3{
	background-color:lime;
}

#divopac{
	background-image:url('images/bkgrd.jpg');
	position:fixed;
	top:0px;
	left:-4000px;
}




#curseurbeholder {
  position: fixed;
  pointer-events: none;
  z-index: 152;
	font-family:Arial, Helvetica, sans-serif;
	overflow: hidden;
	left:-100px;
}

.divpetitbeholder{
	width:10rem;
	height:10rem;
	left:-100px;
}

#petitbeholder{
	display:none;
		height:10rem;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 5s;
  -webkit-animation-name: rotate;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  
  -moz-transition-property: -moz-transform;
  -moz-animation-name: rotate; 
  -moz-animation-duration: 5; 
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  
  transition-property: transform;
  animation-name: rotate; 
  animation-duration: 5s; 
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@-webkit-keyframes rotate {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

@-moz-keyframes rotate {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(360deg);}
}

@keyframes rotate {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}

}


#divrem{
	width:1rem;
	height:1rem;
}


.titre{
	font-family: Agatha;
	font-size: 3rem;
}

.jdrdisplay{
	font-family:Agatha;
	font-size: 1.3rem;
	}

.taillelogo{
	max-width:5rem;
}

#interrog {
    max-height: 3rem;
    cursor: pointer;
}


.menugauche form{
	cursor:pointer;
}

.menudroite input{
	cursor:pointer;
}

.mainindex{
	width:99%;
	padding-left:1%;
}

.intro{
	margin-left:2rem;
	font-style:italic;
}

.introindex{
	margin-left:10%;
}

.texteinto{
	color: #302510;
	font-size: 1.2rem;
}

.texteintopetit{
	font-size:0.8rem;
	margin-left:1rem;
	margin-bottom:0.5rem;
}

.intropartietexte{
	color: #302510;

	width: 35vw;
	margin-right: 2rem;
	margin-left: 1rem;
}

.tailleimagesintro{
	width:25vw;
}


.tailleminiimagesintro{
	width:3rem;
	cursor:pointer;
	position:absolute;

}

.taillemaxiimagesintro{
	width:3rem;
	position:absolute;

}

#divcroixfermer{
/*	visibility: hidden;*/
	position:absolute;
	z-index:15;
	width:2rem;
	height:2rem;
}

#croixfermer{
	width:2rem;
	height:2rem;
}

.imgsec{
position:absolute;
top:0px;
left:-4000px;
z-index:11;
}


.borduremaxi{
	border-style: solid;
	border-width: 2px;
}
















.imgmaxi{
	width:3rem;
}


.divtailleimagesintrogauche{
	width:25vw;
}

.tailleimagesintrogauche{
	width:25vw;
}

.indeximginfo{
	font-size:0.7rem;
		width:25vw;

}

.divbeholder{
	width:5rem;
	height:5rem;
}

#beholder{
	display:none;
		height:5rem;
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 5s;
  -webkit-animation-name: rotate;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  
  -moz-transition-property: -moz-transform;
  -moz-animation-name: rotate; 
  -moz-animation-duration: 5; 
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  
  transition-property: transform;
  animation-name: rotate; 
  animation-duration: 5s; 
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@-webkit-keyframes rotate {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

@-moz-keyframes rotate {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(360deg);}
}

@keyframes rotate {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}

}


#bandeautitre{
	margin-left:1rem;
}




#lancement{
	max-height:5rem;
	cursor:pointer;
	
}
#lancementjoueur{
	max-height:5rem;
	cursor:pointer;
}

#gomme{
margin-left:1rem;
	height:2rem;
}


.titrepage{
	margin-left:4vw;
	margin-right:5vw;
	font-size: 2rem;
	font-family: "Gotham", sans-serif;
	text-decoration: underline;
    margin-top:0.5rem;
    margin-bottom:0.5rem;
}


#droitetitrepage{
    width:65vw
}

#flechecodebare{
	border: 1px solid #000000;
	width: 1rem;
	background-image: url('images/bkgrd.jpg');
	z-index: 3;
}

#blocvide1em{
	width:1rem;
	background-image: url('images/bkgrd.jpg');
	z-index:3;

}

#tvqrcodetrans{
position:relative;
	border-style: solid none solid solid;
	border-width: 1px;
	border-color: #000000;
	z-index:2;

}


#foucusout{
position:fixed;
left:-110vw;
}



#espaceminiecran{
	height: 3rem;
}

#contespaceminiecran{
margin-left:0.5rem;
margin-right:0.5rem;
}


.premlignedroite{
	height:4rem;
}






.blocinfojetons{
	padding:0.5rem;
	border: 0.3rem ridge #C416F0;
	background-image: url('images/fondjaunevif.jpg');
	position: absolute;
	top: 10rem;
	width: 20vw;
	height: 10vw;
	z-index: 140;
	left:45vw;
	cursor:pointer;
}
.divimginfojeton{
		width:10vw;
		height:10vw;
	
}
.imginfojeton{
		max-width:10vw;
		max-height:10vw;
}

.divtexteinfojeton{
		width:10vw;
		height:10vw;
}


.nompersoinfojeton{
		height:25%;
}
.divrondinfojeton{
		height:50%;
}
.nomjetoninfojeton{
		height:25%;
}


.rondinfojeton{
	border: thin solid #FFFFFF;
	box-shadow: 0px 0px 1px 1px #999999 inset;
	border-radius: 50%;
	width: 45%;
	height: 90%;

}

.valeurinfojeton{
	font-size:2.5em;
	font-weight:bold;
}









/*--------------------------INFOBULL------------------------*/

#largeurviewport{
	width: 100vw;
	height: 0px;
	position:absolute;
}
#hauteurviewport{
	width: 0px;
	height: 100vh;
	position:absolute;
}
#taille_1em{
	width: 1rem;
	height:1rem;
	position:absolute;
}

.divblocimginfo{
	position:relative;
	width:1rem;
}


.imginfo{
	width:1.5rem;
  cursor: help;

}

.infobull{
	position:absolute;
	left: 3rem;
	width: 25vw;
	background-image:url('images/fondjaune.jpg');
	padding: 1rem;
	color:black;
	font-family: "Gotham", sans-serif;
	font-size: 1rem;
	border-style: solid;
	border-width: 5px;
	border-color:#DB501C;
	border-radius: 10px 10px 10px 10px;
	z-index: 10;
	top:100vh;
	z-index:199;

}

/*--------------------------------------------ONGLETS------------------------*/

#gomme{
	cursor:pointer;
}




.bloconglets{
	display: flex;
	z-index:2;
	 border-bottom : 1px solid #DB501C; 
	margin: 0px 1rem 0px 1rem;

}

#interonglet{
	width:10rem;
	padding:0.2rem;
}

.onglet{
	font : bold 18px "Gotham", sans-serif;
	margin : 2px 15px 0 0px;
	border : 1px solid #DB501C;
	border-radius: 5px 5px 0 0;
	top: 1px;
	position: relative;
}

.ongletselect{
	background-image: url('images/bkgrdorange.png');
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #F1CF92;
}

.ongletselectarchives{
	background-image: url('images/bkgrdvioletfonce.png');
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #F2BFFF;
}

.ongletselectstock{
	background-image: url('images/fondorange.jpg');
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #F58E01;
}

 .onglet:hover{
	background-image: url('images/bkgrdorange.png');
	cursor:pointer;
	
}

.titreonglet{
	padding-right:1rem;
	padding-left:1rem;
	padding-bottom:0.7rem;
	padding-top:0.7rem;
}

.center{
		text-align: center;
}

/*--------------------------------------------------*/
body{
	background-image:url('images/bkgrd.jpg');
	margin:0px;
	padding:0px;
	font-family: "Gotham", sans-serif;

}

header{
	background-image:url('images/bkgrdorange.png');
/*	padding-top:0.3rem;
	padding-bottom:0.3rem;
	padding-right:1rem;
	padding-left:1rem;*/
    width: 100%;
}

.divheader{
	width:96%;
	padding-top:0.3rem;
	padding-bottom:0.3rem;
	padding-right:1rem;
	padding-left:1rem;
}

footer{ 
	margin: auto;
    width: 100%;
   }


.bhr{
	margin-block-start:0px;
}

form{
	margin:0px;
	padding:0px;
}

main{ 
    width: 100%;
   }




 a{
	color: #6600CC;
}

.italique {font-style: italic;}
.souligne {text-decoration:underline;}
.gras {font-weight:bold;}
.textecentre{
	text-align:center;
}


.divespace{
	padding:0.5rem;
}
.div2espace{
	padding: 0.5rem 1rem 0.5rem 1rem;
}
.div3espace{
	padding: 0.5rem 2rem 0.5rem 2rem;
}
.div4espace{
	padding: 0.5rem 3rem 0.5rem 3rem;
}
.div5espace{
	padding: 0.5rem 4rem 0.5rem 4rem;
}

.divdemiespace{
	padding:0.25rem;
}

.divespacelarge{
	padding-right: 0.5rem;
	padding-left: 0.5rem;
}


.divquartespace{
	padding:0.125rem;
}

#nompersoasupp{
font-weight:bold;
}

.aucunjoueur{
	width:100%;
	height:100%;
}

input{
	font-size: 1.1rem;
	font-family: "Gotham", sans-serif;
	background-image: url('images/fondjaunevif.jpg');
	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
}



label{
	font-size:1.1rem;
}

.ecritpetit{
	font-size:0.7rem;
}
.texterouge{
	color:#FF0066;
}

.divdesactive{
	opacity:0.5;
}

.infoonglet{
	height:2rem;
}

/*-----------------  espacements depuis le bord gauche  ---------------------*/


.parag1{
margin-left:1rem;
}

.parag2{
margin-left:2rem;
}
.parag3{
margin-left:3rem;
}
.parag4{
margin-left:4rem;
}













/*------------------------------FLEX--------------------------------*/

.flex{
	    display: flex;
    flex-wrap: wrap;
}

.flexcentre{
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

.flexecartemultilignes{
	display: flex;
    flex-wrap: wrap;
	justify-content: space-between;
}


.flexecarte{
	display: flex;
	justify-content: space-between;
}


.flex_ecart_vertical
{
    display: flex;
     flex-direction: column;
	justify-content: space-between;
	
}

.flexvertical
{
    display: flex;
    align-items: center;
}


.flex_ecart_vertical2
{
    display: flex;
     flex-direction: column;
     	justify-content: space-around;

}


.flextotal{
    display: flex;
    justify-content: center;
    align-items: center;
}

.flextotalvertical{
    display: flex;
         flex-direction: column;

    justify-content: center;
    align-items: center;
}


/*-----------------------------------BOUTONS---------------------------------------*/
.bouton{
	font-size: 1.3rem;
	font-family: "Gotham", sans-serif;
	background-image: url('images/fondjaunevif.jpg');
	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	cursor: pointer;
}

.bouton.annulerpartie{
color:red;
}

.bouton.reprendrepartie{
color:green;
}

.bouton:disabled{
	background-image: url('images/fondjaunevif.jpg');
	box-shadow: 3px 2px 2px #DB501C;
}

.bouton:disabled:hover{
	background-image: url('images/fondjaunevif.jpg');
	box-shadow: 3px 2px 2px #DB501C;
}


.bouton:active{
	margin: 1px -1px -1px 1px;
	box-shadow: 0px 0px 0px #ffffff;
}





.boutontv{
	background-color: black;
	font-size: 1.3rem;
	font-family: "Gotham", sans-serif;
	border: 3px ridge #D13F2D;
	box-shadow: 2px 2px 2px 1px #F0906C;
	cursor: pointer;
}

.boutontv:hover{
	box-shadow: 0px 0px 2px 2px #F0906C;
}

.boutontv:active{
	margin: 1px -1px -1px 1px;
	box-shadow: 0px 0px 0px 0px #ffffff;
}



.boutonmessagerie{
	font-size: 1.3rem;
	font-family: "Gotham", sans-serif;
	background: #6a00eb;
	border: 1px solid silver;
	border-radius: 5px;
	box-shadow: 4px 4px 9px 1px #6a00eb;
	cursor: pointer;
	color: #FFFFFF;
}


.boutonmessagerie:hover{
	box-shadow: 2px 2px 4px 1px #6a00eb;
	margin: 1px -1px -1px 1px;
}
















.boutonmarge{
	font-size: 1rem;
	font-family: "Gotham", sans-serif;
	background-image: url('images/fondjaunevif.jpg');
	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	margin:0.5rem;
	cursor: pointer;

}



.boutonmarge:hover{
	background-image: url('images/fondjaune.jpg');
	margin-top:calc(0.5rem + 1px);
	margin-right:calc(0.5rem - 1px);
	margin-bottom:calc(0.5rem - 1px);
	margin-left:calc(0.5rem + 1px);
	box-shadow: 1px 1px 1px #DB501C;
}


.boutonmarge:active{
	margin-top:calc(0.5rem + 1px);
	margin-right:calc(0.5rem - 1px);
	margin-bottom:calc(0.5rem - 1px);
	margin-left:calc(0.5rem + 1px);
	box-shadow: 0px 0px 0px #ffffff;
}


.boutonmoyen{
	font-size: 1rem;
	font-family: "Gotham", sans-serif;
	background-image: url('images/fondjaunevif.jpg');
	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	cursor: pointer;
}

.boutonmoyen:disabled{
	cursor:default;
}


.boutonmoyen:hover:enabled{
	background-image: url('images/fondjaune.jpg');
	margin: 1px -1px -1px 1px;
	box-shadow: 1px 1px 1px #DB501C;
}


.boutonmoyen:active{
	margin: 1px -1px -1px 1px;
	box-shadow: 0px 0px 0px #ffffff;
}


.boutonmoyen.select{
	background-image: url('images/fondjaune.jpg');
	-webkit-box-shadow: 1px 1px 1px #DB501C, 0px 0px 4px 2px rgba(41,25,10,0.6), 0px 0px 8px 6px rgba(203,24,1,0.7), 0px 0px 10px 10px rgba(246,206,44); 	
	box-shadow: 1px 1px 1px #DB501C, 0px 0px 4px 2px rgba(41,25,10,0.6), 0px 0px 8px 6px rgba(203,24,1,0.7), 0px 0px 10px 10px rgba(246,206,44);
}


.boutonpetit{
	font-size: 0.8rem;
	font-family: "Gotham", sans-serif;
	background-image: url('images/fondjaunevif.jpg');
	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	cursor: pointer;
}

.boutonpetit:hover{
	background-image: url('images/fondjaune.jpg');
	margin: 1px -1px -1px 1px;
	box-shadow: 1px 1px 1px #DB501C;
}


.boutonpetit:active{
	margin: 1px -1px -1px 1px;
	box-shadow: 0px 0px 0px #ffffff;
}



.boutontrespetit{
	font-size: 0.6rem;
	font-family: "Gotham", sans-serif;
	background-image: url('images/fondjaunevif.jpg');
	border : 1px solid #DB501C;
	border-radius: 3px;
	box-shadow: 3px 2px 2px #DB501C;
	cursor: pointer;
}

.boutontrespetit:hover{
	background-image: url('images/fondjaune.jpg');
	margin: 1px -1px -1px 1px;
	box-shadow: 1px 1px 1px #DB501C;
}


.boutontrespetit:active{
	margin: 1px -1px -1px 1px;
	box-shadow: 0px 0px 0px #ffffff;
}

















.minibouton{
	background-color:#EAE684;
	border : 1px solid #DB501C;
	border-radius: 3px;
	cursor: pointer;
	width: 1rem;
	height: 1rem;
}

.minibouton:hover{
	background-color:#F0CD4C;
}



.minibouton:active{
	background-image: url('images/fondjaune.jpg');
	box-shadow: 0px 0px 0px #ffffff;
		margin: 1px -1px -1px 1px;
}

.minibtnh{
	background-image:url('images/reph.png');
	background-size: 100%;
}

.minibtnv{
	background-image:url('images/repv.png');
	background-size: 100%;
}


.actif{
	background-image: url('images/fondjaune.jpg');
	margin: 1px -1px -1px 1px;
	box-shadow: 1px 1px 1px #DB501C;
}

.actifmarge{
	background-image: url('images/fondjaunemoyen.jpg');
	margin-top:calc(0.5rem + 1px);
	margin-right:calc(0.5rem - 1px);
	margin-bottom:calc(0.5rem - 1px);
	margin-left:calc(0.5rem + 1px);
	-webkit-box-shadow: 1px 1px 1px #DB501C, 0px 0px 4px 2px rgba(41,25,10,0.6), 0px 0px 8px 6px rgba(203,24,1,0.7), 0px 0px 10px 10px rgba(246,206,44); 	
	box-shadow: 1px 1px 1px #DB501C, 0px 0px 4px 2px rgba(41,25,10,0.6), 0px 0px 8px 6px rgba(203,24,1,0.7), 0px 0px 10px 10px rgba(246,206,44);
}

.ligneboutonsaffiche{
	height:2rem;
}

.quitaffimmediat{
	font-size: 1rem;
	font-family: "Gotham", sans-serif;
	background-image: url('images/bkgrdvioletfonce.png');
	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	cursor: pointer;
}

.quitaffimmediat:hover{
	background-image: url('images/bkgrdvioletfonce.png');
	margin: 1px -1px -1px 1px;
	box-shadow: 1px 1px 1px #DB501C;
}



.boutontypetexte{
	font-family: "Gotham", sans-serif;
	background-color:#EBE283;
	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	cursor: pointer;
	font-size: 1.1rem;
	text-align:left;
	white-space: nowrap;
	overflow: hidden;
}

.boutonpresentligne{
	padding: 1px;
	margin: 2px;
	font-family: "Gotham", sans-serif;
	background-image: none;
	border: 2px solid #CC00CC;
	font-size: 1.1rem;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
}

.boutontypetexte.select{
	background-image: url('images/fondjaune.jpg');
	-webkit-box-shadow: 1px 1px 1px #DB501C, 0px 0px 4px 2px rgba(41,25,10,0.6), 0px 0px 8px 6px rgba(203,24,1,0.7), 0px 0px 10px 10px rgba(246,206,44); 	
	box-shadow: 1px 1px 1px #DB501C, 0px 0px 4px 2px rgba(41,25,10,0.6), 0px 0px 8px 6px rgba(203,24,1,0.7), 0px 0px 10px 10px rgba(246,206,44);
}


. boutontypetexte:disabled{
	background-image: url('images/fondjaunevif.jpg');
	box-shadow: 3px 2px 2px #DB501C;
	
	
}


.boutontypetexte:hover{
	background-image: url('images/fondjaune.jpg');
	margin: 1px -1px -1px 1px;
	box-shadow: 1px 1px 1px #DB501C;
}


. boutontypetexte:active{
	box-shadow: 0px 0px 0px #ffffff;
}



.actiftexte{
	background-image: url('images/fondjaune.jpg');
	-webkit-box-shadow: 1px 1px 1px #DB501C, 0px 0px 4px 2px rgba(41,25,10,0.6), 0px 0px 8px 6px rgba(203,24,1,0.7), 0px 0px 10px 10px rgba(246,206,44); 	
	box-shadow: 1px 1px 1px #DB501C, 0px 0px 4px 2px rgba(41,25,10,0.6), 0px 0px 8px 6px rgba(203,24,1,0.7), 0px 0px 10px 10px rgba(246,206,44);
}








.boutonalign{
	background-image: url('images/fondjaunevif.jpg');

	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	width: 1.5rem;
	height: 1.5rem;
	cursor: pointer;
	margin:0.2em
}


.boutonalign:disabled{
	background-image: url('images/fondjaunevif.jpg');
	box-shadow: 3px 2px 2px #DB501C;
}

.boutonalign:hover{
	background-image: url('images/fondjaune.jpg');
	box-shadow: 3px 2px 2px #DB501C;
}


.boutonalign:disabled:hover{
	background-image: url('images/fondjaunevif.jpg');
	box-shadow: 3px 2px 2px #DB501C;
}


.boutonalign:active{
	background-image: url('images/fondjaune.jpg');
	margin: 1px -1px -1px 1px;
	box-shadow: 0px 0px 0px #ffffff;
}








.boutonpolice{
	background-image: url('images/fondjaunevif.jpg');

	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	width: 1rem;
	height: 1rem;
	cursor: pointer;
	margin:0.2em
}


.boutonpolice:disabled{
	background-image: url('images/fondjaunevif.jpg');
	box-shadow: 3px 2px 2px #DB501C;
}

.boutonpolice:hover{
	background-image: url('images/fondjaune.jpg');
	box-shadow: 3px 2px 2px #DB501C;
}
.boutonpolice:disabled:hover{
	background-image: url('images/fondjaunevif.jpg');
	box-shadow: 3px 2px 2px #DB501C;
}


.boutonpolice:active{
	background-image: url('images/fondjaune.jpg');
	margin: 1px -1px -1px 1px;
	box-shadow: 0px 0px 0px #ffffff;
}

/*--------------------------------------------Menu choix affichage--------------------------------*/


.imgtvavecsansimg{
	height: 2.5rem;
	cursor:pointer;
}

/*--
#imgtvavecsansimgtxt{
	height: 2.5rem;
	cursor:pointer;
}

#imgtvavecsansimgaff{
	height: 2.5rem;
	cursor:pointer;
}
*/


.divecrandiff{
	width:9rem;
	cursor:pointer;
	margin-bottom:0.5rem;
	
}


.ecrandiff{
	max-width:9rem;
	opacity:0.5;
}




.ecrandiff:hover{
	cursor:pointer;
	opacity:0.7;
}


.ecrandiff.diffselect:hover{
	opacity:1;
	cursor:default;
}


.diffselect{
	opacity:1;
}

/*--------------------------------------------SELECT--------------------------------*/

select {
	/* Reset Select */
  appearance: none;
	outline: 0;
	border: 0;
	box-shadow: none; /* Personalize */;
	flex: 1;
	padding: 0 1rem;
	color: #000000;
	background-color: #F4D24C;
	background-image: url('images/fondjaunevif.jpg');
	cursor: pointer;
	  height: 1.3rem;
}
/* Remove IE arrow */
select::-ms-expand {
  display: none;
}
/* Custom Select wrapper */
.selecteur {
	border : 1px solid #DB501C;
  position: relative;
  display: flex;
  height: 1.3rem;
/*  max-width:50vw;*/
  border-radius: .25rem;
  overflow: hidden;
  	box-shadow: 3px 2px 2px #DB501C;
  font-size:1.1rem;
  width:100%;
  max-width:50rem;
}

.selecteur:hover {
  	box-shadow: 2px 1px 1px #DB501C;
}

/* Arrow */
.selecteur::after {
  content: '\25BC';
  position: absolute;
  top: 0;
  right: 0;
  padding: 0.1rem;
	background-image: url('images/fondjaunevif.jpg');
  transition: .25s all ease;
  pointer-events: none;

}
/* Transition */
.selecteur:hover::after {
	color: #666666;
}




.selecteurpetit {
	border : 1px solid #DB501C;
  position: relative;
  display: flex;
  height: 1.2rem;
/*  max-width:50vw;*/
  border-radius: .2rem;
  overflow: hidden;
  	box-shadow: 2px 2px 2px #DB501C;
  font-size:0.9rem;
  width:90%;
}

.selecteurpetit:hover {
  	box-shadow: 2px 1px 1px #DB501C;
}

/* Arrow */
.selecteurpetit::after {
	background-image: url('images/fondjaune.jpg');
  transition: .25s all ease;

}
/* Transition */
.selecteurpetit:hover::after {
	color: #666666;
}




.lignefamille{
	border: medium inset #DB501C;
	background-image: url('images/fondjaune.jpg');
	margin: 0.5rem;
	padding: 0rem 0rem 0rem 1rem;
}

#idfamille{
	font-family: "Gotham", sans-serif;
	font-size:1.1rem;
}

.listeselectfamille{
	font-size:0.9rem;
	width:15rem;
}

#selectfamille{
	font-family: "Gotham", sans-serif;
	font-size:1rem;
}

.selecteurfamille{
	font-family: "Gotham", sans-serif;
	font-size:1rem;
}



.classselect{
	font-family: "Gotham", sans-serif;
	font-size:1rem;
}

/*--------------------------------------------------------radio------------------------------------------*/

input[type="radio"] {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  appearance: none;
  /* For iOS < 15 to remove gradient background */
  background-color:lime;
  /* Not removed via appearance */
  margin: 0;
	box-shadow: 0px 0px 0px #DB501C;

}


input[type="radio"] {
  appearance: none;
  background-color:lime;
/*  background-image:url('images/saurons-eye copie.png');*/
  margin: 0;
  font: inherit;
  color:#DE2000;
  width: 1.15rem;
  height: 1.15rem;
  border: 0.15rem solid currentColor;
  border-radius: 50%;
}

.form-control + .form-control {
  margin-top: 1rem;
}


input[type="radio"] {
  appearance: none;
  background-color:lime;
  margin: 0;
  font: inherit;
  color:#DE2000;
  width: 1.15rem;
  height: 1.15rem;
  border: 0.15rem solid currentColor;
  border-radius: 50%;
  transform: translateY(-0.075rem);
}

input[type="radio"] {
  /* ...existing styles */

  display: grid;
  place-content: center;
}

input[type="radio"]::before {
  content: "";
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 50%;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1rem 1rem red;
}


input[type="radio"] {
  /* ...existing styles */
  display: grid;
  place-content: center;
}

input[type="radio"]::before {
  content: "";
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 50%;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1rem 1rem black;
}

input[type="radio"]:checked::before {
  transform: scale(1);
}


input[type="radio"]::before {
  /* ...existing styles */

  /* Windows High Contrast Mode */
  background-color: CanvasText;
}


input[type="radio"]:focus {
  outline: max(2px, 0.15rem) solid #FFFF66;
  outline-offset: max(2px, 0.15rem);
}

.form-control:focus-within {
  color: black;
}























/*--------------------------------------------------------Checkbox glissee------------------------------------------*/


input[type="checkbox"].boutongliss {
  display: none;
}
input[type="checkbox"].boutongliss + label {
  box-sizing: border-box;
  display: inline-block;
  width: 2.7rem;
  height: 1.2rem;
  border-radius: 1.5rem;
  padding:2px;
/*  background-color: #c0ceda ;*/
  background-color:#999999;
  transition: all 0.5s ;
}
input[type="checkbox"].boutongliss + label::before {
  box-sizing: border-box;
  display: block;
  content: "";
  height: calc(1.2rem - 4px);
  width: calc(1.2rem - 4px);
  border-radius: 50%;
  background-color:#EBE282;
  transition: all 0.5s ;
}
input[type="checkbox"].boutongliss:checked + label {
  background-color:#D13F2D;
}
input[type="checkbox"].boutongliss:checked + label::before {
  margin-left: 1.5rem ;
}


/*--------------------------------------------------------Checkbox glissee petite------------------------------------------*/


input[type="checkbox"].boutonglisspetit {
  display: none;
}
input[type="checkbox"].boutonglisspetit + label {
margin:0.1rem;
  box-sizing: border-box;
  display: inline-block;
  width: 2rem;
  height: 0.7rem;
  border-radius: 0.7rem;
  padding:2px;
/*  background-color: #c0ceda ;*/
  background-color:#999999;
  transition: all 0.5s ;
   cursor:pointer;

}
input[type="checkbox"].boutonglisspetit + label::before {
  box-sizing: border-box;
  display: block;
  content: "";
  height: calc(0.7rem - 4px);
  width: calc(0.7rem - 4px);
  border-radius: 50%;
  background-color:#EBE282;
  transition: all 0.5s ;
}
input[type="checkbox"].boutonglisspetit:checked + label {
  background-color:#D13F2D;
}
input[type="checkbox"].boutonglisspetit:checked + label::before {
  margin-left: 1.2rem ;
}


/*--------------------------------------------------------Checkbox normale------------------------------------------*/

.pasauto{
	font-size:1.5rem;
	color:#D13F2D;
}

input[type="checkbox"].chknorm {
  display: none;
}
input[type="checkbox"].chknorm + label {
	background-image: url('images/fondjaunevif.jpg');
	border-radius: 3px;
	border: 1px solid #D13F2D
}
input[type="checkbox"].chknorm + label::before {
  content: "\2714";
  opacity:0;
}

input[type="checkbox"].chknorm:checked + label {
  background-color:#D13F2D;
}


input[type="checkbox"].chknorm:checked + label::before {
  opacity:1;
}



















/*--------------------------------------Blocs principaux--------------------------------------------*/

#contenantaffichage{
	margin: 0px 1rem 0px 1rem;

}

#contenantgeneral{
	margin: 0px 1rem 1rem 1rem;
	background-image: url('images/bkgrdorange.png');
	border-color: #DB501C;
	border-style: solid;
	border-width: 1px;
	padding: 0.5rem;
	  border-radius: 5px;


}


#blocaffichage{
	background-image: url('images/bkgrdorange.png');
	border-color: #DB501C;
	border-style: solid;
	border-width: 0 1px 1px 1px;
	padding: 0.5rem;
}
#blocaffichagestock{
	background-image: url('images/fondorange.jpg');
	border-color: #DB501C;
	border-style: solid;
	border-width: 0 1px 1px 1px;
	padding: 0.5rem;
}
#blocaffichagearchives{
	background-image: url('images/bkgrdvioletfonce.png');
	border-color: #DB501C;
	border-style: solid;
	border-width: 0 1px 1px 1px;
	padding: 0.5rem;
}

#bloccp{
	background-image: url('images/bkgrdorange.png');
	border-color: #DB501C;
	border-style: solid;
	border-width: 0 1px 1px 1px;
	padding: 0.5rem;
}

#bloccs{
	background-image: url('images/bkgrdorange.png');
	border-color: #DB501C;
	border-style: solid;
	border-width: 0 1px 1px 1px;
	padding: 0.5rem;
}



#blocgauchedroit{
	visibility: hidden;
}


#blocaffgauche{
	border: 1px solid #669900;
	background-image: url('images/bkgrdvertvif.png');
}


.dansblocaffdroit{
	margin-left: 0.5rem;
	min-width:470px;
}


.blocdroitselect{
	border: 1px solid #CD6A18;
	background-image: url('images/fondorange.jpg');
}
.blocdroitgroupe{
	border: 1px solid #BA9412;
	background-image: url('images/fondjaunevif.jpg');
}
.blocdroitunique{
	border: 1px solid #BB2FFF;
	background-image: url('images/bkgrdvioletfonce.png');
}
#blocdroittextes{
	border: 1px solid #0456FF;
	background-image: url('images/bkgrdbleu.png');
	height:100%;
}


#blocgestion{
	margin: 2rem;
	background-image: url('images/fondjaunevif.jpg');
}


#blocarchives{
	margin: 2rem;
}


.nomfamille{
	font-size: 1.5rem;
	text-decoration: underline;
}

.divprincipalgestion{
	margin: 2rem;
}

.divprincipalstock{
	margin: 2rem;
}


.divprincipal{
	margin: 2rem;
	overflow-y:auto;
	height:45vh;
}


#blocgestionimage{
/*	visibility:hidden;*/
}

/*--------------------------------------------------------------------------------------------------*/

textarea {

	font-size: 1.05rem;
	font-family: "Gotham", sans-serif;
	background-image: url('images/fondjaunevif.jpg');
	border : 1px solid #DB501C;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
}


.cadresaisie{
	padding: 0rem 1rem 0rem 1rem;
	font-size: 1.1rem;
}

.fondjaune{
	background-image: url('images/fondjaunevif.jpg');

}



.divconteneur{
	position:relative;
	z-index:10;
	border: 3px double #D3001D;
	border-radius: 5px;
	width: 200px;
	height: 200px;
	background-image:url('images/carredropzone.jpg');

}

.divimgblocdropzone{
	position:absolute;
	width: 200px;
	height: 200px;
}

.imgblocdropzone{
	max-width: 200px;
	max-height: 200px;
}

.divtextedropzone{
	position:absolute;
	font-family: "Gotham", sans-serif;
	font-size:1.5rem;
	width: 200px;
	height: 200px;
	text-align:center;
}

.zonedropzone{
	position:absolute;
	width: 200px;
	height: 200px;
}

.divstocknometcont{
	margin: 5px;
	border: 3px double #D3001D;
	border-radius: 5px;
	width: 200px;
	height: 200px;
	position:relative;
}

.divconteneurstock{
	border-radius: 5px;
	width: 200px;
	height: 200px;
	z-index: 5;
}
.titredropzone{
	font-size: 1rem;
	font-weight: bold;
	background-image: url('images/fondjaunevif.jpg');
	position:absolute;
	width: 200px;
	height: 200px;
}

.blocvignette{
	border: 1px solid #000000;
	margin: 2px;
	width: 160px;
	height: 210px;
}
.divvignette{
	width: 158px;
	height: 152px;
	margin: 1px;
}
.vignettestock{
	max-width:200px;
	max-height:200px;
	margin-right:1rem;
}



.boutonfermer{
	position:absolute;
	top: 1rem;
	right: 1rem;
}

.pavesurgissant{
	border: 0.3rem ridge #CC001C;
	background-image: url('images/fondjaune.jpg');
	position: absolute;
	top: 5rem;
	left:-3500px;
	max-width:70vw;
	border-radius: 3px;
}

.texteinfopave{
	font-style:italic;
	font-size:0.8rem;
}

.pavesurgissantvert{
	border: 0.3rem ridge #00CC00;
	background-image: url('images/fondvert.jpg');
	position: absolute;
	top: 5rem;
	left: -3500px;
	max-width: 50rem;
	z-index:140;
	border-radius: 3px;
	}

.pavesurgissantrouge{
	border: 0.3rem ridge #FF3300;
	background-image: url('images/fondrouge.jpg');
	position: absolute;
	top: 5rem;
	left: -3500px;
	max-width: 50rem;
	color: #FFFFFF;
	z-index:140;
	border-radius: 3px;
}

.iconeagranditreduit{
	
}


/*-------------pavesurgissantbis a les memes caracteristiques que pavesurgissant mais n est pas efface par le bouton annuler----------------*/
.pavesurgissantbis{
	border: 0.3rem ridge #CC001C;
	background-image: url('images/fondjaune.jpg');
	position: absolute;
	top: 5rem;
	left:-3500px;
	max-width:50rem;
	border-radius: 3px;
}


.pavevignettesurgissant{
	border: 10px ridge #CC001C;
	background-image: url('images/fondjaune.jpg');
	position: absolute;
	top: 100px;
	left:-3500px;
	border-radius: 3px;
}


.divcont{
		width: 100px;
	height: 100px;

}
#container{
	width: 150px;
	height:150px;
	padding: 15px;
	border-radius: 4px;
	}


#divcontainer{
	width: 150px;
	height:150px;
	padding: 15px;
	border: 3px double #000000;
	border-radius: 5px;
	background-image: url('images/bkgrdorange.png');

	}

#imgtroppetite{
	font-size:1.3rem;
	text-align:center;
}


.affichphotosimple{
width:150px;
margin:5px;
}

.aucuneimage{
	font-size:1.5rem;
}




#divzoomplus{
	height:100%;
	width:100%;
	background-color:black;
	position:absolute;
	top:0;
	left:-110vw;
  display: flex;
justify-content: center;	
align-items: center;
z-index:10;

}

#infotailles{
	position:absolute;
	background:white;
	font-size:0.8rem;
	color:black;
	top:0px;
	left:0px;
	z-index:10;
	
	
}

#divimgzoomplus{
	height:100%;
	width:100%;
  display: flex;
  z-index:2;
}


#imgzoomplus{
	max-width:100vw;
	max-height:100vh;
}


/*---------------------------- Gestion des stocks de photo  -*/


.gdimagestock{
	max-height:600px;
	max-width:600px;
}

.divgdimagestock{
	height:600px;
	width:600px;
}



.clicarme{
	padding: 0px;
	margin: 1px;
	cursor: pointer;
	background-image: url('images/bkgrdjaune.png');
}


.pavecarre{
	width:500px;
	height:500px;
}



#photoclignote {
   animation-duration: .8s;
   animation-name: clignoter;
   animation-iteration-count: infinite;
   transition: none;
}

@keyframes clignoter {
  0%   { opacity:1; }
  50%   {opacity:0; }
  100% { opacity:1; }
}

/*----------------------------------------------Vignette-----------*/



.affichphoto0{
	margin: 5px;
	width: 106px;
	height:calc(106px + 3.8rem);
	border: thin solid #C0C0C0;
}

.affichphoto1{
	margin: 5px;
	width: 106px;
	height:calc(106px + 5.8rem);
	border: thin solid #C0C0C0;
}

.affichphoto2{
	margin: 5px;
	width: 106px;
	height:calc(106px + 7.8rem);
	border: thin solid #C0C0C0;
}

.affichphoto3{
	margin: 5px;
	width: 106px;
	height:calc(106px + 9.8rem);
	border: thin solid #C0C0C0;
}


.divimagevignaff{
	width:106px;
	height:106px;
}

.imagevignaff{
	border: 2px solid #CCCCCC;
	maw-width: 100px;
	max-height: 100px;
	cursor:pointer;
}

.textnomvignette{
	margin: 0.3rem 0.2rem 0.3rem 0.1rem;
	vertical-align: middle;
	text-align: center;
	height:3rem;
}




.textnomvignettearchives{
	margin: 0.3rem 0.2rem 0.3rem 0.1rem;
	vertical-align: middle;
	text-align: center;
	height:1rem;
	font-style: italic;
}

#existedeja{
	maw-width:90vw;
}
.cadredoublons{

	padding:1rem;
}

.divimgdoublons{
	width:100px;
	height:100px;
	margin:0.5rem;
}

.cadreselectvignette{
	border: 3px solid #00FF00;
}


.cadrevert{
	border: 3px solid #00FF00;
}

.fondvert{
	background-color: #B0FFA8;
}

.fondblanc{
	background-image:url('images/bkgrdtresclair.png');
}

#preloader{
display:none;
left:1500px;
}
/*-----------------------------------------------------------------------*/


/*-----------------------------------Pas range-------------------*/


.divtextenom{
	height:75px;	
}


.classtitre {
text-align: center;
font-size: xx-large;
	font-family: "Gotham", sans-serif;
text-decoration: underline;
}


.aligndroite {
	text-align: right;
}

.classflex{
		display: flex;
}




.divcentrale{
	margin: auto;
	display: flex;
	flex-wrap: wrap;
 justify-content: space-around;

}





.imagegrise {
    opacity: 0.5;
}



.cadretransp{
	border: 3px solid #FCE8B9;
}


.tailleimage{
max-height:100%;
max-width:100%;
	
}


.divcenrale{
	margin: auto;
	display: flex;
	flex-wrap: wrap;
 justify-content: space-around;

}


.supression{
background-color:orange;
	
}


.ligneaff{
	border-style: inset;
	background-image: url('images/bkgrdorange.png');
}





.divimageges{
	width:106px;
	height:176px;
}



#ligneradiotype{
	border: medium inset #DB501C;
	background-image:url('images/fondjaune.jpg');
	max-width:90%;
	padding:0.5rem;
	margin-left:3rem;
	margin-bottom:1rem;
	margin-top:1rem;
	margin-right:1rem;

}

.nomtypedansbloc{
	margin: 0.50rem;
}
.larglignegroupe{
	width:80%;
}


.cadreimage{
	border: 5px inset #D3001D;
	background-color:black;
	width:200px;
	height:200px;
}

.imagedemo{
	max-width:200px;
	max-height:200px;
}


/*-----------------------------------------------------------------------------------------PAGE INDEX  */

/*----formulaires creation client-----*/
.champsaisie {
    display: flex;
    flex-wrap: wrap;
  /*  width: 600px;*/
    padding:3px;
}
.zonelab{
	margin-right:1rem;
}

.zonesaisie{
    width:100%;
}

.paveerreur{
	margin: 0.5rem;
	color: red;
	font-size: 1rem;
	font-weight: bold;
}

#g_crea{
	max-width:50vw;
}

#crea{
	max-width:50vw;
}

#mailenvoye{
	border: 3px outset #66FF66;
	padding: 1rem;
	display: none;
	background-image: url('images/fondjaunevif.jpg');
	border: 3px solid #66FF66;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	top: -10rem;
	position: relative;
}
/*-----------------------------------------------------------------------------------------PAGE paiement  */

#nbrabsec{
	width:2rem;
	text-align:center;
}

#divboutonspaiement{
width:300px;
height:140px;
}

#contenantbtnvirement{
	background-image:url('images/bkgrd.jpg');
	position:relative;
	height:33px;
	bottom:33px;
	z-index:100;
}

#btnvirement{
	background-color:#CC00FF;
	position:relative;
	height:35px;
	bottom:-9px;
	z-index:101;
	cursor: pointer;
}

#btnvirement:hover{
		background-color:#B000DD
}

.textvirement{
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	    font-weight:600;
        font-size: 13px;
        color:#FFFFCC;
		border-radius: 4px;

}
/*--------------------------------PARAMETRES---------------------------------*/
.divconteneurimgbase{
	z-index:10;
	border: 3px double #D3001D;
	border-radius: 5px;
	background-image: url('images/carredropzone.jpg');
	width: 200px;
	height: 200px;
}



/*--------------------------------MON COMPTE---------------------------------*/

#quisuisje{
	margin: 0rem 0rem 0rem 3rem;
}

#champsquisuisje{
	margin: 0rem 0rem 0rem 3rem;
	width:50vw;
}

.divchsais{
	width:50%;
}

.oeilmp{
position:relative;
text-align : right;
}

#graverspayant{
	margin-left: 5rem;
}

.colcs{
	width:15rem;
}

.texterecup{
	font-size:0.8rem;
}



/*------------------------------------------------------------------Admin ------------------*/

#contenantadmin{

padding:2rem;}

.csfondrouge{
	background-color:#FF9966;
}

/*------------------------------------------------------------------TEXTES ------------------*/

.afffamillestextes{
	border: 1px solid #C82836;
	padding: 0.5rem;
	margin: 0.2rem;
}


.btnfiltrefamille{
	font-size: 1.1rem;
	height: 1.2rem;
	font-family: "Gotham", sans-serif;
	background-image: url('images/fondjaunevif.jpg');
	border : 1px solid #DB501C;
	border-radius: 5px;
	padding-right: 1.4rem;
	padding-left: 4px;
}
.croixfiltre{
	font-weight: bold;
	font-size: 1.1rem;
	width: 1.2rem;
	height: 1.2rem;
	cursor: pointer;
	right: 1.2rem;
	position: relative;
	color:#C82836;
}





#champtexte{
	width:75%;
}



.carrecouleur{
	border: 1px solid #000000;
	margin: 0.25rem;
	width: 1rem;
	height: 1rem;
	border-radius:2px;

}


.carebarre{
color:red;
	width: 1rem;
	height: 1rem;
}


.carrecouleur:hover{
cursor:pointer;
}


.carrecouleur.select{
	-webkit-box-shadow: 1px 1px 1px #DB501C, 0px 0px 3px 1px rgba(41,25,10,0.6), 0px 0px 7px 5px rgba(203,24,1,0.7), 0px 0px 9px 9px rgba(246,206,44); 	
	box-shadow: 1px 1px 1px #DB501C, 0px 0px 3px 1px rgba(41,25,10,0.6), 0px 0px 7px 5px rgba(203,24,1,0.7), 0px 0px 9px 9px rgba(246,206,44);
}



.carrepolice{
	font-family:"Times New Roman", Times, serif;
	font-size:1.3rem;
	margin: 0.2rem;
	width: 1rem;
	height: 1rem;
	text-align:center;
	border-radius:3px;
}

.carrepolice.select{
	background-color: #E2EAFE;
	box-shadow: 0px 0px 3px 3px #E2EAFE;
	border-radius:3px;
}

.carrepolice:hover{
	text-shadow:   0px 0px 7px rgba(203,24,1,0.7), 0px 0px 9px rgba(246,206,44);
	border-radius:3px;
	cursor: pointer;
	
}

.carrepolice:active{
	background-color:#ffffff;
	box-shadow: 0px 0px 3px 3px #ffffff;
	border-radius:3px
}

#blocecran{
	border-style:ridge;
	border-width:5px;
	position:relative;
	background-color:black;
}

#cadredifferenceaffiche{
	border: 4px solid red;
	position: absolute;
	width: 100%;
	height: 100%;
	left:-9px;
	top:-9px;
	padding:5px;
	animation: clignottdiffaff 2s ease 0s infinite normal forwards;
}


@keyframes clignottdiffaff {
	0%,
	50%,
	100% {
		opacity: 1;
	}

	25%,
	75% {
		opacity: 0;
	}
}



#blocecranclone{
	border-style:ridge;
	border-width:5px;
	position:relative;
	background-color:black;
}



#contenanttextesclone{
position:absolute;
z-index:10;
}


.divminiblocs{
	position: relative;
	left: -1000px;
}

.divminiimage{
    position: absolute;
    bottom:0px;
}

.divtext{
	position: absolute;
	bottom: 0px;
	background-color: black;
	color: white;
	z-index:5;
}





#ecranminiclone{
position:absolute;
}

#divcontpointeursclone{
position:absolute;
}

.divbtnpointeurs{
	margin-top:0.5rem;
	background-image:url('images/bkgrd.jpg');
	border:thin;
	border-color:#D13F2D;
	border-style:ridge;
	padding-bottom:5px;
	padding-left:2px;
	padding-right:5px;
	padding-top:2px;
	border-radius: 3px;
	height:1.2rem;
}

.divbtnpointeursvide{
	margin-top:0.5rem;
	height:1.2rem;
	padding-bottom:5px;
	padding-left:2px;
	padding-right:5px;
	padding-top:2px;

}


#divcontjetonsclone{
position:absolute;
}

#divcontimgprincipclone{
position:absolute;
}


.stylejetonmini{
	border: thin ridge #FFFFFF;
	border-radius: 50%;
	max-width: 0.8rem;
	max-height: 0.8rem;
	min-height: 0.8rem;
	min-width: 0.8rem;
	width: 0.8rem;
	height: 0.8rem;
	margin:0.1rem;
}


.spanjetonmini{
	font-size:0.48rem;
	font-weight:bold;
	z-index:10;
}


.stylejetonminiclone{
	border: thin ridge #FFFFFF;
	border-radius: 50%;
	max-width: 2rem;
	max-height: 2rem;
	min-height: 2rem;
	min-width: 2rem;
	width: 2rem;
	height: 2rem;
	margin:0.25rem;
}


.spanjetonminiclone{
	font-size:1.2rem;
	font-weight:bold;
	z-index:10;
}






.cadrerouge{
	box-shadow:0px 0px 0px 2px red ;

}

.texteliste{
	position:absolute;
}

.texteliste:hover{
	cursor:pointer;
}



.bkgbaree{
	background-image:url('images/bkgbarre.png');
/*	opacity:0.3;*/
}

.invisible{
/*	opacity:0;*/
visibility: hidden;

}

#ligneh{
	width:100%;
	height:0.5rem;
		position:absolute;

}

#lignev{
	width:0.5rem;
	height:100%;
	position:absolute;
}

.rep{
	width:0.6rem;
	height:0.6rem;

}

.reperes{
	position:absolute;
}




.btnicone{
	padding:4px;
}

.btnicone.select{
	-webkit-box-shadow: 1px 1px 1px #DB501C, 0px 0px 2px 1px rgba(41,25,10,0.6), 0px 0px 5px 4px rgba(203,24,1,0.7), 0px 0px 7px 7px rgba(246,206,44); 	
	box-shadow: 1px 1px 1px #DB501C, 0px 0px 2px 1px rgba(41,25,10,0.6), 0px 0px 5px 4px rgba(203,24,1,0.7), 0px 0px 7px 7px rgba(246,206,44);
}

#blocpositions{
}

.minicarre{
	width:1.5rem;
	height:1.5rem;
}

.minifleche{
	max-width:1.3rem;
}


.lignerepere{
	display:none;
	z-index:20;
}

#blocreperes{
	border: 2px outset #C20027;
	padding: 1rem;
	width:80%;
	background-image:url('images/fondjaunevif.jpg');
}

.lignefine{
	border: 1px solid #C20027;
	border-radius: 5px;
	padding: 0.5rem;
	background-color: #EEDB91;
}


#contenanttextes{
position:absolute;
}

#divcontpointeurs{
position:absolute;
}


#divcontjetons{
	position:absolute;
	top: 0px;
	left: 0px;
	z-index:8;
}



#divcontimgprincip{
	position:absolute;
	top: 0px;
	left: 0px;
}


#ecranmini{
	background-color:black;
	width:100%;
	display: flex;
    flex-wrap: wrap;
	position:absolute;
	justify-content: space-around;
}


#texteinfominiecrancroix{
	color: red;
	font-size: 1rem;
	animation: clignottdiffaff 2s ease 0s infinite normal forwards;
	font-weight: bold;
}





/*-------------------------------------------  LIGNES ---------------------------------------------------*/
.imgdepvert{
	width:1rem;
	height:1rem;
}

.divimgdepvert{
		margin-right:1rem;
	}
	
.divimgdepvert:hover{
		cursor:move;
	}



 .detailliste { list-style-type: none; padding: 0.5rem; background-color:rvb(0,0,0,0)}
  .detailliste div { font-size: 1rem;  }
  html>body .detailliste div {
	height: 1.2rem;
	line-height: 1.2rem;
	padding: 0.3rem 0.5rem 0.3rem 0.5em
}
  .ui-state-highlight { height: 1.2rem; line-height: 1.2rem;  }
  
  .ui-sortable-placeholder{
	background-color:#C05B2F;
	height: 1.2rem; line-height: 1.2rem; 
		border-radius: 3px;

}
  

.bloclignes{
	position:absolute;
}

.bkliste{
	position:absolute;
}

.listeecran{
	position:absolute;
}
#tabliste{
	width:1rem;
}

.btnlist{
	width:4rem;
	text-align:center;
}
.btnlisttransp{
	width:4rem;
	text-align:center;
	opacity:0;
	
}

.transp{
	opacity:0;
	
}

.detailliste{
	padding: 0.5rem;
	border: 1px solid #D13F2D;
	background-image: url('images/fondjaunevif.jpg');
	margin: 0rem 1rem 1rem 3rem;
	border-radius: 3px;
}
.ligne{
	margin: 0.5rem 1rem 0.5rem 1rem;
}

#champtitreliste{

}

.titreliste{
	position:absolute;
}

.ligneliste {
	position:relative;
}


#marge{
	width:2rem;
	text-align:center;
}

.btnplusmoins{
	width:1.5rem;
	height:1.5rem;
	cursor: pointer;
}

.btnplusmoins:hover{
	background-image: url('images/fondjaunemoyen.jpg');
	margin: 1px -1px -1px 1px;
	box-shadow: 1px 1px 1px #DB501C;
}

.btnplusmoins:active{
	background-image: url('images/fondjaune.jpg');
	margin: 1px -1px -1px 1px;
	box-shadow: 1px 1px 1px #DB501C;
}


#bk{
	background-color:white;
	border: 2px solid rgba(0, 0, 0, 0);

}

.titreliste{
	padding:4px;
}

.bkliste{
	border: 2px solid rgba(0, 0, 0, 0);
	padding: 4px;
}


.bloclignes{
	padding:4px;
}



.nouvlignelistecouleur{
color:black;
}


.btnmodifierligne{
	cursor:pointer;
}

/*-------------------------------------------  FAMILLES ---------------------------------------------------*/

.blocpresfamille{
	margin: 1rem 0.5rem 1rem 4.5rem;
	border: 1px solid #D13F2D;
	padding: 0.5rem;
	width:auto;
}

.blocnomfamille{
font-size:1.2rem;	
}

.blocinfosfamille{
	margin-right: 1rem;
	margin-left: 1rem;
}

.nbemelfamm{
	font-weight:bold;
	text-align:right;
	width:4rem;
}

.infofamille{
	margin:0.2rem;
	text-align:left;
	cursor:pointer;
	font-weight:bold;
	width:5rem;
}

.pasinfofamille{
	margin:0.2rem;
	text-align:left;
	width:5rem;
}


.blocrenomfamille{
	margin-right: 1rem;
	margin-left: 1rem;
}

.blocsuppfamille{
	margin-right: 1rem;
	margin-left: 1rem;
}

.blocvignfamille{
	border: 1px solid #CC0000;
	background: white;
	max-width:80vw;
}

.divimgvignfamm{
	margin: 4px;
	border: thin solid #000000;
	width:5rem;
	height:5rem;
}

.imgvignfamm{
	max-width:5rem;
	max-height:5rem;

}

.divtextfamm{
	margin:3px;
}


/*--------------------------TABLES----------------------*/

.divlignetable{
	margin-left: 1rem;
	margin-right: 1rem;
	margin-top: 0rem;
	margin-bottom: 0.5rem;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #B8001A;
	width:100%;
}

.lignetable{
	margin-left: 1rem;
	margin-top: 0rem;
	margin-bottom: 0.5rem;
	padding-top: 2px;
	padding-bottom: 0.5rem;
}

.secondbloclignetable{
	margin-top: 1rem;
	margin-right: 1rem;
	margin-left: 1rem;
	width:15rem;
}

.btnlancerpartie{
	width:4rem;
}

.lancerpartie{
	padding:0.3rem;
	
}

.stoperpartie{
	padding: 0.3rem;
	color: #FF0000;
	font-weight: bold;
}



.listenomtable{
	font-size: 1.1rem;
	font-weight: bold;
}
.listejeutable{
	font-size: 0.9rem;
	font-style: italic;
}
.listeinfostable{
	font-size: 0.7rem;
}


.divimgvignperso{
	margin: 2px;
	border: thin solid #000000;
	width:5rem;
	height:5rem;
}
.imgvignperso{
	max-width:5rem;
	max-height:5rem;

}

.divimgvignpj{
	margin: 4px;
	border: thin solid #000000;
	width:3rem;
	height:3rem;
}

.imgvignpj{
	max-width:3rem;
	max-height:3rem;
}
.ligneinfosjoueurs{
	border: 1px solid #E2B516;
	background-image: url('images/bkgrdjaune.png');
	padding-top: 0.2rem;
	padding-right: 0.2rem;
	padding-bottom: 0.2rem;
	padding-left: 0.5rem;
}

.listejoueurstable{
	width:41.5rem;
}

.listjoueurscolnom{
	margin-right: 0.5rem;
	font-size:0.9rem;
	width:10rem;
	text-align:left;
	vertical-align:
}
.listjoueurscolimg{
	margin-right: 0.5rem;
}
.listjoueurscolperso{
	margin-right: 0.5rem;
	margin-left:0.5rem;
	font-size:0.9rem;
	width:10rem;

}
.listjoueurscolinfos{
	margin-right: 0.5rem;
	font-size:0.9rem;
	width:10rem;

}
.listjoueurscolbtn{
width:5.5rem;
}


.divimgvignpj{
	margin:auto;
}

.boutonpj{
	margin-right:0.5rem;
}

.btnjoueur{
	font-family: "Gotham", sans-serif;
	background-image: url('images/fondjaunevif.jpg');
	border : 1px solid #DB501C;
	border-radius: 5px;
	cursor: pointer;
	height:5rem;
	width:4.5rem;
}

.btnjoueur:hover{
	margin: 1px -1px -1px 1px;
	box-shadow: 1px 1px 1px #DB501C;
}

.pavejoueur{
	width:50vw;
}

.divimgpavejoueur{
	max-width:20vw;
	max-height:30vh;
	padding-right:1rem;
}

.imgpavejoueur{
	max-width:15vw;
	max-height:30vh;
}
.nominfopavejoueur{
	width:40%;
}

#divcontlignescarac{
	display:flex;
	flex-direction:column;
	align-items:center;
	flex-wrap:wrap;
	max-height:12rem;
	width:90%;
	overflow-y:auto;
	padding-bottom:0.5rem;
}

.pavejoueurlignecarac{
	font-size: 1rem;
}

.pavejoueurdivnomcarac{
	font-size: 0.9rem;
	font-weight: bold;
}
.pavejoueurdivvalcarac{
	font-size: 0.9rem;
}

.etoilecaraccomm{
	color:#9900CC;
	text-align:center;
	font-size:1.3em;
	font-weight:bold;
	width:1rem;
	cursor:pointer;
	height:1.3rem;
	width:1.3rem;
	cursor:help;

}

.divetoilecaraccomm{
	height:1.3rem;
	width:1.3rem;
}

.zonetextemessage{
	font-size: 0.8rem;
	height:3rem;
}


/*----------------------------------------------------------------QR CODE--------------------------*/

#divimgtvqr:hover{
	cursor:pointer;
}

/*-------------------------------------------------Jetons------------------------------------------------------*/
.divjetons{
	/*width:20rem;*/
}

.divjetons1{
	width: 5rem;
	font-size: 1rem;
	font-weight: bold;
}


.divjetons2{
	width:15rem;	
	font-size: 1rem;
}

.nomlistejetons{
	width:40%;
	text-align:left;
	margin-right:1rem;
}

.lignejetonstype{
	width:5rem;
}

.lignejetonsplusmoins{
	width:5rem;
}


#contenantexjeton{
	margin: 1rem 1rem 2rem 2rem;
	position: absolute;
	right: 0px;
}

.lignejetons{
	margin:0.5rem;
}

#exjeton{
	border: medium ridge #FF0000;
	background: radial-gradient(#ff0000 0%, #ffffff 100%);
}

#nomexjet{
	font-size: 0.8rem;
}


.stylejeton{
	border-radius: 50%;
	max-width:  4rem;
	max-height: 4rem;
	min-height:4rem;
	min-width:4rem;
	width:4rem;
	height:4rem;
}

.spanjet{
	font-size:2.4rem;
	font-weight:bold;
}


.styleminijeton{
	border: medium ridge #FFFFFF;
	border-radius: 50%;
	max-width:  2rem;
	max-height: 2rem;
	min-height:2rem;
	min-width:2rem;
	width:2rem;
	height:2rem;
}

.spanminijet{
	font-size:1.2rem;
	font-weight:bold;
	z-index:10;
}

.spanminijetretour{
	font-size:1.2rem;
	font-weight:bold;
	z-index:10;
	font-family:"WINGDNG3"
}


.btnjetons{
	cursor:pointer;
	margin-left: 0.5rem;
	margin-right: 0.5rem;
}
.btnjetonsjoueur{
	cursor:pointer;
	margin-left: 0.5rem;
	margin-right: 0.5rem;
}

.tvbtnjetonsjoueur{
	position:absolute;
	width:3.5rem;
	height:3rem;
	z-index:5;}

.tvbetjeton{

	width:1.5rem;
	height:1.5rem;
}

.nomjetons{
	margin-left: 0.5rem;
	margin-right: 0.5rem;
	height:1rem;
	font-size: 0.8rem;
}

.afficherjetonjoueur{
	height:0.5rem;
}

.nompersoblocperso{
	margin-left:3rem;
}

.jetonsdujoueur{
	border: 2px solid #C20027;
	padding: 0.25rem;
	border-radius:5px;
}

.divaffichejetons{
	height:0.8rem;
}


.stylejetonreini{
	border: thin ridge #FFFFFF;
	border-radius: 50%;
	max-width: 1.5rem;
	max-height: 1.5rem;
	min-height: 1.5rem;
	min-width: 1.5rem;
	width: 1.5rem;
	height: 1.5rem;
	margin:0.1rem;
	border: medium ridge #FF0000;
	background: radial-gradient(#ff0000 0%, #ffffff 100%);

}

#reinitjetons{
	cursor:pointer;
}

.rotation{
  -webkit-transition-property: -webkit-transform;
  -webkit-transition-duration: 1s;
  -webkit-animation-name: rotate;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease-in-out;
  
  -moz-transition-property: -moz-transform;
  -moz-animation-name: rotate; 
  -moz-animation-duration: 1; 
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: ease-in-out;
  
  transition-property: transform;
  animation-name: rotate; 
  animation-duration: 1s; 
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
}

@-webkit-keyframes rotate {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(-360deg);}
}

@-moz-keyframes rotate {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(-360deg);}
}

@keyframes rotate {
    from {transform: rotate(0deg);}
    to {transform: rotate(-360deg);}

}



.spanjetreini{
	font-size: 1rem;
	font-weight: bold;
	z-index: 10;
	font-family: "WINGDNG3";
}


.stylejetonreinimenu{
	border: thin ridge #FFFFFF;
	border-radius: 50%;
	max-width: 2rem;
	max-height: 2rem;
	min-height: 2rem;
	min-width: 2rem;
	width: 2rem;
	height: 2rem;
	margin:0.1rem;
	border: medium ridge #FF0000;
	background: radial-gradient(#ff0000 0%, #ffffff 100%);
	cursor:pointer;

}


.spanjetreinimenu{
	font-size: 1.2rem;
	font-weight: bold;
	z-index: 10;
	font-family: "WINGDNG3";
}


#jetonmenureini{
margin-right:3rem;
}



#nomspjetjetonsindiv{
	padding: 1rem;
	border: 3px solid #CC001C;
	position: absolute;
	left: -3000px;
	background-color: black;
	border-radius: 1rem;
	z-index: 150;
}

.lignenomspjetjetonsindivnom{
		color: white;
}


.lignenomspjetjetonsindivjeton{
	padding: 0.5rem;
}

/*----------------------------------------------------------------------------Pointeurs---------------------------------------------*/

.cercle{
	border: medium ridge #FFFFFF;
/*	background-color:rvb(0,0,0,0);*/
	border-radius: 50%;
}


.rond{
	border-radius: 50%;
	border: medium ridge rvb(0,0,0,0);
}


.divpointeur{
	cursor:pointer;
	margin:0.8rem;
	overflow: hidden;
}

#pointeurselect{
	width:1.5rem;
	height:1.5rem;

}

#cloneminiecran{
	position:relative;
}



#cloneminiecran:hover{
	  cursor: none;
}

.selecttypecurseur{
	box-shadow: 0px 0px 13px 4px #c33222, 0px 0px 3px 1px #000000;
}

#cloneminiecran .texteliste:hover{
	cursor:none;
}


#cursor {
  position: fixed;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  pointer-events: none;
  z-index: 152;
	font-family:Arial, Helvetica, sans-serif;
	overflow: hidden;
}


#nouvpointeur {
  position: absolute;
  border-radius: 50%;
  width: 1.5rem;
  height: 1.5rem;
  z-index: 150;
	font-family:Arial, Helvetica, sans-serif;
	overflow: hidden;
}

.pointeurs{
  position: absolute;
  border-radius: 50%;
  z-index: 150;
	font-family:Arial, Helvetica, sans-serif;
	cursor:pointer;
	overflow: hidden;
}

.pointeursunique{
  border-radius: 50%;
  z-index: 150;
	font-family:Arial, Helvetica, sans-serif;
	cursor:pointer;
	overflow: hidden;
	margin:0.2rem;
}

.minipointeurs{
  position: absolute;
  border-radius: 50%;
  z-index: 150;
font-family:Arial, Helvetica, sans-serif;
overflow: hidden;

}

#textepointeurs{
	font-family:Arial, Helvetica, sans-serif;
}

.divboutonpointeurlaser{
	margin: 0.5rem;
	position: absolute;
	width: 2rem;
	height: 2rem;
}

.divboutonpointeurlasergauche{
	margin: 0rem 0.2rem 0rem 0rem;
	width: 2rem;
	height: 2rem;
}

.boutonpointeurlaser{
	width: 1.6rem;
	height: 1.3rem;
}
.boutonpointeurjetons{
	width: 1.6rem;
	height: 1.3rem;
}
.laser{
	max-width: 1.2rem;
}
.bjetons{
	max-width: 1.1rem;
}



.bouton.boutonpointeurlaser{
	background-color:black;
	background-image:url('images/imgtransparente.png');
}

.bouton.boutonpointeurjetons{
	background-color:green;
	background-image:url('images/imgtransparente.png');
}


.pointeurspartiebassedroite{
	border: 2px ridge #FF0000;
	width: 12vw;
	background-image: url('images/fondjaunevif.jpg');
	border-radius: 5px;
	padding:0.5rem;
	margin-left:0.5rem;
}





/*----Reperre rapide------*/

.reprapide{
	max-width: 1.8rem;
}

#reprap{
	width:6rem;
	height:6rem;
	position:absolute;
	animation-duration: 1.5s;
	animation-name: reperrapide;
	visibility:hidden;
}



@keyframes reperrapide {
  from {
	transform: scale(1);
	visibility:visible;
  }

	to{
	transform: scale(0);
	visibility:hidden;
	}
}







#titegomme:hover{
	cursor:pointer;
}



.rotated {
width:3rem;
height:0.5rem;
  transform: rotate(90deg);
}


#bloctriangles{
	width:4rem;
	height:3.6rem;
}


.lignetriangle{
	width:4rem;
	height:1.1rem;
	margin-top:0.1rem;
	margin-bottom:0.1rem;
}



.divtriangle{
	width:1rem;
	height:1rem;
	margin-left:0.1rem;
	margin-right:0.1rem;
}




.triangle{
	max-width:1rem;
	max-height:1rem;
}


.etispan{
	position: fixed;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8rem;
	max-width: 10rem;
	border-radius: 2px;
}

.etibord{
	border: 1px solid #000000;
	background-color: #FFFFFF;

}

.nouvetispan{
	opacity:0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8rem;
	max-width: 10rem;
	border-radius: 2px;
	z-index: 151;
}


.cloneetispan{
	position: absolute;
	opacity:1;
	font-family: Arial, Helvetica, sans-serif;
	max-width: 10rem;
	border-radius: 2px;
	z-index: 151;
}
.minietispan{
	position: absolute;
	font-family: Arial, Helvetica, sans-serif;
	opacity:1;
	border: 1px solid #000000;
	background-color: #FFFFFF;
	border-radius: 2px;
	z-index: 151;
}

.etispangrand{
	position: absolute;
	font-family: Arial, Helvetica, sans-serif;
	opacity:1;
	border: 1px solid #000000;
	background-color: #FFFFFF;
	border-radius: 2px;
	z-index: 151;
	font-size:0.8rem;
}


.minicloneetispan{
	position: absolute;
	font-family: Arial, Helvetica, sans-serif;
	opacity:1;
	border: 1px solid #000000;
	background-color: #FFFFFF;
	border-radius: 2px;
	z-index: 151;
	max-width: 4rem;
}


/*----------------------------------------------Messagerie---------------------------*/
.blocconversation{
	height:6rem;
	background-color:black;
	border : 2px solid #6a00eb;
	border-radius: 5px;
	overflow-y:auto;
}

.messagemj{
	color: #FFFFFF;
	font-size: 0.8rem;
	margin-bottom:0.5rem;}

.messagepj{
	color:yellow;
	font-size: 0.8rem;
	margin-left:1rem;
	margin-bottom:0.5rem;
}

.bloctextecomm{
		width:calc(100% - 6rem);

}

.suppligneconv{
	width:1rem;
	height:1rem;
	cursor: pointer;
}

.btnlu{
	width:4rem;
	color:lime;
}

.btnnouv{
	width:4rem;
	color:red;
}

.nonlu{
	background-color:#333333;
	cursor:pointer;
}

.paveinfotexto{
	padding: 1rem;
	border: 0.3rem ridge #C416F0;
	background-image: url('images/fondjaunevif.jpg');
	position: absolute;
	top: 10rem;
	width: 60vw;
	z-index: 140;
}

.titrepavemessage{
	font-size:2rem;
}


.blocdroittexto{
	margin: 5px;
	height: calc(106px + 3.8rem);
	width:calc(100% - 130px);
}

.divtextetexto{
		height:calc((106px + 3.8rem)/2);
	width:100%;
	background-color:black;
	font-size:1rem;
	color:white;
	border : 2px solid #6a00eb;
	border-radius: 5px;
}

.textetexto{
	margin:1rem;
}

.lignebtntexto{
		height:calc((106px + 3.8rem)/2);
}


.boutonlu{
	font-size: 1.3rem;
	font-family: "Gotham", sans-serif;
	border: 1px solid #009933;
	border-radius: 5px;
	box-shadow: 3px 2px 2px #DB501C;
	cursor: pointer;
	color: #003300;
	background-color: #00FF00;
	background-image: url('images/imgtransparente.png');
}


.boutonlu:active{
	margin: 1px -1px -1px 1px;
	box-shadow: 0px 0px 0px #ffffff;
}




/*--------------Minitexto----*/

#textostandby{
	position: fixed;
	bottom: 0rem;
	width: 100%;
}

.paveminiinfotexto{
	margin: 0.2rem;
	border: 0.2rem ridge #C416F0;
	background-image: url('images/bkgrdviolet.png');
	width: 4rem;
	height: 4rem;
	z-index: 140;
	border-radius: 5px;
	cursor:pointer;

}


.divminitexteo{
	height:1rem;
	width:100%;
	padding:0.1rem;
}

.textnomminitexto{
	vertical-align: middle;
	text-align: center;
}

.divtexteminitexto{
	background-color:black;
	color:white;
	border : 1px solid #6a00eb;
	border-radius: 5px;
	margin:0.1rem;
	height:calc(3rem - 0.2rem - 4px);
	width:calc(4rem - 0.2rem - 2px);
	}

.textetexto{
	margin:0.2rem;
}



#qrcodepouraffprin{
	position: absolute;
	top: 0px;
	left: -3000px;
	border: medium solid #000000
}