/**
 * @Author: Nicolas Wimmer
 * @Date:   19.08.2021 11:19
 * @Email:  nico@kurios.at
 * @Last modified by:   Nicolas Wimmer
 * @Last modified time: 19.08.2021 20:41
 */
/*
$light: #dddddd;
$dark: #171c20;

@import "bootstrap";
*/

* {
  transition: 500ms;
}

body {
  background-color: #3b464e;
}

#tabMenu, #footer {
  box-shadow: 0px 0px 5px 0px black;
  padding: 5px;
  background-color: #3b464e !important;
  transition: 500ms !important;
}

#tabSubMenu {
  box-shadow: 0px 0px 5px 0px black;
  padding: 5px;
  background-color: #3b464e !important;
  width: 90%;
  margin-left: 5%;
  margin-top: 1%;
}

#tabMenu.scrolling {
  box-shadow: none;
  transition: 500ms;
}

#allPageTitel.scrolling {
  position: fixed;
  background-color: #3b464e;
  z-index: 10;
  height: auto;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: 0px 5px 5px 0px black;
  transition: 500ms !important;
}

.singleGraph {
  max-height: 30vh;
  min-height: 25vh;
}

#calls2, #mails1, #tickets1, #graph, #graphMalus {
  max-width: 80vw;
}

.tableButtonPriv, .tableButtonNext {
  margin-bottom: .5rem;
}

#allPageSubtitleh3 {
  background-color: none;
}

/*ONLY 4 DEBUGGING!!
.container{
    min-height: 40em;
}
*/

.foreground{
  z-index: 1000 !important;
  position: absolute !important;
  background-color: rgba(0,0,0,0.4);
  opacity: 1 !important;
}

.wrapper {
  min-height: 75vh;
  text-align: center;
  padding: 5%;
}

.container-xl, div.container-fluid{
  background-color: #3b464e !important;
}

.customTooltip, .customTooltipTableBtnPriv, .customTooltipTableBtnNext {
  position: relative;
  display: inline-block;
}

.customTooltip .customTooltiptext, .customTooltipTableBtnPriv .customTooltiptextTableBtnPriv, .customTooltipTableBtnNext .customTooltiptextTableBtnNext {
  visibility: hidden;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px;
  position: absolute;
  z-index: 1;
  bottom: 100%;
  left: 50%;
  margin-left: -60px;
  white-space: nowrap;
  
  /* Fade in tooltip - takes 1 second to go from 0% to 100% opac: */
  opacity: 0;
  transition: opacity 1s;
}

.customTooltip:hover .customTooltiptext, 
.customTooltipTableBtnPriv:hover .customTooltiptextTableBtnPriv, 
.customTooltipTableBtnNext:hover .customTooltiptextTableBtnNext, 
.tableButtonPriv:hover + .customTooltipTableBtnPriv .customTooltiptextTableBtnPriv, 
.tableButtonNext:hover + .customTooltipTableBtnNext .customTooltiptextTableBtnNext {
  visibility: visible;
  opacity: 1;
}

.activeButton {
  background-color: #23272b;
  border-color: #1d2124;
  box-shadow: 0 0 0 0.2rem rgb(82 88 93 / 50%);
}

@media only screen and (max-width: 768px) {
  form.form-signin {
    position: relative;
    box-sizing: border-box;
    height: auto;
    padding: 10px;
    font-size: 16px;
    padding: 0;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .d-none{
    display: block !important;
  }

}

.fadeColorAnimation {
  animation: fadeColor 500ms;
}

@keyframes fadeColor {
  from {background-color: green;}
  to {background-color: none;}
}