/*
################################################################
	##### Global Layout #####
################################################################
*/
/* DEPRECATED rcc style plugin 25.9.20
:focus
{
	outline: none;
}
*/
/* DEPRECATED rcc style plugin 25.9.20 */
h1_OFF
{
	color: #a00057;
	font-family: "Verdana", sans-serif;
	font-size: 24px;
	line-height: 31px;
	font-style: normal;
	display: block;
	margin-top: 35px;
	margin-bottom: 15px;
}

@media (max-width: 768px) {
	h1_OFF
	{
		font-size: 22px;
		line-height: 26px;
	}
}

/* DEPRECATED rcc style plugin 25.9.20 */
h2_OFF
{
	color: #415e6c;
	font-family: "Verdana", sans-serif;
	font-size: 13px;
	font-weight: bold;
	font-style: normal;
	display: block;
	margin-top: 5px;
	margin-bottom: 15px;
	line-height: 22px;
}

h3_OFF
{
	color: #415e6c;
	font-family: "Verdana", sans-serif;
	font-size: 12px;
	font-weight: bold;
	font-style: normal;
	display: block;
	margin-top: 5px;
	margin-bottom: 5px;
}

.contentWrap-border
{
	padding: 0;
	min-height: 600px;
}

.noPadding
{
	padding: 0;
}

.onePxPadding
{
	padding-right: 1px;
	padding-left: 1px;
}

.fivePxPadding
{
	padding-right: 5px;
	padding-left: 5px;
}

.fivePxPaddingAllDirections
{
	padding: 5px;
}

.tenPxPaddingAllDirections
{
  padding: 10px;
  border-bottom: 2px solid #fff;
}

.paddingRight
{
	padding-right: 30px;
}

.firstElementFromTop
{
	margin-top: 35px;
}

.firstElementFromTop.withH1
{
	margin-top: 25px;
}

.navbar-collapse
{
	border-top: 0px;
}

.hsluCheckColor
{
  color: #fff;
  background-color: #3c9b1b;
}

.hsluTimesColor
{
    border: #a20058 1px solid;
    background-color: #fff;
    width: 26px;
    text-align: center;

}

.hsluTimesColor:before {
  content: "•••";
}

.master-column-left
{
	margin-left: 30px;
	padding-left: 0;
	padding-right: 0;
	width: 19%;
}
.master-column-left.layout-2-b
{
	width: 13%;
}

body.phone .master-column-left,
body.phone .master-column-left.layout-2-b
{
	width: 100%;
	margin-left: 0px;
}



.statusIcon {
  border-radius: 50%;
}

/* 26.3.17:
- in responsive polishing, this is wrong.
- it is needed in 3 column layout.
.master-column-right
{
	x/x*x margin-left: 30px; x*x/x
	position: relative;
	left: 60.7%;
}
*/

/* 26.3.17:
- in responsive polishing, this is wrong.
- it is needed in 3 column layout.
.master-column-right.layout-2-a
{
	position: relative;
	left: 0;
}
*/

.master-column-right.layout-2-b
{
	left: 0;
}

.master-column-right.layout-2-b .col-news
{
	display: none;
	visibility: hidden;
}

body.top-1 .master-column-right.layout-2-b .jumper
{
	max-width: initial;
	width: initial;
}

_::-webkit-:not(:root:root), body.top-1 .master-column-right .jumper
{
  margin-left: 730px;
}

@media(max-width : 1200px)
{
  _::-webkit-:not(:root:root), body.top-1 .master-column-right .jumper
  {
    margin-left: 60%;
  }
}

.master-column-center
{
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right:0;
}
@media (min-width: 769px) {
	.master-column-center
	{
		padding-left: 45px;
	}
}
.master-column-center.layout-2-b
{
    padding-left: 20px;
}

.start-page .master-column-center
{
  padding: 0;
  padding-left: 45px;
}

body.phone .start-page .master-column-center
{
	padding: 0;
	margin: 0;
}

/* 26.3.17: in responsive polishing, this is wrong.
.master-column-center.layout-2-a
{
	padding-left: 30px;
	width: 80%;
	margin-right: 26px;
}
*/
input#subject-rcc
{
	font-family: "Arial Narrow", Arial, sans-serif;
}

.brand-block {
 margin-right: 0.5em;
 white-space: nowrap;
}

.brand-block > span {
  color: #fff;
    border-radius: 50%;
    display: inline-block;
    width: 0.85em;
    text-align: center;
    line-height: 0.7em;
    padding-bottom: 0.15em;
    background-color: #afca4f;
    text-indent: 0px;
    margin-right: 2px;
    font-size: 0.9em;
    position: relative;
    top: -2px;

    /* P. Hofer 7.8.17
    color: #fff;
    border-radius: 50%;
    display: inline-block;
    width: 0.8em;
    text-align: center;
  line-height: 0.65em;
    padding-bottom: 0.15em;
    background-color: #afca4f;
    text-indent: -3px;
    margin-right: 2px;
    */
}


.brand-relax
{
  color: rgb(175, 202, 79);
  box-sizing: border-box;
}

.brand-concentrate
{
  color: rgb(253, 199, 40);
  box-sizing: border-box;
}
.brand-concentrate > span {
  background-color: #fdc728;
}

.brand-create
{
  color: rgb(230, 0, 126);
  box-sizing: border-box;
}

.brand-create > span {
  background-color: #e6007e;
}


/*
Panel edits
 */

 /*********** New with accordion *******/

#diagram-control-widget-container > .panel > .panel-collapse > .panel-body
{
    padding: 0;
    margin: 0;
}

#diagram-control-widget-container > .panel
{
    padding: 0;
    margin: 0;
    border: 0;
}

#diagram-control-widget-container > .panel > .panel-heading
{
    background-color: #6a95a9;
    border-radius: 0;
    padding-top:5px;
    padding-bottom: 8px;
    padding-left: 5px;
    padding-right: 5px;
	border-top: 1px solid white;
}

#diagram-control-widget-container > .panel > .panel-collapse {
    border: 1px solid #6a95a9;
    padding: 2px 5px;
}

#diagram-control-widget-container > .panel > .panel-heading > .panel-title > a,
#diagram-control-widget-container > .panel > .panel-heading > .panel-title
{
    color: white;
}

/* The date picker must go upwards so it won't get cut at the lower end. */
#diagram-control-widget-container .datetator_picker {
	top: -200px !important;
	bottom: 30px px;
}

.panel-heading
{
	padding: 2px 5px;
}

.panel-group .panel
{
	border-radius: 0px;
}

.panel-default>.panel-heading
{
	background-color: transparent;
	border-color: #6a95a9;
}

.panel-title a
{
	text-decoration: none;
	color: #415e6c;
	font-weight: bold;
	font-size: 12px;
}
/*
Panel edits end
 */

/*
Button edits
 */


.btn-hsluDark /* extends bootstrap colors */
{
	background-color: #415e6c;
	color: #ffffff;
	transition: background-color 0.3s ease;
}

.btn-hsluDark:hover /* extends bootstrap colors */
{
	background-color: #a00057;
	color: #ffffff !important;
}

.btn-hsluDark:active,
.btn-hsluDark:focus
{
	color: #ffffff;
}

/* DEPRECATED 201022
.csc-textpic-text
{
    font-family: verdana;
}
*/

.csc-textpic-text p a,
.csc-textpic-text p a:hover,
.csc-textpic-text p a:visited,
.csc-textpic-text p a:active
{
       color: #a00057;
       text-decoration: none;
       font-weight: bold;
}


.btn-group-hsluLight
{
	background-color: #6a95a9;
	transition: color 0.3s ease;
}

.btn-group-hsluLight a,
.btn-group-hsluLight a:active
{
	transition: color 0.3s ease;
	color: #ffffff;
}

.btn-hsluLight /* extends bootstrap colors */
{
	background-color: #6a95a9;
	color: #ffffff;
	transition: color 0.3s ease;
}

.btn-hsluLight:hover /* extends bootstrap colors */
{
	color: #a00057 !important;
}

.btn-hsluLight:active,
.btn-hsluLight:focus
{
	color: #a00057;
}


.btn /* overrides bootstrap */
{
	font-size: 13.5px;
	border-radius: 18px;
	padding-top: 3px;
	padding-bottom: 3px;
}

.btn.focus, .btn:focus, .btn:hover
{
	color: #a00057;
}

.btn-hsluGrey
{
	background-color: #6a95a9 !important;
	color: #ffffff;
}

.btn-hsluToolButton
{
	border-radius: 0px !important;
	padding-left: 6px;
	padding-right: 6px;
}

.btn-hsluEditBtnGroup
{
	margin-bottom: 15px;
}

.btn-eckig
{
	border-radius: 0px;
}

.btn-group-round {
	border-radius: 20px; /* Sufficient until 40 px heigth. Usual is 27px height. */
}

/*
Button edits end
 */


.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari*/
     -khtml-user-select: none; /* Konqueror */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

/*
Input edits
 */

.form-control
{
	font-size: 13.5px;
	padding-top: 3px;
	padding-bottom: 3px;
	height: initial;
	border-color: #6a95a9;
}

.input-group-addon
{
	font-size: 13.5px;
	padding-top: 3px;
	padding-bottom: 3px;
	height: initial;
	color: #000000;
	border-color: #6a95a9;
	border-radius: 0px;
	background-color: transparent;
}

/*
Input edits end
 */

/*
Select edits
 */
.hsluSelect
{
	border-radius: 0px;
	border: 1px solid #6a95a9;
	padding: 0px 6px;
	height: auto;
}
/*
select edits end
 */

.dateBlock
{
	font-weight: normal;
	color: #000000;
	display: block;
    margin-bottom: 5px;
}
.rccNews
{
	position: relative;
	background-color: #cfd500;
	padding: 15px;
	font-weight: bold;
	margin-top: 2px;
	margin-bottom: 2px;
}

.rccNews header .rcc-message-close
{
	position: absolute;
	top: 0;
	right: 0;
	width: 20px;
	height: 20px;
	line-height: 20px;
	cursor: pointer;
}

.rccNews.message-system {
	line-height: 1.75rem;
}

.rccNews header .rcc-message-close:hover
{
	color: gray;
}

.rccNews header .rcc-message-close:before
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	line-height: inherit;
	font-family: FontAwesome;
	font-size: 14px;
  content: "\f00d";
	display: block;
}


/* new style 
.rccNews,
.rccDidacticalHint {
	background-color: #EBF4FD !important; x/x*x INFO LIGHT x*x/x
	color: #4792F7; x/x*x INFO DARK x*x/x
	font-weight: normal !important;
	position: relative;
}

.rccNews:after,
.rccDidacticalHint:after {
	position: absolute;
  left: -4px;
  top: -4px;
  width: 18px;
  height: 18px;
  border-radius: 9px;
  font-size: 11px;
  line-height: 19px;
  text-align: center;

	font-family: FontAwesome;
	content: "\f129";
	background-color: #4792F7 !important;
	color: #EBF4FD;
	font-weight: normal;
}
*/
@media (max-width: 1024px) {
	.rccNews,
	.rccDidacticalHint
	{
		padding: 7px !important;
	}
	.rccNews,
	.rccDidacticalHint,
	.rccDidacticalHint > p
	{
		font-size: 12px;
		line-height: 15px;
	}
}

@media (max-width: 900px) {
	.rccNews,
	.rccDidacticalHint
	{
		padding: 5px !important;
	}
	.rccNews,
	.rccDidacticalHint,
	.rccDidacticalHint > p
	{
		font-size: 10px;
		line-height: 13px;
	}
}

.rccDidacticalHint
{
	margin-top: 10px;
	background-color: #9ad4f1;
	padding: 15px;
	font-weight: bold;
}

.helptext.message-didactics,
.rccNews.message-didactics {
    background-color: #9ad4f1 !important;
}

.helptext.message-news,
.rccNews.message-news {
  background-color: #cfd500 !important;
}

.helptext.message-software-help,
.rccNews.message-software-help {
  background-color: #ffd401 !important;
}

.helptext.message-system,
.rccNews.message-system {
  background-color: #ffbaa0 !important;
}

.helptext.message-system-critical,
.rccNews.message-system-critical {
  background-color: #af271a !important;
  color: white;
}


.questionMark
{
	height: 70px; /* This height is cutting the multi-icon-image questionMark > img in pieces. */
	overflow: hidden;
	margin-top: 15px;
	margin-bottom: 20px;
  opacity: 1;
  position: relative;

    transition: transform 0.1s ease-in-out;
    animation-name: blink-animation;
 	animation-duration: 0.7s;
     animation-iteration-count: 6;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;


}

@media (min-width: 901px) {
  .questionMark
  {
  transform-origin: 130px center;

  }
}

.questionMark:hover {
  transform: scale(1.08);
}

@keyframes blink-animation {
  0% {
      opacity: 1;
  }
  50% {
    opacity: 0.4;
    transform: scale(1.09);
  }
  100% {
    opacity: 1;
  }
}


body.phone .questionMark
{
	float: right;
	overflow: initial;
	margin-top: 0;
	height: 40px;
	overflow: hidden;
}

.questionMark > img
{
	display: block;
	margin-left: auto;
	height: 140px;
	width: 70px;
	cursor: pointer;
	transition: margin-top 0.3s ease;
	pointer-events: auto;
}

.questionMark > img.cth-close
{
	margin-top: -70px;
}

body.phone .questionMark > img.cth-close
{
	margin-top: -33px;
}

.jumper.local-form > .questionMark > img.cth-close
{
	margin-top: -30px;
}

body.phone	.questionMark > img
{
		display: block;
		margin-left: auto;
		margin-top: 8px;
		margin-bottom: 8px;
		margin-right: 8px;
	height: 64px;
		width: 32px;
	}

.context-help-data {
	position: absolute;
	height: 1px;
	width: 1px;
	/* debug */
	/*border: 1px solid red;
	height: 10px;
	width: 10px;
	*/
}


.jumper.local-form
{
    float: right;
    display: inline-block;
}

.jumper.local-form > .questionMark
{
    height: 30px;
    margin: 0;
}

.jumper.local-form > .questionMark > img {
    width: 30px;
    height: 60px;
}

.dateHighlite
{
	color: #a00057;
}

.hsluGrey
{
	color: #6a95a9;
}

@media(min-width : 767px)
{
	.paddingBothSides
	{
		padding-right: 50px;
		padding-left: 50px;
	}
}
/* Large Devices, Wide Screens */
@media(min-width : 1200px)
{
	.contentWrap-border
	{
		border: 1px solid #707173;
		border-radius: 10px;

		/* PH BEGIN */
		width: 1200px;  /* Die Breite bleibt fix. Erst bei Breite < Tablet beginnen einzelne Spalten, untereinander zu fallen. */
		display: block;
		position: relative;
		margin: auto;  /* Ganzen Inhalt vertikal einmitten. */
		float: none;
		margin-top: 15px; /* Im WBT ist die Höhe des Inhaltes fix und ist vertikal eingemittet. Bei uns geht das nicht, die Höhe ist variabel. Gar kein Rand oben sieht jedoch hässlich aus. */
		margin-bottom: 40px; /* Im WBT ist die Höhe des Inhaltes fix und ist vertikal eingemittet. Bei uns geht das nicht, die Höhe ist variabel. Gar kein Rand oben sieht jedoch hässlich aus. */
		overflow: hidden; /* Wichtig, weil sonst die Border Radien oben links und rechts verdeckt werden (komischer Effekt). */
		/* PH END */
	}

}

  .contentWrap-border.start-page
	  {
	    background: url(../Images/hslu/startseite_bg_z.jpg) no-repeat;
	    background-size: 163%;
      	background-position: -40px -95px;
	  }

body.tablet .contentWrap-border.start-page
{
    background: url(../Images/hslu/startseite_bg_z.jpg) no-repeat;
    background-size: 166%;
    background-position: -180px -95px;
    min-height: 635px;
}

body.phone .contentWrap-border.start-page
{
    background: url(../Images/hslu/startseite_bg_z.jpg) no-repeat;
    background-size: 300%;
/*    background-position: -450px -350px;*/
	background-position: -300px -166px;
    min-height: 900px;
}

@media (max-width: 320px) {
	body.phone .contentWrap-border.start-page
	{
    background: url(../Images/hslu/startseite_bg_z.jpg) no-repeat;
    	background-size: 300%;
    	background-position: -300px -66px;
    	min-height: 900px;
	}
}


/* This is the help box top right in layouts with only content. */
.help-corner-right {
	position: absolute;
	right: 13px;
	/*top: 130px; */ /*115px; Otherwise it overlaps the quicklink menu */
	bottom: 1140px;
	z-index: 9000;
}

.help-corner-right .questionMark.hidden-xs {
	margin-top: 0;
	margin-bottom: 0;
}

body.context-help-open .help-corner-right {
	z-index: 10000;
}

.messages.free {
	max-width: 1200px;
	width: 100%;
	top: 0;
	box-shadow: none;
	border-radius: 0;
}
/*
################################################################
	##### Global Layout End #####
################################################################
*/

/*
################################################################
	##### Body modifications #####
################################################################
*/

.jumper {
	transition: top 0.5s ease;
	pointer-events: none;
	background: none !important;
}

.jumper .rccNews {
        pointer-events: all;
}

body.context-help-open:not(.phone) .master-column-right > .jumper,
body.top-1:not(.phone) .master-column-right > .jumper
{
	position: fixed;
	max-width: 169px;
	width: 13%;
}

body.top-1:not(.phone) .master-column-right > .jumper
{
	top: 10px;
}

body.top-1.phone .master-column-right > .jumper
{
	display: none;
	visibility: hidden;
}

body.context-help-open .master-column-right > .jumper {
	z-index: 20000;
}

body.context-help-open .master-column-right > .jumper > .col-news {
	display: none;
}


body.tablet	.help-corner-right
{
	top: 50px;
}

body.tablet	.help-corner-right > .jumper
{
	height: 50px;
}
body.tablet	.help-corner-right > .jumper .questionMark
{
	width: 50px;
	height: 50px;
}

body.tablet	.help-corner-right > .jumper .questionMark img
{
	width: 50px;
	height: auto;
}

body.tablet	.help-corner-right > .jumper .questionMark img.cth-close
{
	margin-top: -50px;
}

/*
################################################################
	##### Navigation #####
################################################################
*/

.navheaderDesktop
{
	min-height: 100px;
	padding: 15px 30px 15px 30px;
}

.navheaderDesktop img.logo-rcc
{
	margin-left: 13px;
	margin-top: 15px;
}

.navheaderDesktop img.logo-be-rcc
{
	height: 40px;
	position: relative;
	bottom: -25px;
	/*left: -13px;*/
}

.navheaderDesktop img.logo-hslu {
	margin-top: -5px;
	max-height: 70px;
    width: 180px;
    margin-top: 35px;
}
/*
#main-menu-rcc ul > li.quicklink .personalized::after {
  content: "⋮";
  margin: 0 8px;
  font-weight: bold;
}
*/

/* PH BEGIN */
@media(min-width : 902px)
{

	#main-menu-rcc ul {
		white-space: nowrap; /* In der fixen Breite sollen die Menüpunkte nicht untereinander fallen (Entscheidung). */
	}
	#main-menu-rcc ul > li {
		float: none;	/* dito */
		display: inline-block;
		margin-left: 12px;
	}

  #main-menu-rcc ul > li.last {
    position: absolute;
    right: 50px;

  }

  #main-menu-rcc ul > li.quicklink {
    right: 10px;
    width: 30px;
    padding: 0;
    text-align: center;
    margin: 0;
  }
  #main-menu-rcc ul > li.last .dropdown-menu {
    left: auto;
    right: 0;
  }

  #main-menu-rcc ul > li.quicklink > div {
    padding-right: 7px;
    padding-left: 0px;
  }
  #main-menu-rcc ul > li.last li {
   margin-left: 0;
  }
}
/* PH END */

/* Navigation für Smartphones start */
/* Extra Small Devices, Phones */
/* @media(min-width : 480px) */
@media(max-width : 767px)
{
	.navbar-header
	{
		background-color: white;
	}

	body.phone .navbar-header a {
		display: inline-block;
		vertical-align: bottom;
	}
	.rcc-logo-xs {
		height: 30px;
		margin-top: 10px;
		width: auto;
		vertical-align: bottom;
	}

	.navbar-nav
	{
		margin-top: 0px;
		margin-bottom: 0px;
	}

	#main-menu-rcc
	{
		width: 100%;
	}

	.container-fluid
	{
		padding-right: 0px;
		padding-left: 0px;
	}

	.container-fluid>.navbar-header
	{
		margin-right: 0px;
		margin-left: 0px;
	}

	.container-fluid>.navbar-collapse
	{
		margin-right: 0px;
		margin-left: 0px;
	}

  #main-menu-rcc > div > ul > li,
  #mobileNav > div > ul > li
	{
		border-top: 1px solid white;
	}
  #main-menu-rcc > div > ul > li > a,
  #mobileNav > div > ul > li > a
	{
		padding-top: 15px;
		padding-bottom: 15px;
		padding-right: 30px;
	}

  #main-menu-rcc > div > ul > li.last > div,
  #mobileNav > div > ul > li.last > div
	{
		padding-top: 15px;
		padding-bottom: 15px;
	}

  #main-menu-rcc > div > ul > li > a > i,
  #mobileNav > div > ul > li > a > i
	{
		margin-top: -5px;
	}
}
/* Navigation für Smartphones ende */

.navigationbar
{
	padding: 0;
}

.navbar
{
	min-height: 18px;
	text-decoration: none;
	font-family: "Verdana", sans-serif;
	/*font-weight: bold;  Das ist im Browser schwerer als im PDF. */

	font-size: 16px;
	border-left: 0px;
	border-right: 0px;
}

/*
@media (max-width: 768px) {
	.navbar
	{
		font-size: 10px;
	}
}
*/

@media (max-width: 768px) {
	h1
	{
		font-size: 16px;
	}
}

.navbar a
{
	text-decoration: none;
}

.navbar-default
{
	background-color: #415e6c;
	border: none;
	padding-left: 0;
	margin-left: -12px;
}

body.phone .navbar-default
{
	margin-left: 0;
}

.navbar-nav>li>a
{
	padding-top: 4px;
	padding-bottom: 4px;
}

.navbar-default .navbar-nav>li>a,
.navbar-default .navbar-nav>li>div
{
	color: #fff;
}

.navbar-default .navbar-nav>.active>a
{
	background-color: #a00057;
	color: #fff;
}

.navbar-default .navbar-nav>.active>a:hover
{
	background-color: #fff;
	color: #415e6c;
}

.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li>div:hover
{
	background-color: #fff;
	color: #415e6c;
}

.personalized {
	cursor: pointer;
}
.personalized:hover + ul {
  display: block;

}
.personalized.dropdown > .main-user-name {
	display: inline-block;
}

#personalized-menu:hover {
  display: block;
}

.navbar-nav li.last{
	height: 100%;
}

.navbar-nav li.last > div {
	padding-right: 20px;
    padding-left: 20px;
    padding-top: 3px;
    /*height: 100%;*/
    height: 28px;
}

@media (max-width: 768px) {
	.navbar-nav li.last > div {
		padding-top: 6px;
	}
}

#personalized-menu {
	white-space: normal !important;
	background-color: #415e6c;
	z-index: 30000;
	box-shadow: none;
	right: 0;
}
/*
.last:not(.quicklink)>#personalized-menu {
	width: 100%;
}
	*/

#personalized-menu li {
	width: 100%;
}

#personalized-menu li:hover a {
	background-color: white;
	color: #415e6c;
}

#personalized-menu li a {
	color: white;
}

#profilDropdown {
  float: right;
  text-align: center;
}

#profilDropdown li {
	/*width: 200px;*/
	min-width:220px;
	background-color: #415e6c;
}
#profilDropdown li a {
  text-decoration: none;
}

#profilDropdown .navbar-nav {
	/*margin-right: 1px;*/
	padding: 0;
}
.personalized-dropdown {
	white-space: nowrap;
}
li:not(.quicklink) > .personalized.dropdown:after,
.start-page li.quicklink > .personalized.dropdown:after{
	content: "▼";
	/* float: right; */
	transform: scale(0.8);
	display: inline-block;
	/* margin-left: 15px; */
	position: absolute;
	right: 0;
}

.personalized.dropdown > span {
    display: inline-block;
    width: 3px;
    font-size: 19px;
    line-height: 19px;
}

/************************************/
/* submenu style START              */

.submenu {
	padding-left: 0;
	padding-right: 0;
}

.submenu a:link
{
	text-decoration: none;
	color: #415e6c;
}

.submenu a:visited
{
	text-decoration: none;
	color: #415e6c;
}

.submenu li:not(.active):hover > a,
.submenu a:hover {
	/*color: #a00057;*/
	text-shadow: 1px 0 0 black;
}

@media(min-width : 767px)
{
	.submenu
	{
		font-family: Verdana;
	    font-size: 13px;
	    color: #415e6c;
	    font-weight: normal;
	}

	.submenu li
	{
		padding: 8px 0px;
		/*white-space: nowrap; *//* Ohne bricht die Zeile nach der Zahl um. */
		/* Es gibt keine Zahl mehr. Der Umbruch ist nötig. */
	}

	.submenu > ul > li.active > ul
	{
		padding-left: 20px;
	}

	.submenu > ul > li.active > ul > li:last-child
	{
		padding-bottom: 0px;
	}

	/* Reihenfolge spielt eine Rolle START */
	.submenu > ul > li.active
	{
		font-weight: bold;
		color: #415e6c;
		border-top: 1px solid #415e6c;
		border-bottom: 1px solid #415e6c;
	}

	.submenu > ul > li
	{
		font-weight: normal;
	}
	/* Reihenfolge spielt eine Rolle ENDE */

	/* Reihenfolge spielt eine Rolle START */
	.submenu > ul > li.active > ul > li.active > a:link
	{
		color: #a00057;
	}
	.submenu > ul > li.active > ul > li.active > a:visited
	{
		color: #a00057;
	}
	.submenu > ul > li.active > ul > li.active
	{
		font-weight: bold;
		color: #a00057;
	}
	.submenu > ul > li.active > ul > li
	{
		font-weight: normal;
	}
	/* Reihenfolge spielt eine Rolle ENDE */

	.submenu-sub > ul
	{
		margin-left: 12px;
		visibility: hidden;
		display: none;
	}

	.submenu > ul > li > .submenu-sub
	{
		font-weight: normal;
	}

	.submenu > ul > li.active > .submenu-sub > ul
	{
		visibility: visible;
		display: block;
	}
	.submenu > ul > li.active > .submenu-sub > ul > li.active
	{
		font-weight: bold;
	}

	.submenu > ul > li.active > .submenu-sub > ul > li.active a
	{
		color: #a00057;
	}

	/* free the menu */
	body.top-1 div.submenu > ul {
		position: fixed;
		top: 60px;
		bottom: 20px;
		overflow-y: auto;
		width: 19%;
		max-width: 228px;
	}

	body.top-1 .layout-2-b div.submenu > ul {
		position: fixed;
		top: 60px;
		bottom: 20px;
		overflow-y: auto;
		width: 13%;
		max-width: 155px;
	}
}

@media(max-width : 767px)
{
	.submenu
	{
		min-height: 18px;
		text-decoration: none;
		font-family: "Verdana", sans-serif;
		font-weight: bold;
		font-size: 16px;
		border-left: 0px;
		border-right: 0px;
	}

	.submenu a
	{
		padding: 15px;
		display: block;
		border-bottom: 1px solid #415e6c;
	}

	.submenu > ul > li.active > a
	{
		color: #a00057;
	}
	.submenu > ul > li.active > ul > li.active > a
	{
		color: #a00057;
	}
}

/* Submenu pills adjustment */
.nav-pills.hslu-submenu {
	display: block;
}

.nav-pills.hslu-submenu > li {
	line-height: 16px;
	float: left;
	clear: both;
}

.nav-pills.hslu-submenu > li > a {
	padding: 0;
	border: none;
	background-color: initial;
	line-height: 16px;
}
.nav-pills.hslu-submenu > li.active {
	background: none;
}

.nav-pills.hslu-submenu > li.active > a {
	background: none;
	color: #a00057;
}

/* Submenu flavors: week */
.hslu-submenu > li.journal-menu-item {
	width: 100%;
	margin-left: 0 !important;
}
.hslu-submenu > li.journal-menu-item > a {
	display: flex;
	flex-direction: row;
}
.hslu-submenu > li.journal-menu-item > a > span:first-child {
	flex: 1 0 70%;
	white-space: normal;
}
.hslu-submenu > li.journal-menu-item > a > span:nth-child(2) {
	flex: 0 1 30%;
	max-width: 45px;
}

.hslu-submenu.journal-menu {
	max-height: calc(100vh - 320px);
	overflow-y: auto;
	overflow-x: hidden;
}

/* Submenu flavors: targets / 3 level */
.hslu-submenu li.level-3 {
	margin-left: 12px !important;
	padding: 4px 0;
	font-weight: normal;
	text-shadow: none;
	width: calc(100% - 12px) !important;
}

.hslu-submenu li.level-3 a {
	font-size: 10px !important;
	text-shadow: none;
}

/* submenu style ENDE               */
/************************************/

.nav-pills-hslu > li,
.nav-pills-hslu > li.active
{
	background-color: initial;
	border-radius: 0;
}

.nav-pills-hslu > li:first-child {
	margin-left: 0;
}

.nav-pills-hslu > li > a,
.nav-pills-hslu > li > a:active,
.nav-pills-hslu > li > a:focus,
.nav-pills-hslu > li > a:hover,
.nav-pills-hslu > li > a:visited
{
	color: white;
	text-decoration: none;
	background-color: #6a95a9;
	border-radius: 0;
}

.nav-pills-hslu > li.active > a,
.nav-pills-hslu > li.active > a:active,
.nav-pills-hslu > li.active > a:focus,
.nav-pills-hslu > li.active > a:hover,
.nav-pills-hslu > li.active > a:visited
{
	color:#d70070;
	text-decoration: none;
	background-color: #6a95a9;
	border-radius: 0;
}

.tab-content.wordclouds
{
	border: 1px solid #6a95a9;
	margin-bottom: 30px;
}

/* Small Devices, Tablets */
/*@media(min-width : 768px)
{

}*/

/* Medium Devices, Desktops */
@media(min-width : 992px)
{
	.navbar
	{
		border-radius: 0px;
	}
}

/* Large Devices, Wide Screens */
@media(min-width : 1200px)
{
	.navbar
	{
		border-radius: 0px;
	}
}

/*
################################################################
	##### Navigation End #####
################################################################
*/



/*
################################################################
	##### Site Layout #####
################################################################
*/
.sitecontent
{
	padding: 0px 30px 0px 30px;
}

.sectionTitle
{
	color: #a00057;
	font-family: "Verdana", sans-serif;
	font-size: 24px;
	display: block;
	margin-top: 35px;
	margin-bottom: 15px;
}

.sectionSubtitle
{
	color: #415e6c;
	font-family: "Verdana", sans-serif;
	font-size: 13px;
	font-weight: bold;
	display: block;
	margin-top: 5px;
	margin-bottom: 15px;
}

.sectionCaption
{
	color: #000000;
	font-family: "Verdana", sans-serif;
	font-size: 13px;
	font-weight: bold;
	display: block;
	margin-top: 5px;
	margin-bottom: 5px;
}

#processAccordion .goalsDiv .feedback {

  display: none !important;
}


.sectionButtonRow
{
	margin-top: 15px;
}

/*
################################################################
	##### Site Layout end #####
################################################################
*/

/*
################################################################
	##### WeekJournal #####
################################################################
*/

.journal_week
{
	width: initial;
}

.journal_week .weekConclusion {
	background-color: initial;
	padding: 0;
}

.Tagebucheintrag
{
	border-top: 5px solid #a00057;
	border-bottom: 5px solid #a00057;
	margin-top: 15px;
	margin-bottom: 15px;
}

.fazit-range-container {
	margin-bottom: 50px;
}

/*
################################################################
	##### WeekJournal end #####
################################################################
*/

/*
################################################################
	##### SPFactorsJournal #####
################################################################
*/

.editEintrag
{
	margin-top: 15px;
	margin-bottom: 15px;
}

/*
################################################################
	##### SPFactorsJournal end #####
################################################################
*/

/*
################################################################
	##### Advising #####
################################################################
*/

#c-diagram-control,
#c-diagram
{
	display: inline;
}

.diagram-wrapper .chart-title
{
	font-size: 16px;
}

.chart-nothing-chosen.sectionSubtitle {
	margin-top: 60px;
}

#c-diagram-control > div {
	margin-right: 20px;
}

#c-diagram-control .panel-heading,
#c-diagram-control .panel-body
{
	border: initial;
	box-shadow: none;
}

#c-diagram-control .panel {
	box-shadow: none;
}

#diagram-wrapper-3 table
{
	width:735px;
	max-width:735px;
}

#diagram-wrapper-3 table td,
#diagram-wrapper-3 table th
{
	padding: 3px;
}

#diagram-wrapper-3 table tr :nth-child(1)
{
	max-width: 100px;
	word-wrap: break-word;
}

#diagram-wrapper-3 table tr :nth-child(4),
#diagram-wrapper-3 table tr :nth-child(5)
{
	max-width: 130px;
	word-wrap:break-word;
}

#diagram-wrapper-3 table img
{
	width: 50px;
	height: auto;
}


#diagram-control-widget-container .nav.disabled
{
	display: none;
}

#collapse1 input
{
	margin-bottom: 3px;
}

#collapse2 input
{
	margin-bottom: 3px;
}

#diagram-chooser .btn
{
	margin: 0px;
	margin-bottom: 3px;
}

.datetator_holder > input
{
	max-width: 135px;
	height: 27px;
}

.datetator-group .input-group-addon
{
	padding-left: 2px;
	padding-right: 2px;
max-width: 33px;
    min-width: 33px;
}

.advisingToggleNav .tab.active > a {
	color: #a00057;
}

.advisingToggleNav .tab.disabled {
	opacity: 0.4;
}
.advisingToggleNav .tab.disabled > a {
	cursor: default;
}

/*
################################################################
	##### Advising end #####
################################################################
*/

/*
################################################################
	##### Deckblatt #####
################################################################
*/

.halfTransparent
{
	background-color: rgba(255, 255, 255, 0.5);
}

.halfTransparent.forGray
{
	background-color: rgba(100, 100, 100, 0.2);
}

.whiteBackgroundMainPage
{
	background-color: #ffffff;
	margin-top: 5px;
}

.intro-box
{
  /*max-height: 420px;*/
 /*overflow-y: auto;*/

  margin-top: 15px;
}

.intro-box .bodytext {
    margin-bottom: 10px !important;
}

body.tablet .intro-box
{
  /*max-height: 440px;*/
}

body.phone .intro-box
{
  max-height: none;
}

@media (max-width: 320px) {
  body.phone .intro-box
  {
    max-height: none;
  }
}

div.mainPageButton,
a.mainPageButton
{
  padding: 0px;
  text-align: left;
    background-color: #f6f6f6;
    margin: 20px 0px;
    border-radius: 7px;
    border: 1px solid #ddd;
    /* box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
	/* --> jQuery Mobile */
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.15);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,.15);
	box-shadow: 0 1px 3px rgba(0,0,0,.15);
	cursor: pointer;
}

div.mainPageButton .panel,
div.mainPageButton .panel-heading
{
	padding: 0;
    border: none;
    background-color: rgba(0,0,0,0);
    box-shadow: none;
}

div.mainPageButton .panel-heading a > .default,
div.mainPageButton .panel-heading a > i
{
	vertical-align: middle;
}

span.mainPageButton-text
{
	margin-left: 20px;
	display: inline-block;
	white-space: normal;
	width: 70%;
}

body.phone span.mainPageButton-text {
  display: inline-block;
  width: 70%;
  padding-right: 85px;
}

@media (max-width: 470px) {
  body.phone span.mainPageButton-text {

     padding-right: 35px;
  }
  .vertical-middle-main-page-arrow {
    color: transparent;
  }
}

@media (max-width: 320px) {
	body.phone i.fa-4x  {
		font-size: 2em;
	}
}
div.mainPageButton .panel-heading a:link,
div.mainPageButton .panel-heading a:visited
{
	text-decoration: none;
	color: #000000;
}

div.mainPageButton:hover  {
	background-color: #a00057;
}

div.mainPageButton:hover .panel-heading a,
div.mainPageButton:hover .panel-body
{
	color: white;
}

div.mainPageButton a
{
	cursor: pointer;
}

div.mainPageButton:hover a .vertical-middle-main-page-arrow i {
  background-color: #7b0046;
  transition: transform ease 0.3s;
}

div.mainPageButton [aria-expanded="true"] .vertical-middle-main-page-arrow i {
  transform: rotate(90deg);
}

@media (max-width: 320px) {
  body.phone .vertical-middle-main-page-arrow i {
    margin-top: 10px;
  }

}

a.mainPageButton > .default,
a.mainPageButton > i
{
	vertical-align: middle;
}

a.mainPageButton > .default {
	margin-left: 20px;
}

a:link.mainPageButton,
a:visited.mainPageButton
{
  text-decoration: none;
  color: #000000;
  padding: 10px;
}

a:hover.mainPageButton {
	color: white;
	background-color: #a00057;
}

a:hover.mainPageButton .vertical-middle-main-page-arrow i {
  background-color: #7b0046;
}

.vertical-middle-main-page
{
	/* margin-top: 15px; */
	margin: 15px;
}

.vertical-middle-main-page-arrow
{
  float: right;
  display: inline-block;
  margin-top: 15px;
  line-height: 24px;
  font-weight: bold;
  padding-left: 3px;

}

.vertical-middle-main-page-arrow i {
  width: 24px;
  height: 24px;
  text-align: center;
  display: inline-block;
  color: white;
  border-radius: 12px;
  background-color: #9B9B9B;
  line-height: 2em;
  text-indent: 1px;
  margin-left: 3px;
}

.mainPageImpressum
{
	margin-top: 80px;
}

body.tablet .mainPageImpressum,
body.phone .mainPageImpressum
{
  margin-top: 30px;
  /*margin-top: 30%;*/
}

#wbt-parts .panel-body
{
	padding-left: 90px;
}

body.phone #wbt-parts .panel-body {
	padding-left: 5px;
}

#wbt-parts .panel-body a
{
	color: black;
	text-decoration: none;
	margin-bottom: 10px;
	display: block;
	float: left;
	clear: both;
	width: 100%;
}

#wbt-parts .wbt-books
{
	margin-right: 7px;
}

#wbt-parts .col-1
{
	display: block;
	float: left;
	width: 9%;
	min-width: 80px;
	clear: both;
}

#wbt-parts .col-2
{
	display: block;
	float: left;
	width: 80%;
	white-space: normal;
}

body.phone #wbt-parts .col-1
{
	min-width: 75px;
}

body.phone #wbt-parts .col-2
{
	width: 76%;
}

div.mainPageButton #wbt-parts .panel-body a {
  border: 2px solid transparent;
  padding: 3px 7px;
}

div.mainPageButton:hover #wbt-parts .panel-body a {
	color: white;
}

div.mainPageButton #wbt-parts .panel-body a:hover {
  /*font-weight: bold;*/
  border-color: #fff;
}

/*
################################################################
	##### Deckblatt end #####
################################################################
*/

/*
################################################################
	##### ProzessPfeil #####
################################################################
*/

#processAccordion
{
  max-width: 800px;
  background-color: #6b0036;
  padding: 40px 0 25px;
}

#processAccordion .panel+.panel
{
  /*margin-top: 0px;*/
}

#processAccordion .panel-heading
{

  cursor: pointer;
  padding: 0;

}

#processAccordion .panelBodyWrap
{
  padding: 10px;
  padding-right: 55px;
  color: #ffffff;
  position: relative;
  background-color: #a2005a;
  margin-left: 155px;

}

#processAccordion .panelBodyWrap .panelBodyWrap {
   margin-left: 0;
}

#processAccordion .goto {
  position: absolute;
  right: 10px;
  bottom: 10px;
}

#processAccordion .offsetLeftColumns {

}

#processAccordion .panel-body
{
  background-color: #6c0139;

  border: 0px;
  padding: 0px;
  padding-bottom: 35px;
}

@media(min-width : 992px)
{
	#processAccordion .panel-body.noPadding
	{
		display: flex;
		flex-wrap: wrap;
	}
}
/*
#processAccordion .panel-body.noPadding
{
	background-color: #a00057;
}
*/
#processAccordion h2
{
	color: #ffffff;
}

#processAccordion ul
{
	padding-left: 20px;
}

#processAccordion li
{
	list-style-type: disc;
}

#processAccordion .goalsDiv
{
    color: #a20058;
    padding: 10px 0 10px 10%;
    background-color: #f7e6ee;
    margin-left: 155px;
}

#processAccordion .goalsDiv a {
  color: inherit;
}
#processAccordion  a:hover .goalsDiv .dp-label {
  text-decoration: underline;
}

#processAccordion .dp-label {
  display: inline-block;
}

.processAccordion-options {
	max-width: 800px;
	text-align: right;
}

#processAccordion .panel-title
{
  color: #ffffff;
  text-decoration: none;
  display: inline-block;
  width: 82%;
  word-break: break-word;
  white-space: normal;
  position: absolute;
  bottom: 53px;
  left: 150px;
  padding-right: 110px;
  padding: 40px 32px;
}



body.tablet #processAccordion .panel-title,
body.phone #processAccordion .panel-title
{
	/* DEPRECATED new style
    font-size: 13px;
		*/
    left: 90px;
    border-width: 1px;
    bottom: 52px;
    padding: 11px;
    padding-right: 60px;
    width: 76%;
}
body.tablet #processAccordion .panel-title {
 width: 87%;
}

body.tablet #processAccordion .panel-heading-left,
body.phone #processAccordion .panel-heading-left
{
  width: 150px;
    transform: scale(.6);
    transform-origin: left top;
  height: 110px;
}
#processAccordion .panel-heading-left {
  display: inline-block;
  width: 200px;
    height: 150px;
    vertical-align: middle;
}

body.tablet #processAccordion .panel-heading-toggle-marker,
body.phone #processAccordion .panel-heading-toggle-marker {
  top: 10px;
  margin-right: 10px;
}

body.tablet #processAccordion .panelBodyWrap,
body.phone #processAccordion .panelBodyWrap,
body.tablet #processAccordion .goalsDiv,
body.phone #processAccordion .goalsDiv {
 margin-left: 0;
}

body.tablet #processAccordion .panel,
body.phone #processAccordion .panel {
 margin-top: 0;
}






#processAccordion .panel-default>.panel-heading,
#processAccordion a
{
  color: #ffffff;
}

#processAccordion .panel-heading
{
  position: relative;
  border-top-left-radius: 0px;
    border-top-right-radius: 0px;
  white-space: nowrap;
}

#processAccordion > .panel > a,
#processAccordion > .panel > a:link,
#processAccordion > .panel > a:visited,
#processAccordion > .panel > a:hover
{
  text-decoration: none;
}

#processAccordion .panel
{
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border: 0px;
  margin-top: -24px;
  margin-bottom: 0;
  background: none;
}

#processAccordion a.process-accordion-goto,
#processAccordion a.process-accordion-goto:active,
#processAccordion a.process-accordion-goto:visited
{

}
#processAccordion .dida-arrow-img {
    position: absolute;
    margin-left: 50px;
    margin-top: 43px;
    max-height: 68px;
}
#processAccordion > div:nth-child(4) > a > div > span.panel-heading-left > img.dida-arrow-img {
  /*  margin-left: 10px;*/
}
#processAccordion > div:nth-child(5) > a > div > span.panel-heading-left > img.dida-arrow-img {
   /* margin-left: 34px;*/
}

#processAccordion .dida-arrow-img-bg {
  position: absolute;
  z-index: 1;


}

#processAccordion .panel:hover .dida-arrow-img-bg
{
  opacity: 1;
}

#processAccordion .process-accordion-goto {
	color: #fcd538;
}


#processAccordion .process-accordion-goto:before {
	z-index: 20;
	position: relative
}

#processAccordion .process-accordion-goto:after {
    content: "\00A0";
    position: relative;
    display: block;
    z-index: 10;
    background-color: white;
    width: 70%;
    left: 15%;
    line-height: 60%;
    margin-top: -95%;
}

.panel-heading-toggle-marker {
    float: right;
    line-height: 23px;
    font-size: 25px;
    margin-right: 10px;
	transform: rotate(90deg);
	transition: transform 0.3s ease;
	position: relative;
	z-index: 1000;
}

.collapsed .panel-heading-toggle-marker {
	transform: rotate(-90deg);
}


@media(min-width : 992px)
{
	#processAccordion .innerColumns
	{
		border-right: 10px solid white;
		display: flex;
		flex-direction: column;
	}
}

#processAccordion .panel-heading-toggle-marker {
  top: 32px;
  margin-right: 50px;
}

div.mainPageButton .panel-heading > a {
 display: block;
  padding: 10px;
}

#processAccordion .innerColumns:last-child
{
	border-right: 0px;
}


/* mobile */



@media (max-width: 776px) {

}


.didacticalTipp
{
	margin-bottom: 30px;
}


#processAccordion .goalsDiv > div > div
{
  display: inline-block;
  vertical-align: top;
  padding-bottom: 5px;
}

.overall-completeness-list .c2 > i,
#processAccordion .goalsDiv .symbol > i
{
    margin-left: 0;
    border-radius: 50%;
    font-size: 12px;
    padding: 6px;
}

.journal-menu-item {
	white-space: nowrap;
}

.journal-menu-item .state-symbol {
	text-align: center;
	/*margin-left: 20px;*/
	vertical-align: top;
}

.journal-menu-item .state-symbol > i {
	margin-left: 0;
	border-radius: 50%;
	font-size: 7px;
	height: 15px;
	width: 15px;
	line-height: 6px;
}

.journal-menu-item .state-symbol > i.hsluCheckColor {
	padding-top: 5px;
	padding-left: 1px;
}
.journal-menu-item .state-symbol > i.hsluTimesColor {
	padding-top: 4px;
	padding-left: 1px;
}

.journal-menu-item:not(.active):not(:hover) .state-symbol {
	opacity: 0.75;
	transform: scale(0.7);
}

.journal-menu-item.active {
	background-color: #f2e5ec;
}

.hslu-submenu li:not(.active).journal-menu-item.level-2:hover {
	/*	background-color: #dae5ea;*/
	/*font-weight: bold;*/
	text-shadow: 1px 0px 0px black;
	color: #415e6c !important;
}

.hslu-submenu :not(.visible-xs) li:not(.active).journal-menu-item.level-2:hover a {
	color: #415e6c !important;
}

.hslu-submenu :not(.visible-xs) li:not(.active).journal-menu-item.level-3:hover {
	/*	background-color: #dae5ea;*/
	/* font-weight: bold;*/
	color: #415e6c !important;
	text-shadow: 1px 0px 0px black !important;
}

.hslu-submenu :not(.visible-xs) li:not(.active).journal-menu-item.level-3:hover a {
	color: #415e6c !important;
	text-shadow: 1px 0px 0px black !important;
}



@-webkit-keyframes fadeInTopMedium {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-100px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes fadeInTopMedium {
	0% {
		opacity: 0;
		-moz-transform: translateY(-100px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}

@-o-keyframes fadeInTopMedium {
	0% {
		opacity: 0;
		-o-transform: translateY(-100px);
	}

	100% {
		opacity: 1;
		-o-transform: translateY(0);
	}
}

@keyframes fadeInTopMedium {
	0% {
		opacity: 0;
		transform: translateY(-100px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}


@media(max-width:765px) {

	.top-1 .navbar-default-rcc {
		-webkit-animation-name: fadeInTopMedium;
		-moz-animation-name: fadeInTopMedium;
		-o-animation-name: fadeInTopMedium;
		animation-name: fadeInTopMedium;
		-webkit-animation-duration: 1s;
		-moz-animation-duration: 1s;
		-o-animation-duration: 1s;
		animation-duration: 1s;
	}

	.top-1 .navbar-default-rcc {
		position: fixed;
		top: -2px;
		right: 0;
		left: 0;
		z-index: 1000;
		overflow-y: auto;
		overflow-x: hidden;
	}

}


	/*
################################################################
	##### ProzessPfeil end #####
################################################################
*/
	/*
################################################################
	##### Allgemeine Korrekturen begin #####
################################################################
*/

	.journal-protection-factors-container {
	margin-left: 0;
	width: initial;
}

div.prot-factor {
	padding-right: 10px;
}

textarea.prot-factor {
	min-height: 40px;
	margin-bottom: 10px;
	border: 1px solid rgb(64, 93, 107);
	border-radius: 0;
	box-shadow: none;
}

.prot-factor.rangetitle > h2 {
	margin-bottom: 5px;
}
.prot-factor.period-title-2 {
	padding-left: 5px;
}

h2.subgroup {
	float: left;
	clear: both;
	margin-top: 25px;
}

.editor-container textarea {
	padding: 0;
}

.editor-container iframe.wysihtml5-sandbox {
	min-height: 40px;
	margin: 10px;
}

.week-edit-outer {
	transition: background-color 0.3s ease;
}
.week-edit-outer:hover {
	background-color: #EEEEEE;
}
.week-edit-outer.editor-active:hover {
	background-color: initial;
}
.security-hint {
	float: right;
	opacity: 0;
	transition: opacity 0.3s ease;
	white-space: nowrap;
	color: #949a00;
}

.editEintrag .security-hint {
	float: left;
	clear: both;
}

.security-hint.s-visible {
	opacity: 1;
}
.security-hint.s-error {
	color: #e2007a;
}
.editEintrag button.weekfazit {
	margin-top: 20px;
}
.editEintrag textarea {
	border-radius: 0;
	min-height: 160px;
}
.editEintrag iframe.wysihtml5-sandbox {
    min-height: 150px;
}

/*
################################################################
	##### Allgemeine Korrekturen end #####
################################################################
*/


/*
################################################################
	##### Context help begin #####
################################################################
*/

#ctDiv
{
	-webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    max-width: none;
    width: initial;
}

#ctDiv > .bg {
	overflow: hidden;
	clear: both;
}

#ctDiv > .fg {
	overflow-y: auto;
    max-height: 500px;
}

.cb-modal-content
{
	display: none;
}

.custombox-modal {
	width: 60%;
	margin: auto;
	text-align: left;
}

.cth-title
{
	display: inline-block;
	float: left;
	font-size: 14px;
}

.cth-wbt-link
{
	display: inline-block;
	float: right;
	width: 200px;
}

.main-context-help-box a {
    color: #fbc3e0;
}

.cth-wbt-link.short
{
	display: inline-block;
	float: right;
	width: 130px;
}

.cth-wbt-link  a {
	color: rgb(255, 212, 2);
	text-decoration: none;
}

.cth-wbt-close
{
	display: inline-block;
	float: right;
	text-align: right;
	width: 30px;
}
/*
################################################################
	##### Context help end #####
################################################################
*/


/*
################################################################
	##### Calendar begin #####
################################################################
*/

table.fc-header {
    height: 70px;
}

table.fc-header td {
	vertical-align: middle;
}

table.fc-header .fc-button {
	border-radius: 20px;
	background-color: #6a95a9;
	background-image: none;
	box-shadow: none;
	color: white;
	transition: color 0.3s ease;
	text-shadow: none;
	border: none;
}

table.fc-header .fc-button:hover {
	color: #a00057;
}

#calendar
{
	padding-left: 15px;
	padding-right: 15px;
}

#calendar-menu:before {
	content: '\A0';
	height:70px;
	width: 1px;
	vertical-align: middle;
	display: inline-block;
}

#calendar-menu button {
	float: none;
	z-index: 8500; /*9500;*/
}
#calendar-menu .dropdown-menu {
	z-index: 9501;
	float: none;
	top: 46px;
	left: unset;
	min-width: 170px;
	right: 72%;
}

.fc-event {
    /* padding: 3px; */

	border-color: rgba(0,0,0,0) !important;
    border-radius: 0 !important;
}


.widget-edit-event {
	z-index: 9000;
}

#modal-background {
	z-index: 8999 !important;
}

/*
################################################################
	##### Calendar end #####
################################################################
*/

/*
################################################################
	Start Page
################################################################
*/

.hslu-brand {
	box-sizing: border-box;
	margin: 10px 0px 48px;
	font-family: "FS Albert Web Regular", Helvetica, sans-serif;
	line-height: 40px;
	color: rgb(51, 51, 51);
	text-rendering: optimizeLegibility;
	font-size: 48px;
}

body.phone .hslu-brand
{
	font-size: 28px;
}
@media (max-width: 320px) {
	body.phone .hslu-brand
	{
		font-size: 24px;
	}
}

.impressum > .r-1,
.impressum > .r-2
 {
	display: block;
	float: left;
}

.impressum > .r-1
{
	width: 35%;
}

.impressum > .r-2
{
	width: 60%;
}

.impressum > .r-1 > span,
.impressum > .r-2 > span
{
    width: 100%;
    display: inline-block;
}

body.phone .impressum > .r-1
{
	width: 45%
}

body.phone .impressum > .r-2
{
	width: 55%
}

@media (max-width: 320px) {
	body.phone .impressum > .r-1,
	body.phone .impressum > .r-2
	{
		font-size: 0.9em;
	}
}

a[title="JavaScript charts"] {
	visibility: hidden;
}

#c-diagram-control {
	z-index: 1000;
}

#c-diagram-control .btn-hsluGrey.active
{
    /* background-color: #415e6c; */
    color: #a00057;
}

.tx-datamintsfeuser-pi1 fieldset {
    border: none !important;
    margin-top: 20px;
}

.tx-datamintsfeuser-pi1 input[type="submit"] {
	float: left;
}

#mobileNav  {
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.53);
}

#mobileNav li.dropdown .caret {
  position: absolute;
  right: 20px;
  top: 50%;
  margin-top: -2px;
  transition: all 0.3s ease;
  transform: scale(1.6, 1.6);
}

#mobileNav li.dropdown.open .caret {
	transform: rotate(-180deg) scale(1.6, 1.6);
}

#mobileNav .level-2 a {
  color: #fff;
}

#mobileNav .level-2 a:hover,
#mobileNav .level-2 a.active {
  color: #555;
  background-color: #eee;

}

#mobileNav .level-2 a:hover {
  background-color: #fff;
}

#mobileNav .level-2 ul.nav-pills > li > a
{
	padding-left: 40px;
}

#mobileNav .level-2 ul.nav-pills > li.active > a {
	font-weight: bold;
	text-decoration: underline;
}

#mobileNav .level-2 ul.nav-pills a
{
	font-size: 13px;
	line-height: 20px;
}

#mobileNav .level-2 .nav-pills a:hover
{
	background-color: eee;
}


#mobileNav .level-2 .submenu-sub {
    background-color: #98aab3;
}

#mobileNav .level-2 .submenu-sub li:hover,
#mobileNav .level-2 .submenu-sub li.active {
    color: #555;
    background-color: #FFF;
}
#mobileNav .level-2 .submenu-sub li a {
	padding-left: 50px;
}

#mobileNav .level-2 .submenu-sub li:hover,
#mobileNav .level-2 .submenu-sub li.active a {
    color: #555;
}
@media (min-width: 992px) {
    .rccHomePage.navigationbar {
          padding-left: 57px;
    }
  }



#c-man-details-accordion #accordion .panel-heading {
    cursor: pointer;
}

#c-man-details-accordion .collapsing {
    transition: height 1.2s;
}

span.man-dashboard-no-data {
    height: auto;
    display: inline-block;
    width: 250px;
    border: 1px solid #333;
    padding: 10px;
    margin-top: 30px;
}


.week-edit-outer .editor-spinner {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: rgb(185, 185, 185, 0.7);
	display: flex;
}

.week-edit-outer .editor-spinner img {
	position: relative;
	margin: auto;
	opacity: 0.8;
}

.week-edit-outer {
	margin-bottom: 10px;
}

.journal_week .activityimage-container .rccToolbar {
	position: absolute;
	top: 10000;
	bottom: 0;
	left: 0;
	opacity: 0.6;
}

.journal_week .rccToolbar:hover {
	opacity: 1;
}

.journal_week .col-md-12[data-role="week-entry-preview"] {
	min-height: 123px;
}

.journal_week .btn-hsluEditBtnGroup {
	margin-bottom: 0;
}

.journal_week .security-hint {
	float: left;
	clear: both;
	height: 0;
}

.journal_week .security-hint.s-visible {
	height: auto;
}

/* Show a disk save symbol once the editor is open. */
.editor-active button[data-role="week-entry-edit"] .fa-pencil:before {
    content: "\f0c7";
}
