﻿@charset "utf-8";

/* 
Verwendete Farbtöne:

Button zurück usw.
ffa500 rgb(255,165,0) * 0,3 opacity
Rahmen: 1px solid #FFA500

rot ee3c50 rgb(238,60,80) *
grün 3c763d rgb(60, 118, 61) * 

#A8A8A8 - grau aus logo für Leisten und Buttons bzw. Schrift für Footerlinks  rgb(168, 168, 168) *
#F0F0F0 - ganz helles grau für hintergrund für Leisten und Buttons und zur Abgrenzung von inhaltlichen Blöcken  rgb(240, 240, 240) *

custom anpassungen bizztrainer_wp
blau: #00c6e5; rgb(0,198,229) *
orange: #EE6317; rgb(238,99,23) *

background player neu
0E0E0E
blau: #00c6e5; rgb(0,198,229) *
orange: #EE6317; rgb(238,99,23) *
#A8A8A8 - grau aus logo für Leisten und Buttons bzw. Schrift für Footerlinks  rgb(168, 168, 168) *

grüner button: rgba(18,200,18,0.3)
rahmen: 1px solid #14C814

playbizz:
rot: 75,0,0 #C00000 (75,0,0,0.3)
weißgrau: #F0F0F0;

PTM::
rot logo: 228,49,61 #E4313D
grün logo: 0, 67, 34 #004322

helles giftgrün: 169,208,70 #a9d046
dunkles giftgrün: 185,215,101 #b9d765
*/


@font-face { font-family: 'OpenSans';
             src: url('../fonts/OpenSans-Regular.ttf') format('truetype'); }


body {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: column;
	flex-flow: column;
	background: #FFFFFF;
	font-family: OpenSans,arial,verdana,sans-serif;
}

/**************************************/
/* Body */
main {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: column;
	flex-flow: column;
	min-height: 400px;
}

/* weitere kindelemente (nav und section nicht als Kindelemente einer Flexbox genutzt) */

header a {
	color: #E4313D;
	text-decoration: none;
}

header a:hover {
	color: #E4313D;
	text-decoration: underline;
}

article a {
	color: #E4313D;
	text-decoration: none;
}

article a:hover {
	color: #E4313D;
	text-decoration: underline;
}

article span.schrift_rot {
	color: #E4313D;
}

button.btn-primary, a.btn-primary {
	background: rgb(0, 67, 34, 0.3);
	border: 1px solid #004322;
	color: #000000;
}

button.btn-primary:hover, a.btn-primary:hover {
	background: rgb(0, 67, 34, 0.7);
	border: 1px solid #004322;
	color: #FFFFFF;
}

button.btn-primary:focus, a.btn-primary:focus, button.btn-primary:focus:active, a.btn-primary:focus:active button.btn-primary:active, a.btn-primary:active {
	background: rgb(0, 67, 34, 0.7);
	border: 1px solid #004322;
	color: #FFFFFF;
	box-shadow: 0 0 0 0.25rem rgba(0, 67, 34, 0.3);
}

.btn-primary.disabled, .btn-primary:disabled {
	background: rgb(0, 67, 34, 0.2);
	border: 1px solid #004322;
	color: #FFFFFF;
}


a.nav-link, a.nav-link:hover {
	color: #E4313D;
}

/* callout */

.callout {
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    border: 1px solid #e9ecef;
    border-left-width: .25rem;
    border-radius: .25rem;
}

.callout-info {
    border-left-color: #5bc0de;
}

.callout-warning {
    border-left-color: #f0ad4e;
}

.callout-danger {
    border-left-color: #d9534f;
}



/*planung*/

.btn-link {
	color: #E4313D;
}

.btn-link:hover {
	color: rgba(0, 67, 34, 0.7);
}

.form-range::-webkit-slider-thumb {
	background-color: rgba(0, 67, 34, 0.7);
}

.form-range::-moz-range-thumb {
	background-color: rgba(0, 67, 34, 0.7);
}

.form-range:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(0, 67, 34, 0.3);
}
.form-range:focus::-moz-range-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(0, 67, 34, 0.3);
}

.form-range::-webkit-slider-thumb:active {
  background-color: rgba(0, 67, 34, 0.3);
}

.form-range::-moz-range-thumb:active {
  background-color: rgba(0, 67, 34, 0.3);
}

.form-check-input:focus {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(0, 67, 34, 0.3);
}
.form-check-input:checked {
  background-color: rgba(0, 67, 34, 0.3);
  border-color: rgba(0, 67, 34, 0.3);
}

.lead {
	font-size: 1rem;
}

h1 {
	font-size: 2rem;
	font-weight: 600;
}

h3 {
	font-size: 1.5rem;
	font-weight: 600;
}

/**************************/
/* Header Infos */
div.headerbox {
	background: #F0F0F0;
	height: 50px;
}

div.headerbox span.schrift_rot {
	color: #E4313D;
}

div.headerbox img {
	max-height: 40px;
}

div.headerbox_menubutton span.nav_button {
	color: #E4313D;
	font-size:30px;
	cursor:pointer;
	padding: 7px;
	
}

/* Content */

.seitenueberschrift {
	margin: 10px;
	color: #E4313D;
}

.container {
		border: 1px solid #F0F0F0;
		border-top: 0px solid #F0F0F0;
}

div.contentbox  {
	height: 100%;
	background-color: #F0F0F0; 
}

img.content_breit {
	width: 100%;
}


/*Entscheidungstabs */

.nav-tabs button.nav-link {
	background: rgb(0, 67, 34, 0.3);
	border: 1px solid #004322;
	color: #000000;
}

.nav-tabs button.nav-link:hover {
	background: rgb(0, 67, 34, 0.7);
	border: 1px solid #004322;
	color: #FFFFFF;
}

/* Diagramme Accordion */

.accordion-item button.accordion-button {
	background: rgb(0, 67, 34, 0.3);
	border: 1px solid #004322;
	color: #000000;
}

.accordion-item button.accordion-button:hover {
	background: rgb(0, 67, 34, 0.7);
	border: 1px solid #004322;
	color: #FFFFFF;
}

.accordion-item button.accordion-button:focus {
	border-color:#004322;
	box-shadow:0 0 0 .25rem rgba(0, 67, 34, 0.3);
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}


/*Rahmen formularfelder */
.form-control:focus {
	border-color:#004322;
	box-shadow:0 0 0 .25rem rgba(0, 67, 34, 0.3);
}

/* saisonstatusbar.... */

div.saisonstatusbar_gespielt {
	background: rgb(228,49,61, 0.7);
	width: 100%;
}

div.saisonstatusbar_ausstehend {
	background: rgb(0, 67, 34, 0.7);
	width: 100%;
}

/**************************************/
/* Right Navigation */

.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  right: 0;
  background-color: #595959;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.maincontent {
  transition: margin-right .5s;
  padding: 0px;
}

/* schauen was man braucht */

.bi {
  vertical-align: -.125em;
  pointer-events: none;
  fill: currentColor;
}

.dropdown-toggle { outline: 0; }

.nav-flush .nav-link {
  border-radius: 0;
}

.btn-toggle {
  display: inline-flex;
  align-items: center;
  padding: .25rem .5rem;
  font-weight: 400;
  color: rgba(240, 240, 240, 1.0);
  background-color: transparent;
  border: 0;
}
.btn-toggle:hover,
.btn-toggle:focus {
  color: rgba(240, 240, 240, 1.0);
  background-color: rgba(0, 0, 0, 0.3);
}

.btn-toggle::before {
  width: 1.25em;
  line-height: 0;
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
  transition: transform .35s ease;
  transform-origin: .5em 50%;
}

.btn-toggle[aria-expanded="true"] {
  color: rgba(240, 240, 240, 1.0);
}
.btn-toggle[aria-expanded="true"]::before {
  transform: rotate(90deg);
}

.btn-toggle-nav a {
  display: inline-flex;
  padding: .1875rem .5rem;
  margin-top: .125rem;
  margin-left: 1.25rem;
  text-decoration: none;
  color: rgba(240, 240, 240, 1.0);
}
.btn-toggle-nav a:hover,
.btn-toggle-nav a:focus {
  color: rgba(240, 240, 240, 1.0);
  background-color: rgba(0, 0, 0, 0.3);
}

.scrollarea {
  overflow-y: auto;
}

.fw-semibold { font-weight: 600; }
.lh-tight { line-height: 1.25; }

.sidenav .closebtn {
  position: absolute;
  cursor: pointer;
  color: rgba(240, 240, 240, 1.0);
  top: 5px;
  right: 10px;
  font-size: 3em;
}

/* bis hier */
@media screen and (max-height: 450px) {
  nav {padding-top: 15px;}
  nav a {font-size: 18px;}
}


/************************************/
/* Footer */

div.footerbox {
	height: 50px;
}

ul.footernav {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: left;
	border: none;
}

li.footernav {
	margin: 0;
	padding: 0;
	display: inline-block;
}

a.footerlink {
	color: #A8A8A8 !Important;
	text-decoration: underline;
	border: none;
}

a.footerlink:hover {
	color: #004322;
	text-decoration: underline;
}

a.footernavlinkactive {
	color: #004322;
	text-decoration: underline;
}

/* Formatierung für Tabellenzellen in den Berichten */

table th.th_unterstrichen { 
	font-weight: normal;
	text-decoration: underline;
	color: #000000;
}

table th.th_fett { 
	font-weight: bold;
	color: #000000;
}

table td.td_fett  { 
	font-weight: bold;
	color: #000000;
}

table td.td_klein  { 
	font-size: 0.15em;
}

table td.td_alarm  { 
	color: #F00000;
}

table td.td_eingerueckt  { 
	padding-left: 15px;
}

span.alarm {
	color: #F00000;
}


/* Formatierung für Tabellenzellen */

.breite1 {	
	width: 1%;
}
.breite2 {	
	width: 2%;
}
.breite3 {	
	width: 3%;
}
.breite4 {	
	width: 4%;
}
.breite5 {	
	width: 5%;
}
.breite6 {	
	width: 6%;
}
.breite7 {	
	width: 7%;
}
.breite8 {	
	width: 8%;
}
.breite9 {	
	width: 9%;
}
.breite10 {	
	width: 10%;
}
.breite11 {	
	width: 11%;
}
.breite12 {	
	width: 12%;
}
.breite13 {	
	width: 13%;
}
.breite14 {	
	width: 14%;
}
.breite15 {	
	width: 15%;
}
.breite16 {	
	width: 16%;
}
.breite17 {	
	width: 17%;
}
.breite18 {	
	width: 18%;
}
.breite19 {	
	width: 19%;
}
.breite20 {	
	width: 20%;
}
.breite21 {	
	width: 21%;
}
.breite22 {	
	width: 22%;
}
.breite23 {	
	width: 23%;
}
.breite24 {	
	width: 24%;
}
.breite25 {	
	width: 25%;
}
.breite26 {	
	width: 26%;
}
.breite27 {	
	width: 27%;
}
.breite28 {	
	width: 28%;
}
.breite29 {	
	width: 29%;
}
.breite30 {	
	width: 30%;
}
.breite31 {	
	width: 31%;
}
.breite32 {	
	width: 32%;
}
.breite33 {	
	width: 33%;
}
.breite34 {	
	width: 34%;
}
.breite35 {	
	width: 35%;
}
.breite36 {	
	width: 36%;
}
.breite37 {	
	width: 37%;
}
.breite38 {	
	width: 38%;
}
.breite39 {	
	width: 39%;
}
.breite40 {	
	width: 40%;
}
.breite45 {	
	width: 45%;
}
.breite50 {	
	width: 50%;
}
.breite60 {	
	width: 60%;
}
.breite70 {
	width: 70%;
}
.breite75 {
	width: 75%;
}
.breite80 {
	width: 80%;
}
