body
{
  text-align : center;
  background-repeat: repeat;
	margin : 1%;
}

.white-bg
{
  background-color : rgba(255, 255, 255, 0.65);
  z-index : 1;
	font-size : 0px;
}

.Empty
{
  display : none;
  top : 0%;
  left : 0%;
}

.ChapeauEtoile
{
  top : 32%;
  left : 37%;
}

.ChapeauHautDeForme
{
  top : 18%;
  left : 39%;
}

.ChapeauFeuille
{
  top : 25%;
  left : 29%;
}

.ChapeauCornet
{
  top : 4%;
  left : 36%;
}

.BoucheU
{
  top : 73%;
  left : 46%;
}

.BoucheO
{
  top : 70%;
  left : 45%;
}

.Moustache
{
  top : 70%;
  left : 44%;
}

.YeuxU
{
  top : 60%;
  left : 39%;
}

.YeuxRonds
{
  top : 55%;
  left : 36%;
}

.ClinD
{
  top : 53%;
  left : 35%;
}

.ClinG
{
  top : 53%;
  left : 35%;
}

.YeuxBrillants
{
  top : 60%;
  left : 40%;
}

.test
{
  top : 50%;
  left : 25%;
}

.preview-block
{
  z-index : 2;
  position : relative;
  display : block;
  margin : 1%;
}

.base-img
{
  width : 50%;
  height : auto;
}

.com-img
{
  z-index : 3;
  height : auto;
  position : absolute;
}

.quickPreview
{
  opacity : 0.5;
}

.preview
{
  display : inline-block;
  vertical-align : middle;
  width : 40%;
}

.menu-select
{
  display : block;
  vertical-align : middle;
  margin : 1%;
  margin-bottom : 3%;
}

.menu-content
{
  display : block;
  vertical-align : middle;
  margin : 1%;
}

.menu
{
  display : inline-block;
  vertical-align : top;
  width : 55%;
}

.button-line
{
  display : block;
  margin-top : 2%;
}

.small-button-line
{
  display : block;
  margin-top : 5%;
}

.button
{
  display : inline-block;
  width : 11%;
  height : 0;
  padding-bottom : 11%;
  position : relative;
	margin-right : 1%;
	margin-left : 1%;
}

.small-button
{
  display : inline-block;
  width : 8%;
  padding-bottom : 8%;
  height : 0;
  position : relative;
	margin-right : 0.5%;
	margin-left : 0.5%;
}

.tab1
{
  display : inline-block;
  width : 5.67%;
  position : relative;
}

.tab2
{
  display : inline-block;
  width : 16.74%;
  position : relative;
}

.tab3
{
  display : inline-block;
  width : 8.37%;
  position : relative;
}

.button-img
{
  max-width : 70%;
  max-height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
}

.code-input
{
	width : 20%;
}

.de-img
{
  max-width : 100%;
  max-height : 90%;
  position : absolute;
  opacity : 0.5;
	top : 5%;
}

.de-img:hover
{
	opacity : 1;
}

.button-fond
{
  width : 100%;
  height : auto;
}

.select-img
{
  opacity : 1;
}

.unselect-img
{
  opacity : 0.4;
}

.unselect-img:hover
{
  opacity : 0.7;
}

.cyan-button0
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 255);
	border-radius : 50%;
}

.cyan-button1
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(230, 255, 255);
	border-radius : 50%;
}

.cyan-button2
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(205, 255, 255);
	border-radius : 50%;
}

.cyan-button3
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(180, 255, 255);
	border-radius : 50%;
}

.cyan-button4
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(155, 255, 255);
	border-radius : 50%;
}

.cyan-button5
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(130, 255, 255);
	border-radius : 50%;
}

.cyan-button6
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(105, 255, 255);
	border-radius : 50%;
}

.cyan-button7
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(80, 255, 255);
	border-radius : 50%;
}

.cyan-button8
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(55, 255, 255);
	border-radius : 50%;
}

.cyan-button9
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(30, 255, 255);
	border-radius : 50%;
}

.magenta-button0
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 255);
	border-radius : 50%;
}

.magenta-button1
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 230, 255);
	border-radius : 50%;
}

.magenta-button2
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 205, 255);
	border-radius : 50%;
}

.magenta-button3
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 180, 255);
	border-radius : 50%;
}

.magenta-button4
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 155, 255);
	border-radius : 50%;
}

.magenta-button5
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 130, 255);
	border-radius : 50%;
}

.magenta-button6
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 105, 255);
	border-radius : 50%;
}

.magenta-button7
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 80, 255);
	border-radius : 50%;
}

.magenta-button8
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 55, 255);
	border-radius : 50%;
}

.magenta-button9
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 30, 255);
	border-radius : 50%;
}

.yellow-button0
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 255);
	border-radius : 50%;
}

.yellow-button1
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 230);
	border-radius : 50%;
}

.yellow-button2
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 205);
	border-radius : 50%;
}

.yellow-button3
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 180);
	border-radius : 50%;
}

.yellow-button4
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 155);
	border-radius : 50%;
}

.yellow-button5
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 130);
	border-radius : 50%;
}

.yellow-button6
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 105);
	border-radius : 50%;
}

.yellow-button7
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 80);
	border-radius : 50%;
}

.yellow-button8
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 55);
	border-radius : 50%;
}

.yellow-button9
{
  width : 70%;
  height : 70%;
  position : absolute;
  top : 15%;
  left : 15%;
  background-color : rgb(255, 255, 30);
	border-radius : 50%;
}
