@charset "utf-8";
/* CSS Document */
body {
	margin:0;
	padding:0;
	text-align: center;
	font-family: Roboto,Helvetica Neue,Arial,sans-serif;
	font-size: 12px;
	background-color: #f9fafc;
    background-image: url("../img/background01.jpg");
    background-size: cover;
}

a:link {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:active {
  text-decoration: none;
}

select {
  font-family: 'FontAwesome', 'DuepuntozeroProBold';
}

/* td */

.text_td {
  font-size: 14px;
  color: #52545c;
}

.table_td:hover {
  font-size: 14px;
  color: #ef4f98;
  background-color: #efefef;
  text-decoration: none;
}

/* td line-through */

.text_td_line_through {
  font-family: DuepuntozeroProBold;
  font-size: 14px;
  color: #52545c;
  background-color: #A7A4A4;
  text-decoration: line-through;
}

.text_td_line_through:hover {
  font-family: DuepuntozeroProBold;
  font-size: 14px;
  color: #ef4f98;
  background-color: #efefef;
  text-decoration: line-through;
}

/* Search */

.search_field_background {
  border-radius: 10px;
  background-color: #07516a;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.search_field_background_icons {
	color:#fff;
	font-size: 30px;
}

.search_field_text {
  margin-left: 20px;
  text-align: center;
  color: #fff;
  font-size: 22px;
  font-family: DuepuntozeroProBold;
}


/* timeCARD 3.0 */

.timeCARD_3_background {
  border-radius: 10px;
  background-color: #07516a;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
  background-image: url(../img/timeCARD_qrcode.png);
  background-repeat: no-repeat;
  background-position: right bottom;
  padding-right: 40px; /* Je nach Größe des Icons anpassen */
}

.timeCARD_3_headline {
  font-size: 24px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

.timeCARD_3_headline a{
  font-size: 24px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

.timeCARD_3_subheadline {
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

.timeCARD_3_card_number {
  font-size: 24px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

.timeCARD_3_card_valid {
  font-size: 14px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

.timeCARD_3_no_picture {
  font-size: 80px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

/* Header */

.header {
  z-index: 99997;
  position: fixed;
  left: 0;
  top: 0;
  margin-left: 60px;
  width: 100%;
  height: 60px;
  background-image: url(../img/header.jpg);
  background-color: #2264b0;
}
.page-info-btn {
  margin-left: 20px;
  margin-top: 15px;
  max-width: 900px;
  text-align: left;
  color: #ffffff;
  opacity: .7;
  font-size: 22px;
  font-family: DuepuntozeroProBold;
}


/* Footer */

.footer {
  z-index: 99999;
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 40px;
  text-align: center;
  background-image: url(../img/background_footer.jpg);
}

.footer_text {
	font-size: 12px;
	color: #d8d9da;
}
.footer_text a{
	font-size: 12px;
	color: #d8d9da;
}

.footer_text_green {
	font-size: 12px;
	color: #04FF04;
}

/* Sidebar */

.sidebar {
	z-index: 99998;
	position: fixed;
	background-color: #202426;
	height: 100%;
	width: 60px;
	left: 0px;
	padding: 0px;
	top: 0px;
	margin-top: 0px;
	margin-left: 0px;
	margin-bottom: 0px;
	box-shadow: 5px 0 10px -5px #52545c;
}
.sidebar_icons {
	color:#e9edf2;
	opacity: .7;
	font-size: 20px;
	width: 60px;
}
.sidebar_logo {
	background-color: #081f3f;
    height: 60px;
}

/* h1,h2,h3,h4 tags */

.h4 {
  margin-left: 20px;
  text-align: left;
  color: #fff;
  font-size: 22px;
  font-family: DuepuntozeroProBold;
}

/* WELCOME TITLE */

.welcome_title {
    font-size: 30px;
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    font-family: DuepuntozeroProBold;
    text-shadow: 3px 3px 4px #777;
}

.welcome_subtitle {
    font-size: 18px;
    color: #fff;
    text-decoration: none;
    font-weight: 300;
    text-shadow: 3px 3px 4px #777;
    font-family: DuepuntozeroProBold;
}

/* BIRTHDAY DASHBOARD */

.birthday_text {
    font-size: 16px;
    color: #fff;
    text-decoration: none;
    font-family: DuepuntozeroProBold;
}

.birthday_text_icon {
    font-size: 24px;
    color: #fff;
    text-decoration: none;
    font-family: DuepuntozeroProBold;
}

.birthday_text a {
    font-size: 16px;
    color: #07516a;
    text-decoration: none;
    font-family: DuepuntozeroProBold;
}

/* ASSIGNMENTS DASHBOARD */

.assignments_text {
    font-size: 16px;
    color: #fff;
    text-decoration: none;
    font-family: DuepuntozeroProBold;
}

.assignments_text_icon {
    font-size: 24px;
    color: #fff;
    text-decoration: none;
    font-family: DuepuntozeroProBold;
}

.assignments_text a {
    font-size: 16px;
    color: #07516a;
    text-decoration: none;
    font-family: DuepuntozeroProBold;
}

/* BUTTONS */

.icon_button {
  margin-left: 20px;
  text-align: center;
  color: #fff;
  font-size: 60px;
}

.button_dashboard_green {
  border-radius: 10px;
  background-color: #00c3ed;
}

.button_dashboard_green:hover {
  background-color: #fd9b10;
  border-radius: 10px;
  opacity: .9;
}

.button_dashboard_orange {
  border-radius: 10px;
  background-color: #087fa7;
}

.button_dashboard_orange:hover {
  background-color: #fd9b10;
  border-radius: 10px;
}

.button_dashboard_erweiterungen {
  border-radius: 10px;
  background-color: #ef4f98;
}

.button_dashboard_erweiterungen:hover {
  background-color: #fd9b10;
  border-radius: 10px;
}


/* HEADLINES */

.text_headline {
  font-size: 22px;
  color: #52545c;
  text-decoration: none;
  font-weight: 600;
  font-family: DuepuntozeroProBold;
}
.text_headline_small {
  font-size: 19px;
  color: #52545c;
  text-decoration: none;
  font-family: DuepuntozeroProBold;
}
.text_headline_h1 { 
  font-size: 24px;
  color: #67696c;
  font-family: DuepuntozeroProBold;
}

.dashboard_text_headline_box {
  font-size: 14px;
  text-align: left;
  color: #07516a;
}

/* TITLES */

.titel_dashboard_blue {
  border-radius: 5px;
  background-color: #07516a;
}

.titel_dashboard_green {
  border-radius: 5px;
  background-color: #00cc00;
}

.titel_dashboard_lightblue {
  border-radius: 5px;
  background-color: #00c3ed;
}

/* BUTTONS */

.button_v3_blue {
  border-radius: 10px;
  background-color: #00c3ed;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.button_v3_blue:hover {
  background-color: #00c3ed;
  border-radius: 10px;
  opacity: .6;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.text_button_v3_blue {
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.button_icon_v3_blue {
	color:#fff;
	font-size: 30px;
}

.button_v3_green {
  border-radius: 10px;
  background-color: #02da1b;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.button_v3_green:hover {
  background-color: #02da1b;
  border-radius: 10px;
  opacity: .6;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.text_button_v3_green {
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.button_icon_v3_green {
	color:#fff;
	font-size: 30px;
}

.button_v3_pink {
  border-radius: 10px;
  background-color: #ef4f98;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.button_v3_pink:hover {
  background-color: #ef4f98;
  border-radius: 10px;
  opacity: .6;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}


.button_add_green {
  border-radius: 10px;
  background-color: #02da1b;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.button_add_green:hover {
  background-color: #02da1b;
  border-radius: 10px;
  opacity: .6;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.button_add_green_icons {
	color:#fff;
	font-size: 30px;
}

.button_add_blue {
  border-radius: 10px;
  background-color: #00c3ed;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.button_add_blue:hover {
  background-color: #00c3ed;
  border-radius: 10px;
  opacity: .6;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.button_add_blue_icons {
	color:#fff;
	font-size: 30px;
}

.button_add_pink {
  border-radius: 10px;
  background-color: #ef4f98;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.button_add_pink:hover {
  background-color: #ef4f98;
  border-radius: 10px;
  opacity: .6;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.button_add_pink_icons {
	color:#fff;
	font-size: 30px;
}

/* TEXT */

.text_button_v3_pink {
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.text_button_v3_pink a {
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.text_icon_button {
  margin-left: 20px;
  text-align: center;
  color: #fff;
  font-size: 22px;
  font-family: DuepuntozeroProBold;
}

.more_options_blue_text_icon {
  font-size: 14px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.more_options {
  border-radius: 5px;
  background-color: #ef4f98;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.more_options:hover {
  background-color: #ef4f98;
  border-radius: 5px;
  opacity: .6;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.more_options_blue {
  border-radius: 5px;
  background-color: #00c3ed;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.more_options_blue:hover {
  background-color: #fd9b10;
  border-radius: 5px;
  opacity: .6;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.more_options_pink {
  border-radius: 5px;
  background-color: #ef4f98;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.more_options_pink:hover {
  background-color: #fd9b10;
  border-radius: 5px;
  opacity: .6;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.more_options_green {
  border-radius: 5px;
  background-color: #04e004;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.more_options_green:hover {
  background-color: #fd9b10;
  border-radius: 5px;
  opacity: .6;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.more_options_red {
  border-radius: 5px;
  background-color: #fa4a4a;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.more_options_red:hover {
  background-color: #f93838;
  border-radius: 5px;
  opacity: .6;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.text_new_headline { 
  font-size: 16px;
  font-family: DuepuntozeroProBold;
  color: #000;
  opacity: .6;
}

.text_new_headline a { 
  font-size: 16px;
  font-family: DuepuntozeroProBold;
  color: #000;
  opacity: .6;
  text-decoration: none;
}
.header_new_edit { 
  background-color: #00c3ed;
  border-radius: 5px;
  font-size: 22px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

.sub_new_edit { 
  background-color: #00c3ed;
  border-radius: 5px;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

.save_button_green {
  background-color: #04e004;
  border: none;
  color: white;
  padding: 7px 32px 7px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  border-radius: 8px;
}

.save_button_green:hover {
  background-color: #04e004;
  border: none;
  color: white;
  padding: 7px 32px 7px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  border-radius: 8px;
  opacity: .6;
}


.textfield_white_450_new {
	font-size: 14px;
	color: #52545c;
	background-color: #fff;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	height: 35px;
	width: 450px;
}

/* Rating NEW 3.0 */

.rating_letter { 
  font-size: 30px;
  font-family: DuepuntozeroProBold;
  color: #52545c;
}

/* Payment NEW 3.0 */

.payment_warning { 
  background-color: #ef4f98;
  border-radius: 5px;
  font-size: 22px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

.invoice_open { 
  background-color: #ef4f98;
  border-radius: 5px;
  font-size: 14px;
  font-family: DuepuntozeroProBold;
  color: #fff;
}

/* table_td NEW 3.0 */

.table_white_bg {
  background-color: #fff;
  border-radius: 5px;
}

.table_white_bg_trans {
  background-color: #fff;
  border-radius: 5px;
  opacity: .8;
}

.table_td { 
  background-color: #ffffff;
  border-radius: 5px;
  font-size: 14px;
  font-family: DuepuntozeroProBold;
  color: #52545c;
}

.table_td_first_column { 
  background-color: #dee5ed;
  border-radius: 5px;
  font-size: 14px;
  font-family: DuepuntozeroProBold;
  color: #52545c;
}

.table_footer_navi_blue {
  border-radius: 5px;
  background-color: #00c3ed;
}

.text_footer_navi_blue {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.arrow_footer_navi_blue{
  font-size: 19px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.text_button_online_article_add_pink {
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.text_button_online_article_add_pink a {
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

/* table icons */

.table_icons_active_pink {
	color:#ef4f98;
	opacity: .7;
	font-size: 20px;
}

.table_icons_active_lightgray {
	color:#d3d3d3;
	opacity: .7;
	font-size: 20px;
}

/* popup */
.popup {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50%;
  height: 50%;
  background-color: #00c3ed;
  padding: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  z-index: 9999;
  overflow: auto;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9998;
}

.time-input {
  height: 45px;
  width: 100px; 
  font-weight: 300;
  text-decoration: none;
  font-family: DuepuntozeroProBold;
  font-size: 28px;
}

.popup-table {
  width: 100%;
  min-height: 45vh;
  border-collapse: collapse;
  table-layout: fixed;
  border: none;
}

.popup-table td {
  text-align: center;
  vertical-align: middle;
  padding: 10px;
  border: none;
}

.popup-table .button {
  background-color: orange;
  color: #fff;
  padding: 10px 20px;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  cursor: pointer;
}

.info-icon-popup {
    font-size: 90px;
    color: #fff;
    font-weight: 300;
    text-decoration: none;
    font-family: DuepuntozeroProBold;
}

.info-text-popup {
    font-size: 28px;
    color: #fff;
    font-weight: 300;
    text-decoration: none;
    font-family: DuepuntozeroProBold;
}

.button-label {
    font-size: 32px;
    color: #fff;
    text-decoration: none;
    font-weight: 300;
    text-shadow: 3px 3px 4px #777;
    font-family: DuepuntozeroProBold;
}

.button-label-sub {
    font-size: 18px;
    color: #eaeaea;
    text-decoration: none;
    font-weight: 300;
    text-shadow: 3px 3px 4px #777;
    font-family: DuepuntozeroProBold;
}

.button-show {
  width: 260px;
  height: 50px;
  background-color: #ef4f98;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  cursor: pointer;
}

.button-show:hover {
  background-color: #c43c7c;
}

/* timetable cases */

.timetable_background {
  border-radius: 10px;
  background-color: #07516a;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.timetable_background_header {
  border-radius: 10px;
  background-color: #043140;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

.timetable_table_background {
  border-radius: 8px;
  background-color: #09769b;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.timetable_table_background_free {
  border-radius: 8px;
  background-color: #064960;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.timetable_table_background_break {
  border-radius: 8px;
  background-color: #ef4f98;
  font-size: 18px;
  font-family: DuepuntozeroProBold;
  color: #fff;
  text-decoration: none;
}

.timetable_title {
    font-size: 24px;
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    font-family: DuepuntozeroProBold;
}

.timetable_time {
    font-size: 22px;
    color: #fff;
    text-decoration: none;
    font-weight: 400;
    font-family: DuepuntozeroProBold;
}

.timetable_description {
    font-size: 18px;
    color: #fff;
    text-decoration: none;
    font-weight: 400;
    font-family: DuepuntozeroProBold;
}

.timetable_main_case_background {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background-color: #fff;
}

.timetable_main_case_background_gray {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background-color: #ccc;
}

.timetable_main_case_background_green {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background-color: #02da1b;
}

.timetable_main_case_background_pink {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background-color: #ef4f98;
}

.timetable_main_case_background_striped_background_green {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background: linear-gradient(to right, #ffffff 50%, #02da1b 50%);
  background-size: 8px 100%;
}

.timetable_main_case_background_striped_background_pink {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background: linear-gradient(to right, #ffffff 50%, #ef4f98 50%);
  background-size: 8px 100%;
}

.timetable_main_case_background_striped_background_blue {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background: linear-gradient(to right, #ffffff 50%, #00c3ed 50%);
  background-size: 8px 100%;
}

.timetable_main_case_background_striped_background_blue_corner {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background: linear-gradient(45deg, #ffffff 50%, #00c3ed 50%);
  background-size: 8px 100%;
}

.timetable_main_case_background_striped_background_gray_corner {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background: linear-gradient(45deg, #ffffff 50%, #cccccc 50%);
  background-size: 8px 100%;
}

.timetable_main_case_background_striped_background_gray {
  font-size: 15px;
  font-family: DuepuntozeroProBold;
  color: #000;
  background: linear-gradient(to right, #ffffff 50%, #cccccc 50%);
  background-size: 8px 100%;
}


.edit_text_field_370 {
  font-size: 14px;
  color: #52545c;
  background-color: #fff;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  height: 35px;
  width: 370px;
}