/*------*/
/* menu */
/*------*/

.cl_menu
{
  overflow:         hidden;
  background-color: white;
  display:          flex;
  justify-content:  left; /* left, center, right */
  padding-left:     2em;
}

.cl_menu_desktop
{
  overflow:        hidden;
  display:         flex;
  justify-content: left; /* left, center, right */
}

.cl_menu_mobile
{
  overflow:        hidden;
  display:         flex;
  justify-content: right; /* left, center, right */
}

.cl_menu_desktop_content
{
  z-index:          16;
  display:          none;
  position:         absolute;
  top:              4em;
  background-color: white;
  min-width:        5em;
  border:           1px solid #7c7c7b;
}

.cl_menu_mobile_content
{
  z-index:          16;
  display:          none;
  position:         absolute;
  top:              4em;
  left:             0em;
  background-color: white;
  min-width:        100%;
  border:           1px solid #7c7c7b;
}

.cl_menu_desktop_button
{
  cursor:           pointer;
  background-color: white;
  color:            black;
  display:          flex;
  align-items:      center; /* flext-start, center, flex-end;*/
  justify-content:  center; /* left, center, right */
  padding-left:     1em;
  padding-right:    1em;
  font-size:        1.2em;
}

.cl_menu_mobile_button
{
  cursor:           pointer;
  background-color: white;
  color:            black;
  display:          flex;
  align-items:      center; /* flext-start, center, flex-end;*/
  justify-content:  center; /* left, center, right */
  padding-left:     1em;
  padding-right:    1em;
  font-size:        1.5em;
  width:            3em;
}

.cl_menu_button_hover
{
  background-color: #eee;
  color:            black;
}

.cl_menu_button_clicked
{
  background-color: #ddd;
  color:            black;
}

.cl_menu_mobile_seperator
{
  display:          flex;
  align-items:      center; /* flext-start, center, flex-end;*/
  justify-content:  left;   /* left, center, right */
  background-color: #e30613;
  color:            white;
  padding-left:     0.5em;
  height:           1.5em;
}

.cl_menu_action
{
  background-color: white;
  color:            black;
  display:          block;
  padding-top:      1em;
  padding-bottom:   1em;
  padding-left:     1em;
  padding-right:    1em;
  text-decoration:  none;
  font-size:        0.9em;
}

.cl_menu_action:hover
{
  background-color: #ddd;
  color:            #e30613;
  cursor:           pointer;
}
