/*
* Dieses File dient der Erstellung von Klassen, die zur Darstellung verwendet werden
* - Farben; - Schatten; - Ränder; 
* Version 20180801
*
*/

/* Konstanten für Farben */
/* WICHTIG; in den Theme Roller verschoben */
/*:root {
*	--White: #FFFFFF;
*	--LightGrey: #DDDDDD;
*	
*	/*Erpam Blau*
*	--MainColor: #203874;
*	/*Carisma Red*
*	/*--MainColor: #C7001F;*
*	/*MBSupport Orange*
*	/*--MainColor: #ee8700;*
*	
*	--SecondColor: #4b4b4b; /* Grey *
*	--SecondDarkColor: #2c436e; /* Dunkelblau *
*	--MainGreen: #39DD9E;
*	--MainRed: #DD3939; 
*	--TopBackgroundColor: #79787e;
*	--LightMainColor: #13BB9C; /* Türkis *
*	--LightSecondColor: #9fc0ff; /*hellblau *
*	--IconColor: #808080;
*}
*/

/* Color Definitions as Classes */
/* Text-Colors */

.pk-White-text {
	color: var(--White);
}
.pk-LightGrey-text {
	color: var(--LightGrey);
}
.pk-MainColor-text {
	color: var(--MainColor);
}
.pk-SecondColor-text {
	color: var(--SecondColor);
}
.pk-SecondDarkColor-text {
	color: var(--SecondDarkColor);
}
.pk-MainGreen-text {
	color:var(--MainGreen);
}
.pk-MainRed-text {
	color: var(--MainRed);
}
.pk-TopBackgroundColor-text {
	color: var(--TopBackgroundColor);
}
.pk-LightMainColor-text {
	color: var(--LightMainColor);
}
.pk-LightSecondColor-text {
	color: var(--LightSecondColor);
}
.pk-IconColor-text {
	color: var(--IconColor);
}
.pk-Black-text {
	color:#000000;
}

/* Background-Colors */

.pk-White-background {
	background-color: var(--White);
}
.pk-LightGrey-background {
	background-color: var(--LightGrey);
}
.pk-MainColor-background {
	background-color: var(--MainColor);
}
.pk-SecondColor-background {
	background-color: var(--SecondColor);
}
.pk-SecondDarkColor-background {
	background-color: var(--SecondDarkColor);
}
.pk-MainGreen-background {
	background-color:var(--MainGreen);
}
.pk-MainRed-background {
	background-color: var(--MainRed);
}
.pk-TopBackgroundColor-background {
	background-color: var(--TopBackgroundColor);
}
.pk-LightMainColor-background {
	background-color: var(--LightMainColor);
}
.pk-LightSecondColor-background {
	background-color: var(--LightSecondColor);
}
.pk-IconColor-background{
	background-color: var(--IconColor);
}

/* Border-Colors */

.pk-White-border {
	border-color: var(--White);
}
.pk-LightGrey-border {
	border-color: var(--LightGrey);
}
.pk-MainColor-border {
	border-color: var(--MainColor);
}
.pk-SecondColor-border {
	border-color: var(--SecondColor);
}
.pk-SecondDarkColor-border {
	border-color: var(--SecondDarkColor);
}
.pk-MainGreen-border {
	border-color:var(--MainGreen);
}
.pk-MainRed-border {
	border-color: var(--MainRed);
}
.pk-TopBackgroundColor-border {
	border-color: var(--TopBackgroundColor);
}
.pk-LightMainColor-border {
	border-color: var(--LightMainColor);
}
.pk-LightSecondColor-border {
	border-color: var(--LightSecondColor);
}
.pk-IconColor-border{
	border-color: var(--IconColor);
}


/* Button Definitions */

.pk-main-button {
	border: none;
	font-weight: bold;
	display: inline-block;
	color: var(--White);
	--webkit-border-radius: 90px;
	-moz-border-radius: 90px;
	border-radius: 90px;
	padding: 10px;
	margin: 5px;
	cursor: pointer;
}

.pk-stripe-MainColor{
	border-left: solid 5px var(--MainColor);
}
.pk-stripe-TopBackgroundColor{
	border-left: solid 5px var(--TopBackgroundColor);
}
.pk-stripe-MainGreen{
	border-left: solid 5px var(--MainGreen);
}
.pk-stripe-MainRed{
	border-left: solid 5px var(--MainRed);
}
.pk-stripe-LightMainColor{
	border-left: solid 5px var(--LightMainColor);
}
.pk-stripe-LightSecondColor{
	border-left: solid 5px var(--LightSecondColor);
}


/* Style Definitions */

.pk-middle {
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%; 
  position: relative;
}

/*** Radio Buttons ***/

.pk-radio input:checked + label:before{
  border-color: var(--MainColor) !important;
  background-color: var(--MainColor) !important;
}
.pk-radio input:checked + label:after{
 border-color: var(--MainColor) !important;
  background-color: var(--MainColor) !important;
}

/* Links in den News */
.pk-news-main-text a {
	color: var(--MainColor);
}

@media only screen and (max-width: 480px) {
	.t-PageBody--login.apex-side-nav, .t-PageBody--login.apex-side-nav .t-Body {
	  background-color: #ececec;
	}
}
	