@charset "UTF-8";

/* ----------------------------------------------------------------------------- *
 *                      Konfiguration der Dashboard-Elemente                     *
 * ----------------------------------------------------------------------------- */
 
 .dashboard-flex{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
 } 
 
 .dashboard-element {
  float: left;
  flex-grow: 1;
  width:100%;
  background-color:#ffffff;
  padding:0px;
  margin: 0.5rem;
  border-radius:4px;
  color:#505e6c;
  box-shadow:1px 1px 7px rgba(0,0,0,0.1);
  box-sizing: border-box;
}
  .dashboard-element-top {
  float: none;
  width:100%;
  height:3.0rem;
  padding:0px;
  box-sizing: border-box;
  font-weight:300;
  font-size:1.8rem;
  text-align: center;
  background-color:#bb0a30;
  color:white;
  border-radius:4px 4px 0px 0px;
  border-bottom: 2px solid;
}

.dashboard-element-eigene-bilanz {
  float: none;
  width:100%;
  padding:5px;
  box-sizing: border-box;
  font-size:2.5rem;
  font-weight:bold;
  text-align: left;
  border-bottom: 1px dashed #ddd;
}

.dashboard-element-bottom {
  padding:1.0rem;
  float: left;
  width:100%;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  font-size:1.3rem;
  align-items: flex-start;
  flex-direction: row;

}

.dashboard-element-bottom-header {
  width:100%;
  padding:5px 5px 0px 5px;
  box-sizing: border-box;
  text-align: left;
  box-sizing: border-box;
  font-size:1.2rem;

}


.dashboard-containerelemente-person {
  flex-grow:1;
  background-color:#f7f9fc;
  margin:5px;
  font-size:1.3rem;
  text-align:center;
  width:25vw;
  max-width:25vw;
  /*min-width:90px;
  max-width:20%;*/
  display: flex;
  flex-wrap: wrap;
  align-content: stretch;
  box-shadow:1px 1px 7px rgba(0,0,0,0.1);
}

.dashboard-status {
  min-width:2vw;
  display: flex;
  flex-wrap: wrap;

}


.dashboard-bilanz-person {
  padding:5px 5px 5px 5px;
  /*width:90%;*/
  width:calc(100%-2vw);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction:column;
  flex-grow:1;

}

.dashboard-own-status-red {
	background-color:#bb0a30 !important;
}

.dashboard-own-status-orange {
	background-color:orange !important;

}

.dashboard-own-status-green {
	background-color:green !important;
}

.dashboard-background-brief {
	background-image:url('../icons/icon_message_grey.svg');
    background-repeat: no-repeat;
    background-position:center 0%;
    background-size: contain;
	width:40px;
	min-height:100%;

}

.dashboard-background-voting {
	background-image:url('../icons/icon_voting2.svg');
    background-repeat: no-repeat;
    background-position:center 0%;
    background-size: 70%;
	width:40px;
}

.dashboard-new-status-icon {
	background:#bb0a30;
	padding:2px;
	margin:0px;
	border-radius:10px;
	font-size:1.0rem;
	color:#ffffff;
	text-align:center;
	width:18px;
	height: 18px;
	position:relative;
    left: 11px;
    top: -9px;
    margin:auto;
}
  .dashboard-containerelemente-voting {
   flex-grow: 1;
  max-width:45%;

  background-color:#f7f9fc;
  margin:5px;
  font-size:3vw;
 
  text-align:center;
  /*min-width:105px;*/
  min-width: 35%;

  display: flex;
  flex-wrap: wrap;
  align-content: stretch;
  box-shadow:1px 1px 7px rgba(0,0,0,0.1);
}

.dashboard-voting-icons{
  display: flex;
  flex-wrap: wrap;
  flex-direction:row;
  justify-content: center;

  height:25px;
  margin-top:15%;
  margin-left:-10%;
}

.dashboard-voting-details {
  padding:5px 5px 5px 5px;
  width:calc(100%-2vw);
  flex-direction:column;
  flex-grow:1;
  justify-content: center;
}

.dashboard-voting-date {
	font-size:4vw;
	font-weight:bold;
	color:#4c4c4c;
}

.dashboard-containerelemente-abwesenheiten {
  flex-grow: 1;
  flex-direction: row;
  background-color:#f7f9fc;
  margin:5px;
  font-size:3vw;
   width:25vw;
  max-width:25vw;
  text-align:center;
  /*min-width:105px;*/

  display: flex;
  flex-wrap: wrap;
  align-items:stretch;
  box-shadow:1px 1px 7px rgba(0,0,0,0.1);
  /*justify-content: center;*/
  /*background: linear-gradient(to right, rgba(76,76,76,0.5) 5%, rgba(246,249,252,1) 50%);*/
}

.dashboard-abwesenheiten-header {
	font-size:3.0vw;
	color:#4c4c4c;
	font-weight:bold;
}

.dashboard-abwesend-number {
	display:flex;
	align-items:center;
	background-color:#4c4c4c;
	background-color:#c5c7c9;
	color:white;
	min-height:100%;
	min-width:4.5vw;
	justify-content: center;
	font-weight:bold;
}

.dashboard-abwesend-container-status {
  display: flex;
  flex-wrap: none;
  align-items:stretch;
  flex-direction:column;
  margin:0px;
  width:calc(100% - 4.5vw);
  justify-content: center;

}

.dashboard-abwesenheiten-datum {
  padding:0px;
}

.dashboard-container-divider {
	margin-top:1.5rem;
	border-top: 1px dashed #ddd;
	box-sizing: content-box;
	min-width:100%;
}

.dashboard-protokoll-tagessumme {
	display:flex;
	flex-wrap: none;
	flex-direction: row;
	justify-content: center;
	min-height:7vw;
}

.dashboard-protokoll-detail {
	min-width: 40%;
	margin:1vw;
}

.dashboard-protokoll-background-hinfahrt-orange {
	background-image:url('../icons/icon_morgen_orange2.svg');
    background-repeat: no-repeat;
    background-position:center 0%;
    background-size: contain;
}
.dashboard-protokoll-background-hinfahrt-red {
	background-image:url('../icons/icon_morgen_red2.svg');
    background-repeat: no-repeat;
    background-position:center 0%;
    background-size: contain;
}
.dashboard-protokoll-background-hinfahrt-green {
	background-image:url('../icons/icon_morgen_green2.svg');
    background-repeat: no-repeat;
    background-position:center 0%;
    background-size: contain;
}

.dashboard-protokoll-background-rückfahrt-orange {
	background-image:url('../icons/icon_abend_orange2.svg');
    background-repeat: no-repeat;
    background-position:center 0%;
    background-size: contain;
}
 
.dashboard-protokoll-background-rückfahrt-red {
	background-image:url('../icons/icon_abend_red2.svg');
    background-repeat: no-repeat;
    background-position:center 0%;
    background-size: contain;
}
.dashboard-protokoll-background-rückfahrt-green {
	background-image:url('../icons/icon_abend_green2.svg');
    background-repeat: no-repeat;
    background-position:center 0%;
    background-size: contain;
}


@media screen and (min-width: 40em) {
.dashboard-element  {
  min-width:20rem;
  width:45%;
  /*background-color:blue;*/	  
}

.dashboard-status {
  min-width:1vw;
}

.dashboard-voting-details {
  width:calc(100%-1vw);
}

.dashboard-voting-date {
	font-size:2.2vw;
}

.dashboard-containerelemente-voting {
  font-size:1.8vw;
}

.dashboard-bilanz-person {
	  width:calc(100%-1vw);
}
.dashboard-containerelemente-person {
  font-size:1.5vw;
  width:12vw;
  max-width:12vw;
}

.dashboard-containerelemente-abwesenheiten {
  font-size:1.5vw;
  width:12vw;
  max-width:12.5vw;
}

.dashboard-abwesend-number {
  min-width:2.5vw;
}

.dashboard-abwesenheiten-header {
	font-size:1.6vw;
}

.dashboard-abwesend-container-status {
  width:calc(100% - 2.5vw);
}

.dashboard-protokoll-tagessumme {
  min-height:5vw;
}


}


@media screen and (min-width: 64em) {
 	.dashboard-element  {
 	  min-width:20rem;
	  width:45%;
	  /*background-color:lime;*/
	}
	
.dashboard-status {
  min-width:0.5vw;
}

.dashboard-voting-details {
  width:calc(100%-0.5vw);
}

.dashboard-voting-date {
	font-size:1.3vw;
}

.dashboard-containerelemente-voting {
  font-size:0.9vw;
  margin:5px;
  min-width:95px;
  /*min-width:5vw;*/
  max-width:9.5vw;

}

.dashboard-background-brief {
    background-size: 55%;
}

.dashboard-background-voting {
    background-size: 55%;
}

.dashboard-bilanz-person {
	  width:calc(100%-0.5vw);
}

.dashboard-containerelemente-person {
  font-size:1.0vw;
  width:8vw;
  max-width:8vw;
}

.dashboard-containerelemente-abwesenheiten {
  font-size:1.0vw;
  width:9.0vw;
  max-width:9.0vw;
}

.dashboard-abwesend-number {
  min-width:2.1vw;
}

.dashboard-abwesenheiten-header {
	font-size:1.2vw;
}

.dashboard-abwesend-container-status {
  width:calc(100% - 2.1vw);
}

.dashboard-protokoll-tagessumme {
  min-height:3.0rem;
}

.dashboard-protokoll-detail {
	min-width: 40%;
	margin:5px;
}

}

@media screen and (min-width: 80em) {
 	.dashboard-element  {
	  width:46%;
	  /*background-color:yellow;*/
	}
	

.dashboard-background-brief {
    background-size: 70%;

}

.dashboard-background-voting {
    background-size: 70%;

}

.dashboard-status {
  min-width:8px;
}

.dashboard-voting-details {
  width:calc(100%-8px);
}

.dashboard-voting-date {
	font-size:1.5rem;
}

.dashboard-containerelemente-voting {
  font-size:1.2rem;
  margin:5px;
  min-width:120px;
  max-width:120px;
  /*min-width:5vw;
  max-width:9.5vw;*/

}

.dashboard-bilanz-person {
	  width:calc(100%-2vw);
}

.dashboard-containerelemente-person {
  font-size:1.3rem;
  min-width:90px;
  max-width:40%;
}

.dashboard-containerelemente-abwesenheiten {
  font-size:1.2rem;
  min-width:95px;
  max-width:45%;
}

.dashboard-abwesend-number {
  min-width:25px;
}

.dashboard-abwesenheiten-header {
	font-size:1.5rem;
}

.dashboard-abwesend-container-status {
  width:calc(100% - 25px);
}

.dashboard-protokoll-tagessumme {
  min-height:3.0rem;
}

.dashboard-protokoll-detail {
	min-width: 40%;
	margin:5px;
}

}