body {background-image: url("images/bg.png");}

h1 {color:black; font-family:Arial, sans-serif; font-size:30px; font-weight:bold;   text-align:center; margin:0 auto;}
h2 {color:black; font-family:Arial, sans-serif; font-size:16px; font-weight:bold;   text-align:center; margin:0 auto;}
h3 {color:black; font-family:Arial, sans-serif; font-size:14px; font-weight:normal; text-align:center; margin:0 auto; vertical-align: middle;}
h4 {color:black; font-family:Arial, sans-serif; font-size:20px; font-weight:bold;   text-align:center; margin:0 auto;}
h5 {color:black; font-family:Arial, sans-serif; font-size:12px; font-weight:normal; text-align:center; margin:0 auto;}
h6 {color:red;   font-family:Arial, sans-serif; font-size:20px; font-weight:bold;   text-align:center; margin:0 auto;}

input.check  {width:25px; height:25px; text-align:center; margin:0 auto;}
input.count  {color:black; font-family:Arial, sans-serif; font-size:20px; text-align:center; margin:0 auto; font-weight:bold; maxlength:"2";}
input.button {color:white; font-family:Arial, sans-serif; font-size:14pt; text-align:center; background-color:darkgreen; border-color:#EFEFEF; cursor:pointer; margin:0 auto;}
input.event  {color:blue;  font-family:Arial, sans-serif; font-size:18px; font-weight:bold;}
input.event[readonly] {background-color: #e0e0e0; color: #555; cursor: not-allowed;}
input[type='number']             {width:40px;}
input[type='checkbox'][disabled] {opacity: 0.4;}
input[type='radio']              {border: 0px; width: 100%; height: 20px;}

img.suit  {width:30px; height:30px; text-align:center; margin:0 auto;}
img.small {width:12px; height:12px; text-align:center; margin:0 auto;}

button.refresh    {color:black; font-family:Arial, sans-serif; font-size:13pt; text-align:center; margin:0 auto;}
button.img-button {background-color: lightgreen; border: 0px; border-radius: 10px; padding: 0px; cursor: pointer; vertical-align: middle; transition: background-color 0.3s, transform 0.2s;}

span.underline {color:black; font-weight:normal; text-decoration:underline; font-family:Arial, sans-serif;}
span.font16    {color:black; font-family:Arial, sans-serif; font-size:16px;}

table.center      {text-align:center; padding:5px; margin:0 auto;}
table.centerfixed {text-align:center; padding:5px; margin:0 auto; table-layout: fixed;}

td             {color:black; font-weight:bold;   font-family:Arial, sans-serif; font-size:20px; text-align:center; margin-left:auto; margin-right:auto;}
td.center      {color:black; font-weight:normal; font-family:Arial, sans-serif; font-size:18px; text-align:center;}
td.centerbold  {color:black; font-weight:bold;   font-family:Arial, sans-serif; font-size:20px; text-align:center;}
td.centerfixed {color:black; font-weight:normal; font-family:Arial, sans-serif; font-size:18px; text-align:center; width:70px;}
td.left        {color:black; font-weight:bold;   font-family:Arial, sans-serif; font-size:20px; text-align:left;}
td.right       {color:black; font-weight:bold;   font-family:Arial, sans-serif; font-size:20px; text-align:right;}
td.smalltext   {color:black; font-weight:normal; font-family:Arial, sans-serif; font-size:14px; text-align:left; vertical-align: middle;}

div.center     {text-align:center; margin-left:auto; margin-right:auto;}
div.title      {text-align:center; font-family:Arial, sans-serif; font-size:24px; font-weight:bold; margin:0 auto; color:black;}
div.grid       {text-align:left;   font-family:Arial, sans-serif; font-size:14px; display:grid; grid-template-columns:auto auto auto; gap:10px; padding:10px;}
div.rounded    {text-align:center; margin:0 auto; border:2px solid red; padding:5px 5px; background:lightgreen; width:600px; border-radius:20px; box-shadow:5px 5px 3px 2px rgba(0,0,0,0.4);}
div.rounded400 {text-align:center; margin:0 auto; border:2px solid red; padding:5px 5px; background:lightgreen; width:400px; border-radius:20px; box-shadow:5px 5px 3px 2px rgba(0,0,0,0.4);}