/* pt-sans-italic - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-italic.eot'); /* IE9 Compat Modes */
  src: local('PT Sans Italic'), local('PTSans-Italic'),
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-italic.svg#PTSans') format('svg'); /* Legacy iOS */
}

/* pt-sans-700 - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700.eot'); /* IE9 Compat Modes */
  src: local('PT Sans Bold'), local('PTSans-Bold'),
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700.svg#PTSans') format('svg'); /* Legacy iOS */
}

/* pt-sans-700italic - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local('PT Sans Bold Italic'), local('PTSans-BoldItalic'),
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-700italic.svg#PTSans') format('svg'); /* Legacy iOS */
}

/* pt-sans-regular - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('PT Sans'), local('PTSans-Regular'),
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/pt-sans-v9-latin/pt-sans-v9-latin-regular.svg#PTSans') format('svg'); /* Legacy iOS */
}

body,
html {
	color: #000;
	font-size: 16px;
	line-height: 1.2;
	font-family: 'PT Sans', sans-serif;
	font-style: normal;
	font-weight: 400;
	margin: 0;
	padding: 0;
	width: 100%;
	-webkit-text-size-adjust: 100%;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	height: 100%;
}

body {
	min-width: 1800px;
}

.contentpage {	
	min-width: 20px;
}

* {
	outline: none;
	box-sizing: border-box;
}

td,
p {
	margin: 0;
}


/*--------------------------------------------------------*/
/* TYPO*/
/*--------------------------------------------------------*/
h1, h2, h3 {
	margin-top: 0;
	margin-bottom: 3rem;
	line-height: 1.2;
	font-weight: 600
}

h1 {
	font-size: 1.5rem;
	color: #666;
}

.modul_content h1 {
	text-align: center;
    text-transform: uppercase;
	border-bottom: 2px solid #666;
	padding-bottom: 0.5rem;
}


h2 {
	font-size: 1rem;	
	margin-bottom: 0;
}

/*--------------------------------------------------------*/
/* CORPORATE IDENTITY COLORS */
/*--------------------------------------------------------*/
/*Blue*/
.CI-first-color {
	color: rgba(0, 71, 118, 1)
}

/*Yellow*/
.CI-second-color {
	color: rgba(251, 168, 0, 1)
}

.CI-first-bg-color {
	background: rgba(0, 71, 118, 1)
}

.CI-first-bg-color-lighter {
	background: #6691ad;
}

.CI-first-bg-color-light {
	background: #336c91;
}

.CI-first-bg-color-transparent-dark {
	background: rgba(0, 71, 118, 0.9)
}

.CI-second-bg-color {
	background: rgba(251, 168, 0, 1)
}

.CI-second-bg-color-light80 {
	background: rgba(251, 168, 0, 1);
	opacity: 0.8;
}


/*--------------------------------------------------------*/
/* STYLING NICE SELECT, CHECKBOX, INPUT READONLY */
/*--------------------------------------------------------*/
.nice-select.readonly {
	background: rgba(0, 71, 118, 1)
}

.nice-select.readonly:hover {
	cursor: default;
}

.nice-select.readonly:after {
	border-bottom: none;
	border-right: none;
	margin-top: 0;
	-webkit-transform: rotate(0);
	-ms-transform: rotate(0);
	transform: rotate(0);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;	
	background: rgba(255,255,255,0.5);
	background: repeating-linear-gradient(
		-45deg,
		rgba(255,255,255,0.5),
		rgba(255,255,255,0.5) 5px,
		rgba(255,255,255,0.2) 5px,
		rgba(255,255,255,0.2) 10px
	);
}

.checkboxwrapper label.readonly:hover {
	cursor: default;
	
}

.checkboxes .checkmark.readonly {	
	background: rgba(255,255,255,0.5);
	background: repeating-linear-gradient(
		-45deg,
		rgba(255,255,255,0.5),
		rgba(255,255,255,0.5) 5px,
		rgba(255,255,255,0.2) 5px,
		rgba(255,255,255,0.2) 10px
	);
}

.checkboxes:hover .checkmark.readonly, .checkboxes:hover .checkmark.readonly {	
	background: rgba(255,255,255,0.5);
	background: repeating-linear-gradient(
		-45deg,
		rgba(255,255,255,0.5),
		rgba(255,255,255,0.5) 5px,
		rgba(255,255,255,0.2) 5px,
		rgba(255,255,255,0.2) 10px
	);
	cursor: default;
}

input[readonly], textarea[readonly] {	
	background: rgba(255,255,255,0.5);
	background: repeating-linear-gradient(
		-45deg,
		rgba(255,255,255,0.5),
		rgba(255,255,255,0.5) 5px,
		rgba(255,255,255,0.2) 5px,
		rgba(255,255,255,0.2) 10px
	) !important;
}

/*--------------------------------------------------------*/
/* WEEKPLANER */
/*--------------------------------------------------------*/
.mdi-15px.mdi-set, .mdi-15px.mdi:before {
  font-size: 15px;
}

.mdi-16px.mdi-set, .mdi-16px.mdi:before {
  font-size: 16px;
}

.mdi-20px.mdi-set, .mdi-20px.mdi:before {
  font-size: 20px;
}

.icon-spacer {
	width: 25px;
	display: inline-block;
}

#weekplaner {
	width: 100%;
	display: flex;
	align-items: stretch;
	background: #fff;
	position: relative;
}

#weekplaner .overlay-inactive {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(125,125,125,0.5);
	background: repeating-linear-gradient(
		-45deg,
		rgba(125,125,125,0.3),
		rgba(125,125,125,0.3) 5px,
		rgba(125,125,125,0) 5px,
		rgba(125,125,125,0) 10px
	);
}

#weekplaner .rowgrid {
	width: 100%;
}

#weekplaner .rowgrid .rowcell {
	min-height: 120px;
	height: calc((100vh - 156px) / 8);
	width: 100%;
	border-bottom: 1px solid #999;
}

/*
#weekplaner .rowgrid .rowcell:last-of-type  {
	border-bottom: none;
}
*/
/*
#weekplaner .col-first .rowgrid .rowcell:first-of-type {
	min-height: 143px;	
	height: calc(((100vh - 156px) / 8) + 29px);
}
*/


#weekplaner .feiertag{background:#fef1f1;}

#weekplaner .col-day, #weekplaner .col-first {
	border-right: 1px solid #999;
}

.wrap-days {
	width: calc(100% - 33px);
	display: flex;
}

#weekplaner .col-first {
	width: 32px;
}

#weekplaner .col-day {
	position: relative;
	width: calc((100%) / 7);
}

#weekplaner .col-first .col-head {
	height: 52px;
	position: relative;
	line-height: 20px;
}

#weekplaner .col-first .col-head-inner {
	position: absolute;
	left: 0;
	top: 0;
	text-align: center;
	background: #777;
	color: white;
	text-transform: uppercase;
	width: 100%;
	line-height: 26px;
	height: 52px;
}

#weekplaner .col-head {
	text-align: center;
	padding: 0;
	color: white;
	height: 29px;
}

#weekplaner .col-head .amount {
	display: inline-block;
	text-align: center;
	border-radius: 50%;
	background: #fff;
	margin: 5px 1em;
	width: 20px;
	height: 20px;
	flex: none;
}

#weekplaner .sender-admin-info {
	text-align: center;
	padding: 0;
	color: #fff;
	height: 23px;
}

#weekplaner .sender-admin {
	font-size: 15px;
	display: inline-block;
	text-align: center;
	padding: 4px;
	flex: none;
	padding-top: 1px;
	color: #fff;
}

#weekplaner .col-head .date {
	margin: 5px 1em;
	line-height: 20px;
}

#weekplaner .filming-item {
    height: 100%;
	background: #fff;
}

#weekplaner .rowcell_nachbearbeitung .filming-item:last-child {
    border-bottom: 1px solid #999;
}

#weekplaner .filming-item .status {
    text-align: center;
    float: right;
    height: 20px;
    width: 20px;
}

#weekplaner .filming-item-head {
	color: #fff;
	padding: 5px 0.5em 4px 0.5em;
	height: 29px;
}

#weekplaner .filming-item-title {
	width: calc(100% - 2em);
	display: inline-block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#weekplaner .filming-content {
	display: flex;
	flex-wrap: wrap;
	align-content: stretch;
	width: 100%;
	color: #000;
	height: calc(100% - 29px);
}

#weekplaner .filming-content .table-row {
	display: flex;
	align-items: center;
	width: 100%;
	padding-right: 0.25em;
}

#weekplaner .filming-content .table-cell {
	width: 49%;
	display: inline-block;
}

#weekplaner .filming-content {
	font-size: 15px;	
}

#weekplaner .filming-content .mdi {
	margin-right: 0.5em;
}

#weekplaner .filming-content .table-row:nth-of-type(2n) {
	background: rgba(188,212,240,1);
}

#weekplaner .edit_freitext_tb{
	padding:10px;
	background:#f0f0f0;
	font-size: 14px;
	overflow-y: auto;
}
#weekplaner .edit_freitext_mode{border:1px solid #000;}

/*--------------------------------------------------------*/
/* REGISTER */
/*--------------------------------------------------------*/
#registerressources {
	background: rgba(0, 71, 118, 1);
	position: relative;
	bottom: 0;
	left: 0;
	width: 100%;
	display: flex;
	height: 25px;
	z-index: 9;
}

#registerressources .col-day {
	position: relative;
	width: calc((100%) / 7);
}

#registerressources .col-first {
	flex-basis: 1;
	position: relative;
	width: 32px;
	border-right: 1px solid #777;
}

#registerressources .available-ressources {
	position: absolute;
	z-index: 10;
	top: 0;
	left: 0;
	width: 100%;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;	
	border-right: 1px solid #777;
}

#registerressources .available-ressources.active {	
	transform: translateY(calc(-100% + 25px));
}

#registerressources .available-ressources.active .ressource-category {
	display: block;
}	

#registerressources .register {
	position: relative;
	height: 25px;
	cursor: pointer;
}

#registerressources .register::after {
    position: absolute;
    content: "";
    top: 3px;
    left: 50%;
	transform: translateX(-50%) rotate(180deg);
    width: 0;
    height: 0;
    border: 6px solid transparent;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-left-color: transparent;
    border-color: #fff transparent transparent transparent;
}

#registerressources .available-ressources.active .register::after {	
    top: 9px;
    border-color: transparent transparent #fff transparent;
}

#registerressources .ressource-category {
	position: relative;
	width: 100%;
	display: none;
}

#registerressources .ressource-category, #registerressources .ressource-item {
	line-height: 1;
	font-size: 15px;
	padding: 0.5rem;
	border-top: 1px solid #fff;
	color: #fff;
	height: 33px;
}

#registerressources .open-ressource-items {
	cursor: pointer;
}

#registerressources .ressource-category-head {	
	padding: 0.25em 0.25em 0.25em 0.25em;
	text-transform: uppercase;
	font-size: 18px;
	line-height: 22px;
}

#registerressources .ressource-category-head .mdi {
	height: 22px;
}

#registerressources .close-ressource {	
	cursor: pointer;
}

#registerressources .close-ressource:hover {	
	opacity: .75;
}

#registerressources .ressource-category::after {
    position: absolute;
    content: "";
    top: 10px;
    right: 5px;
	transform: translateX(0) rotate(-90deg);
    width: 0;
    height: 0;
    border: 6px solid transparent;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-left-color: transparent;
    border-color: #fff transparent transparent transparent;
}

#registerressources .status {
	float: right;
    text-align: center;
    border-radius: 50%;
    background: #fff;
    margin-right: 2em;
    width: 18px;
    height: 18px;
    padding-top: 2px;
}

#registerressources .ressource-items-wrapper {
	display: none;
	z-index: 20;
	position: absolute;	
	right: -1px;
	bottom: 33px;
	width: 100%;
	transform: translateX(100%);
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}

#registerressources .col-day:last-of-type .ressource-items-wrapper {	
	right: 1px;
	transform: translateX(-100%);	
} 

#registerressources .ressource-items-wrapper.active {
	display: block;
}

#registerressources .inactive-ressource {
	text-decoration: line-through;
}

/*--------------------------------------------------------*/
/* BROADCAST*/
/*--------------------------------------------------------*/
#broadcasts, #broadcasts_extra {
	position: relative;
	font-size: 15px;
	width: 100%;
	display: flex;
	min-height: 100px;
	border-top: 1px solid #999;
	background: #fff;
	z-index: 10;
}
#broadcasts_extra {
	min-height: 1px;
	background:#f0f0f0;
}

#broadcasts [class^="col"], #broadcasts_extra [class^="col"] {
	border-right: 1px solid #999;
}

#wrap-days {
	width: 100%;
	display: flex;	
}

#broadcasts .col-first, #broadcasts_extra .col-first {	
	flex-basis: 1;
	background: #777;
	position: relative;
	width: 31px;	
}

#broadcasts .title, #broadcasts_extra .title {	
	top: 0;
	left: -3px;
	transform: rotate(-90deg) translate(-200%,1px);
	text-transform: uppercase;
	color: #fff;
}

#broadcasts .col-day, #broadcasts_extra .col-day {
	width: calc((100%) / 7)
}

#broadcasts .broadcast-record, #broadcasts_extra .broadcast-record {
	line-height: 1;
	font-size: 14px;
	padding: 0.5em;
	border-top: 1px solid #999;
	background: #fff;
}

#broadcasts .broadcast-record:first-of-type, #broadcasts_extra .broadcast-record:first-of-type, #weekplaner .broadcast-record:first-of-type {
	border-top: none;
}

#broadcasts .broadcast-record:last-of-type {
	border-bottom: 1px solid #777;
	margin-bottom: 22px;
}


#broadcasts .short_record{
	display: block;
	width:calc(100% - 40px);
	float:left;
}

#broadcasts .duration, #weekplaner .duration {
	float: right;
}

#broadcasts_extra .edit_freitext_sd{
	background:#f0f0f0;
	padding:10px;
	min-height: 34px;
}
#broadcasts_extra .edit_freitext_mode{
	border:1px solid #000 !important;
}

/*--------------------------------------------------------*/
/* CUSTOM STYLE CHECKBOX*/
/*--------------------------------------------------------*/
.checkboxwrapper {	
	margin-top: 2px;
}

.checkboxwrapper label {	
	float: left;
}

.checkboxes {
	display: inline-block;
	margin-bottom: 16px;
	text-align: left;
}

.checkboxes label {
	padding-left: 2em;
	width: auto;
	margin-right: 3em;
}
/* The checkboxcontainer */
.checkboxcontainer {
	position: relative;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
/* Hide the browser's default checkbox */
.checkboxcontainer input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}
/* Create a custom checkbox */
.checkmark {
	position: absolute;
	top: 0;
	left: 0;
	margin: 7px 0;
	height: 20px;
	width: 20px;
	background-color: #eee;
}
/* On mouse-over, add a grey background color */
.checkboxcontainer:hover .checkmark {
	background-color: #ccc;
}
/* When the checkbox is checked, add a blue background */
.checkboxcontainer .checkmark.checked {
	background-color: rgba(251, 168, 0, 1);
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
	content: "";
	position: absolute;
	display: none;
}
/* Show the checkmark when checked */
.checkboxcontainer .checkmark.checked:after {
	display: block;
}
/* Style the checkmark/indicator */
.checkboxcontainer .checkmark:after {
	left: 8px;
	top: 4px;
	width: 5px;
	height: 10px;
	border: solid white;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}


/*--------------------------------------------------------*/
/* ICON-DROPDOWNS MENULEISTE OBEN*/
/*--------------------------------------------------------*/
.wrapper-dropdown ul.dropdown {
	margin: 0;
	padding: 0;
	list-style: none;
}

.wrapper-dropdown {
    position: relative;
    margin: 0 auto;
    cursor: pointer;
    outline: none;
}

.wrapper-dropdown .dropdown {
	border-top: 4px solid rgba(0, 71, 118, 1);
	width: 200px;
    position: absolute;
    top: 100%;
    left: 0;
    opacity: 0;
    pointer-events: none;
	z-index: 10;
}

.wrapper-dropdown:hover .dropdown {
    opacity: 1;
    pointer-events: auto;
}

.wrapper-dropdown .dropdown li {    
	padding: .5rem;
}

.wrapper-dropdown .dropdown li:hover {    
	background: rgba(255,255,255,0.2);
}

/*--------------------------------------------------------*/
/* BENUTZERVERWALTUNG*/
/*--------------------------------------------------------*/
#BenutzerModal .pwd_info {
	margin-bottom: 16px;
}

#benutzer_liste, #sick_liste, #cvd_liste, #fahrzeug_liste, #kamera_liste {
	width: 100%;
	display: table;
}

#benutzer_liste .buttons-useradmin, #sick_liste .buttons-useradmin, #cvd_liste .buttons-useradmin, #fahrzeug_liste .buttons-useradmin, #kamera_liste .buttons-useradmin{
	text-align: right;
}

#benutzer_liste div[class^="user_"], #benutzer_liste_archiv div[class^="user_"], #sick_liste div[class^="sick_"], #cvd_liste div[class^="cvd_"], #fahrzeug_liste div[class^="fahrzeug_"], #kamera_liste div[class^="kamera_"] {
	line-height: 38px;
	display: table-row;
}

#benutzer_liste div[class^="user_"] div, #benutzer_liste_archiv div[class^="user_"] div, #sick_liste div[class^="sick_"] div, #cvd_liste div[class^="cvd_"] div, #fahrzeug_liste div[class^="fahrzeug_"] div, #kamera_liste div[class^="kamera_"] div {
	padding: 0 10px;
	display: table-cell;
}

#benutzer_liste .name, #benutzer_liste_archiv .name, #sick_liste .name, #cvd_liste .name, #fahrzeug_liste .name, #kamera_liste .name {
	padding-top: 5px;
}

#benutzer_liste div[class^="user_"]:nth-child(odd), #benutzer_liste_archiv div[class^="user_"]:nth-child(odd), #sick_liste div[class^="sick_"]:nth-child(odd), #cvd_liste div[class^="cvd_"]:nth-child(odd), #fahrzeug_liste div[class^="fahrzeug_"]:nth-child(odd), #kamera_liste div[class^="kamera_"]:nth-child(odd) {
	background: rgba(255,255,255,0.1);
}

/*--------------------------------------------------------*/
/* LOGIN-FORM*/
/*--------------------------------------------------------*/
#loginmodal-wrapper {
	padding: relative;
	height: 100vh;
	width: 100vw;
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url("/assets/img/lake-forggensee-250745_1920.jpg");
	background-size: cover;
	background-origin: center center;
	background-repeat: no-repeat;
}

#loginmodal {
	font-size: 18px;
	padding: 1em;
	color: #fff;
	width: 30%;
	border-radius: 10px;
	text-align: center;
	position: relative;
}

#loginmodal ul{list-style-type: none; padding:0; margin:0;}

#loginmodal .loginmodal-content {
	margin: 0 auto;
	width: 70%;
}

#loginmodal .company-logo {
	margin: 1em 2em;
}

#loginmodal .login-options {
	display: flex;	
	justify-content: space-between;
	flex-wrap: wrap;
	font-size: 16px;
}

#loginmodal .login-options a {
	color: #fff;
	text-decoration: underline;
}

#loginmodal .login-options label {
	cursor: pointer;
}

#loginmodal .login-options .forgot-pwd {
	margin: 10px 0;
}

#loginmodal input[type=text],
#loginmodal input[type=password] {
	font-size: 18px;
	width: 100%;
	padding-left: 20px;
	padding-right: 20px;
	margin: 10px 0;
	display: inline-block;
	border: none;
	box-sizing: border-box;
	border-radius: 0;
}

#loginmodal button, #BenutzerModal button.formbutton, #RessourceModal button.formbutton, #UserPasswordChange button.formbutton, button.savebutton, #CVDModal button.formbutton {
	font-size: 18px;
	color: #fff;
	padding: 9px 20px;
	margin: 8px 0;
	border: none;
	border-radius: 0;
	cursor: pointer;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

#loginmodal button:hover, #BenutzerModal button.formbutton:hover, #RessourceModal button.formbutton:hover {
	color: #000;
	background: #fff;
}

#loginmodal-wrapper label{display: none;}
#loginmodal-wrapper .form-group{margin:0;}
#loginmodal-wrapper .btn{border-radius:0;}

#UserPasswordChange button.formbutton:hover, button.savebutton:hover {
	color: #fff;
	background: rgba(0, 71, 118, 1);
}


/* Add Animation */
.animate {
	-webkit-animation: animateslidein 0.8s;
	animation: animateslidein 0.8s
}

@-webkit-keyframes animateslidein {
	from {
		-webkit-transform: translateY(-200%)
	}
	to {
		-webkit-transform: translateY(0)
	}
}

@keyframes animateslidein {
	from {
		transform: translateY(-200%)
	}
	to {
		transform: translateY(0)
	}
}

/*--------------------------------------------------------*/
/*RESPONSIVE MEDIA QUERIES*/
/*--------------------------------------------------------*/
@media screen and (max-width: 1280px) {
	#loginmodal {
		width: 50%;
	}	
}

@media screen and (max-width: 768px) {
	#loginmodal {
		width: 70%;
	}
	
	#loginmodal .company-logo {
		margin: 1em 1em;
	}
}

@media screen and (max-width: 480px) {
	#loginmodal {
		width: 90%;
	}
	
	#loginmodal .company-logo {
		margin: 1em 0;
	}
}

/*--------------------------------------------------------*/
/*ALLGEMEIN*/
/*--------------------------------------------------------*/
hr {
	margin-top: 3rem;
	margin-bottom: 3.5rem;
	border-width: 0;
	border-top: 1px solid #fff;
}

hr.one-rem-top-zero-bottom {	
	margin-top: 1rem;
	margin-bottom: 0rem;
	border-width: 0;
	border-top: 1px solid #333;
}

hr.one-rem-top-two-rem-bottom {	
	margin-top: 1rem;
	margin-bottom: 2rem;
	border-width: 0;
	border-top: 1px solid #333;
}

hr.one-rem-top-one-rem-bottom {	
	margin-top: 1rem;
	margin-bottom: 1rem;
	border-width: 0;
	border-top: 1px solid #333;
}

hr.line-topicsheet {
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	border-width: 0;
	border-top: 1px solid #fff;
}

.floatleft {
	float: left;
}

.floatright {
	float: right;
}

.margin-bottom-1rem {
	margin-bottom: 1rem;
}

.margin-bottom-2rem {
	margin-bottom: 2rem;
}

.margin-top-1rem {
	margin-top: 1rem;
}

.margin-top-2rem {
	margin-top: 2rem;
}

.textalign-center {
	text-align: center;
}

.overflowellipsis {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.visibilityhidden {
	visibility: hidden;
}

.displaynone {
	display: none !important;
}

.uppercase {
	text-transform: uppercase;
}

.clearfix:after {visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

/*--------------------------------------------------------*/
/*SCHEDULER*/
/*--------------------------------------------------------*/
/*
header .avatar {
	top: -0.3em;
	left: 0.25em;	
	position: absolute;
	width: 80px;
	height: 80px;
	border-radius: 50%;
}

header .avatar  img {
	width: 100%;
}
*/

header {
	color: #fff;
	width: 100%;
	position: relative;
}

header #headtop, header #headbottom {	
	padding: 0.25em 0.5em 0.25em 0.5em;
}

header #topmenu, header #bottommenu {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

header .user {
	margin-left: 10px;
	margin-right: 1em
}

header .user > span {
	display: block;
}

header .buttonsection {
	display: flex;
	align-items: center;
}

header .buttonsection a:hover, .wrapper-dropdown:hover {
	background: rgba(255,255,255,0.2);
}

.mdi {
	margin: 0 5px;
	padding: 0;
}

.cursorpointer {
	cursor: pointer;
}

header #dropdown-current-articles .mdi-window-close, header #dropdown-halde .mdi-window-close {	
	cursor: pointer;
}

header #dropdown-current-articles .mdi-window-close:hover, header #dropdown-halde .mdi-window-close:hover {	
	opacity: 0.75;
}

header .buttonsection .company-logo {
	display: inline-block;
	width: 100px;
	margin-left: 2em;
}

header .searchevent {
	background: #fff;
	height: 34px;
	margin-left: 5px;
	border: none;
	border-radius: 4px;
	float: right;
	padding: 0;
}

header .form-control {
	border: none;
	width: 200px;
	height: 34px;
}

/*-----------------------Dropdown----------------------*/
header #dropdown-current-articles, header #dropdown-live-search-articles, header #dropdown-halde {
	display: none;
	width: calc(100% + 1em);
	padding: 0 1em 0 1em;
	z-index: 99;
	margin-left: -0.5em;
}

header #dropdown-live-search-articles {
	display: block;
}

header #articles-wrapper {
	position: relative;
	min-height:200px;
}

header .flex-container {	
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;	
}

header .flex-item {
	border-left: 1px solid #fff;
	padding-left: 1em;	
	margin: 1em 2em 1em 0;
}

header #dropdown-current-articles .mdi, header #dropdown-halde .mdi {
	margin: 0;
	padding: 0;
}

header #sidebar .mdi {
	top: .5em;
	position: relative;
	margin-left: -3px;
}

header #close-current-articles.mdi, header #close-halde.mdi {
	position: absolute;
	top: 100%;
	left: -3px;
	transform: translateY(-115%);
}

header #sidebar {
	padding-right: 12px;
	height: 100%;
	float: left;
	display: inline-block;
	position: relative;
}

header #sidebar-title {
	position: absolute;
	top: 0;
	left: 0;
	transform: rotate(-90deg) translate(-130%,-11px);
}

header .status {
	text-align: center;
	background: #fff;
	float: right;
	height: 18px;
	width: 18px;
	margin-left: 1.5em;
}

/*-----------------------Live Search Content----------------------*/
#dropdown-live-search-articles table {
	width: 100%;
	border-collapse: collapse;
	margin: 1em auto;
}

#dropdown-live-search-articles th,
#dropdown-live-search-articles td {
	padding: 10px 10px;
}

#dropdown-live-search-articles th {
	background-color: #fff;
}

#dropdown-live-search-articles th[data-sort] {
	cursor: pointer;
}

/* just some random additional styles for a more real-world situation */
#dropdown-live-search-articles #msg {
	color: #0a0;
	text-align: center;
}

/* zebra-striping seems to really slow down Opera sometimes */
#dropdown-live-search-articles tr:nth-child(even) > td {
/*	background-color: #f9f9f7;*/
}

#dropdown-live-search-articles tr:nth-child(odd) > td {
	background-color: rgba(255,255,255,0.1);
}

.no_search_result{margin:10px 0;}

/*--------------------------------------------------------*/
/*THEMENBLATT*/
/*--------------------------------------------------------*/
.ThemenblattLinkItem {
	width: 30px;
	display: inline-block;
	text-align: center;
	cursor: pointer;
	padding: 6px 10px;
	margin-left: 5px;
	background: rgba(251, 168, 0, 0.8);
}

.ThemenblattLinkItem.active {	
	background: rgba(251, 168, 0, 1);
}

/*
.ThemenblattItem, .UserAdminItem {
	display: block;
	border-left: 10px solid rgba(251, 168, 0, 1);
	padding-bottom: 2em;
}
*/

#ThemenblattModal .modal-footer button {
	font-size: 18px;
	color: #fff;
	padding: 9px 20px;
	margin: 8px 0;
	border: none;
	border-radius: 0;
	cursor: pointer;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

#ThemenblattModal .modal-footer button:hover {
	color: #000;
	background: #fff;	
}

#ThemenblattModal .status-saved::before {
	color: greenyellow;
}

.themeblattForward, .themeblattBack, #printThemenblatt, #saveThemenblatt, #inbox, #OpenBenutzerModal, .user_edit, .user_passwortreset, .user_status, #user_achiv, #user_verwaltung, .buttonsection .mdi {cursor: pointer;}

#ThemenblattModal .modal-body, #BenutzerModal .modal-body, #BenutzerModalArchiv .modal-body, #UserPasswordChange .modal-body, .small-menu-modal .modal-body, #CVDModal .modal-body, #RessourceModal .modal-body {
	padding: 0;
}

.modal-content {
	color: #fff;
	border-radius: 0;
}

.modal-top {
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.modal-content .close {
	opacity: 1;
}

.modal-navi {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1em;
}

.modal-content .buttonsection, .modal-navi .buttonsection {
	display: flex;
	align-items: center;
}

.modal-content .editingPersons span {
	display: block;
	font-size: 11px;
}

.modal-content .buttonsection a:hover {
	background: rgba(255,255,255,0.2);
}

.modal-content .formsection .form-group {
	display: flex;
	flex: wrap;
	justify-content: space-between;
	width: 100%;
}

.modal-content .formsection {
	margin: 0;
	display: block;
	border-left: 10px solid rgba(251, 168, 0, 1);
	padding-bottom: 2em;
}

.modal-content .formsection label {
	margin-right: 1em;
	line-height: 38px;
	font-weight: 700;
	text-align: left;
	width: 120px;
	margin-bottom: 0;
	flex: none
}

.modal-sm {
    max-width: 350px;
}

.small-menu-modal .modal-content .formsection label {
	width: 4rem !important;
}

.modaltitle {
	padding: 12px 0;
}

.modal-content .zwischentitel {
	margin-right: 1em;
	font-weight: 700;
	text-align: left;
	width: 120px;
}

.modal-content .zwischentitel ~ .mdi {
	position: absolute;
	top: 0;
	right: 8px;
	line-height: 16px;
}

.add_field_button{cursor: pointer;}

.modal-content .formsection .label-2nd {
	text-align: left;
	width: auto;
}

.modal-content .formsection .label-2nd-adminuser {
	text-align: left;
	width: 85px;
}

.modal-content .deleterow {
	position: absolute;
	top: 10px;
	right: 8px;
	line-height: 16px;
}

.modal-content .formsection input, .modal-content .formsection textarea {
	color: #fff;
	background: none;
	border-radius: 0;
	border: none;
	border-bottom: 1px solid #fff;
	margin-bottom: 16px;
}

.modal-content .formsection input:-moz-read-only {
	color: #fff;
}

.modal-content .formsection textarea:-moz-read-only {
	color: #fff;
}

.modal-content .formsection input:read-only {
	color: #fff;
} 

.modal-content .formsection textarea:read-only {
	color: #fff;
} 

.modal-content .formsection .shorterinput {
	width: 100%;
	margin-right: 1.5em;
}

.modal-content .formsection input:focus, .modal-content .formsection textarea:focus {
	box-shadow: none;
	background: rgba(255,255,255,0.2);
}

.modal-content .form-group {
	margin-bottom: 0;
}

/*--------------------------------------------------------*/
/*SMALL MODAL, GRAY BACKGROUND*/
/*--------------------------------------------------------*/
.graybg {	
	background: #f7f7f7;
}

.colorgray {
	color: #333;
}

.graybg .formsection input {
	color: #555;
	border-bottom: 1px solid #333;
	margin-bottom: 32px;
}

.graybg .formsection input:focus {
	background: rgba(0,0,0,0.1);
}

#UserPasswordChange .formsection label {	
	line-height: 1.5em;
}

#UserPasswordChange .modal-content .formsection, .small-menu-modal .modal-content .formsection {
	margin-top: 1em;
	display: block;
	border-left: none;
}

#UserPasswordChange .modal-content .formsection label, .small-menu-modal .modal-content .formsection label {
	width: 100%;
}

/*--------------------------------------------------------*/
/*FILEUPLOAD*/
/*--------------------------------------------------------*/
#FileCarouselContainer, #UploadContainer {
	margin-top: 1em;
}

#FileCarouselContainer {
	height: 150px;
	width: 100%;
}

#FileCarouselContainer .carousel-item  {
	text-align: center;
}

#FileCarouselContainer .carousel-item img {
	height: 100%;
}

#FileCarouselContainer p {
	color: #fff;
	background:#000;
	word-wrap: break-word;
}

#UploadContainer {
	text-align: center;
	color: #777;
	border: 2px dashed #fff;
}

#UploadContainer #drop {
	padding: 40px 50px;
	margin-bottom: 30px;
	border: 20px solid rgba(0, 0, 0, 0);
	border-radius: 3px;
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;
	z-index: 2;
}

#UploadContainer .custombutton {
	display: block;
	color: #fff;
	padding: 9px 20px;
	margin: 8px 0;
	border-radius: 0;
	cursor: pointer;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

#UploadContainer .custombutton:hover {
	color: #000;
	background: #fff;
}

#drop input {
	display: none;
}

#upload ul {
	list-style: none;
	margin: 0 -30px;
	border-top: 1px solid #2b2e31;
	border-bottom: 1px solid #3d4043;
}

#upload ul li {
	background-color: #333639;
	background-image: -webkit-linear-gradient(top, #333639, #303335);
	background-image: -moz-linear-gradient(top, #333639, #303335);
	background-image: linear-gradient(top, #333639, #303335);
	border-top: 1px solid #3d4043;
	border-bottom: 1px solid #2b2e31;
	padding: 15px;
	height: 52px;
	position: relative;
}

#upload ul li input {
	display: none;
}

#upload ul li p {
	width: 144px;
	overflow: hidden;
	white-space: nowrap;
	color: #EEE;
	font-size: 16px;
	font-weight: bold;
	position: absolute;
	top: 20px;
	left: 100px;
}

#upload ul li i {
	font-weight: normal;
	font-style: normal;
	color: #7f7f7f;
	display: block;
}

#upload ul li canvas {
	top: 15px;
	left: 32px;
	position: absolute;
}

#upload ul li span {
	width: 15px;
	height: 12px;
	position: absolute;
	top: 34px;
	right: 33px;
	cursor: pointer;
}

#upload ul li.working span {
	height: 16px;
	background-position: 0 -12px;
}

#upload ul li.error p {
	color: red;
}


/*--------------------------------------------------------*/
/*FOOTER*/
/*--------------------------------------------------------*/
footer {
	border-top: 1px solid #777;
	position: relative;
	z-index: 10;
}

footer > div {
	height: 25px;
	width: 100%;
}

/* Ergänzungen Chris */
#loginmodal .company-logo {max-width:306px;}

.imprint{position: absolute; top:1rem; right:1rem; font-size:12px; /*height:12px;*/ overflow: hidden; color:#555; z-index: 2;}
.imprint a{font-size:12px; color:#555;}
.wrapper_content {
	width:100%; 
	max-width: 100vw;
    min-height: 100vh;
	position: relative;
}

.wrapper_content:before {
	content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    min-height: 100vh;
	height: 100%;
    z-index: -1;
    opacity: 0.1;
	width:100%; 
	max-width: 100vw;
	background-image: url('../img/allgaeutv-logo_blue.svg');
	background-size: contain;
	background-position: center bottom;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

.modul_content {	
    min-height: 100vh;
	text-align: left; 
	margin:0 auto;
	padding: 10vh 0;
	width: 100%;
	max-width: 1024px; 
	color: #333; 
	line-height: 24px;
}

@media screen and (max-width: 1280px) {
	.modul_content {
		padding-left: 20px;
		padding-right: 20px;
	}
}

.modul_content p{margin-bottom:15px;}
.modul_content a{color:#333; text-decoration: underline;}


#BenutzerModal .btn {line-height: 2em; padding: 0;}

.ThemenblattItem{display: none;}
.saveStatus{width:46px;}
#status-saved{display: none;}
#status-error{display: none;}
#ThemenblattModal .status-error::before {
	color: red;
}

.OpenThemenblattModal{cursor: pointer;}
#ThemenblattModal input.error{background:#ff9494;}

#o-ton-fields .row{position: relative;}
.new_nachbearbeitung_input, .new_nachbearbeitung2_input, .new_sg_input {position: relative;}

#FileCarouselContainer .carousel-item {
    height: 150px;
}
#FileCarouselContainer .carousel-item img {
    height:auto;
}
.carousel-caption{
	bottom:10px;
	padding-bottom: 0px;
}

#pdfdownload {
	width: 100%;
	border-top: 1px solid #fff;
}

#pdfdownload p {
	padding: 10px 0 0 10px;
}

#pdfdownload a {
	display: block;
	color:#fff;
	text-decoration: underline;
	padding: 0 0 10px 10px;
}

#pdfdownload a:hover{text-decoration: none;}

.deleteFile{position: absolute; top:10px; right:45%; display:none; cursor: pointer; background: rgba(251, 168, 0, 1);}
.deleteFile:hover{background: rgba(251, 168, 0, 0.8);}
#FileCarousel:hover .deleteFile{display:block;}

a.save_ok, a.save_ok:hover{background: rgba(0,208,0,1) !important;}
a.save_error, a.save_error:hover{background: rgba(208,0,0,1) !important;}

#benutzer_info, #cvd_info, #fahrzeug_info, #kamera_info {
	border-top: 1px solid #fff;
}

#benutzer_neu input.error, #benutzer_neu select.error, #benutzer_edit input.error, #benutzer_edit select.error, .custom-select-field .error, #reportSicknessModal input.error, #reportHolidayModal input.error, #reportEventModal input.error, #benutzer_sick input.error, .nice-select.error, #CVDModal input.error, #fahrzeug_neu input.error, #kamera_neu input.error, #fahrzeug_edit input.error, #kamera_edit input.error{background:#ff9494;}

.benutzer_neu_error {
	text-align: center;
	padding: 10px;
	background: red;
	color:#fff;
}
.benutzer_neu_info {
	text-align: center;	
	padding: 10px;
	background: green;
	color:#fff;
}

.user_inaktiv, .fahrzeug_inaktiv, .kamera_inaktiv{color:#838383;}
#benutzer_edit, #benutzer_sick, #fahrzeug_edit, #kamera_edit{display: none;}

#benutzer_liste a, #benutzer_liste_archiv a, #sick_liste a, #cvd_liste a, #fahrzeug_liste a, #kamera_liste a{cursor: pointer; display: inline-block;}
#benutzer_liste a:hover, #benutzer_liste_archiv a:hover, #sick_liste a:hover, #cvd_liste a:hover, #fahrzeug_liste a:hover, #kamera_liste a:hover{background: rgba(255,255,255,0.2);}

.icon_disabled .mdi-light{cursor: auto !important;}
.icon_disabled .mdi-light::before{color:#838383 !important;}

/* Drag&Drop */
#ablage_content .active{background: rgba(0, 71, 118, 1); z-index: 99999999;}
.filming-item.active{background: #fff; z-index: 99999999;}

.rowgrid.aktivepossible{background:#f4f4f4; border:1px solid #004776;}
#dropdown-current-articles.aktivepossible, #dropdown-halde.aktivepossible{background:#00568f;}
.filming-item.aktivepossible{background:#f4f4f4 !important; border:1px solid #004776;}

.XXXressource-item .active{background:#000;}
.draggable_rs{padding:5px;}
.draggable_fake{padding:5px;}
.ressource-item .mdi{margin:0;}

.movecursor{cursor:move;}

.kamera_row{position: relative;}
.kamera_row .form-group{width:calc(100% - 20px) !important;}
.kamera_row i{position:absolute; top:0 !important; right:-10px !important;}

.fahrzeug_row{position: relative;}
.fahrzeug_row .form-group{width:calc(100% - 20px) !important;}
.fahrzeug_row i{position:absolute; top:0 !important; right:-10px !important;}

.not_available{color:#ff0000;}

.no_ie{display:none; color:#ff0000; background:#fff; padding:10px;}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.XXXloginmodal-content{display: none !important;}
	.XXXno_ie{display:block;}
}

@media not all and (min-resolution:.001dpcm) { @media {
	.XXXloginmodal-content{display: none !important;}
	.XXXno_ie{display:block;}
}}

.kernsatz_text{cursor: pointer;}