html
{
  overscroll-behavior-y: contain;
}
body
{
  font-family: "Open Sans", "Arial";
  line-height:1.2;
  height:100vh;
  width:100vw;
  background:#FAFAFA;
  -webkit-font-smoothing:antialiased;
}
body.noscroll
{
  /*position:fixed;*/
  overflow:hidden;
}
a, a:hover, a:visited, a:focus,a:active{color: inherit;}
a:hover{text-decoration:underline;}
.vote{height:250px;}
.vote, .voteloading{border-radius:7px;}
.vote
{
    margin:8px;
    cursor: pointer;
}
.voteloading
{
  position:absolute;
  top:0;
  height:100%;
  width:100%;
  justify-content:center;
  align-items:center;
  background-color:rgba(0,0,0,0.8);
  color:white;
}
.unvoted{background-color:#BDBDBD;}
.accepted{background-color:#9CCC65;}
.rejected{background-color:#E57373;}
.unvoted.inactive{background-color:#EEEEEE;}
.accepted.inactive{background-color:#DCEDC8;}
.rejected.inactive{background-color:#ffcdd2;}
.vote.loading{background:#EEEEEE;}
.infoAccepted, .infoRejected, .infoUnvoted, .attendance{cursor:pointer;}
.nonplaying{background-color:#C5E1A5;}/*FFE082*/
.nonplaying_color{color:#C5E1A5;}
.zusagen_sep
{
    width:1rem;
    display:inline-block;
}
.no_selection {
    -webkit-user-select: none; /* webkit (safari, chrome) browsers */
    -moz-user-select: none; /* mozilla browsers */
    -khtml-user-select: none; /* webkit (konqueror) browsers */
    -ms-user-select: none; /* IE10+ */
}
.infoScreen, #loadingScreen{background:rgba(0,0,0,0.9);position:fixed;top:0;left:0;height:100vh;width:100vw;z-index:999999;display:none;align-items:center;justify-content:center;color:white;flex-flow:column nowrap;cursor:pointer;}
.infoScreenHeader{display:flex;justify-content:center;}
.infoScreenContent{max-height:100%;width:100%;overflow:auto;}
.tooltip_table{text-align:left;}
/*.tippy-popper:focus {outline:0;}*/
.background_grey{background-color:#EEEEEE;}
label input[type="radio"] ~ i.fa.fa-circle-o{color: #EF9A9A;display: inline;}
label input[type="radio"] ~ i.fa.fa-dot-circle-o{display: none;}
label input[type="radio"]:checked ~ i.fa.fa-circle-o{display: none;}
label input[type="radio"]:checked ~ i.fa.fa-dot-circle-o{display: inline;}
label:hover input[type="radio"] ~ i.fa {color: inherit;}
input.reason-radio{display:none;}
.btn{cursor:pointer;}

/*.delete_event, .remind_event, .important_event, .nonplaying_enabled_event
{
    display:flex;
    position:absolute;
    z-index:2;
  cursor:pointer;
}
.delete_event
{
    top:90px;
    left:3px;
}
.important_event
{
  top:45px;
  left:3px;
}
.remind_event
{
  top:0px;
  left:3px;
}
.nonplaying_enabled_event
{
  top:135px;
  left:3px;
}*/
/*.delete_event, .remind_event, .important_event, .nonplaying_enabled_event
{
  display:flex;
  z-index:2;
  cursor:pointer;
}*/
.important_event.active
{
  color:red;
}
.nonplaying_enabled_event.active
{
  color:#558B2F;
}

.important
{
    display:flex;
    position:absolute;
    top:22px;
    right:3px;
}
.img.important
{
    height:24px;
}
.rotate30
{
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
    transform-origin: 50% 50%;
}
.rotate20
{
  -moz-transform: rotate(20deg);
  -ms-transform: rotate(20deg);
  -o-transform: rotate(20deg);
  -webkit-transform: rotate(20deg);
  transform: rotate(20deg);
  transform-origin: 50% 50%;
}
.swallow_click{cursor:pointer;}
.span_check{cursor:pointer;}
.span_x{cursor:pointer;}
.span_question{cursor:pointer;}
/* Ripple effect */
.ripple {
  background-position: center;
  transition: background 0.8s;
}
/*.ripple:hover {
  background: rgba(0,0,0,0.05) radial-gradient(circle, transparent 1%, rgba(0,0,0,0.05) 1%) center/15000%;
}*/
.ripple:active {
  background-color: rgba(0,0,0,0.1);
  background-size: 100%;
  transition: background 0s;
}

/* Button style */
/*button {
  border: none;
  border-radius: 2px;
  padding: 12px 18px;
  font-size: 16px;
  text-transform: uppercase;
  cursor: pointer;
  color: white;
  background-color: #2196f3;
  box-shadow: 0 0 4px #999;
  outline: none;
}*/
.strike-through{text-decoration: line-through;}
table.notifications_table tr:nth-child(1) td
{
  padding-bottom:0.25rem;
  border-bottom:1px solid rgba(0,0,0,0.1);
  font-weight:bold;
}
table.notifications_table tr:nth-child(2) td
{
  padding-top:0.25rem;
}
table.notifications_table tr td:nth-child(2), table.notifications_table tr td:nth-child(3)
{
  text-align:center;
}
table.notifications_table tr td:nth-child(1), table.notifications_table tr td:nth-child(2)
{
  padding-right:1rem;
}
.input_header
{
  display:inline;
  font-family:'Open Sans Condensed';
  font-size:80%;
  padding-left:2px;
}

.fancy-selel {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;outline:none;cursor:pointer;display:flex;flex-flow: row nowrap;align-items:flex-start;margin:0;}
.fancy-selel > input[type=checkbox], .fancy-selel > input[type=radio]{display:none;}
.fancy-selel > .checked, .fancy-selel > .unchecked {margin-right:0.25rem;}
.fancy-selel > input[type=checkbox] ~ .checked, .fancy-selel > input[type=radio] ~ .checked {display: none;}
.fancy-selel > input[type=checkbox]:checked ~ .checked, .fancy-selel > input[type=radio]:checked ~ .checked{display: inline-block;}
.fancy-selel.green > input[type=checkbox]:checked ~ .checked, .fancy-selel.green > input[type=radio]:checked ~ .checked{color:#388E3C;}
.fancy-selel.green > input[type=checkbox]:checked ~ span, .fancy-selel.green > input[type=radio]:checked ~ span, .fancy-selel.green > input[type=checkbox]:checked ~ div, .fancy-selel.green > input[type=radio]:checked ~ div{color:#388E3C;}
.fancy-selel > input[type=checkbox]:checked ~ .unchecked, .fancy-selel > input[type=radio]:checked ~ .unchecked{display: none;}
.fancy-selel > input[type=checkbox]:disabled ~ .checked, .fancy-selel > input[type=checkbox]:disabled ~ .unchecked, .fancy-selel > input[type=checkbox]:disabled ~ span, .fancy-selel > input[type=checkbox]:disabled ~ div{color:#BDBDBD;}


.custom_fab {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  position: fixed;
  bottom: 0px;
  right: 0px;
  margin-right: 15px;
  margin-bottom: 15px;
  z-index: 1;
  border-radius: 50%;
  cursor: pointer;
  background-color: #343a40;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
}
.custom_fab.level2
{
  bottom: calc(56px + 15px);
}
.custom_fab.small_fab
{
  width: 42px;
  height: 42px;
  margin-bottom: 10px;
  margin-right: calc(15px + 8px);
}

.custom_attention
{
  display: inline-block;

  animation: tada; /* referring directly to the animation's @keyframe declaration */
  animation-duration: 1s; /* don't forget to set a duration! */
}