.drinkcode{
   font-size: small;
}

.link{
   color: purple;
   cursor: pointer;
}
.link:hover{
   color: green;
}

.rowdate:hover, input:hover, textarea:hover, .has-input:hover {
   background: lightblue !important;
}

.iavoid {
   padding: 1em;
   border: none;
}
.iavoid:hover {
   background: pink;
}

.gender:hover {
   background: pink;
}

body,textarea{
   font-family: sans-serif;
}

#copyright {
   text-align: right;
   font-size: smaller;
}


#totopbutton{
   background-color: lightyellow;
   position: sticky;
   font-size: large;
   top: 0;
   float: right;
   margin-right: 1em;
}

#menu_container{
   text-align:center;
}

#menu_container.sticky{
   position: sticky;
   top: 0;
}

#menu{
   cursor: default;
   margin:auto;
   display:inline-block;
}

#menu.sticky{
   opacity: 1;
   background-color: lightyellow;
}

table {
   border-collapse: collapse;
}

td,th {
   border: 1px solid;
}

input {
   background: white; /*#f0f0f0;*/
}

input::placeholder{
   font-weight: normal;
}

#titlediv{
   padding: 0 0 1em 0;
}

#toptitle{
   font-size:   larger;
   font-weight: bold;
}

#helptext li .firstli{
   font-weight: bold;
}

#help li .fat{
   font-weight: bold;
}
#help li .fatbig{
   font-weight: bold;
   font-size:   larger;
}

#table input, #reserve input {
   font:       inherit;
   border:     0;
   /*font-size:  larger;*/
   text-align: center;
}

#tablebody tr {
   /* brave-browser gives wrong height when using FREEDAYTXT, so we force it to 1 */ 
   line-height: 1;
}

#table tr td {
   text-align: center;
}

#table td.monthchange{
   border-top: 0.2em solid;
}

#table td.sums{
   border-top: 0.2em solid;
}

#table  td.freeday:not(.warning), #quickhelp td.freeday, #legendatable td.freeday{
   background: #a9f2c9;
}

#table .warning {
   text-align: left;
}

td.absent, #table td[force],#table td.force,#quickhelp td.absent, #legendatable td.absent {
   background: pink; 
}

#legendatable td:not(.freeday):not(.absent):not(.to_compute):not(.computed){
   border: none;
}
#table td.absent.freeday, #table td.freeday[force] {
   background: #fdb362;
}
#table td.forced.freeday {
   background: #fdb362;
}

#tablebody td:last-child {
   border:    none;
   font-size: larger;
}

#reserveinput th:first-child {
   padding-left:  0.5em;
   padding-right: 0.5em;
}

#reserveinput {
   cursor: default;
}

#tableheader td:last-child {
   border:    none;
}

#firstdate, #lastdate{
   width:      8em;
   text-align: center;
   cursor:     pointer;
}

.email,.phone,.name{
   border: none;
   padding-left  : 0.5em;
   padding-right : 0.5em;
}

.hplayer,.rplayer,.hplayer_print {
   min-width:     3em;
   padding-left:  0.2em;
   padding-right: 0.2em;
}

.name{
   width: 15em;
}

.email{
   width: 15em;
}

.phone{
   width: 10em;
}

.strength, .gender{
   width:      3em;
   text-align: center;
}

#varia{
   width: 40em;
}

#adapt {
   font: inherit;
   /*font-size: larger;*/
   margin: 0;
   padding: 0;
   display: none;
   white-space: pre;
}

#legenda th{
   border:none;
}

#legenda td{
   border:none;
}

table{
   margin: 0 auto;
}

h1 {
   text-align:center;
}

.need_apply {
   background: orange;
}

td.to_compute {
   background: #fff6ff;
}

textarea#varia {
   text-align: margin 0 auto;;
   width: 60em;
}

#tvaria td{
   border: 0px;
}

#menutable td{
   border: 0px;
}

#table .rowdate{
   padding-left:0.5em;
   padding-right:0.5em;
   text-align: left;
}

#helptext{
   width: 50em;
   margin: 0 auto;
}

.quickhelp {
   /*font-style: italic;*/
   border: none;
}

#legendaspan {
   /*font-style: italic;*/
   border: none;
}

button {
   cursor: pointer;
}

#table tbody {
   cursor: pointer;
}

#tavoids {
   display: none;
}

#tavoids tbody .avoidcell {
   cursor: pointer;
}

.strength, .gender {
   cursor: pointer;
}

#avoidshead {
   font-size: larger;
}

.avoiding {
   background: red;
}

#emails,#davoids,#reserve,#table,#tvaria,#avoidstable,#exampletable,#legendatable,#yourscheme,#fillin{
   border: 2px solid;
}

.noborder {
   border: none;
}

.manualbutton {
   background: yellow;
}

#davoids td, #davoids th, #exampletable td, #yourscheme td, #fillin td{
   border: none;
   text-align: left;
   padding: 0.2em;
}

textarea,.hplayer,.rplayer,.name,.email,.phone{
   border: none;
   outline: none;
}

.computing{
   color: lightgray;
}

#leavemenubutton{
   background-color: lightyellow;
   position: sticky;
   font-size: large;
   top: 0;
   float: right;
}

.applywarning{
   background-color: orange;
   max-width:        12em;
   text-align:       center;
   cursor:           pointer;
   position:         absolute;
   top:              2em;
   right:            10em;
   border:           2px solid gray;
   border-radius:    0.5em;
}

.applywarningwrapper {
   background: transparent; 
   position:   sticky; 
   top:        0; 
   width:     100%;
   z-index:   20;
}

::placeholder {
   color: red;
}

textarea {
   resize: none;
}

.lang_chosen {
   background: pink;
}

.weekday_chosen {
   background: pink;
}

.clicked{
   background: lightblue;
}

#languagebuttons {
   float:       right;
   position:    absolute;
   margin-left: 6em;
}

#tablefooter {
   /* disable repeat when printing */
   display: table-row-group;
}

.hplayer_print {
   display: none;
}

#table thead {
   position: sticky;
   top:      0;
   z-index:  10;
}

#directionswrapper{
   text-align: center;
}

#directions{
   text-align:    center;
   background:    lightyellow;
   margin:        auto;
   border:        0.2em solid;
   border-radius: 0.5em;
   border-color:  gray;
   display:       inline-block;
   padding:       0.4em;
   margin-top:    0.5em; 
   margin-bottom: 0.5em; 
   cursor:        default;
}

#gametype {
   width: 8em;
}

.iavoid {
   font-weight: bold;
}

.avoidsclick {
   font-weight: normal;
}

/* start of minifish */

.mf-region .mf-menu ul, .mf-region .mf-menu-nohover ul{
   display:none;
}

.mf-region .mf-menu:hover ul {
   display: block;
}

.mf-region .mf-menu-nohover:focus ul {
   display: block;
}

/* end of minifish */

/* apply minifish */


.mf-region td {
   position: relative;
}

.mf-region td ul {
   position: absolute;
   top:      0.5em;
   left:     4em;
   z-index:  5;
   padding-left: 0;
}
#emailbody td ul {  /* strength and gender */
   top: 0;
   left: 2em;
 }

#iavoids td ul {  /* avoids */
   top: 1em;
   left: 1em;
   min-width: 4em;
}

.mf-region td ul li {
   padding: 0.1em;
   list-style-type: none;
   background: lightgray;
}

.mf-region td ul li:hover {
   background: lightblue;
   list-style-type: none;
}

.mf-region td ul li.chosen {
   background: pink;
}

.mf-region td.mf-menu:hover, .mf-region td.mf-menu-nohover:hover {
   background: lightblue;
}

/* end of apply minifish*/

.tablecell, .strength, .gender, .iavoid {
   /*animation-name: animate; */
   animation-duration: 0.2s;
}


@keyframes animate {
   from {background-color: red;}
   to {background-color: yellow;}
}



@media print {

   .hplayer {
      display: none;
   }

   .hplayer_print {
      display: inline;
   }

   input::placeholder {
      color:   white;   /* yields very light gray */
      display: none !important; /* does not work */
      opacity: 0; /* this works */
   }

   .noprint {
      display: none;
   }

   #reserve {
      display: none;
   }

   #table td.freeday{
      background: initial;
   }
   #table td.absent{
      background: initial;
   }
   #table td.absent.month{
      background: #fff4f4;
   }
   input {
      background: initial;
   }
   #varia {
      border: 0;
   }
   div#tstable {
      font-size: smaller;
   }
   button{
      display: none;
   }
}