@CHARSET "UTF-8";

body {
	font-size: 16px;
}

.mb-2 {
	margin-bottom: 15px;
}
.ml-auto {
	margin-left: auto;
}

.mr-auto {
	margin-right: auto;
}


.custom-control.custom-switch {
	white-space: nowrap;
}

.pStats {
	margin-bottom: 15px;
}

.pRange {
	display: -ms-flexbox;
	display: flex;
	font-size: 78%;
}

.pStart {
	margin-right: auto;
}

.pEnd {
	margin-left: auto;
}

.pBalken {
	height: 7px;
	background-color: #c3c3c3;
}
.pValue {
	height: 7px;
	position: relative;
}
.pValue .label {
	position: absolute;
	top: -3px;
	right: -12px;
	background-color: #808080;
	font-weight: lighter;
	font-size: 61%;
}

.ui-dialog-title {
	font-family: decorMedium !important;
}

.navbar-default {
	background-color: #e7ecef;
}

.navbar {
	min-height: auto;
}
.btn {
	font-size: 16px;
}
.pt-1 {
	padding-top: 10px;
}
.pr-1 {
	padding-right:10px;
}
.pl-1 {
	padding-left: 10px;
}
.pb-1 {
	padding-bottom: 10px;
}
.p-0 {
	padding: 0px;
}
.mt-1 {
	margin-top: 10px;
}
.mr-1 {
	margin-right:10px;
}
.ml-1 {
	margin-left: 10px;
}
.mb-1 {
	margin-bottom: 10px;
}
.m-0 {
	margin: 0;
}
.my-1 {
	margin-top: 10px;
	margin-bottom: 10px;
}
.my-2 {
	margin-top: 20px;
	margin-bottom: 20px;
}
.d-flex {
	display: -ms-flexbox!important;
	display: flex!important;
}

.flex-column {
	-ms-flex-direction: column!important;
	flex-direction: column!important;
}

.align-items-center {
	-ms-flex-align: center!important;
	align-items: center!important;
}

.justify-content-between {
	-ms-flex-pack: justify!important;
	justify-content: space-between!important;
}

#head {
	padding: 30px 0px;
}

.color-red {
	color: #e61849;
}
.btn.btn-danger {
	background-color: #e61849;
	background-image: linear-gradient(to bottom, #e61849 0%, #e61849 100%);
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {
	color: #e61849;
}

.teaserTopLeft {
	padding: 40px 0px 0px 15px;
}



.box-v2 {
	background-color: #f6f6f6;
	padding: 20px;
}
.box-v2 .kleinBoxTitle {
	z-index: 0;
	font-size: 26px;
	padding: 0px 0px 10px 0px !important;
	position: relative;
	color: #130c37 !important;
	background-color: transparent !important;
	font-family: decorBold,times,times new roman,serif;
}
.box-v2  .kleinBoxText {
	padding: 0 !important;
	/*padding-right: 34% !important;*/
	min-height: 178px;
	background-color: transparent !important;
}

.cooperation-v2 .imgCls-cooperation {
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: right top;
	/*background-image: url(/img/competences/icons/Zahnrad_Icon.png);*/
}

.communication-v2 .imgCls-communication {
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: right top;
	/*background-image: url(/img/competences/icons/Sprechblasen_Icon.png) !important;*/
}

.creativity-v2 .imgCls-creativity {
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: right top;
	/*background-image: url(/img/competences/icons/Pinsel_Icon.png) !important;*/
}

.assessment-v2 .imgCls-assessment {
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: right top;
	/*background-image: url(/img/competences/icons/Gluehbirne_Icon.png) !important;*/
}

.cooperation-v2 .btn.btn-primary {
	background-color: #3960a0;
}
.communication-v2 .btn.btn-primary {
	background-color: #7d9dd1;
	color: #000;
}
.creativity-v2 .btn.btn-primary {
	background-color: #1d3050;
}
.assessment-v2 .btn.btn-primary {
	background-color: #2b4878;
}






body {
	background-color: #FFF;
	font-family: 'regular';
	font-size: 16px;
}

*, a{
    outline: 0;
}
img { 
	border: 0;
}

textarea {
	resize:vertical;
}

#headnav {
	background-color: #e9e7e2;
}

#faz_logo {
	background-color: #FFF;
	background-image: url(/img/FAZ_SchuleNet_Logo_Blau_RGB.png);
	background-position: center;
	background-repeat: no-repeat;
	height: 120px;
}

#nav {
	z-index: 1001;
}

.breadcrumb {
	position:relative;
	padding: 8px 16px;
	margin-bottom: 8px;
	background-color: transparent;
}

#content-head {
	position: relative;
	margin: 8px 0px 16px 0px;
	border-bottom: 1px solid #110a34;
}

#content-head .title {
	background-color:  #110a34;
	padding: 8px 16px;
	display: inline-block;
}
#content-head .title .username {
	display: inline-block;
	font-size: 18px;
	color: #FFF;
	vertical-align: middle;	
}


#content-head .customer_logo {
	position: absolute;
	right: 0px;
	bottom: 16px;
}

#content {

        background-color: #fff;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	padding-top: 16px;
	padding-bottom: 20px;	
}
#content_1 {
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}


#sidebar {
	display: none;
}

#sidebar #chart {
	overflow: hidden;
}

#sidebar.open {
	z-index: 1000;
	display: block;
	position: absolute;
	left: 0px;
	top: 100px;
}

/**
 * NAVIGATION
 */

#sidebar ul.navigation {
	list-style: none;
	padding: 0px;
	margin-left: 48px;
	margin-right: 16px;
	font-family: regular;
}

#sidebar ul.navigation li {
	position: relative;	
	background-color: #FFF;
	border-bottom: 1px solid #666;
}

#sidebar ul.navigation li.active {
	background-color: #666;
}

#sidebar ul.navigation li ul {
	list-style: none;
	padding: 0px;
	display: none;
}

#sidebar ul.navigation li ul li {
	border-bottom: none;
}

#sidebar ul.navigation li.active ul {
	display: block;
}

#sidebar ul.navigation li a:link,
#sidebar ul.navigation li a:visited,
#sidebar ul.navigation li a:active {
	display: block;	
	text-transform: uppercase;
	color: #666;
	padding: 12px 16px;
	font-size: 18px;
}

#sidebar ul.navigation li a div.arrow {
	background-image: url('../img/competences/icons/arrow-big.png');
	background-repeat: no-repeat;
	position: absolute;
	width: 32px;
	height: 36px;
	left: -40px;
	top: 6px;
}
	
#sidebar ul.navigation li ul li a div.arrow {
	top: -2px;
}

#sidebar ul.navigation li.active a:link,
#sidebar ul.navigation li.active a:visited,
#sidebar ul.navigation li.active a:active {
	color: #FFF;
}

#sidebar ul.navigation li ul li a:link,
#sidebar ul.navigation li ul li a:visited,
#sidebar ul.navigation li ul li a:active {
	font-size: 14px;
	color: #666;
	background-color: #FFF;	
	text-transform: none;
	padding: 6px 16px;	
}

#sidebar ul.navigation li.active ul li a:link,
#sidebar ul.navigation li.active ul li a:visited,
#sidebar ul.navigation li.active ul li a:active {
	color: #666;
	background-color: #FFF;	
}

#sidebar ul.navigation li.active ul li.active a:link,
#sidebar ul.navigation li.active ul li.active a:visited,
#sidebar ul.navigation li.active ul li.active a:active {
	text-decoration: underline;
}

/**
 * NAVIGATION END
 */

#main {
	
}

@keyframes rotating {
	from { 
		transform:rotate(0deg);
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
	}
}
@-webkit-keyframes rotating /* Safari and Chrome */ {
	from { 
		transform:rotate(0deg);
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
	}

}

.waiting {
	width: 0px;
	height: 0px;
	padding: 10px;
	background-color: #FFF;
	border-radius: 20px;
	border-right: 4px solid #333;
	border-top: 2px solid #666;	
	-webkit-animation: rotating 0.5s linear infinite;
	-moz-animation: rotating 0.5s linear infinite;
	-ms-animation: rotating 0.5s linear infinite;
	-o-animation: rotating 0.5s linear infinite;
	animation: rotating 0.5s linear infinite;
}

.boxHead {
	padding: 10px 16px;
	color: #FFF;
	font-family: 'ITCFranklinGothicW01-Bk 812656';
	font-size: 26px;
	line-height: 26px;
	display: inline-block;
	font-family: decorRegular;
}

.box {
	background-color: #f6f6f6;
	padding: 16px;
	position: relative;
}

.box > img {
    border-bottom: 16px solid rgba(0, 0, 0, 0);
    margin: -16px;
    width: 736px;
}

.box .contentLayer .head,
.box > .head {
	box-sizing: content-box;
	-moz-box-sizing: content-box; /* Firefox */	
	width: 100%;
	display: table;
	background-color: #2b4878;
	color: #FFF;
	padding: 16px;
	margin: -16px;
	margin-bottom: 16px;
}

.box .contentLayer .head > .left,
.box > .head > .left {
	display: table-cell;
	vertical-align: top;
	width: 100%;	
}

.box .contentLayer .head > .left .headline,
.box > .head > .left .headline {
	font-family: regular;
	font-size: 16px;
	border-bottom: 1px solid #FFF;
	text-align: right;
	margin-left: -16px;
}

.box .contentLayer .head > .left .sub_headline,
.box > .head > .left .sub_headline {
	font-size: 14px;
	text-align: right;
	width: auto;
}

.box .contentLayer .head > .left .sub_headline.big,
.box > .head > .left .sub_headline.big {
	margin-top: 8px;
	font-size: 45px;
	line-height: 45px;
	font-family: decorMedium;
}

.box .contentLayer .head > .middle,
.box > .head > .middle {
	display: -ms-flexbox!important;
	display: flex!important;
	-ms-flex-align: end!important;
	align-items: flex-end!important;
	height: 72px;
}

.box .contentLayer .head > .middle .big,
.box > .head > .middle .big {	
	font-size: 60px;
	line-height: 80px;
	font-family: decorRegular;
	text-align: center;
	margin: 0 8px;
	height: 64px;
}

.box .contentLayer .head > .middle .big .small,
.box > .head > .middle .big .small {	
	font-size: 24px;
	line-height: 24px;	
	white-space: nowrap;
	font-family: decorRegular
}

.box .contentLayer .head > .right,
.box > .head > .right {
	display: table-cell;
	vertical-align: top;
	min-width: 286px !important;	
	width: 286px !important;	
}

.box .contentLayer .head > .right .info,
.box > .head > .right .info {
	display: block;
	box-sizing: content-box;
	-moz-box-sizing: content-box; /* Firefox */	
	min-height: 80px;	
	border-left: 1px solid #FFF;
	margin: -16px -16px -16px 0;
	padding: 16px;
	font-size: 80%;
}

.box .intro {
	background-color: #efefef;
	margin: -16px -16px 16px -16px;
	padding: 16px;
}


.box .intro .right {
	display: inline-block;
	vertical-align: bottom;
	width: 318px;
	white-space: nowrap;
}

.box .intro .left {
	display: inline-block;
	vertical-align: top;
	width: 385px;
}


.box .intro .legend span,
.box .intro .legend svg {
	display: inline;
}

.box .intro ul {
	padding-left: 13px;
}

.box .intro ul li {
	list-style-type: square;
}

.box .intro ul li a {
	text-decoration: underline;
}

.box .intro ul li a:hover {
	text-decoration: none;
}

.box .intro .device {
	position: relative;
	width: 319px;
	height: 211px;
	margin-right: -16px;
	margin-left: 16px;
}

.box .intro .device img {
	position: absolute;
	width: 250px;
	height: 150px;
	margin-left: 50px;
	margin-top: 10px;
}

.box .intro .device .laptop {
	position: absolute;	
	background-image: url("../img/devices/Laptop.png");
	width: 319px;
	height: 211px;
}

.box .intro .device .monitor {
	position: absolute;	
	background-image: url("../img/devices/Monitor.png");
	width: 319px;
	height: 211px;
}

.box .intro .device .tablet {
	position: absolute;	
	background-image: url("../img/devices/Tablet.png");
	width: 319px;
	height: 211px;
}

.box div.hint {
	font-family: 'ITCFranklinGothicW01-Bk 812656';
	background-color: #808080;
	position: absolute;
	padding: 2px 4px 4px 24px;
    right: 6px;
	width: 270px;
	color: #FFFFFF;	
    z-index: 1;
}

.box div.hint div.icon {
    font-family: 'ITCFranklinGothicW01-Bk 812656';
    left: 5px;
    position: absolute;
    top: -10px;
    color: #FFF;
    font-size: 48px;
}

.box div.hint div.headline {
    font-family: 'ITCFranklinGothicW01-Bk 812656';
}

.box div.hint div.arrow {
    background: url('../img/hint_arrow.svg') no-repeat top left;
	width: 20px;
	height: 20px;
	position: absolute;
	left: -20px;
	top: 5px;
}

.allgemeineWissenRight .knowledgeTestResult {
	margin-left: -2px;
	padding: 0px;	
} 

.knowledgeTestResult {
	background-color: #e4e4e4;
	overflow: hidden;
	display: table;
	height: 250px;
	border-spacing: 2px;
	margin-left: -16px;
	padding: 0 16px;
}

.knowledgeTestResult .ressort {
	width: 24px;
	overflow: hidden;
	display: table-cell;
	vertical-align: bottom;
	position: relative;
}

.knowledgeTestResult .ressort .name {
	transform: rotate(-90deg);	
	-ms-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	width: 30px;
	white-space: nowrap;
}

.knowledgeTestResult .ressort .bar {
	width: 24px;
	min-height: 1px;
	background-color: #f5a4b7;
	margin: 10px 3px 5px 3px;
	position: relative;
}

.knowledgeTestResult .ressort .bar .result {
	width: 24px;	
	background-color: #e51747;
	position: absolute;
	bottom: 0px;
}

.knowledgeTestResult .ressort .percent {
	width: 30px;
	text-align: center;
	font-size: 12px;
}

.latestTask {
	margin-bottom: 32px;
	cursor: pointer;
}

.latestTask:hover .headline,
.latestTask:hover .text {
	text-decoration: underline;
}

.latestTask img {
	width: 120px; 
	float: right;
	border: 1px solid #666;
	margin-left: 4px;
	margin-bottom: 4px;
}

.latestTask .title {
	font-size: 18px;
	font-family: decorRegular;
	margin-bottom: 15px;
}

.latestTask .date {
	font-size: 12px;
}

.latestTask .headline {
	font-weight: bold;
}

.latestTask .text {
	color: #333;	
}

ul.tasks {
	padding-left: 14px;
}

ul.tasks li {
	list-style-type: square;
}

.cooperation ul.tasks li {
	list-style-type: square;
	color: #3a609f;
}
.communication ul.tasks li {
	list-style-type: square;
	color: #7e9dd3;
}
.assessment ul.tasks li {
	list-style-type: square;
	color: #2c4878;
}
.creativity ul.tasks li {
	list-style-type: square;
	color: #1d3050;
}

ul.tasks li .date {
	font-size: 12px;
	color: #333;
}

ul.tasks li a {
	display: block;
	color: #333;
	text-decoration: underline;
}

ul.tasks li a:hover {
	text-decoration: none;
}


footer .container {
	background-color: #110a34;
	color: #ffffff;
}

footer a:hover,
footer a:active,
footer a {
	color: #fff;
}
footer a:hover {
	text-decoration: underline;
}


footer .footer-icon {
	filter: brightness(0) invert(1);
	margin-right: 30px;
	height: max-content;
}

footer .title {
	font-family: decorBold,times,times new roman,serif;
	font-size: 24px;
	padding-top: 20px; 
	padding-bottom: 10px;
}

footer .quickbar {
  	font-size: 0;	
	border-top: 1px solid #4e4e4e;
	border-bottom: 1px solid #4e4e4e;
	padding: 0 7px;
}

footer .quickbar a {
	font-size: 14px;	
	transition: all 250ms;	
	background-position: center top;
	background-repeat: no-repeat;
	display: inline-block;
	width: 158px;
	text-align: center;
	color: #666;
	padding-top: 60px;
	margin-top: 10px;
	margin-bottom: 20px;	
}

footer .quickbar a:hover {
	background-position: center 5px;
}

footer .quickbar a.user {
	background-image: url("/img/icons/user.png");
}

footer .quickbar a.coop {
	background-image: url("/img/icons/coop.png");
}
footer .quickbar a.comm {
	background-image: url("/img/icons/comm.png");
}
footer .quickbar a.creative {
	background-image: url("/img/icons/creative.png");
}
footer .quickbar a.assessment {
	background-image: url("/img/icons/assessment.png");
}
footer .quickbar a.portfolio {
	background-image: url("/img/icons/portfolio.png");
}
footer .quickbar a.contact {
	background-image: url("/img/icons/contact.png");
}

footer ul {
	display: inline-block;
	vertical-align: top;
	margin-top: 20px;
	margin-bottom: 30px;
	width: 183px;
}


footer ul li:FIRST-CHILD {
	font-weight: bold;
}

footer ul li {
	list-style: none;
	font-weight: normal;
}

footer .end {
	background-color: #FFF;
	padding-bottom: 80px;
}

footer .end .copyright {
	line-height: 24px;
	margin-top: 30px;
	float: left;
}

footer .end img.faz_logo_foot {
	float: right;
}

@media( max-width:768px ){
		
}

@media ( min-width : 1152px) {
	#sidebar {
		display: block;
	}
	.navbar-toggle {
		display: none;
	}
}

/**
 * Kompetenzen
 */

.competence_bg  {
	background-color: #2b4878;
}

body.cooperation .competence_bg, .cooperation_bg  {
	background-color: #3a609f;
}

body.communication .competence_bg, .communication_bg  {
	background-color: #7e9dd3;
}

body.assessment .competence_bg, .assessment_bg  {
	background-color: #2c4878;
}

body.creativity .competence_bg, .creativity_bg  {
	background-color: #1d3050;
}

body.competence1 .competence_bg, .competence1_bg {
	background-color: #550C7A;
}

body.competence2 .competence_bg, .competence2_bg {
	background-color: #00B294;
}


.competence_color  {
	color: #2b4878;
}

body.cooperation .competence_color  {
	color: #3a609f;
}

body.communication .competence_color  {
	color: #7e9dd3;
}

body.assessment .competence_color  {
	color: #2c4878;
}

body.creativity .competence_color  {
	color: #1d3050;
}

body.competence1 .competence_color {
	color: #550C7A;
}

body.competence2 .competence_color {
	color: #00B294;
}


body.cooperation .box.knowledgetest > .head,
body.cooperation .box > .head {
	background-color: #3a609f;
}
body.cooperation .box.knowledgetest .btn-primary {
	background-color: #3a609f !important;
}

body.communication .box.knowledgetest > .head,
body.communication .box > .head {
	background-color: #7e9dd3;
}
body.communication .box.knowledgetest .btn-primary {
	background-color: #7e9dd3 !important;
}

body.assessment .box.knowledgetest > .head,
body.assessment .box > .head {
	background-color: #2c4878;
}
body.assessment .box.knowledgetest .btn-primary {
	background-color: #7e9dd3 !important;
}

body.creativity .box.knowledgetest > .head,
body.creativity .box > .head {
	background-color: #1d3050;
}
body.creativity .box.knowledgetest .btn-primary {
	background-color: #1d3050 !important;
}



body.competence1 .box > .head {
	background-color: #550C7A;
}

body.competence2 .box > .head {
	background-color: #00B294;
}

/* NAVIGATION COLORS */
.navbar-static-top,
.nav.navbar-nav {
	width: 100%;
	max-width: 1120px;
}
.nav.navbar-nav li:last-child {
	float: right;
}


#sidebar ul.navigation li a:hover {
	color: #ed1953 !important;
}
#sidebar ul.navigation li.active a:hover {
	color: #ffffff !important;
}
#sidebar ul.navigation li.active li:not(.active) a:hover {
	color: #ed1953 !important;
}
#sidebar ul.navigation li.active li.active a:hover {
	color: #211b3d !important;
}

#sidebar ul.navigation li a div.arrow {
	display: none;
}

#sidebar ul.navigation li.cooperation {
	border-bottom: 1px solid #211b3d;
}

#sidebar ul.navigation li.cooperation a {
	color: #211b3d;
}

#sidebar ul.navigation li.active.cooperation {
	background-color: #211b3d;
}

#sidebar ul.navigation li.cooperation ul li.active a {
	color: #211b3d;
}

#sidebar ul.navigation li.cooperation a div.arrow {
	background-image: url('../img/competences/icons/arrow-1-big.png');
}

#sidebar ul.navigation li.communication {
	border-bottom: 1px solid #211b3d;
}

#sidebar ul.navigation li.communication a {
	color: #211b3d;
}

#sidebar ul.navigation li.active.communication {
	background-color: #211b3d;
}

#sidebar ul.navigation li.communication ul li.active a {
	color: #211b3d;
}

#sidebar ul.navigation li.communication a div.arrow {
	background-image: url('../img/competences/icons/arrow-2-big.png');
}

#sidebar ul.navigation li.creativity {
	border-bottom: 1px solid #211b3d;
}

#sidebar ul.navigation li.creativity a {
	color: #211b3d;
}

#sidebar ul.navigation li.active.creativity {
	background-color: #211b3d;
}

#sidebar ul.navigation li.creativity ul li.active a {
	color: #211b3d;
}

#sidebar ul.navigation li.creativity a div.arrow {
	background-image: url('../img/competences/icons/arrow-4-big.png');
}

#sidebar ul.navigation li.assessment {
	border-bottom: 1px solid #211b3d;
}

#sidebar ul.navigation li.assessment a {
	color: #211b3d;
}

#sidebar ul.navigation li.active.assessment {
	background-color: #211b3d;
}

#sidebar ul.navigation li.assessment ul li.active a {
	color: #211b3d;
}

#sidebar ul.navigation li.assessment a div.arrow {
	background-image: url('../img/competences/icons/arrow-3-big.png');
}

/**
 * WEITERE KOMPETENZEN
 */

#sidebar ul.navigation li.competence1 {
	border-bottom: 1px solid #550C7A;
}

#sidebar ul.navigation li.competence1 a {
	color: #550C7A;
}

#sidebar ul.navigation li.active.competence1 {
	background-color: #550C7A;
}

#sidebar ul.navigation li.competence1 ul li.active a {
	color: #550C7A;
}

#sidebar ul.navigation li.competence1 a div.arrow {
	background-image: url('../img/competences/icons/arrow-competence1-big.png');
}


#sidebar ul.navigation li.competence2 {
	border-bottom: 1px solid #00B294;
}

#sidebar ul.navigation li.competence2 a {
	color: #00B294;
}

#sidebar ul.navigation li.active.competence2 {
	background-color: #00B294;
}

#sidebar ul.navigation li.competence2 ul li.active a {
	color: #00B294;
}

#sidebar ul.navigation li.competence2 a div.arrow {
	background-image: url('../img/competences/icons/arrow-competence2-big.png');
}

/**
 * ALLGEMEINWISSEN
 */
#sidebar ul.navigation li.basicknowledge {
	border-bottom: 1px solid #ed1953;
}

#sidebar ul.navigation li.basicknowledge a {
	color: #ed1953;
}

#sidebar ul.navigation li.active.basicknowledge {
	background-color: #ed1953;
}

#sidebar ul.navigation li.basicknowledge ul li.active a {
	color: #ed1953;
}

#sidebar ul.navigation li.basicknowledge a div.arrow {
	background-image: url('../img/icons/arrow-yellow-big.png');
}

/**
 * SELBSTEINSCHAETZUNG
 */
#sidebar ul.navigation li.selfassessmentnav {
	border-bottom: 1px solid #2b4878;
}

#sidebar ul.navigation li.selfassessmentnav a {
	color: #2b4878;
}

#sidebar ul.navigation li.active.selfassessmentnav {
	background-color: #2b4878;
}

#sidebar ul.navigation li.selfassessmentnav ul li.active a {
	color: #2b4878;
}



/**
 * NAV COLORS END
 */

ul.errors {
	list-style-type: square;
	color: #C60000;
	padding-left: 16px;
	margin: 0px;
}

.form-group.error input[type='text'],
.form-group.error textarea,
.form-group.error input[type='password'] {
	border-color: #C60000;
}

.testResult {
	width: 416px;
	min-height: 100px;
	position: relative;
	color: #FFF;
	padding: 16px;
	padding-right: 195px;
}

.testResult > .title {
	margin-bottom: 6px;
}

.testResult > .date {
	font-size: 12px;
	position: absolute;
	right: 16px;
	top: 16px;
}

.testResult > .hook {
	background-image: url("../img/icons/hook-big.png");
	width: 91px;
	height: 62px;
	position: absolute;
	right: -50px;
	bottom: 16px;
}

body.cooperation .testResult > .hook {
	background-image: url("../img/icons/hook-1-big.png");	
}

body.communication .testResult > .hook {
	background-image: url("../img/icons/hook-2-big.png");	
}

body.creativity .testResult > .hook {
	background-image: url("../img/icons/hook-4-big.png");	
}

body.assessment .testResult > .hook {
	background-image: url("../img/icons/hook-3-big.png");	
}

.testResult > .points {
	position: absolute;
	right: 48px;
	bottom: 16px;
	font-family: 'ITCFranklinGothicW01-Bk 812656';
    font-size: 45px;
    line-height: 45px;
}

.testResult > .points > .from {
	display: inline;
    font-size: 24px;
    line-height: 24px;
}


.kleinBoxTitle{
    z-index: 0;
    color: white;
    font-size: 22px;
    padding: 10px 16px 10px 16px;
	position: relative;
	font-family: decorRegular;
}
.kleinBoxTitle.orangeCls.cleanCls.circlCls {
	font-family: regular;
}



.kleinBoxTitle .points {
    font-size: 36px;
    position: absolute;
    right: 29px;
    text-align: center;
    top: 27px;
    width: 60px;
}

.kleinBoxTitle canvas {
	position: absolute;
    right: 20px;
    top: 12px;	
}

.competenceCls{
    float: right;
    margin-top: 20px;
}

.imgCls-cooperation,
.imgCls-communication,
.imgCls-assessment,
.imgCls-creativity {
	background-color: white;
	position: relative;
}


.home.imgCls-cooperation:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	top: 0px;
	width: 135px;
	height: 135px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/1.png');
}

.home.imgCls-communication:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	top: 0px;
	width: 135px;
	height: 135px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/2.png');
}

.home.imgCls-assessment:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	top: 0px;
	width: 135px;
	height: 135px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/3.png');
}

.home.imgCls-creativity:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	top: 0px;
	width: 135px;
	height: 135px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/4.png');
}

.home.imgCls-competence1:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	top: 0px;
	width: 135px;
	height: 135px;
	background-size: contain;
	background-position: bottom right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/5.png');
}

.imgCls-cooperation:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	bottom:5px;
	width: 100px;
	height: 100px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/1.png');
}

.home.imgCls-cooperation:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	top: 0px;
	width: 135px;
	height: 135px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/1.png');
}

.imgCls-communication:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	bottom:5px;
	width: 100px;
	height: 100px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/2.png');
}

.imgCls-assessment:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	bottom:5px;
	width: 100px;
	height: 100px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/3.png');
}

.imgCls-creativity:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	bottom:5px;
	width: 100px;
	height: 100px;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/4.png');
}

.imgCls-competence1:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	bottom:5px;
	width: 100px;
	height: 100px;
	background-size: contain;
	background-position: bottom right;
	background-repeat: no-repeat;
	background-image: url('/img/competences/icons/5.png');
}

.imgCls-competence1 {
	background-color: white;
	position: relative;
}
.imgCls-competence2 {
    background-color: white;
    position: relative;
}
.imgCls-competence2:after {
	content: " ";
	display: block;
	position: absolute;
	right: 5px;
	bottom: 5px;
	width: 100px;
	height: 100px;
	background-size: contain;
	background-position: bottom right;
	background-repeat: no-repeat;
	background-image:url('/img/competences/icons/14.png');
}

.kleinBoxText{
    position: relative;
    z-index: 1;
    margin-top: 6px;
    background-color: #f6f6f6;
    padding: 16px 16px 16px 16px;
    min-height: 250px;
}   

.kleinBoxText1{
    position: relative;
    z-index: 1;
    margin-top: 6px;
    background-color: #f6f6f6;
    padding: 16px 16px 16px 16px;
    min-height: 276px;
}

.abstCls {
    margin-top: 20px;
}

.aktiveAufgaben  {
    padding-bottom: 10px;
    min-height: 300px;
    background-color: #f6f6f6;
    float: left;
    margin-bottom: 16px;
}

.aktiveAufgabenTitle  {
    height: 10%;
    color: white;
    background-color: #2b4878;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    font-size: 24px;
	font-family: decorRegular;
}

.aktiveAufgabenLeft {
    width: calc(50% - 10px);
    padding-top: 30px;
    height: 90%;
    float: left;
    background-color: #f6f6f6;
}

.aktiveAufgabenRight {
   
    height: 90%;
    float: right;
    background-color:  #f6f6f6;
    padding-top: 30px;
}

.boxPortfolio{
    position: absolute;
    margin-top: 10px;
}

.bxLinkFx{
    padding-left: 0px!important;
}

.subTitleAktiveAufgaben {
    padding-bottom: 10px;
    padding-left: 10px;
    color: #666;
	font-family: decorRegular;
	font-size: 12px;
}

ul.currentTasks {
    list-style: square;
    padding-left: 25px;
}

ul.currentTasks li {
    padding-bottom: 10px;
}
ul.currentTasks li a {
	display: block;	
    font-size: 15px;
    text-decoration: underline;
    color: #666;
}

ul.currentTasks li a span.headline {
	display: block;	
}

ul.currentTasks li span.description {
	display: block;	
}
.currentTasks .headline {
	font-family: decorRegular;
}

.currentTasks li.communication {
    color: #110a34;
}

.currentTasks li.communication .headline {
    color: #110a34;
}

.currentTasks li.cooperation {
    color: #110a34;
}

.currentTasks li.cooperation .headline  {
    color: #110a34;
}

.currentTasks li.assessment {
    color: #110a34;
}

.currentTasks li.assessment .headline {
    color: #110a34;
}

.currentTasks li.creativity {
    color: #110a34;
}

.currentTasks li.creativity .headline {
    color: #110a34;
}

.currentTasks li.competence1 {
    color: #110a34;
}

.currentTasks li.competence1 .headline {
    color: #110a34;
}

.currentTasks li.competence2 {
    color: #110a34;
}

.currentTasks li.competence2 .headline {
    color: #110a34;
}

.calendar {
	background-color: #e9e7e2;
	padding: 16px;
	padding-right: 20px;
	padding-bottom: 8px;	
	width: 367px;
	position: relative;	
	color: #666;
}

.calendar .arrowLeft {
	cursor: pointer;
	position: absolute;
	top: 26px;
	left: 98px;
}

.calendar .arrowRight {
	cursor: pointer;
	position: absolute;	
	top: 26px;
	right: 4px;
}

.calendar .labels {
	display:inline-block;
	vertical-align: top;
	border-right: 1px solid #FFF;
	width: 100px;
}

.calendar .labels .top {
	border-bottom: 1px solid #FFF;	
	height: 34px;
}

.calendar .labels .competence {
	height: 22px;
	padding-top: 2px;	
	padding-right: 4px;
	font-size: 12px;
}

.calendar .weeks {
	vertical-align: top;
	display: inline-block;
	width: 231px;
	overflow: hidden;
	padding-bottom: 8px;
}

.calendar .weeks .weeksContainer {
	display: table;
	position: relative;	
}

.calendar .weeks .weeksContainer .week {
	display: table-cell;
	border-right: 1px solid #FFF;
}

.calendar .weeks .weeksContainer .week.current {
	border-right: 1px solid #2b4878;
	border-left: 1px solid #2b4878;
	background-color: #FFF;	
}

.calendar .weeks .weeksContainer .week .top.tooltip {
	border-bottom-color: transparent;
}

.calendar .weeks .weeksContainer .week .top {
	border-bottom: 1px solid #FFF;
	font-size: 12px;
	text-align: center;
	height: 34px;
}

.calendar .weeks .weeksContainer .week.current .top {
	background-color: #2b4878;
	border-bottom: 1px solid #2b4878;	
	color: #FFF;
}

.calendar .weeks .weeksContainer .week .weekRow {
	opacity: 0.15;
	height: 22px;
	width: 32px;
	padding: 0 4px;
}

.calendar .weeks .weeksContainer .week.current .weekRow {
	width: 31px;
}

.calendar .weeks .weeksContainer .week .weekRow.active {
	opacity: 1;	
	cursor: pointer;
}


.blueCls {
    background-color: #7e9dd3;
}

.dunkleBlueCls {
    background-color: #130c37;
}

.orangeCls {
    background-color: #3a609f;
     background-image: none;
}

.greenCls {
    background-color: #2c4878;
}

.purpleCls {
    background-color: #1d3050;
}

.communication .kleinBoxTitle {
    background-color: #7e9dd3;
    padding-left: 16px;
}

.cooperation .kleinBoxTitle {
    background-color: #3a609f;
    padding-left: 16px;
}

.assessment .kleinBoxTitle {
    background-color: #1d3050;
    padding-left: 16px;
}

.creativity .kleinBoxTitle {
    background-color: #2c4878;
    padding-left: 16px;
}

.competence1 .kleinBoxTitle {
    background-color: #550C7A;
    padding-left: 16px;
}

.competence2 .kleinBoxTitle {
    background-color: #00b294;
    padding-left: 16px;
}

form .form-stars {
	cursor: pointer;
}

.form-stars {
	min-height: 22px;
}

.form-stars .star {
	background-image: url('../img/icons/star_grey.png');
	background-repeat: no-repeat;
	width: 18px;
	height: 18px;
	display: inline-block;
	vertical-align: middle;
	transition: all 200ms ease 0s;
}

.form-stars .star.highlight {
	transform: scale(1.3);	
}

.form-stars .starDescription {
	margin-left: 10px;
	font-weight: bold;
	display: inline-block;
	vertical-align: middle;	
}


.cooperation .form-stars .star.active {
	background-image: url('../img/competences/icons/star-1.png');
}

.communication .form-stars .star.active {
	background-image: url('../img/competences/icons/star-2.png');
}

.assessment .form-stars .star.active {
	background-image: url('../img/competences/icons/star-4.png');
}

.creativity .form-stars .star.active {
	background-image: url('../img/competences/icons/star-3.png');
}

.competence1 .form-stars .star.active {
	background-image: url('../img/competences/icons/star-competence1.png');
}

.competence2 .form-stars .star.active {
	background-image: url('../img/competences/icons/star-competence2.png');
}


.assessmentTopic {
	margin-bottom: 16px;
}

.assessmentTopic .form-stars {
	display: inline-block;
	vertical-align: text-bottom;	
}

.assessmentTopic .title {
	font-weight: bold;
	display: inline-block;
	margin-left: 10px;
	vertical-align: middle;	
}

.assessmentTopic .date {
	display: inline-block;
	margin-left: 10px;
	color: #999;
	vertical-align: middle;	
}

.assessmentTopic .from {
	font-size: 12px;
	color: #999;
}

span.communication {
/*    margin-left: 10px;*/
    padding: 2px 7px 2px 7px;
    background-color: #7e9dd3;
    color: white;
    
}

span.cooperation  {
/*    margin-left: 10px;*/
    padding: 2px 7px 2px 7px;
    background-color: #3a609f;  
    color: white;
}

span.boxLink.allgemeineWissenColor  {
    left: 10px;
    margin-top: 20px;
    padding: 2px 7px 2px 7px;
}


span.assessment {
/*    margin-left: 10px;*/
    padding: 2px 7px 2px 7px;
    background-color: #1d3050;
    color: white;
}

span.assessment a:hover {
    color: white;
}
span.communication a:hover {
    color: white;
}
span.cooperation a:hover {
    color: white;
}
span.creativity a:hover {
    color: white;
}

span.creativity  {    
    color: white;
/*    margin-left: 10px;*/
    padding: 2px 7px 2px 7px;
    background-color: #2c4878;
}

.allgemeineWissen {
    margin-top:6px;
    clear: both;
    float:left;
    background-color: #f6f6f6;
}
.assessmentDialogButton
{
    position: absolute;
    left: 10px;
    bottom: 20px;
}

.allgemeineWissenHeader {
    background-color: #e51747;
    font-size: 17px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    font-size: 17px;
    height: 10%;
    color: white;
    min-width:  25%;
    width:  25%;
    clear: both;
}

.allgemeineWissenLeft {
    padding: 16px;
    width: 50%;
    height: 90%;
    float: left;
    background-color: #f6f6f6;
    
}

.allgemeineWissenRight {
    
    overflow: visible;
    width: 50%;
    float: right;
    background-color:  #f6f6f6;
    padding: 16px 0 16px 16px;
}

.allgemeineWissenColor {
    background-color: #e51747;
}

.allgemeineWissenLinkSpan {
    color: white;
}

.arrowLink {
    margin-top: -3px;
}

.boxLink {
    border: 0px;
    padding: 1px 5px 1px 5px;
    color: white;
    font-size: 13px;
}

.mineHint{
    margin-top: 10px;
}

.circlCls {
    background-repeat: no-repeat;
    background-position: 250px center;
    background-size: 83px 81px;
    background-image:url('/img/transparentCircle.png');
}

a.boxLink:hover {
    text-decoration: none;
    color: white;
}


.untenBoxTitle {
	position: relative;
    margin-top: 5px;
    font-size: 16px;
	font-family: decorMedium;
}

.subTitleSelbst{
    font-size: 28px;   
    font-family: dekoBold;
    
}

.subSubTitleSelbst{
    font-family: regular;
}

.selbstIndexText{
    font-family: 'ITCFranklinGothicW01-Bk 812656';
}

.untenBoxSubTitle {
    margin-top: 5px;
    font-size: 11px;
}

.untenColor-cooperation {
    width: 160px;
    background-color: #99b0d0;
    height: 7px;
}

.untenColor-communication {
    width: 160px;	
    background-color: #3d4d67;
    height: 7px;
}
.untenColor-communication .obenColor {
background-color: #010004;
}

.untenColor-creativity {
    width: 160px;	
    background-color: #97a2c0;
    height: 7px;
}

.untenColor-assessment {
    width: 160px;	
    background-color: #8b99a2;
    height: 7px;
}

.obenColor {
    background-color: white;
    height: 7px;
}

.cleanCls {
    padding-bottom: 10px;
}

.laptopHolder {
    
    background-color: #efefef;
    float: right;
    padding: 16px 0 0 0;
    margin: -16px 0 0 0;
}

.laptopCls {
    float: right;
}

.laptopColor {
    background-color: #efefef;
}

.headerBack {
    width: 736px;
    margin-left: 0px;
    background-repeat: no-repeat;
    background-position:center center;
    background-size: 736px 294px;
    height: 294px;
    width: 736px;
    background-image:url('/mediabase/img/883.png');
}

.leftSide {
    color: white;
    padding: 0;
    height: 110px;
    z-index: 1;
    text-align: right;
}

.rightSide {
    border-left: 1px solid white;
    padding: 16px;
    width: 306.5px;
    color: white;
    font-size: 13px;
    height: 110px;
    z-index: 1;
}

.headlineLeft {
    height: 110px;
    width: 300px;
    float: left;
}

.headlineLeftDate {
    margin-right: 20px;
    width: 100px;
    height: 110px;
    float:right;
}

.point{
    cursor: pointer;
}

.headlineLeftDate .big {
    font-family: 'ITCFranklinGothicW01-Bk 812656';
    padding: 0px;
    line-height: 120px;
    font-size: 120px;
}

.headlineLeftDate .big .small{
    
    font-family: 'ITCFranklinGothicW01-Bk 812656';
    font-size: 15px;
}

.headlineSi {
    border-bottom: 1px solid white;
    margin-top: 15px;
    width: 300px;
    text-align: right;
}

.sub_headline {
    font-size: 10px;
    text-align: left;
    width: 100%;
    margin-left: 15px;	
    margin-top: 10px;
}

.img_header {
    z-index: 1;
    margin-top: 30px;
    display: block;
}

.img_headline {
    color: white;
    width: 150px;
}

.img_sub_headline {
    color: white;
    font-size: 13px;
    width: 220px;
    margin-bottom: 10px; 
}

.headlineSelbstUnten{
   font-size: 15px;
   color: #2b4878;
}

.subHeadlineSelbstUnten {
    color: #2b4878;
    font-weight: bold;
}

.rowFix {
     width: 737px;
     margin: 0px;
}

.textAlign {
    padding: 10px 0 0 18px;
}

.chipsPic {
    margin-top: -2px;
    background-repeat: no-repeat;
    background-position:center center;
    background-size: 288px 334px;
    height: 334px;
    width: 288px;
    background-image:url('/img/competences/icons/chps.png'); 
}

.selbstEinscaetzungLeft {
    margin-top: -2px;
}

.bottomCls {
    margin-top: 206px;
}

.textAlignChps {
    width: 250px;
    padding: 10px 0 0 10px;
}

.circlCls1 {
    text-align: right;
    margin-top: 10px;
}


.startseiteLoginHeader {
    background-repeat: no-repeat;
    background-position:center center;
    background-size: cover;
    padding: 0px;
    margin: 0 0 0 0;
    height: 446px;
    width: 100%;
    background-image:url('/img/competences/teaser/Header_Startseite_1180x470.jpg');
}

.startseiteLoginHeader h1 {
	font-size: 46px;
}
.startseiteLoginHeader h2 {
	font-size: 18px;
	margin: 5px 0px 15px 0px;
}

.Titelpersonen_freigestellt{
   margin-top : -1px;
}

.startSeiteHeader{
    color: white;
    font-size: 18px;
    padding: 7px 16px 6px 16px;
}

.startSeiteHeader1{
    color: white;
    font-size: 26px;
    padding: 7px 16px 7px 16px;
    line-height: 44px;
}

.startSeiteFooter {
    background-color: #e51747;
    font-size: 26px;
    color: white;
    float: left;
    padding: 10px 16px 10px 16px;
}
.imgContainer{
    width: 100%;
    background-color: white;
}

.nav_1 {
    border: 0px!important;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin-bottom: 0px!important;
}

.startSeiteFooterText {
    float: left;
    clear: both;
    width: 300px;
    margin-top: 10px;
}

.startSeiteFooterImg {

}
.alignDiv{
    text-align: center;
}

.boxLinkStartSeite{
    margin-left: -5px;
}

.loginBox{
    float: right;
    margin-right: 45px;
    margin-top: 45px;
    width: 300px;
}
.loginHeader {
    display: inline;
    color: white;
    font-size: 20px;
    padding: 7px 16px 7px 16px;
	font-family: decorBold;
}
.loginBox .inputField input {
	margin-top: 0px;
	margin-bottom: 7.5px;
	width: 100%;
}

.loginForm {
    margin-top: 8px;
    padding: 15px;
    background-color: rgba(255, 255, 255, 0.6);
}

.inputField input{
    margin-top: 10px;
    padding: 5px;
    font-size: 18px;
    border: 0px;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #2b4878;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #2b4878;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #2b4878;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #2b4878;
}


.anmeldenBtn{
}

.anmeldenBtn button{
    margin-top: 15px;
    padding: 5px 10px 5px 10px;
    border: 0px;
    background: none;
}

.registrierenBtn {
    color: #2b4878;
    font-size: 14px;
    float: right;
    margin-right: 0px;
    text-decoration: underline;
    font-weight: bold;
}

/* .activeClickable path {
	cursor: pointer;
}

 .activeClickable text {
    cursor: pointer;
<<<<<<< HEAD
}

#chart {
	overflow: hidden;
}

=======
}*/

.con {
	position: relative;
	margin-top: -35px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	margin-left: 115px;
	margin-bottom: -15px;
	overflow:hidden;
	display:inline-block;
	width:250px;
	height:250px;
}

.gZahl {
    margin-left: 48px;
    top: 20px;
    position: absolute;
    width: 100px;
    height: 150px;
    float: left;
}


.zahl {
    font-size: 25px;
    color: #3a609f;
}

.grZahl {
    font-size: 55px;
    line-height: 70px;
    font-family: decorMedium;
    margin-left: -5px;
    
}

.kompetenz {
    color: #3a609f;
}

#sidebar #chart .kompetenz {
	display: block;
	background-color: #ffffff;
	line-height: 19px;
	position: absolute;
	top: -20px;
	padding: 0px 2px;
}

.bigLine {   
    margin-left: 45px;
    top: 20px;
    position: absolute;
    float: left;
    width: 195px;
    border-top: 1px solid #666666;
}

.littleLine {
    margin-left: 237px;
    top: 20px;
    position: absolute;
    float: left;
    height: 32px;
    width: 7px;
    background-image: url('/img/competences/icons/punkt.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size:7px 32px;
}

.transparentBall {
    top: 20px;
    margin-left: 187px;
    position: absolute;
    float: left;
    width: 17px;
    height: 17px;
    background-image: url('/img/competences/icons/transparent.png');
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size:17px 17px;
}

#popUp {
    z-index: 1000;
    position: absolute;
    width: 700px;
    height: 700px;
    background-color: #e3e3e3;
    top: 200px;
    left: 200px;
}

/*.pieChart1 text {
    cursor: pointer;
}

.pieChart1 path{
	cursor: pointer;
}*/

.con1 {
	position: relative;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	overflow:hidden;
	display:inline-block;
	width:500px;
        float: right;
        margin-right: -10px;
	height:500px;
        top: 90px;
        bottom: 10px;
}

.gZahl1 {
    margin-left: 85px;
    margin-top: 110px;
    position: absolute;
    width: 100px;
    height: 150px;
    float: left;
}



.zahl1 {
    font-size: 30px;
    color: #3a609f;
    margin-top: 50px;
    margin-left: 30px;
}

.grZahl1 {
    font-size: 73pt;
    line-height: 70px;
    font-family: decorRegular;
    
}

.kompetenz1 {
    font-size: 58pt;
    font-family: decorRegular;
    position: absolute;
    margin-top: 5px;
    margin-left: 120px;
    line-height: 1;
    color: #3a609f;
}

.bigLine1 {   
    top: 90px;
    position: absolute;
    float: right;
    right: 256px;
    width: 725px;
    border-top: 1px solid #666666;
}

.littleLine1 {
    top: 90px;
    position: absolute;
    float: right;
    right: 255px;
    height: 195px;
    border-left: 1px solid #666666;

}

.transparentBall1 {
    top: 185px;
    right: -9px;
    position: absolute;
    float: right;
    width: 17px;
    height: 17px;
    background-image: url('/img/competences/icons/transparent.png');
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size:17px 17px;
}

.transparentBall1Mitte {
    top: 191px;
    right: -4px;
    position: absolute;
    float: right;
    width: 7px;
    height: 6px;
    background-image: url('/img/competences/icons/transparentMitte.png');
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size:7px 6px;
}


#dialog, #dialogGelb, #dialogAssessment{
    overflow: hidden;
}

#dialogAssessment{
    z-index: 1000;
    padding: 0px;
}

.ui-widget-overlay
{
  opacity: .85 !important; /* Make sure to change both of these, as IE only sees the second one */
  filter: Alpha(Opacity=85) !important;
  background-color: rgb(50, 50, 50) !important; /* This will make it darker */
}

.kompetenzImage {
    top: 23px;
    position: absolute;
    float: left;
}


.imgCls1-cooperation {
    background-color: white;
    background-repeat: no-repeat;
    background-position: right bottom;
    background-image:url('/img/competences/icons/cooperation.png');
}

.imgCls1-communication {
    background-color: white;
    background-repeat: no-repeat;
    background-position: right bottom;
    background-image:url('/img/competences/icons/communication.png');
}

.imgCls1-assessment {
    background-color: white;
    background-repeat: no-repeat;
    background-position: right bottom;
    background-image:url('/img/competences/icons/assessment.png');
}

.imgCls1-creativity {
    background-color: white;
    background-repeat: no-repeat;
    background-position: right bottom -1px;
    background-image:url('/img/competences/icons/creativity.png');
}


.imgGr-cooperation {
    margin-left: 25px;
    background-size: 90px 90px;
    width: 90px;
    height: 90px;
}

.imgGr-communication {
    margin-left: 25px;
    background-size: 90px 90px;
    width: 90px;
    height: 90px;
}

.imgGr-assessment {
    margin-left: 25px;
    background-size: 90px 90px;
    width: 90px;
    height: 90px;
}

.imgGr-creativity {
    margin-left: 25px;
    background-size: 90px 90px;
    width: 90px;
    height: 90px;
}

.detailansicht {
    border-bottom: 1px solid #666;
    margin-left: 48px;
    width: 288px;
    position: relative;
}

.auswertungAufgaben{
    margin-left: 120px;
    width: 480px;
    height: 300px;
    position: absolute;
    margin-top: 185px;
}

.auswertungAufgaben1{
    margin-left: 125px;
    width: 400px;
    height: 442px;
    position: absolute;
    margin-top: 200px;
}

.color-cooperation {
	color:  #3a609f;
}

.color-communication {
	color:  #7e9dd3;
}

.color-creativity {
	color:  #1d3050;
}

.color-assessment{
	color:  #2c4878;
}

.bg-cooperation {
	background-color:  #3a609f;
}

.bg-communication {
	background-color:  #7e9dd3;
}

.bg-creativity {
	background-color:  #1d3050;
}

.bg-assessment{
	background-color:  #2c4878;
}

.detailansicht a{
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
    margin: 0px auto;
    font-size: 16px;
    padding-left: 5px;
    color: #666;

}

.detailansicht img {
    	cursor: pointer;
}

#chart div {
    margin-bottom: -45px;
}

.aufgabenListe {
    height: 150px;
    overflow: auto;
    width: 400px;
    position: relative;
    margin-bottom: 15px;
    margin-bttom: 5px;
}

.aufgabenListe div{
    clear: left;
}

.aufgabenListe1{
    width: 300px;
    font-size: 11px;
}
#dialog .aufgabenListe1 {
	width: 400px;
}

.sp3{
    margin-bottom: 10px;
}

.aufgabenListe12{
    height: 160px;
    overflow: auto;
    width: 400px;
    position: relative;
    margin-bottom: 15px;
}

.aufgabenListe12Container {
    height: 150px;
    overflow: hidden;
    width: 500px;
    margin-bottom: -15px;
}

.aufgabe{
    float: left;
/*    padding-top: 15px;*/
    width: 380px;
}

.linkCircle1{
    cursor: pointer;
}

.aufgabe1{
    float: left;
    padding-top: 5px;
    width: 325px;
}

.linkCircle , .linkCircleGelb{
    cursor: pointer;
}

.asdf{
    margin-bottom: 2px;
    margin-right: 10px;
}

.punkte {
    font-family: 'ITCFranklinGothicW01-Bk 812656';
    line-height: 3px;
    font-size: 54px;
    float: right;
}
.aufgabenListe .punkte,
.auswertungAufgaben .punkte {
	font-size: 22px;
}

.aufgabenListe .aufgabe,
.auswertungAufgaben .aufgabe {
	width: 100%;
}


.smallPkt{
    
    font-size: 20px;
}

.selbstPunkte{
    max-height:200px;
    overflow: hidden;
    width: 500px;
    position: relative;
    margin-bottom: 15px;
}

.selbstPunkte div{
    margin-top: 0px;
    padding-bottom: 10px;
    clear: left;
}


.obenColor-cooperation {
    padding: 0px!important;
    width: 70px;
    background-color: #3a609f;
    height: 7px;
}
.obenColor-communication {
    padding: 0px!important;
    width: 70px;
    background-color: #7e9dd3;
    height: 7px;
}
.obenColor-creativity {
    padding: 0px!important;
    width: 70px;
    background-color: #1d3050;
    height: 7px;
}
.obenColor-assessment {
    padding: 0px!important;
    width: 70px;
    background-color: #2c4878;
    height: 7px;
}

.selbstPunkte div{
    padding: 0px!important;
}



.selbstPunkte .untenColor-cooperation {
    width: 288px;
}

.selbstPunkte .untenColor-communication {
    width: 288px;
}

.selbstPunkte .untenColor-creativity {
    width: 288px;
}

.selbstPunkte .untenColor-assessment {
    width: 288px;
}

.untenColor1-dunkle {
    margin-top: 10px!important;
    width: 240px;
    background-color: #e9e7e2;
    height: 7px;
}
.obenColor1-hell{
    margin-top: 10px;
    width: 150px;
    padding: 0px!important;
    background-color: #666666;
    height: 7px;
}

/*-------Gelb Rad----------*/

#conGelb {
        top: 90px;
        right: 40px;
	position: relative;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	overflow:hidden;
	display:inline-block;
	width:450px;
        float: right;
	height:450px;
}

#gZahlGelb {
    margin-left: 65px;
    margin-top: 95px;
    position: absolute;
    width: 100px;
    height: 150px;
    float: left;
}



#zahlGelb {
    font-size: 30px;
    color: #3a609f;
    margin-top: 50px;
    margin-left: 53px;
}

#grZahlGelb {
    font-size:73pt;
    line-height: 70px;
    font-family: decorRegular;
    
}

#kompetenzGelb {
    font-size: 55pt;
    font-family: decorRegular;
    position: absolute;
    margin-top: 5px;
    margin-left: 120px;
    line-height: 1;
    color: #3a609f;
}

#bigLineGelb {   
    top: 82px;
    position: absolute;
    float: right;
    right: 284px;
    width: 698px;
    border-top: 1px solid #666666;
}

#littleLineGelb {
    top: 82px;
    position: absolute;
    float: right;
    right: 283px;
    height: 42px;
    border-left: 1px solid #666666;
}

#transparentBallGelb {
    top: 32px;
    right: -9px;
    position: absolute;
    float: right;
    width: 17px;
    height: 17px;
    background-image: url('/img/competences/icons/transparent1.png');
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size:17px 17px;
}


#whiteCircle{
	position: relative;
	z-index: 1000;
}


.kompetenzrad {
    left: 45px;
    width: 80px;
    height: 77px;
    background-color: white;
    background-repeat: no-repeat;
    background-position: right bottom;
    background-image:url('/img/competences/icons/kompetenzrad.png');
}

.transparentBall1MitteGelb {
    top: 6px;
    right: 5px;
    position: absolute;
    float: right;
    width: 7px;
    height: 6px;
    background-image: url('/img/competences/icons/transparentMitte.png');
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size:7px 6px;
}

.colorGelb{
    color: #e51747;
}

.alGelb{
/*    height: 150px;*/
}

.graph {
    width: 500px;
    height: 170px;
}

.grElOdd:first-of-type {
    margin-left: 0;
}

.grElOdd {
    position: relative;
    width: 25px;
    height: 170px;
    float: left;
    margin-left: 20px;
}

.grElEven {
    position: relative;
    margin-left: 20px;
    width: 25px;
    height: 170px;
    float: left;
}

.pkt{
    position: absolute;
    bottom: 0;
    font-size: 9px;
    background-color: white;
    padding: 0 5px 0 0;
	width: 100%;
	text-align: center;
}

.ttl{
    font-size: 10px;
    padding-top: 5px;
    padding-left: 5px;
    width: 113px;
    height: 113px;
    position: absolute;
    transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    -o-transform: rotate(270deg);
   
}

.clrOdd{
    position: absolute;
    bottom: 0;
    background-color: #e51747;
    width: 25px;
    clear: both;
}

.clrEven{
    position: absolute;
    bottom: 0;
    background-color: #f5a4b7;
    width: 25px;
    clear: both;
}

    .selbstDiagramm{
        font-size: 9px;
        padding-bottom: 5px;
        padding-top: 10px;
        width: 288px;
    }
	#dialog .selbstDiagramm {
		width: 400px;
	}
	#dialog .sp1,
	#dialog .sp3{
		width: 400px !important;
	}


    #stark {
        float: right;
    }

    .headlinesPopUp{
        font-size: 18px;
        
    }

  .ui-tooltip, .arrow1:after {
      border: 0px;
      border-radius: 0px;
  }
  
  .ui-tooltip {
    z-index: 1000;
    background-color: #666;
    border-radius: 0px;
    padding: 2px 4px;
    color: white;
    font: 12px "Helvetica Neue", Sans-Serif;
  }

  
  .arrow1 {
    width: 70px;
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    margin-left: -35px;
    bottom: -16px;
  }
  
  .arrow1.top {
    top: -16px;
    bottom: auto;
  }
  
  .arrow1.left {
    left: 50%;
  }
  
  .arrow1:after {
    background-color: #666;
    content: "";
    position: absolute;
    left: 30px;
    top: -12px;
    width: 15px;
    height: 15px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    tranform: rotate(45deg);
  }
  .arrow1.top:after {
    bottom: -20px;
    top: auto;
  }
  
.cooperationTool {
	background-color: #3a609f;
        background-image: none;
}

.communicationTool {
	background-color: #7e9dd3;
        background-image: none;
}

.assessmentTool {
	background-color: #2c4878;
        background-image: none;
}

.creativityTool {
	background-color: #1d3050;
        bakcground-image: none;
}

#assessmentDialogLeft {
    color: white;
    padding: 16px 20px 16px 10px;
    width: 434px;
    height: 403px; 
    float: left;
    border-right: 0.5px solid white;
    background-color: #666;
}

#assessmentDialogRight {
    color: white;
    padding: 16px 20px 16px 10px;
    width: 301px;
    height: 403px;
    float: right;
    background-color: #666;
}

#assessmentDialogRight span {
    font-weight: bold;
}



#myLeftCanvas_1 label {  
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding-left: 25px;  
    margin-right: 15px;  
    font-size: 13px;  
}  

#myLeftCanvas_1 input[type=radio] {  
    display: none;  
}  

 #myLeftCanvas_1 label:before {  
    content: "";  
    display: inline-block;  
  
    width: 16px;  
    height: 16px;  
  
    margin-right: 10px;  
    position: absolute;  
    left: 0;  
    bottom: 1px;  
    background-color: #aaa;  
/*    box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .3), 0px 1px 0px 0px rgba(255, 255, 255, .8);  */
}  

#myLeftCanvas_1  label:before {  
    border-radius: 8px;  
} 

#myLeftCanvas_1  input[type=radio]:checked + label:before {  
    content: "\2022";   
    font-size: 22px;  
    text-align: center;  
    line-height: 14px;  
} 

#myLeftCanvas_1  input[type=radio]:checked + label.cooperation:before {  
    color:  #3a609f;
}

#myLeftCanvas_1  input[type=radio]:checked + label.communication:before {  
    color: #7e9dd3;
}

#myLeftCanvas_1  input[type=radio]:checked + label.assessment:before {  
    color: #2c4878;
}

#myLeftCanvas_1  input[type=radio]:checked + label.creativity:before {  
    color: #1d3050;
}

#assessmentDialogLeft a {
    position: absolute;
    color: white;
    padding-bottom: 16px;
    bottom: 0px;
    text-decoration: none;
    outline: 0;
}


#question{
    margin-bottom: 18px;
}

.dialogAssessmentRight{
    border: 1px solid #666; 
    width: 301px;
    height: 303px;
    float: right; 
    background-color: #f6f6f6;
}

.dialogAssessmentLeft{
    padding: 10px;
    border: 1px solid #666;
    border-right: 1px solid white; 
    width: 435px;
    height: 303px;
    background-color: #ffffff;
}

.dialogAssessmentErgebnis{
    padding: 17px 0 0 10px;
    font-weight: bold;
}

.dialogAssessmentGraph{
    position: relative;
    width: 300px;
    height: 200px;
}

.dialogAssessmentWhiteLine{
    display: none;
    border-bottom: 1px solid white;
    width: 250px;
    margin-top: -57px;
    margin-left: 25px;
}

.headDiagramm1{
    width: 350px;
    height: 200px;
    position: absolute;
    top: 190px;
    right: 0px;
    z-index: 0;
}

.headDiagramm1Title{
    width: 285px;
    font-size: 20px;
    color: white;
    height: 30px;
    position: absolute;
    top: 122px;
    right: 0px;
	font-family: decorRegular;
}

.headDiagramm1Frage {
    width: 280px;
    font-size: 14px;
    color: white;
    height: 30px;
    position: absolute;
    top: 147px;
    right: 5px;
}

.headDiagramm1Link {
    bottom: 10px; 
    position: absolute;
    z-index: 2;
    width: 285px; 
    right: 0px;
}

#dialog{
    height: 650px!important;
}

#dialogGelb{
    height: 600px!important;
}

.headDiagramm1Link a:focus, a:active,a:visited,a:link,a:hover,a:active{
	text-decoration: none;
	outline: 0;
}

footer a:focus, footer  a:active, footer a:visited, footer a:link, footer a:hover, footer a:active{
	color: white;
}

#myLeftCanvas_11{
    width: 355px!important;
}

.headerViewLine{
    border-bottom: 1px solid white;
    width: 273px;
    position: absolute;
    right: 10px;
    top: 430px;
    display: none;
    height: 1px;
}

.blitzumfrageBtn{
    margin-left: 5px;
}