@import './root.css';
/* TAB SYSTEM */
.tabs
{
	padding: 0;
	background: transparent;
}

.tabs a
{
	background: var(--main-tab-inactive-color);
	border-radius: 8px 8px 0px 0px;
	border: 1px solid rgba(124, 124, 124, 0.4);
	float: left;
	display: block;
	line-height: 24px;
	height: 28px;
	padding-left: 8px;
	padding-right: 8px;
	text-decoration: none;
}
.tabs a span
{
	background: var(--main-tab-inactive-color);
	border-radius: 8px 8px 0px 0px;
	display: block;
	color:#FFFFFF;
	font-family:Verdana;
	font-size:13px;
	font-weight:bold;
}
.tabs a span{float:none;}
.tabs a:hover{background: var(--main-tab-active-color);}
.tabs a:hover span{ background: var(--main-tab-active-color); color: #FFFFFF; }

.tabHeaderActive a { background: var(--main-tab-active-color); color:#FFFFFF;}
.tabHeaderActive a span { background: var(--main-tab-active-color); color: #FFFFFF; }

/* Buttons */
.buttonwrapper
{
	/* Container you can use to surround a CSS button to clear float */
	overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
	width: 100%;
}

a.ovalbutton{
	border-radius: 6px;
	background: var(--main-button-inactive-color);
	border: 1px solid rgba(124, 124, 124, 0.4);
	font: normal 11px verdana;
	line-height: 25px;
	padding: 3px 5px 3px 5px;
	margin: 0px 2px 0px 2px;
	color: #FFFFFF;
	text-decoration: none;
	white-space: nowrap;
}

a.ovalbutton:hover{
	background: var(--main-button-active-color);
}

a.ovalbutton span
{
	color: #FFFFFF;
}

a.bigovalbutton{
	border-radius: 6px;
	background: var(--main-button-active-color);
	border: 1px solid rgba(124, 124, 124, 0.4);
	font: bold 12px verdana;
	line-height: 38px;
	padding: 10px 18px 10px 18px;
	margin: 0px 2px 0px 2px;
	color: #FFFFFF;
	text-decoration: none;
	white-space: nowrap;
}

a.bigovalbutton:hover{
	background: var(--main-button-inactive-color);
}

a.bigovalbutton span
{
	color: #FFFFFF;
}

a.smallovalbutton{
	border-radius: 4px;
	background: var(--main-button-inactive-color);
	border: 1px solid rgba(124, 124, 124, 0.4);
	font: normal 10px verdana;
	line-height: 18px;
	padding: 0px 4px 0px 4px;
	margin: 0px 2px 0px 2px;
	color: #FFFFFF;
	text-decoration: none;
	white-space: nowrap;
}

a.smallovalbutton:hover{
	background: var(--main-button-active-color);
}

a.smallovalbutton span
{
	color: #FFFFFF;
}

a.redovalbutton{
	border-radius: 6px;
	background: #e06666;
	border: 1px solid rgba(124, 124, 124, 0.4);
	font: normal 11px verdana;
	line-height: 25px;
	padding: 3px 5px 3px 5px;
	margin: 0px 2px 0px 2px;
	color: #FFFFFF;
	text-decoration: none;
}

a.redovalbutton:hover{
	background: #c84444;
}

a.redovalbutton span
{
	color: #FFFFFF;
}

a.greenovalbutton{
	border-radius: 6px;
	background: #8cba8c;
	border: 1px solid rgba(124, 124, 124, 0.4);
	font: normal 11px verdana;
	line-height: 25px;
	padding: 3px 5px 3px 5px;
	margin: 0px 2px 0px 2px;
	color: #FFFFFF;
	text-decoration: none;
}

a.greenovalbutton:hover{
	background: #5eae5e;
}

a.greenovalbutton span
{
	color: #FFFFFF;
}

a.karteireiter
{
	background: var(--main-tab-inactive-color);
	border-radius: 8px 8px 0px 0px;
	border: 1px solid rgba(124, 124, 124, 0.4);
	float: left;
	display: block;
	line-height: 24px;
	height: 28px;
	padding-left: 8px;
	padding-right: 8px;
	text-decoration: none;
}

a:link.karteireiter, a:visited.karteireiter, a:active.karteireiter{
color: #FFFFFF; /*button text color*/
}

a.karteireiter span{
	background: var(--main-tab-inactive-color);
	border-radius: 8px 8px 0px 0px;
	display: block;
	color:#FFFFFF;
	font-family:Verdana;
	font-size:13px;
	font-weight:bold;
}

a.karteireiter:hover{
	background: var(--main-tab-active-color);
}

a.karteireiter:hover span{
	background: var(--main-tab-active-color);
	color: #FFFFFF;
}


.karteititel, .karteititel_shadow{
	background: var(--main-tab-active-color);
	border-radius: 8px 8px 0px 0px;
	border: 1px solid rgba(124, 124, 124, 0.4);
	float: left;
	display: block;
	line-height: 24px;
	height: 28px;
	padding-left: 8px;
	padding-right: 8px;
	text-decoration: none;
}

.karteititel span, .karteititel_shadow span{
	background: var(--main-tab-active-color);
	border-radius: 8px 8px 0px 0px;
	display: block;
	color:#FFFFFF;
	font-family:Verdana;
	font-size:13px;
	font-weight:bold;
}



.karteititel_inactiv, .karteititel_shadow_inactiv{
	background: var(--main-tab-inactive-color);
	border-radius: 8px 8px 0px 0px;
	border: 1px solid rgba(124, 124, 124, 0.4);
	float: left;
	display: block;
	line-height: 24px;
	height: 28px;
	padding-left: 8px;
	padding-right: 8px;
	text-decoration: none;
}

.karteititel_inactiv span, .karteititel_shadow_inactiv span{
	background: var(--main-tab-inactive-color);
	border-radius: 8px 8px 0px 0px;
	display: block;
	color:#FFFFFF;
	font-family:Verdana;
	font-size:13px;
	font-weight:bold;
}

.total_hour_counter{
	margin-top:3px;
        margin-left:10px;
	float:left;
	text-align:center;
	width:220px;
	height:22px;
	background-repeat:no-repeat;
	background-color:#CEE3F6;
	vertical-align:middle;
	line-height:22px;
	-moz-border-radius: 15px;
	border-radius: 15px;

}

.total_hour_counter span{
	font-weight:bold;
	text-decoration:none;
	color:#666666;
}


.bpt-popup-window-course
{
	border: 5px solid #D4E1EC;
	background-color: white;
	padding-top:0px;

	z-index: 150 !important;
	position: absolute !important;

	top: 0px;
	left:0px;
}