﻿.test1{
	background-color:aqua;
}
.test11{
	background-color:aqua;
	z-index:10;
}
.test2{
	background-color:fuchsia;
}



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


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

#contenantimage{
	width:1360px;
	height:768px;
}


.divunique{
    position: relative;
}

#imageencours{
	position:absolute;
}


.divtest{
	font-size:100px;
	color:black;
	position:relative;
}


#pointer{
	position:absolute;
	z-index:20;
}



/*-------------------  GRILLE ----------------------*/


.grillevert{
	width:1px;
	height:768px;
	border-left-style: solid;
	border-left-width: 1px;
	position: absolute;
	z-index:10;
}


.grillehoriz{
	width:1360px;
	height:1px;
	border-top-style: solid;
	border-top-width: 1px;
	position: absolute;
	z-index:10;
}

.couleurgrille{
	border-top-color: #0066FF;
	border-left-color: #0066FF;

}


.baseimage{
	width:48px;
	height:48px;
	z-index:25;
	background-color:maroon;
}

.baseimage2{
	width:48px;
	height:48px;
	z-index:25;
	background-color:maroon;
}

.baseimage4{
	width:48px;
	height:48px;
	z-index:25;
	background-color:maroon;
}


.baseimage7{
	width:96px;
	height:96px;
	z-index:25;
	background-color:maroon;
}

.baseimage9{
	width:144px;
	height:144px;
	z-index:25;
	background-color:maroon;
}



.miniimage{
	max-width:48px;
	max-height:48px;
	z-index:22;

}

.miniimage2{
	max-width:48px;
	max-height:48px;
	z-index:22;
	user-select: none;
}

.miniimage4{
	max-width:48px;
	max-height:48px;
	z-index:22;
	user-select: none;
}

.miniimage7{
	max-width:96px;
	max-height:96px;
	z-index:22;
	user-select: none;
}

.miniimage9{
	max-width:144px;
	max-height:144px;
	z-index:22;
	user-select: none;
}


.contnummini{
	width:48px;
	height:48px;
	position:absolute;
}

.contnummini2{
	width:48px;
	height:48px;
	position:absolute;
}

.contnummini4{
	width:48px;
	height:48px;
	position:absolute;
}

.contnummini7{
	width:96px;
	height:96px;
	position:absolute;
}

.contnummini9{
	width:144px;
	height:144px;
	position:absolute;
}

.numimgmini{
	width:20px;
	height:20px;
	position:absolute;
	background-color:white;
	font-weight:bold;
	z-index:26;
	margin:1px;
	border-radius: 10px;

}

.jetonblanc{
	background:white;
}

.jetonjaune{
	background:yellow;
}

.jetonrouge{
	background:red;
}
.jetonvert{
	background:#00CC00;
}
.jetonbleu{
	background:#0099FF;
}

.zonenoire{
	background-color:black;
	position:absolute;
	z-index:40;
}

.zonepolygones{
	position: absolute;
	z-index:40;
}



/*------------------------------------------------LUMIERE------*/

#contenantlumiere{
	width:1360px;
	height:768px;
	position:absolute;
	z-index:30;
}



.contminilumiere{
	width:20px;
	height:20px;
	position:absolute;
	bottom:0;
	right:0;
	z-index:23;
	user-select: none;
}

.minilumiere{
	width:20px;
	position: relative;
}

.zonetenebres{
	background-color:black;
	width:240px;
	height:240px;
	border-radius:120px;
	position: absolute;
	z-index:30;

}




/*------------------------------------------------Zone effet-----*/

#cerclezoneeffet{
	background-color:red;
	position: absolute;
	z-index:40;
	opacity:0.5;

}

#conezoneeffet{
	position: absolute;
	z-index:40;
}

#imgconezoneeffet{
	opacity:0.5;
}

/*------------------------------------Plateau*/