
/****************************************************************************/
/*   Petites modifications au code original par Paulo Silva en 15/06/2020   */
/*                  adapté pour qu'il soit responsive                       */
/****************************************************************************/

form {margin: 0;}

#uicell { width: auto; margin: auto; border: 1px solid #0000FF; padding: 0.3em 0 0; border-radius: 5px; padding-bottom: 0.2em;} /* table principal - boutons format, etc. et palette */
#uicell th { width: 6.2em; text-align: center; font-size: 0.8em; margin-left: 0px; margin-right: 0px; padding: 0 0.2em 0.2em; border: 0.2em dotted #0000FF; border-radius: 4px;} /* - ajouté font-size pour les titres */
#uicell td { padding: 0 0 0 0.5em; border-radius: 4px; margin-right: 0px;}
#uicell td.pal { padding: 0 1em; margin-right: 0;}
#uicell #gobuttons td { height: 1.5em; text-align: center;}

input { font: 0.8em Verdana, sans-serif; padding-bottom: 20px; border-radius: 5px; padding-left: 0.2em; margin-right: 0px;} /* les trois boutons: hex rgb et rgb% */
input[type=text] { padding-left: 0.4em; padding-right: 0.4em;} /* toutes les cellules fond blanc pour les entrées des codes couleurs */

#input { margin: 0 0 0.3em; width: 100%; padding-left: 0.2em; padding-right: 0.2em;} /*  margin-left: 0px;ici le width rétricit les cellules blanches d'entrée des couleurs */
#input a { font: bold 0.61em Verdana, sans-serif; letter-spacing: 0.1rem; width: 100%; border-radius: 4px; border: 2px outset silver; background: silver; padding: 2px 2px 4px; cursor: pointer;} /* code pour les boutons Hex, RGB et RGB% */
#input .coltype {background: #EEE; border-style: inset; border-radius: 4px; padding: 2px 2px 4px;} /* code pour les boutons Hex, RGB et RGB% quand ils sont activés */
#input td { white-space: nowrap; padding-left: 0.2em;} /* border: 1px solid blue; afficher les choix des couleurs 1 et 2 à mélanger. Cellules avec touts les boutons, le choix des couleurs et le total de mélanges*/

#output { width: 100%; padding-left: 0.3em; padding-right: 0.2em; border-radius: 4px;} /* margin: 0 0 0.3em; border-width: 0 2px;0.3em ici le width rétricit les cellules blanches de sortie du mélange des couleurs */ 

.boutonshexrgb { padding-bottom: 0.3em; padding-left: 4px; margin-left: -4px; } /* border: 1px solid red; */

.boutonsmeleff { margin-top: 0.3em; margin-bottom: auto; padding-left: 0px; padding-right: 0.7em; padding-bottom: 0.3em;}

#watercell { width: 75px; background: #CECECE; padding: 0; border-radius: 5px;}

#grid { background: black; border: 1px solid black; border-width: 0 1px 1px 0; margin: 5px 4px;}
#grid td { height: 11px; width: 11px; padding: 0; line-height: 11px;}
#grid td a { display: block; height: 10px; width: 10px; line-height: 10px; border: 1px solid black; border-width: 1px 0 0 1px;}

#tabtexte { border-bottom: double 3px; border-top: double 3px; padding-top: 0; padding-bottom: 0; margin-top: 1em;}
#tabcolor { padding: 0.3em; margin-top: -0.05em; border: 1px solid #0000FF; border-radius: 5px;}
#textcell { margin: 0; padding: 0 1em 1em 0;}/

/*
@media (max-width: 480px) {
	input, #input a {
	font-size: 8.5px;
  }
}

@media (max-width: 575px) {
	input, #input a {
	font-size: 7px;
  }
}
*/