@charset "utf-8";



 ::-webkit-scrollbar {
  width:10px;
  height:8px;
  border-radius:6px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: 4px 6px 8px #00F; 
  border-radius:6px;
  background-color:#FFFACD;

}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background-color:#2F4F4F; 
  border-radius:6px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background-color: #00AA00; 
}

/* Buttons 
::-webkit-scrollbar-button:single-button {
  background-color:#CDCDCD;
  height:8px;
  width: 10px;
}*/

div[class*="MENU_"]
{
    width:215px;
}

#Nuancier
{
    width:260px!important;
}

.font_lire_la_suite{color:#A00; font-weight:bold; font-size:0.9em;}

.menu_code{-webkit-box-shadow: 5px 10px 25px #68838B;}

#ref_hauteur_css1 , #ref_hauteur_css2 , #ref_hauteur_css3 , #ref_hauteur_css4 , #ref_hauteur_css5 , #ref_hauteur_css6
{
   position:relative;
   margin-top:5px;
   
}

#ref_hauteur_css1 div , #ref_hauteur_css2 div , #ref_hauteur_css3 div , #ref_hauteur_css4 div , #ref_hauteur_css5 div , #ref_hauteur_css6 div
{ 
    padding-bottom:4px;
    position:relative;
    float:left;
    height:32px;
    font-size:16px;
    border:1px solid #00FF77;
}
        

#rotule{
	width:5px;
	height:5px;
	background-color:#8B0000;
	margin-left:23px;
	margin-top:23px;
        z-index:300;
	position:absolute;
}

#graduation_top { width:2px; height:9px; background-color:#000; margin-top:-5px; margin-left:25px; position:relative; } 
#graduation_right { width:9px; height:2px; background-color:#000; margin-top:19px; margin-left:42px; position:relative; } 
#graduation_bottom { width:2px; height:9px; background-color:#000; margin-top:22px; margin-left:25px; position:relative; } 
#graduation_left { width:9px; height:2px; background-color:#000; margin-top:-32px; margin-left:0px; position:relative; } 

#seconde{
	width:2px;
	height:23px;
	background-color:#F00;
	margin-left:24px;
	margin-top:23px;
	position:absolute;
        box-shadow: 2px 3px 4px #222;
}


#minute {
	width:1.8px;
	height:22px;
	background-color:#7D26CD ;
	margin-left:25px;
	margin-top:24px;
	z-index:100;
	position:absolute;
}

#heure {
	width:2.3px;
	height:25px;
	background-color:#000;
	margin-left:25px;
	margin-top:24px;
	z-index:200;
	position:absolute;
}
body {
    background-color:#000; /*-webkit-linear-gradient( #D7D7D7 , #EAEAEA , #FFFFFF );*/
    color : #FFDEAD;
}

#banniere{
    position:relative; 
    height:150px; 
    z-index:99999; 
    width:1300px;
    margin-left:auto;
    margin-right:auto;
}
.borderBoxMessageBlack { border-width:1px; border-style:solid; border-color:black; }
.borderBoxMessageRed { border-width:2px; border-style:solid; border-color:rgb(255, 0, 0); }

/* Feuille de style Menu principal, boutons et background */

input
{
    border-radius:8px; 
    height:30px; 
    font-size:16px; 
    letter-spacing:2px; 
    margin-left:8px;
    padding-left:6px;   
    border : 2px solid #0F0;
    background: -webkit-linear-gradient( #CCC, #DDD, #AEAEAE );
    box-shadow:4px 7px 11px #0FF;
}

input:hover
{
    border : 2px solid #F00;
    box-shadow:4px 7px 11px #0F0;
}
input:active
{
    border : 2px solid #F05010;
    box-shadow:4px 7px 11px #A00;
    margin-top:7px;
}


.yellow{background:#FFFACD;}
#td_code_source{  border-radius:8px 0px 0px 0px; letter-spacing:2px;} 
.code_source_name{color:#2AFF00;}
.code_dependant { text-align:center; }

.table_bdd {font-size:40px; z-index:5; padding:20px; width:100%; font-weight:normal; position:relative; }

.fleche_precedent_table  {background-image:url(https://www.jquerydev.fr/images/fleche_precedent.png); background-repeat:no-repeat; cursor:pointer; background-position:center; background-color:#929292; background-size:60% 100%;  width:120px;}

.fleche_precedent_table:hover{background-image:url(https://www.jquerydev.fr/images/fleche_precedent_hover.png);  background-repeat:no-repeat; background-position:center center;  background-color:#7D7D7D;   background-size:60% 100%;  width:120px; }

.fleche_suivant_table   {background-image:url(https://www.jquerydev.fr/images/fleche_suivant.png);   background-repeat:no-repeat; cursor:pointer; background-position:center;  background-color:#929292;  background-size:60% 100%;  width:120px;}

.fleche_suivant_table:hover {  
background-image:url(https://www.jquerydev.fr/images/fleche_suivant_hover.png);  background-repeat:no-repeat; cursor:pointer; background-position:center; background-color:#7D7D7D;  background-size:60% 100%;  width:120px; }

.ligne_table_precedent {background-image:url(https://www.jquerydev.fr/images/ligne_table_precedent.png); background-repeat:no-repeat; cursor:pointer; background-position:center; background-color:#929292; background-size:60% 100%;  width:120px;}

.ligne_table_precedent:hover{background-image:url(https://www.jquerydev.fr/images/ligne_table_precedent_hover.png);  background-repeat:no-repeat; background-position:center;  background-color:#7D7D7D;  background-size:60% 100%;  width:120px; }

.ligne_table_suivant   {background-image:url(https://www.jquerydev.fr/images/ligne_table_suivant.png);   background-repeat:no-repeat; cursor:pointer; background-position:center;  background-color:#929292;  background-size:60% 100%;  width:120px;}

.ligne_table_suivant:hover { background-image:url(https://www.jquerydev.fr/images/ligne_table_suivant_hover.png);  background-repeat:no-repeat; cursor:pointer; background-position:center; background-color:#7D7D7D; background-size:60% 100%;  width:120px;}


.deroule_precedent { cursor:pointer; background-color:#929292;  width:120px;}


.deroule_suivant   { cursor:pointer; background-color:#929292;   width:120px;}


/*********  B A R R E    D E   D E F I L E M E N T   ***************/

.box_barre_bouton_defil{
    width:460px;
    height:85px;
    border:1px solid #636363;
    border-radius:0px 18px 0px 18px;
}
.barre_bouton_defil {
    width:370px;
    height:50px;
    border-radius:0px 0px 14px 14px;
    margin-left:40px;
    position:relative;
}
.hr_ligne_base_defil{
    margin-top:10px;
    border-radius:4px;
    height:4px;
    width:370px;
    background:#4A4A4A;
    -webkit-box-shadow: 1px 3px 20px #4A4A4A inset; 
    
}
#bouton_defil {
	width:10px;
	height:10px;
	margin-top:-17px;
	background:#C00;
	border:1.4px solid #232323;
	border-radius:10px;
	position:relative;
}
.info_position_bouton_defil {
    color:#000;
    border:1px solid #1C1C1C;
    width:58px;
    height:20px;
    padding-top:4px;
    padding-right:4px;
    text-align:right;
    font-size:12px;
    top:17px;
    position:relative;
    font-family:"Times New Roman", Times, serif;
}
.background_gris_clair
{
    background:#E7E7E7;
    background: -webkit-linear-gradient( #E7E7E7 ,  #E7E7E7 , #636363 );
    color:#D4FFAA;
}
/******************************************************************************/



.fleche_precedent_table:active , .fleche_suivant_table:active  , .page_precedent_table:active , .page_suivant_table:active , .deroule_precedent:active ,  .deroule_suivant:active{
	-webkit-box-shadow: 2px 4px 6px 4px #484848 inset; 
}

.page_precedent_table  {background-image:url(https://www.jquerydev.fr/images/page_precedent.png); background-repeat:no-repeat; cursor:pointer; background-position:center; background-color:#929292;   background-size:60% 100%;  width:120px; }

.page_precedent_table:hover{background-image:url(https://www.jquerydev.fr/images/page_precedent_hover.png);  background-repeat:no-repeat; background-position:center;  background-color:#7D7D7D;   background-size:60% 100%;  width:120px; }

.page_suivant_table   {background-image:url(https://www.jquerydev.fr/images/page_suivant.png);   background-repeat:no-repeat; cursor:pointer; background-position:center;  background-color:#929292;  background-size:60% 100%;  width:120px; }

.page_suivant_table:hover { background-image:url(https://www.jquerydev.fr/images/page_suivant_hover.png);  background-repeat:no-repeat; cursor:pointer; background-position:center; background-color:#7D7D7D;  background-size:60% 100%;  width:120px;  }


.black {background-color:#000; }

.cyan  {background-color:#00FFFF;  }

.aquamarine1 {background-color:#7FFFD4;  }

.gris  {background-color:#CCC; }

.code_dependant:active , .C1:active
{
    margin-top:7px;
    
    top:7px;
    
    position:absolute;
} 

.keypress  {top:4px;
    text-shadow:0px 4px 0px black;
    box-shadow: 2px 2px 20px black inset;
    -webkit-box-shadow: 2px 2px 20px black inset;
}

.style_favori{
    color:#DADADA;
    font-size:14px;
    height:22px;
    font-family:"Courier New", Courier, monospace;
}


.defil_menu_principal {
      
    color:#FFFFFF;
    cursor:pointer;
    background: -webkit-linear-gradient( #999 , #888 , #777, #666 , #555 , #444 , #333 , #222 , #111);
    -webkit-animation:couleurs_grises_inverser 0.6s linear infinite;
    -webkit-box-shadow: 14px 18px 24px #FF6E96 , 14px 18px 24px #00F inset;

}


.base_menu_principal{border-top-left-radius:8px; border-top-right-radius:8px; border-width:2px;}

.base_menu 
{
    -webkit-box-shadow: 14px 18px 24px #555 , 14px 18px 24px #888 inset;
 }

.base_entete {
    color:#0F0;
    padding-left:10px;
    background:#CCC;
    background: -webkit-linear-gradient( #BABABA , #656565 );
 }


.base_menu_rouge {
    cursor:pointer;
    padding-top:15px;
    margin-left:5px;
    color : #FF6E96;
    border-color:#0F0;
    background: -webkit-linear-gradient( #999 , #888 , #777 , #555 , #555 , #777 , #888 , #999 );
    -webkit-box-shadow: 4px 8px 12px #FF6E96;
    background-color:#F05;
    
}



.titreCodesSources 
{
    padding:15px 80px;
    color:#97FFFF;
    width:360px;
    font-size:21px;
    font-family:"Times New Roman", Times, serif;
    background: -webkit-linear-gradient( #999 , #888 , #777, #666 , #555 , #444 , #333 , #222 , #111); 
    -webkit-animation:couleurs_grises 1.6s linear infinite;
    -webkit-animation-direction:reverse;
    -webkit-box-shadow: 2px 4px 8px #00F;
    
}


.menu_base_de_donnees  {
    position:relative;
    z-index:5;
    margin-top:7px;
    letter-spacing:3px;
    color:#000;
    font-size:22px;
    font-family:"Times New Roman", Times, serif;
    padding:15px;
    background:#CCC;
    background: -webkit-linear-gradient(#BDBDBD, #E9E9E9);
    text-align:left;
    margin-left:30px;
 }

.menu_base_de_donnees:hover  {
    cursor:pointer;
    color:#A00;
    background:#CCC;
    background: -webkit-linear-gradient(#E9E9E9, #BDBDBD);
    font-style:italic;
}

.init_menu{
    color:#EBEBEB;
    padding-left:4px;
    background:#000;
	
}


.favori_text_white{color:#FFF;}

.favori_rouge{
    background:#969;
    background: -webkit-linear-gradient( #A00, #AEAEAE);
 }


.base_menu_favori{
    background:#CCC;
    background: -webkit-linear-gradient( #E9E9E9, #C1C1C1);
    color:#F00;
}

.id_info, .identifier {
    position:absolute;
    display:none;
    z-index:4;
    border-radius:6px;
    padding-top:10px;
    padding-left:8px;
    padding-right:8px;
    font-style:italic;
    font-family:"Times New Roman", Times, serif;
}


.info {
    width:16px; 
    height:26px;
    padding:4px 5px;
    border-radius:4px; 
    text-align:center;
    border:1px solid black;
    font-family:"Times New Roman", Times, serif;
}
.info:hover{  border:1px #FF0 solid;  cursor:pointer;}


.control{
    clear:both;
    display:block;
    position:absolute;
    z-index:2;
    color:black;
    width:370px;
    height:36px;
    padding-top:0px;
    padding-left:6px;
    padding-bottom:0px;
    font-size:14px;
    font-weight:bold;
    border:1.7px solid #C00;
    border-radius:8px;
    direction:ltr;
    overflow:hidden;
    text-shadow:1px 2px 1px #0FF;
    background: -webkit-linear-gradient(#02F, #FFF, #F36);
 
    -webkit-animation:couleurs_control 0.8s linear infinite;
}


.petit_bouton_rouge
{    
    border-radius:10px;
   
    background: -webkit-linear-gradient(#5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF);
    
    -webkit-box-shadow: 5px 10px 25px #F00;
    
    -webkit-animation:couleurs 1.9s linear infinite;
    
    -webkit-animation-direction:reverse;
    
    color:#000;
    
    font-weight:bold;
    
    padding-top:12px;
    
    padding-bottom:12px;
    
    border:3.2px solid #F00;
    
    font-style: italic;
    
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.petit_bouton_rouge:hover
{
    cursor:pointer;

    -webkit-animation:couleurs 0.80s linear infinite;
 
    -webkit-animation-direction:inherit;
    
    -webkit-box-shadow: 5px 10px 25px #FF6E96; 
    
    border:3.2px solid #FF6E96;
    
    color:#F05010;
    
    
}

.petit_bouton_rouge:active
{  
    -webkit-box-shadow:inherit;
    
    border:3.2px solid #F05010;
    
    color:#0F0;
  
    margin-top:5px;
    
}

.petit_bouton_bleu
{    
    border-radius:10px;
   
    background: -webkit-linear-gradient(#5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF);
    
    -webkit-box-shadow: 5px 10px 25px #00F;
    
    -webkit-animation:couleurs 1.9s linear infinite;
    
    -webkit-animation-direction:reverse;
    
    color:#000;
    
    font-weight:bold;
    
    padding-top:12px;
    
    padding-bottom:12px;
    
    border:3.2px solid #00F;
    
    font-style: italic;
    
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.petit_bouton_bleu:hover
{
    cursor:pointer;

    -webkit-animation:couleurs 0.80s linear infinite;
 
    -webkit-animation-direction:inherit;
    
    -webkit-box-shadow: 5px 10px 25px #FF6E96; 
    
    border:3.2px solid #FF6E96;
    
    color:#F05010
    
    
}

.petit_bouton_bleu:active
{  
    /*-webkit-box-shadow: 5px 10px 25px #F05010;*/
    
    -webkit-box-shadow:inherit;
    
    border:3.2px solid #F05010;
    
    color:#0F0;
  
    margin-top:5px;
    
}



.choiceEffect
{    
    border-radius:10px;
   
    background-color:#0FF;
    
    -webkit-box-shadow: 5px 10px 25px #F05010;
    
    color:#000;
        
    border:1.1px solid #00FFFF;
    
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.choiceEffect:hover
{
    cursor:pointer;
    
    font-style: italic;

    -webkit-animation:couleurs 0.80s linear infinite;
 
    -webkit-animation-direction:inherit;
    
    -webkit-box-shadow: 5px 10px 25px #FF6E96; 
    
    border:1.1px solid #FF0000;
    
    color:#CDCD00;   
    
}

.choiceEffect:active
{  
    -webkit-box-shadow:inherit;
    
    border:1.1px solid #FF00FF;
    
    color:#FF0000;
  
    margin-top:11px;
    
}

.addShadow
{
     -webkit-box-shadow : 3px 6px 16px  #F05010 inset;
}

.choicePrimes
{    
    -webkit-box-shadow: 5px 15px 30px #F05010;
    
    color:#FFDEAD;
    
    background-color:#333;
     
    border:1.1px solid #F05010;
     
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.choicePrimes:hover
{
    cursor:pointer;
    
    font-style: italic;

    -webkit-box-shadow: 5px 15px 30px #FF6E96;
         
    background-color:#555;
      
    border:1.1px solid #00FF00;
    
    color:#CDCD00;   
    
}

.choicePrimes:active
{  
    -webkit-box-shadow:inherit;
    
    border:1.1px solid #FF00FF;
    
    color:#F0F;
  
    margin-top:11px;
    
}





.choicePrimesYellow
{    
    -webkit-box-shadow: 5px 15px 30px #FFDEAD;
    
    color:#FFDEAD;
    
    background-color:#333;
     
    border:1.1px solid #F05010;
     
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.choicePrimesYellow:hover
{
    cursor:pointer;
    
    font-style: italic;

    -webkit-box-shadow: 5px 15px 30px #FF6E96;
         
    background-color:#555;
      
    border:1.1px solid #00FF00;
    
    color:#CDCD00;   
    
}

.choicePrimesYellow:active
{  
    -webkit-box-shadow:inherit;
    
    border:1.1px solid #FF00FF;
    
    color:#F0F;
  
    margin-top:11px;
    
}





.choicePrimesOverGrey
{    
    -webkit-box-shadow: 5px 15px 30px #CCC;
    
    color:#FFDEAD;
    
    background-color:#333;
     
    border:1.1px solid #F05010;
     
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.choicePrimesOverGrey:hover
{
    cursor:pointer;
    
    font-style: italic;

    -webkit-box-shadow: 5px 15px 30px #00FF00;
         
    background-color:#555;
      
    border:1.1px solid #0000FF;
    
    color:#CDCD00;   
    
}

.choicePrimesOverGrey:active
{  
    -webkit-box-shadow:inherit;
    
    border:1.1px solid #FF00FF;
    
    color:#F0F;
  
    margin-top:11px;
    
}





.choicePrimesOverColor
{    
    -webkit-box-shadow: 5px 15px 30px #FF6E96;
    
    color:#FFDEAD;
    
    background-color:#333;
     
    border:1.1px solid #F05010;
     
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.choicePrimesOverColor:hover
{
    cursor:pointer;
    
    font-style: italic;

    -webkit-box-shadow: 5px 15px 30px #00FF00;
         
    background-color:#555;
      
    border:1.1px solid #0000FF;
    
    color:#CDCD00;   
    
}

.choicePrimesOverColor:not(#SelectionneTout):active
{  
    -webkit-box-shadow:inherit;
    
    border:1.1px solid #FF00FF;
    
    color:#F0F;
  
    margin-top:11px;
    
}



.choicePrimesWithOutShadow
{    
    color:#FFDEAD;
  
    background-color:#333;
     
    border:1.1px solid #F05010;
     
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.choicePrimesWithOutShadow:hover
{
    cursor:pointer;
    
    font-style: italic;

    background-color:#555;
    
    border:1.1px solid #0FF;
    
    color:#CDCD00;   
    
}

.choicePrimesWithOutShadow:active
{  
    border:1.1px solid #FF00FF;
    
    color:#F0F;
  
    margin-top:11px;
    
}



.choicePrimesGreen
{    
    -webkit-box-shadow: 5px 15px 30px #00FF00;
    
    color:#FFDEAD;
  
    background-color:#333;
     
    border:1.1px solid #F05010;
     
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.choicePrimesGreen:hover
{
    cursor:pointer;
    
    font-style: italic;

    -webkit-box-shadow: 5px 15px 30px #FF6E96;
    
    background-color:#555;
    
    border:1.1px solid #0FF;
    
    color:#CDCD00;   
    
}

.choicePrimesGreen:not(#valider_angleLibre):not(#DeselectionneTout):active
{  
    -webkit-box-shadow:inherit;
    
    border:1.1px solid #FF00FF;
    
    color:#F0F;
  
    margin-top:11px;
    
    top:11px;
    
}


.choicePrimesPink
{    
    -webkit-box-shadow: 5px 15px 30px #FF6E96;
    
    color:#FFDEAD;
        
    background-color:#333;

    border:1.1px solid #F05010;
     
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.choicePrimesPink:hover
{
    cursor:pointer;
    
    font-style: italic;

    -webkit-box-shadow: 5px 15px 30px #F05010; 
      
    background-color:#555;
    
    border:1.1px solid #0FF;
    
    color:#CDCD00;   
    
}

.choicePrimesPink:active
{  
    -webkit-box-shadow:inherit;
    
    border:1.1px solid #FF00FF;
    
    color:#F0F;
  
    margin-top:11px;
    
}






.petit_bouton
{    
    border-radius:10px;
   
    background: -webkit-linear-gradient(#5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF);
    
    -webkit-box-shadow: 5px 10px 25px #F05010;
    
    -webkit-animation:couleurs 1.9s linear infinite;
    
    -webkit-animation-direction:reverse;
    
    color:#000;
    
    padding-top:10px;
    
    border:3.2px solid #F05010;
    
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.petit_bouton:hover
{
    cursor:pointer;

    -webkit-animation:couleurs 0.80s linear infinite;
 
    -webkit-animation-direction:inherit;
    
    -webkit-box-shadow: 5px 10px 25px #FF6E96; 
    
    border:3.2px solid #FF6E96;
    
    color:#912CEE;   
    
}

.petit_bouton:active
{  
    /*-webkit-box-shadow: 5px 10px 25px #F05010;*/
    
    -webkit-box-shadow:inherit;
    
    border:3.2px solid #F05010;
    
    color:#FF6E96;
  
    margin-top:5px;
    
}



.bouton
{    
    border-radius:10px;
    
    background: -webkit-linear-gradient(#5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF);
   
    -webkit-box-shadow: 5px 10px 25px #0F0;
    
    -webkit-animation:couleurs 1.9s linear infinite;
    
    -webkit-animation-direction:reverse;
    
    color:#000;
    
    padding-top:12px;
    
    padding-bottom:14px;
    
    border:3.2px solid #0F0;
    
    font-style: italic;
    
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}

.bouton:hover
{
    cursor:pointer;

    -webkit-animation:couleurs 0.80s linear infinite;
 
    -webkit-animation-direction:inherit;
    
    -webkit-box-shadow: 5px 10px 25px #FF6E96;
    
    border:3.2px solid #FF6E96;
    
    color:#912CEE;
    
    
}

.bouton:active
{ 
    -webkit-box-shadow:inherit;
    
    border:3.2px solid #FF6E96;
    
    color:#F05010;
    
    margin-top:7px;  
}







.bouton_trigo  
{    
    border-radius:10px;
  
    background: -webkit-linear-gradient(#5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF);
   
    -webkit-box-shadow: 5px 10px 25px #0F0; 
      
    -webkit-animation:couleurs 1.9s linear infinite;
    
     -webkit-animation-direction:reverse;
    
    border:3px solid #FF00FF;
 
    color:#FFDEAD;
     
    padding-top:8px;
    
    padding-bottom:8px;
    
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.bouton_trigo:hover 
{
    cursor:pointer;
    
    font-style:italic;
    
    font-weight:bold;

    -webkit-animation:couleurs 0.80s linear infinite;
 
    -webkit-animation-direction:inherit;
    
    -webkit-box-shadow: 5px 10px 25px #FF6E96; 
    
    border:3px solid #F05010;
    
    color:#0F0;
    
 }

.bouton_trigo:active  
{     
    /*-webkit-box-shadow: 5px 10px 25px #000;*/
    
    -webkit-box-shadow:inherit;
    
    border:3.2px solid #FF00FF;
    
    color:#0F0;
    
    margin-top:5px;
  
}





.petit_bouton_fond_clair  
{    
    border-radius:10px;
   
    background: -webkit-linear-gradient(#5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF );
   
    -webkit-box-shadow: 8px 10px 15px #FF6E96; 
      
    -webkit-animation:couleurs 01.9s linear infinite;
    
    -webkit-animation-direction:reverse;
 
    color:#000;
    
    font-weight:bold;
    
    padding-left:10px;
    
    padding-top:6px;
    
    padding-bottom:12px;
    
    border:3.2px solid #0F0;
    
    font-style: italic;
    
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.petit_bouton_fond_clair:hover 
{
    cursor:pointer;
    
    -webkit-animation:couleurs 0.80s linear infinite;
 
    -webkit-animation-direction:inherit;
    
    -webkit-box-shadow: 8px 10px 15px #0F0; 
     
    border:3.2px solid #F00;
    
    color:#FF6E96;
}

.petit_bouton_fond_clair:active  
{    
     
    -webkit-box-shadow:none; 
    
    color:#0F0;
    
    margin-top:7px;
    
}






.petit_bouton_fond_clair_sans_marges  
{    
    border-radius:10px;
    
    background: -webkit-linear-gradient(#5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF );
   
    -webkit-box-shadow: 1px 3px 20px #0F0; 
      
    -webkit-animation:couleurs 01.9s linear infinite;
    
    -webkit-animation-direction:reverse;
 
    color:#000;
    
    font-weight:bold;
    
    border:2.2px solid #00F;
    
    font-style: italic;
    
    text-align:center;
    
    font-family:"Times New Roman", Times, serif;
}


.petit_bouton_fond_clair_sans_marges:hover 
{
    cursor:pointer;

    -webkit-animation:couleurs 0.80s linear infinite;
 
    -webkit-animation-direction:inherit;
 
    text-shadow:1px 2px 1px #FFF;
    
    border:2.2px solid #F00;
    
    color:#FF6E96;
}

.petit_bouton_fond_clair_sans_marges:active  
{
     /*-webkit-transform: rotateX(80deg);*/
    
    /*-webkit-transition: all 0.25s ease-out;  ease-out: decelaration a la fin de la rotation;*/
    
    -webkit-box-shadow:inherit;
    
    color:#0F0;
    
    margin-top:7px;
    
}





.ombrage{
    
    -webkit-box-shadow: 1px 5px 30px #000; 
    
}

.formConnection , .formModification , .formInscription
{
     /* -webkit-box-shadow: 50px 50px 75px #FF6E96;*/ 
      
      background-color:#7C7C7C;
}

.petit_ombrage_clair
{
   text-shadow: 1px 5px 10px #FFF;  
}

.petit_bouton_blue  {
    position:relative;
    border-radius:10px;
    background: -webkit-linear-gradient(#999, #FFF,  #EEE , #DDD, #CCC );
    -webkit-box-shadow: 8px 12px 12px #222 , 4px 6px 20px #000 inset; 
    -webkit-animation:couleurs 0.9s linear infinite;
    -webkit-animation-direction:reverse;
    text-shadow:1px 2px 1px #FFE0;
    font-weight:bold;
    padding:11px 0px 7px;
    border:2.2px solid #50F;
    font-style: italic;
    text-align:center;
    
}



.titre_formulaire {
    border-radius: 8px 8px 0px 0px;
    background: #333;
    background: -webkit-linear-gradient( #555, #2C2C2C);
    text-align:center;
    font-weight: bold;
    font-size: 24px;
    color: #FFF;
    height:28px;
    letter-spacing:2.5px;
    font-family:"Times New Roman", Times, serif;
}

.petit_bouton_blue:hover {
    cursor:pointer;
    -webkit-animation:couleurs 0.4s linear infinite; 
    -webkit-animation-direction:inherit;
    border:2.2px solid #A00;
    z-index:99;
    color:#333;
}

.petit_bouton_blue:active  {
    background: -webkit-linear-gradient(#FFF, #CCC, #666, #333);
    /*-webkit-box-shadow: 1px 1px 10px black outset, 0.5px 1px 0.5px #999); 
    
    -webkit-transform: rotateX(80deg); 
    
    -*webkit-transition: all 0.25s ease-out;  ease-out: decelaration a la fin de la rotation  */
    
	/*-webkit-box-shadow: 1px 3px 20px #000; */
        
        color:#0F0;
       
    margin-top:7px;
    
   

}





.fond_rouge
{
    background: -webkit-linear-gradient( #444 , #555 , #FFDEAD  );
    
    color:#FFDEAD;
        
    -webkit-box-shadow: 14px 18px 24px #999 ,  8px 14px 22px #111 inset; 
;
    
}



.Code , .Contact{ background-color:#D0D0D0;}

.Code:hover , .Contact:hover{ background-color:#A2A2A2; cursor:pointer;}
	


.background_rouge {
    cursor:pointer;
    color:#FFDEAD;
    background:#969;
    border:1px solid #F05010;
    padding-top:14px;
    background: -webkit-linear-gradient( #A00, #A00, #AEAEAE);
    font-style:italic;
    padding-top:15px;
    margin-left:5px;
    -webkit-box-shadow: 8px 12px 12px #222 , 4px 6px 20px #FFF inset; 
    
}


.backgroundMenucontextuel{
    background:#969;
    
    padding : 8px;
    
    color :#000;
        
    background: -webkit-linear-gradient( #DDD, #DDD, #CDCDCD );

    -webkit-box-shadow: 8px 12px 12px #222 , 4px 6px 20px #FFF inset;
    
    cursor : inherit;
       
}

.boxShadow 
{  
  text-shadow: #0CF 5px 15px 25px 35px;
}


.background{
          
    color:#000;
    
    border-radius:4px;
    
    border:1px solid #DEDEDE;
        
    padding-top:14px;
        
    background: -webkit-linear-gradient( #CCC, #DDD, #AEAEAE );
    
    -webkit-box-shadow: 4px 6px 20px #DDD inset;
    
    cursor:pointer;
    
    margin-left:5px;
       
}

.backgroundVert{
    color:#00F;
    text-align:center;
}


.colore{ /* Hoover de defil_menu  */
    
    background:#DDD;
    
    color : #00F;
    
    cursor :pointer;
   
    -webkit-box-shadow: 12px 12px 12px 12px #222 inset , 4px 12px 4px #222; 
    
}

 .visuel {background:#FFFACD;
    background: -webkit-linear-gradient( #BBB , #FFFACD );
    -webkit-box-shadow: 14px 18px 24px #222 , 4px 6px 20px #FFF inset; 
    }
    
    
.fond_lumineux  , .visualiser_fond_lumineux  {background:#FFFACD;
    background: -webkit-linear-gradient( #BBB , #FFFACD );
    -webkit-box-shadow: 14px 18px 24px #222 , 4px 6px 20px #FFF inset; 
    }
    
.fond_lumineux_inverse {background:#FFFACD; cursor:pointer;
    background: -webkit-linear-gradient( #FFFACD , #BBB );
     -webkit-box-shadow: 8px 12px 12px #222 , 4px 6px 20px #DDD inset;
    
    }

.fond_lumineux_inverse_double {background:#FFFACD;
   /* background: -webkit-linear-gradient( #FFFACD , #BBB , #FFFACD );*/
    
    -webkit-box-shadow: 14px 18px 24px #222 , 4px 6px 20px #FFF inset; 
    
    background-color: #FF6E96;
}


.fond_lumineux_inverse_triple {
    
    background:#FFFACD;
    
    background: -webkit-linear-gradient( #FFFACD , #BBB , #FFFACD , #FFFACD );
    
    -webkit-box-shadow: 14px 18px 24px #222 , 4px 6px 20px #FFF inset; 
}

.backgroundReverse
{ 
    background: -webkit-linear-gradient( #FFDEAD , #666 , #555  );
    
    -webkit-box-shadow: 14px 18px 24px  #F05010 , 8px 14px 22px #999 inset; 
    
    color:#00F;

}
.background_bleu{
    background:#FFFACD;
    background: -webkit-linear-gradient( #E2E2E2, #2A00FF);
    color:#02F;
}


.background_gris
{
    background:#F00;
    margin-left:5px;
    border:1px solid #DEDEDE;
    color:#00F;
    background: -webkit-linear-gradient( #999, #9CF);
   -webkit-box-shadow: 8px 12px 12px #0FF , 4px 6px 20px #FFF inset; 

}
	
#photo_precedent_ContextMenu:hover {
    background:#7E7E7E; 
    background-image:url(https://www.jquerydev.fr/images/photo_precedent_hover.png); 
    background-repeat:no-repeat; 
    background-position:center;
}
#photo_precedent_ContextMenu {
    background-image:url(https://www.jquerydev.fr/images/photo_precedent.png);  
    background-repeat:no-repeat; 
    background-position:center;  
    background-color:#9C9C9C;
}
#photo_suivant_ContextMenu:hover {
    background:#7E7E7E; 
    background-image:url(https://www.jquerydev.fr/images/photo_suivant_hover.png);   
    background-repeat:no-repeat; 
    background-position:center;  
}
#photo_suivant_ContextMenu {
    background-image:url(https://www.jquerydev.fr/images/photo_suivant.png);  
    background-repeat:no-repeat; 
    background-position:center; 
    background-color:#9C9C9C;}


#bienvenue  {
    font-size: 2em;
    font-weight: bold;
    font-style: italic;
    text-align: center;
    color: #000;
}  





/*--------------------------------Menu ---------------------------*/


.accueil , .menuCube , .presentation , .nuancier , .statistiques , .divers , .codes_sources_mobile{
    margin-right:15px;
    padding-left:4px;
    padding-right:4px;
    padding-top:13px;
    position:relative;
    margin-top:13px;
    z-index:99999;
    text-align:center;
    width:160px;
    height:45px;
    color:#000;
    float:left;
    font-weight:bold;
    font-size:20px;
    display:block;
    font-family:Times New Roman;
    border-radius:4px;
    background: -webkit-linear-gradient( #999, #888 , #777, #666, #555, #444, #333, #222 , #111 );
    -webkit-box-shadow: 5px 10px 25px #0F0;
    -webkit-animation-direction:inherit;
    font-family:'Times New Roman', Times, serif;
    
}

#liste_sous_menu_1
{ 
    color:#000; width:220px; position:relative; padding-left:4px; margin-top:155px; padding-right:4px;
}
#liste_sous_menu_2
{ 
    color:#000;  width:300px; position:relative; margin-top:10px; padding-left:4px; padding-right:4px;
}

#divers{
     -webkit-box-shadow: 5px 10px 25px #FF6E96 , 5px 10px 25px #0F0 inset;
}

#membres 
{
     -webkit-box-shadow: 5px 10px 25px #FF6E96 inset;
     color:#FFDEAD;
}
#repare_bdd , #codes_sources_menu_divers , .pageinit , #reinitialiser ,#modifier_profil , #delProfil 
{
     -webkit-box-shadow: 5px 10px 25px #CCC inset;
     color:#FFFACD;
}

.sedeconnecter, .seconnecter, .inscription, .modifier_profil , .delProfil , .membres , .reinitialiser , .repare_bdd , .facades , .pageinit , .google , .code , .quitter
{
    cursor:pointer;
    padding-left:4px;
    padding-right:4px;
    padding-top:13px;
    margin-top:14px;
    margin-bottom:14px;
    z-index:99999;
    text-align:center;
    position:relative;
    /*width:220px;*/
    height:45px;
    font-size:20px;
    display:block;
    font-family:Times New Roman;
    background: -webkit-linear-gradient( #999, #888 , #777 , #666 , #555 , #444 , #333 , #222 , #111);
    -webkit-box-shadow: 5px 10px 25px #888 inset;
   -webkit-animation-direction:inherit;
   border-radius:4px;
   color:#000;
   
}


.menu_defini_gris  {
    cursor:pointer;
    font-weight:bold;
    font-style:italic;
    -webkit-box-shadow: 5px 10px 25px #0F0 , 5px 10px 25px #FF6E96 inset;
}

#seconnecter , #modifier_profil , #sedeconnecter,  #inscription , #delProfil{
    cursor:pointer;
    font-style:italic;
    -webkit-box-shadow: 5px 8px 15px #FF6E96;
    color:#FFDEAD;
}


#inscription{
    cursor:pointer;
    font-style:italic;
    -webkit-box-shadow: 5px 8px 15px #0F0;
}

.menuOver{
     color:#F05010;
    cursor:pointer;
     background: -webkit-linear-gradient( #111 , #222 , #333, #444 , #555 , #666 , #777 , #888 , #999);
     -webkit-animation:couleurs_grises 2s linear infinite;
     -webkit-box-shadow: 5px 10px 25px #FF6E96;

}
.over_liste_sous_menu_1 
{
    color:#F05010;
    cursor:pointer;
     background: -webkit-linear-gradient( #111 , #222 , #333, #444 , #555 , #666 , #777 , #888 , #999);
     -webkit-animation:couleurs_grises 1.2s linear infinite;
     -webkit-box-shadow: 5px 10px 25px #FF6E96 , 5px 10px 25px #0F0 inset;

}

.over_liste_sous_menu_2
{
    color:#F05010;
    cursor:pointer;
     background: -webkit-linear-gradient( #111 , #222 , #333, #444 , #555 , #666 , #777 , #888 , #999);
     -webkit-animation:couleurs_grises 1.2s linear infinite;
     -webkit-box-shadow: 5px 10px 25px #FF6E96 , 5px 10px 25px #0F0 inset;
}

.menu_code div { overflow:hidden; }

.menu_code div:hover
{    
    color:#F05010;
    cursor:pointer;  
    background: -webkit-linear-gradient( #111 , #222 , #333, #444 , #555 , #666 , #777 , #888 , #999); 
    -webkit-animation:couleurs_grises 0.8s linear infinite;
    -webkit-animation-direction:reverse;
    -webkit-box-shadow: 2px 4px 8px #FF69B4; 
}

.menu_code_selection{
    
    color:#97FFFF;
    cursor:pointer;  
    background: -webkit-linear-gradient( #999 , #888 , #777, #666 , #555 , #444 , #333 , #222 , #111); 
    -webkit-animation:couleurs_grises 1.6s linear infinite;
    -webkit-animation-direction:reverse;
    -webkit-box-shadow: 2px 4px 8px #00F; 
}

.menuPageActive
{
    background: -webkit-linear-gradient( #FF0 , #666 , #555 , #FFC125 , #666 , #555 , #FFC125 , #666 , #555 );
    
    -webkit-animation:couleurs_yellow_3D 3s linear infinite ;
    
    -webkit-box-shadow: 5px 10px 25px #FF6E96;
    
    color:#00F;
}

.menuPageActiveOver
{
     background: -webkit-linear-gradient( #FF0 , #666 , #555 , #FFC125 , #666 , #555 , #FFC125 , #666 , #555 );
    
    -webkit-animation:couleurs_yellow_3D 3s linear infinite ;
    
    -webkit-box-shadow: 5px 10px 25px #F00;
    
    -webkit-animation-direction:reverse;
    
    color:#005400;
}

.menuPageActiveSousMenu_1
{
     background: -webkit-linear-gradient( #666 , #555 , #999 , #666 , #555 , #999 , #666 , #555 , #999 , #666 );
    
    -webkit-animation:couleurs_yellow_3D 2s linear infinite ;
    
    -webkit-box-shadow: 5px 10px 25px #FF6E96;
}
/*-------------------------Fin Menu ------------------------------------------------------------*/


@-webkit-keyframes couleurs_grises_3D
{
    
    10%{ 
    background: -webkit-linear-gradient( #666 , #555 , #999 , #666 , #555 , #999 , #666 , #555 , #999 ); }

    20%{
    background: -webkit-linear-gradient( #555 , #999 , #666 , #555 , #999 , #666 , #555 , #999 , #666 ); }
	
    30%{
    background: -webkit-linear-gradient( #999 , #666 , #555 , #999 , #666 , #555 , #999 , #666  , #555 ); }
	
    40%{
    background: -webkit-linear-gradient( #666 , #555 , #999 , #666 , #555 , #999 , #666 , #555 , #999 ); }
	
    50%{ 
    background: -webkit-linear-gradient( #555 , #999 , #666 , #555 , #999 , #666 , #555 , #999 , #666  ); }
    
    60%{ 
    background: -webkit-linear-gradient( #999 , #666 , #555 , #999 , #666 , #555 , #999 , #666 , #555 ); }
    
    70%{ 
    background: -webkit-linear-gradient( #666 , #555 , #999 , #666 , #555 , #999 , #666 , #555 , #999 ); }  
    
    80%{ 
    background: -webkit-linear-gradient( #555 , #999 , #666 , #555 , #999 , #666 , #555 , #999 , #666 ); }  
    
    90%{ 
    background: -webkit-linear-gradient( #999 , #666 , #555 , #999 , #666 , #555 , #999 , #666 , #555 ); }  
   
       
}


@-webkit-keyframes couleurs_yellow_3D
{  
    10%{ 
    background: -webkit-linear-gradient( #FF0 , #666 , #555 , #FFC125 , #666 , #555 , #FFC125 , #666 , #555); }

    20%{
    background: -webkit-linear-gradient( #555 , #FF0 , #666 , #555 , #FFC125 , #666 , #555 , #FFC125 , #666 ); }
	
    30%{
    background: -webkit-linear-gradient( #666 , #555 , #FF0 , #666 , #555 , #FFC125 , #666  , #555 , #FFC125); }
	
    40%{
    background: -webkit-linear-gradient( #FFC125 , #666, #555 , #FF0 , #666 , #555 , #FFC125 , #666 , #555  ); }
	
    50%{ 
    background: -webkit-linear-gradient( #555 , #FFC125 , #666 , #555 , #FF0 , #666 , #555 , #FFC125 , #666  ); }
    
    60%{ 
    background: -webkit-linear-gradient( #666 , #555 , #FFC125 , #666 , #555 , #FF0 , #666 , #555 , #FFC125); }
    
    70%{ 
    background: -webkit-linear-gradient( #FFC125 , #666 , #555 , #FFC125 , #666 , #555 , #FF0 , #666 , #555 ); }  
    
    80%{ 
    background: -webkit-linear-gradient( #555 , #FFC125 , #666 , #555 , #FFC125 , #666 , #555 , #FF0 , #666 ); }  
    
    90%{ 
    background: -webkit-linear-gradient( #666 , #555 , #FFC125 , #666 , #555 , #FFC125 , #666 , #555 , #FF0  ); }  
    
    100%{ 
    background: -webkit-linear-gradient( #FFC125 , #666 , #555 , #FFC125 , #666 , #555 , #FF0 , #666 , #555 ); }  
   
       
}


@-webkit-keyframes couleurs_grises
{
    
    10%{ 
    background: -webkit-linear-gradient(#111, #222 , #333, #444, #555, #666, #777, #888 , #999); }

    20%{
    background: -webkit-linear-gradient(#222 , #333, #444, #555, #666, #777, #888, #999 , #111 ); }
	
    30%{
    background: -webkit-linear-gradient( #333, #444, #555, #666, #777, #888 , #999 , #111 , #222 ); }
	
    40%{
    background: -webkit-linear-gradient( #444, #555, #666, #777, #888,  #999 , #111 , #222 , #333 ); }
	
    50%{ 
    background: -webkit-linear-gradient( #555, #666, #777, #888 , #999 , #111 , #222 , #333, #444 ); }
    
    60%{ 
    background: -webkit-linear-gradient( #666, #777, #888 , #999 , #111 , #222 , #333, #444 , #555 ); }
      
    70%{ 
    background: -webkit-linear-gradient( #777, #888 , #999 , #111 , #222 , #333, #444 , #555 , #666); }
    
    80%{ 
    background: -webkit-linear-gradient( #888 , #999 ,  #111 , #222 , #333, #444 , #555 , #666 , #777); } 
    
    90%{ 
    background: -webkit-linear-gradient( #999 ,  #111 , #222 , #333, #444 , #555 , #666 , #777 , #888); } 
    
    100%{ 
    background: -webkit-linear-gradient( #111 , #222 , #333, #444 , #555 , #666 , #777 , #888 , #999); } 
}


@-webkit-keyframes couleurs_grises_nuancier
{
    
    15%{     
    background: -webkit-linear-gradient( #111, #222, #333, #444, #555, #666, #777); color:#FFDEAD; }

    30%{
    background: -webkit-linear-gradient( #222 ,#333, #444, #555, #666, #777, #111 );  color:#00FF00; }
	
    45%{
    background: -webkit-linear-gradient( #333, #444, #555, #666, #777, #111, #222 );  color:#0000FF; }
	
    60%{
    background: -webkit-linear-gradient( #444, #555, #666, #777, #111, #222, #333 );  color:#EECBAD;  }
	
    75%{ 
    background: -webkit-linear-gradient( #555, #666, #777, #111, #222, #333, #444 );  color:#EECBAD; }
    
    90%{ 
    background: -webkit-linear-gradient( #666, #777, #111, #222, #333, #444, #555 );  color:#E066FF; }
    
    100%{     
    background: -webkit-linear-gradient( #777, #111, #222, #333, #444, #555, #666 );  color:#E066FF;}

}

@-webkit-keyframes couleurs_grises_inverser
{
    
    10%{ 
    background: -webkit-linear-gradient(#999, #888 , #777, #666, #555, #444, #333, #222 , #111 ); }

    20%{
    background: -webkit-linear-gradient( #111, #999, #888 , #777, #666, #555, #444, #333, #222 ); }
	
    30%{
    background: -webkit-linear-gradient( #222 , #111 , #999, #888 , #777, #666, #555, #444, #333 ); }
	
    40%{
    background: -webkit-linear-gradient( #333 , #222 , #111 , #999, #888 , #777, #666, #555, #444  ); }
	
    50%{ 
    background: -webkit-linear-gradient( #444 , #333 , #222 , #111 , #999, #888 , #777, #666, #555 ); }
    
    60%{ 
    background: -webkit-linear-gradient( #555 , #444, #333, #222 , #111 , #999 , #888 , #777 , #666 ); }
      
    70%{ 
    background: -webkit-linear-gradient( #666 , #555 , #444, #333 , #222 , #111 , #999 , #888 , #777 ); }
    
    80%{ 
    background: -webkit-linear-gradient( #777 , #666 , #555 , #444, #333 , #222 , #111 , #999 , #888 ); } 
    
    90%{ 
    background: -webkit-linear-gradient( #888 , #777 , #666 , #555 , #444, #333 , #222 , #111 , #999 ); } 
}

@-webkit-keyframes couleurs
{
    
    14%{ 
    background: -webkit-linear-gradient(#5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF); }

    28%{
    background: -webkit-linear-gradient( #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF , #5F5F5F  ); }
	
    42%{
    background: -webkit-linear-gradient( #AFAFAF , #CFCFCF , #DFDFDF , #EFEFEF , #5F5F5F , #8F8F8F  ); }
	
    56%{
    background: -webkit-linear-gradient( #CFCFCF , #DFDFDF , #EFEFEF , #5F5F5F , #8F8F8F , #AFAFAF ); }
    
    70%{
    background: -webkit-linear-gradient( #DFDFDF , #EFEFEF , #5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF ); }
    
    84%{
    background: -webkit-linear-gradient( #EFEFEF , #5F5F5F , #8F8F8F , #AFAFAF , #CFCFCF , #DFDFDF ); }
	
    
}


@-webkit-keyframes couleurs_trigo
{
    15%{ 
    background: -webkit-linear-gradient(#FFF, #EEE , #DDD, #CCC, #CEDEDE); }

    30%{
    background: -webkit-linear-gradient(#CEDEDE, #FFF,  #EEE , #DDD, #CCC ); }
	
    45%{
    background: -webkit-linear-gradient( #CCC , #CEDEDE, #FFF,  #EEE , #DDD ); }
	
    60%{
    background: -webkit-linear-gradient( #DDD ,#CCC , #CEDEDE , #FFF , #EEE ); }
	
    75%{ 
    background: -webkit-linear-gradient( #EEE , #DDD , #CCC , #CEDEDE, #FFF ); }
    
    90%{ 
    background: -webkit-linear-gradient( #FFF , #EEE , #DDD , #CCC , #CEDEDE ); }
}


@-webkit-keyframes couleurs_control
{
    25%{background:#02F;
    background: -webkit-linear-gradient(#02F, #FFF, #FFF, #F36); }
	
    50%{background:#02F;
    background: -webkit-linear-gradient(#F36, #02F, #FFF, #FFF);  }
	
    75%{background:#02F;
    background: -webkit-linear-gradient(#FFF, #FFF, #F36, #02F);  }
}






/*******************************************************
Forked by 
https://cssdeck.com/labs/full/animated-check-inputs 
Used only CSS
*******************************************************/
/* entypo */
.animations , .definitions , .menusAnimations , .circle ,  .funct_affine , .ContextMenu , .infos_bulles , .pluie , .draggable
, .stats_js , .stats_php{
  display:none;
  opacity:0;
}
#loadcheck , #loadcheck1 , #loadcheck2 , #loadcheck3 , #loadcheck4 , #loadcheck5 , #loadcheck6 , #loadcheck7 , #loadcheck8 , #loadcheck9 {
  position:relative;
}
.loadcheck  {
  width:110px;
  height:25px;
  font-size:22px;
}
.loadcheck span {float:left;}
.load {
  display:block;
  width:7px;
  height:7px;
  margin:14px auto;
  border-radius:10px;
  transition:.5s;
  cursor:pointer;
}
.load:nth-child(1){
  background:#db1536;
}
.load:nth-child(2){
  background:rgba(219, 21, 54,.9);
}
.load:nth-child(3){
  background:rgba(219, 21, 54,.8);
}
.load:nth-child(4){
  background:rgba(219, 21, 54,.7);
}
.load:nth-child(5){
  background:rgba(219, 21, 54,.6);
}
.load:nth-child(6){
  background:rgba(219, 21, 54,.5);
}
.load:nth-child(7){
  background:rgba(219, 21, 54,.4);
}
.load:nth-child(8){
  background:rgba(219, 21, 54,.3);
}
.load:nth-child(9){
  background:rgba(219, 21, 54,.2);
}
.load:nth-child(10){
  background:rgba(219, 21, 54,.1);
}
.entypo-cancel { margin-left:10px; }
span[class*="entypo"]{cursor:pointer;}
span[class*="cancel"]{
  font-size:20px;
  color:#db1536;
  transition:.5s;
  transition-delay:.1s;
} 
span[class*="check"]{
  color:rgba(0,0,0,.4);
  transition:.5s;
  font-weight:bolder;
  transition-delay:.1s;
}
#check:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}




#check1:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check1:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check1:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check1:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check1:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check1:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check1:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check1:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check1:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check1:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check1:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check1:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}



#check2:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check2:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check2:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check2:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check2:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check2:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check2:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check2:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check2:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check2:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check2:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check2:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}




#check3:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check3:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check3:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check3:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check3:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check3:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check3:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check3:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check3:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check3:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check3:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check3:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}







#check4:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check4:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check4:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check4:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check4:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check4:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check4:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check4:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check4:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check4:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check4:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check4:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}




#check5:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check5:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check5:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check5:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check5:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check5:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check5:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check5:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check5:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check5:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check5:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check5:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}





#check6:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check6:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check6:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check6:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check6:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check6:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check6:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check6:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check6:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check6:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check6:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check6:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}




#check7:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check7:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check7:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check7:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check7:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check7:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check7:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check7:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check7:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check7:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check7:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check7:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}



#check8:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check8:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check8:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check8:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check8:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check8:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check8:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check8:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check8:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check8:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check8:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check8:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}




#check9:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check9:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check9:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check9:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check9:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check9:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check9:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check9:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check9:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check9:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check9:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check9:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}




#check10:checked + .loadcheck .entypo-check{
  color:#58d37b;
}
#check10:checked + .loadcheck .entypo-cancel{
  color:rgba(0,0,0,.3);
}
#check10:checked + .loadcheck .load:nth-child(1){
  background:rgba(88, 211, 123,.1);
}
#check10:checked + .loadcheck .load:nth-child(2){
  background:rgba(88, 211, 123,.2);
}
#check10:checked + .loadcheck .load:nth-child(3){
  background:rgba(88, 211, 123,.3);
}
#check10:checked + .loadcheck .load:nth-child(4){
  background:rgba(88, 211, 123,.4);
}
#check10:checked + .loadcheck .load:nth-child(5){
  background:rgba(88, 211, 123,.5);
}
#check10:checked + .loadcheck .load:nth-child(6){
  background:rgba(88, 211, 123,.6);
}
#check10:checked + .loadcheck .load:nth-child(7){
  background:rgba(88, 211, 123,.7);
}
#check10:checked + .loadcheck .load:nth-child(8){
  background:rgba(88, 211, 123,.8);
}
#check10:checked + .loadcheck .load:nth-child(9){
  background:rgba(88, 211, 123,.9);
}
#check10:checked + .loadcheck .load:nth-child(10){
  background:#58d37b;
}