html{
  height:100%;
  font-family: Haettenschweiler, Arial, sans-serif;
}

:root {
  --background: #F1F1F1;
  --background_a: 241, 241, 241;
  --my_calendar_frame_color: #ECE9D8;
  --my_calendar_cell_color: #FFFFD5;
  --my_calendar_dark_cell_color: #FFF4BC;
  --my_calendar_border_color: silver;
  --my_calendar_subcell_border_color: #F3E4B1;
  --my_orange: #df7e57;
  --my_light_blue: #55BACF;
  --my_boston_blue: #429EBD;
  --my_prussian_blue: #053F5C;
  --my_green: #5C9E67;
  --my_red: #D32F23;
  --my_dark_blue: #004AAD;
  --my_anthrazit: #333;
  --my_fuscia: #ae89ab;
  --my_yellow: #998020;
  --my_sp_border: gray;
  --my_beige: #ECE9D8;
  --my_light_yellow: #FFFFD5;
  --my_dark_yellow: #FFF4BC;
  --my_sp_container_background: #e2e9ee;
}

/*
@font-face {
  font-family: "Twemoji from xem.github.io";
  src: url("https://xem.github.io/unicode13/Twemoji.ttf") format("truetype");
  unicode-range: U+00A9-E007F;
}
*/


body {
	background: #F8F8F8;
	margin:0 auto;
	height:100%;
}

h1 {
  font-family: open_sanscondensed_light, Arial;
  font-size: 2.5em;
  margin:0.5em 0;
  overflow-wrap: anywhere;
  text-align: center;
}

input:focus,
select:focus,
textarea:focus  {
   border: 1px solid var(--main_color, #F07746) !important; /* 1 */
   outline: 0 !important;
}

select{
  accent-color: var(--main_color, #F07746);
}

.custom-select {
  position: relative;
}

.custom-select::after {
  position: absolute;
  content: "\f431";
  font-family: "Genericons-Neue";
  right: 0.2rem;
  pointer-events: none;
  font-weight: normal;
  font-style: normal;
  /*border-left: 0.4em solid transparent;
  border-right: 0.4em solid transparent;
  border-top: 0.4em solid var(--my_anthrazit);*/
  top: 19%;
  padding:3px;
  background:white;
  border-radius: 3px;
}

input[type="radio"],
input[type="checkbox"]{
  /* The native appearance is hidden */
  appearance: none;
  -webkit-appearance: none;
  background: white;
  border: 3px solid #FFF;
  box-shadow: 0 0 0 1px gray;
  height:16px;
  width:16px;
  cursor:pointer;
  vertical-align: sub;
}

input[type="radio"] {
  border-radius:8px;
}

input[type="checkbox"] {
  border-radius:3px;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
  box-shadow: 0 0 0 1px var(--main_color);
  background: var(--main_color);
  border-width: 3px;
}

input[type="number"]:read-only,
input[type="radio"]:disabled,
input[type="checkbox"]:disabled{
  cursor:not-allowed;
}

input[type="radio"]:focus {
  border: 3px solid white !important;
  box-shadow: 0 0 0 1px var(--main_color);
  background: var(--main_color);
}


input[type="checkbox"]:focus {
  border: 3px solid white !important;
}

#debug{
display:none;
}


#page_content{
    height:100%;
    background: var(--background, #F1F1F1);
    min-width: 375px;
	/*border-top:5px solid var(--main_color, #F07746);*/
	/*border-bottom:5px solid var(--main_color, #F07746);*/ 
}


.cf:before, .cf:after { content: " "; display: table; } 
.cf:after, .clear { clear: both; } 

.hidden{display:none;}


.header_wrapper{
  background: var(--second_color);
	color: white;
	min-width:100%;
  margin:0;
  padding:0;	
	border-bottom:1px solid gray;
	border-top:4px solid var(--my_sp_border, #F07746);
}

header[role="banner"]{
	margin:0;
	padding:0;
  height:auto;
}


.header_logo{
	height:55px;
}

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

.brand_image{
  display: inline-block;
  vertical-align: middle;
}

.brand{
  display: inline-block;
  vertical-align: middle;
}

.brand h1{
    font-size:46px;
    text-shadow:5px 0px 10px #888;
    margin:0;
    font-family: Arial, Helvetica, sans-serif;
}

.header_sidemenu{
  flex:auto;
}

#settings li{
  font-family: open_sanscondensed_light;
}

#form_login,
#form_settings{
    float:right;
    padding-right:0px;
	  position:relative;
    font-weight: bold;
}

.icon_field {
  margin-left: -30px;
  margin-top: 9px;
  position: absolute;
  z-index: 2;
  color: gray;
  font-size: larger;
  padding: 6px;
}

.icon_eye_field{
  margin-left: -30px;
  margin-top: 3px;
  position: absolute;
  z-index: 2;
  color: gray;
  font-size: inherit;
  padding: 6px;
}

div.main_wrapper{
	min-width:100%;
  margin:0;
  background: var(--background, #F1F1F1);
	position:relative;
  min-height:100%;
}

main[role="main"]{
	margin:0;
	padding:0;
	position:relative;
	max-width:100%;
	background: var(--background, #F1F1F1);
	clear:both;
  min-height:100%;
  display:contents;
}

.center_content{
  max-width:1200px;
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  /*padding-top:5%;*/
  justify-content: center;
  margin: 0 auto;
}


.footer_wrapper{
	background: var(--second_color, #333);
	color: silver;
	min-width:100%;
  margin-bottom:0px;
  margin-top:auto;
  border-top:1px solid gray;
  border-bottom:5px solid var(--my_sp_border, #F07746);
}


footer[role="contentinfo"]{
	max-width:100%;
	margin-left:0px;
	text-align:center;
	padding:10px 10px 10px 10px;
	clear:both;
}

footer[role="contentinfo"] a {
  color: silver;
  text-decoration: none;  
}

footer[role="contentinfo"] a:hover {
  color: var(--color_nav_hover); 
}

.login_inputs{
    list-style:none;
    padding-left:0;
    margin:10px;
}

.login_options{
    list-style:none;
    padding-left:0;
    margin:10px 8px 10px 8px;
}

.login_inputs li{
    display:inline;
}


.login_options li{
    margin-right:12px;
    display: inline;
}


.login_options li a{
  color: white;
  font-weight:bold;
  text-decoration: none; 
  border:1px solid white;
  border-radius: 4px;
  padding:4px;
}

.login_options li label{
  font-weight:bold;
}

.login_options li a:hover{
  /*color: var(--main_color, #F07746);*/
  font-weight:bold;
  text-decoration: underline; 
}


#icon_password,
#icon_user span{
  font-size:18px;
}



.input_holder{
	line-height: 200%;
  box-sizing: border-box;
}

.input_holder:focus,
.input_holder:hover{
	border: 1px solid var(--main_color, #F07746);
}

ul.login_inputs  li.column p{
	color:white;
	display: inline;
}


ul.login_inputs  li.column p:before{
    -webkit-font-smoothing: antialiased;
    font: normal 1.0em 'Genericons-Neue';
    vertical-align:bottom;
}
a.form_button{
  text-decoration:none;
}
.form_button,
#button_login{
	background:var(--main_color, #F07746);
	color:white;
	font-weight: normal;
  padding:12px;
}

.form_button:hover,
#button_login:hover,
.button_profile:hover,
#button_trouble:hover{
	box-shadow:2px 2px 4px #888;
}

.view_profile_btn{
  margin: 15px 0 0 0;
  padding: 4px;
  color: white;
  border: 1px solid var(--main_color);
  border-radius: 4px;
  text-decoration: none;
  font-size: 20px;
  background: var(--main_color);
}

.form_button:active,
#button_login:active,
.button_profile:active,
#button_trouble:active{
	background:silver;
  color:var(--second_color, #333);
}

.std_btn{
	background:lightgray;
	color:var(--main_color, #333);
	border: 1px solid var(--second_color, #333);
	border-radius: 4px;
  vertical-align: middle;
  padding: 6px;
  font-weight: bold;
}

.side_nav_btn{
  background: var(--background);
  color: var(--my_anthrazit);
  border: 1px solid white;
	border-radius: 4px;
  vertical-align: middle;
  padding: 6px;
}

.side_welcome_btn{
  border: 1px solid var(--main_color);
	border-radius: 4px;
  vertical-align: middle;
  font-size: 15px;
  font-weight: bold;
  padding: 10px;
  background: var(--background);
  color: var(--main_color);  
}

.emoji_btn{
	background:white;
	color:var(--second_color, #333);
  border:none;
  padding:0px;
  font-size: 18px;
}


.button_profile:active{
  background:silver;
  color:var(--second_color, #333);
}

#form_login{
    font-size:12px;
}

#form_settings{
    height:65px;
    margin:auto;
    /*background: black;
    border-left: 2px solid gray;*/
}

#header_group{
  text-align: center;
}

div.info_ads_sub{
  width:35%;
  min-width:300px;
  text-align: center;
  flex:auto;
}

div.info_ads{
  width:45%;
  min-width:300px;
  text-align: center;
  flex:auto;
}

div.info_footer {
  width:100%;
  text-align: center;
  padding-top:10px;
}

div.info_footer p{
  font-size:18px;
  color:var(--main_color);
}



div.info_ads_sub img,
div.info_ads img{
	max-width: 70%;
	height: auto;
	margin-top:5px;
	margin-bottom:5px;
}

.info_img{
  max-width: 70%;
}

div.subscription_table{
  min-width:355px;
  max-width:650px;
  padding:10px;
  margin:10px;
  box-shadow:4px 4px 10px var(--second_color, #333);
  border-radius: 8px;
  background: white;
  width:60%;
  box-sizing: border-box;
  flex:auto;  
}

/* div register Profile*/
div.register,
div.profile{
    min-width:355px;
    padding:10px;
    margin:10px;
    box-shadow:4px 4px 10px var(--second_color, #333);
    border-radius: 8px;
    background: white;
    width:50%;
    box-sizing: border-box;
    flex:auto;
}

.profile_fieldset{
  background:white; 
  margin-top:30px;
  border:none;
  box-shadow:3px 3px 8px var(--second_color, #333);
  border-radius: 5px;
}

.profile_description_box{
  text-align:left; 
  background:white; 
  padding:10px; 
  white-space: pre-wrap; 
  box-sizing: border-box;
  margin:20px;
  /*box-shadow:3px 3px 8px var(--second_color, #333);
  border-radius: 10px;*/
  width:fit-content;
  min-width: 300px;
  margin: 0 auto;
  font-size: 14px;
}


#form_register div table{
  width:100%;
}

div.register div.entry,
div.profile div.entry{
    margin-top: 2px;
    margin-bottom:6px;
    
}


#form_upload div.entry div{
	margin-top:0px;
	padding:0;
}


div.entry ul p,
div.entry p{
  font-size:14px;
	font-style:normal;
	font-weight:bold;
	color: var(--second_color, #333);
	margin:0;
	padding:0;  
}

.form_profile div.entry p{
  font-size:13px;
	font-weight:bold;
	color: var(--second_color, #333); 
  margin:4px;
}

.submit_buttons{
  margin-top: 25px;
  border-top: 1px solid silver;
  padding-top: 10px;
}

input.input_m{
    width:106px;
    font-size:12px;
    border-radius: 5px;
    border: 1px solid silver;   
    padding: 5px; 
}

input.input_xs{
  width: 90px;
  border-radius: 5px;
  border: 1px solid silver;
  padding: 6px;
  box-sizing: border-box;
}

.validated_input:valid {
  background-color: rgba(92, 158, 103, .2);
}

.validated_input:invalid {
  background-color: rgba(211, 47, 35, .2);
}

.select_category{
  padding: 8px;
  border: 1px solid silver;
  border-radius: 5px;  
  width:100%;
  color:var(--second_color, #333);
}

.select_group{
  /*box-shadow:3px 3px 8px var(--second_color, #333);*/
  width:215px;
  background: white;
  color: var(--main_color, #F07746);
  padding:6px;
}

table.start-end th{
  width:150px;
  font-size:13px;
  text-align:left;
  margin-bottom:1px;
  margin-top:5px;
}

div.h1_entry{
  font-size:14px;
  margin-top:10px;
  font-weight:bold;
  margin-bottom:0;
  padding:0;
}

.h1_entry table td,
.hi_entry table th{
  font-size:12px;
  font-weight:normal;
}

.schedule_label{
  font-size:13px;
  font-weight:bold;
  margin:0px;
}


div.h1_entry p{
  margin:2px;
}

#timeplan_cyclic_view{
  display:none;
} 

#timeplan_view{
  /*box-shadow:4px 4px 10px var(--second_color, #333);*/
  background: var(--my_sp_container_background);
  border:1px solid gray;
  padding:1px;
  color:var(--second_color, #333);
  margin-bottom: 20px; 
  border-radius: 0 0 8px 8px;
} 

#timeplan_view_edit{
  /*box-shadow:4px 4px 10px var(--second_color, #333);*/
  background: var(--background, #F1F1F1);
  border:1px solid gray;
  padding:8px;
  color:var(--second_color, #333);
  margin: 20px 0 40px 0; 
  border-radius: 8px;
} 

.add_button_container{
  margin:15px 8px 10px 8px;
  padding:4px; 
  text-align: start;
}

.select_timezone{
  width:100%;
  padding:8px;
  box-sizing: border-box;  
  background: white;
  color:var(--second_color, #333);
}

.select_frequency{
  width:150px;
  padding:8px;
  box-sizing: border-box;  
  background: white;
  color:var(--second_color, #333);
}

.timezone_list{
  padding:0px;
  margin:10px 10px 20px 10px;
  box-sizing: border-box;  
}

.timezone_list p{
  font-size:14px;
  font-weight:bold;
  margin: 10px 0 3px 0;
}

.input_s{
  width:200px;
  border-radius: 5px;
  border: 1px solid silver;
  box-sizing:border-box;
}

div.entry input[class="input_s"],
div.h1_entry input[class="input_s"],
div.page_paragraph  input[class="input_s"],
.input_l{
  width:100%;
	padding:8px;
  border-radius: 5px;
  border: 1px solid silver;
  box-sizing:border-box;
}

div.entry input[class="input_l"],
div.h1_entry input[class="input_l"],
div.page_paragraph  input[class="input_l"]{
  width: 100%;
  border-radius: 5px;
  border: 1px solid silver;
  padding: 8px;
  box-sizing: border-box;
}

div.entry input[class="input_90"],
div.h1_entry input[class="input_90"],
div.page_paragraph  input[class="input_90"]{
  width: 90%;
  border-radius: 5px;
  border: 1px solid silver;
  padding: 8px;
  box-sizing: border-box;
}

.input_timeslot_desc{
  width: 312px;
}

div.page_paragraph{
	margin-top:20px;
}

.timeplan_entry{
  margin-top:2px;
  padding: 4px;
  border: 1px solid silver;
  border-radius: 8px;
  background: white;
}

input::file-selector-button {
  font-weight: bold;
  font-size:14px;
  color: var(--main_color, #F07746);
  padding: 8px;
  border: thin solid grey;
  border-radius: 3px;
  -webkit-appearance: none;
}


.email_form_text,
.feedback_form_text{
  font-size:14px;
  font-family:inherit;
  border-radius: 5px;
  border: 1px solid silver;
  padding:8px;
  height: 100px; 
  resize:vertical;
  width: 100%;
  box-sizing: border-box;
  margin-top:5px;
  white-space: pre-wrap;
}

.submit_email_btn:disabled{
  background:silver;
  color:var(--my_anthrazit);
}


.upload_entry{
  width: 100%;
  box-sizing: border-box;
  background: white;
  color:var(--second_color, #333);
	font-size:14px;
  border-radius: 5px;
  border: 1px solid silver;  
  padding:8px;
  margin-top: 5px;
}

.avatar{
	border:1px solid var(--my_anthrazit);
	background:var(--second_color);
  background-clip: padding-box;
  object-fit: cover;
  border-radius: 10%;
}

.avatar_blocked{
  position: absolute;
  opacity: 0.5;
  left: 11px;
  top:11px;
}

.avatar_full{
	border:1px solid var(--second_color, #333);
	background:white;
  object-fit: cover;
}

div#org{
	width:210px;
}

div#org  img.avatar{
	border:none;
	padding:0px;
	margin:0 auto;
	background: white;
	border:1px solid var(--main_color, #F07746);	
  display:block;
}

div#preview{
	max-height:230px;
	padding: 0px;
	margin-left: 10px;
	margin-top:0px;
	overflow: hidden;
	opacity:0.5;
  border: 1px solid var(--main_color);
  position:relative;
}

div#preview_container{
  display:none;
  width:40%;
}
  
div#preview img.avatar{
	width: 128px;
	height: 128px;
	padding: 2px;
	margin: 3px;
}


div#preview_container p button{
	width:120px;
	margin-right:10px;
	font-size: 14px;
}

label[for=register_terms] a{
  text-decoration: none;
  color: var(--main_color, #F07746);
}

label[for=register_terms] a:hover{
  text-decoration: underline;
}


#button_register{
	background:var(--main_color, #F07746);
	color:white;
	border: 1px solid var(--my_anthrazit);
	height:35px;
	border-radius:4px;
	font-size: 20px;
	font-weight: bold;
	width:100%;
}


#button_trouble,
.button_profile{
	background:var(--main_color, #F07746);
	color:white;
	border: 0px solid var(--second_color, #333);
	height:35px;
	border-radius:4px;
	font-size: 18px;
	font-weight: normal;
	width:100%;
	min-width:120px;
}

div.form_cookies{
	margin:10px;
	border-radius:5px;
	overflow:hidden;
  background: white;
  color: var(--second_color, #333); 
  font-size: 14px;  
}

.form_cookies table td:last-child{
  width:100%
}

.form_cookies table td span{
  margin-left: 20px;
  font-size: 20px;
  font-weight: bold;
}

.cookie_buttons{
  float:right;
  padding:10px;
}

.cookie_buttons button{
  margin-left:10px;
}

div.form_warning,
div.form_error,
div.form_success{
	margin:20px;
	padding:10px;
	border-radius:5px;
	overflow-wrap:anywhere;
  background: white;
  font-size: 14px;
  box-sizing: border-box;
}

div.form_warning table,
div.form_error table,
div.form_success table{
  margin: 0 auto;
}


div.form_warning table td:first-child,
div.form_error table td:first-child,
div.form_success table td:first-child{
  width:55px;
}

div.form_error{
  box-shadow: 3px 3px 8px var(--my_red, #d32f23) ;
	border:0px solid var(--my_red, #d32f23);
  color:var(--my_red, #d32f23);
}

div.form_success{
  box-shadow: 3px 3px 8px var(--my_green, #5C9E67) ;
	border:0px solid var(--my_green, #5C9E67) ;
  color:var(--my_green, #5C9E67);
}

div.form_warning{
  box-shadow: 3px 3px 8px var(--my_yellow) ;
	border:0px solid var(--my_yellow) ;
  color:var(--my_yellow);
}

div.form_error div{
  margin:0;
	color: inherit;
}

div.notification_tip{
	color: var(--second_color, #333);
  margin:0;
  vertical-align:middle;
}

div.notification_tip img{
  opacity:0.5
}

#settings,
#settings li,
#settings ul,
#settings a {
  margin: 0;
  padding: 0;
  position: relative;
}

#settings{
  list-style:none;
  font-size:12px;
  overflow:hidden;
}


#settings li{
 float:left;
}

#settings li a.active {
  background-color: var(--second_color, #333);
  color:white;
  text-shadow: 2px 2px 15px white;
}

#settings li p{
 margin:0px;
 padding-top:30px;
 height:35px;
 font-weight:bold;
 font-size:14px;
 color: var(--main_color, #F07746);
}

#settings li i{
 margin-top:0px;
 vertical-align: top;
}

#settings li img{
 /*margin:30px 10px 0px 5px;*/
 /*border:1px solid var(--main_color, #F07746);*/
 margin-top:0px;
 vertical-align: top;
}


#settings li a:hover{
   background:var(--main_color);
   color:var(--color_settings_hover);
}

#settings li a {
  color: white;
  display: inline-block;
  font-size: 16px;
  min-width: 35px;
  text-align: center;
  text-decoration: none;
  height:55px;
  padding:10px 5px 0 5px;  
}


#settings_popup {
  /*display: none;*/
  position: fixed;
  top: -330px;
  right:0;
  width: 100%;
  max-width: 370px;
  background: var(--background, #F1F1F1);
  border: solid 0px var(--second_color, #333);
  border-top:none;
  border-radius: 0 0 0px 5px;
  box-shadow:1px 1px 8px var(--second_color, #333);
  z-index:99999;
  /*padding:10px;*/
  transition: 0.5s ease-out;
  background: lightgray;
  display:flex;
}


#settings_popup nav{
  background: var(--my_calendar_frame_color);
	border-left:1px solid silver;
  flex: auto;
}

#settings_popup nav ul{
	padding:0;
	margin:0;
  list-style: none;
}

#settings_popup nav ul li{
	margin:0;
	height:26px;
}

/*
#settings_popup nav ul li i{
	color:var(--main_color);
}
*/

#settings_popup ul > li a {
  padding:5px 5px 0px 5px;  
  font-size: 12px;
  height:21px;
  color: var(--my_anthrazit);
  text-decoration:none;
  display:block;
}


#settings_popup ul > li.head{
  padding:10px 5px 5px 5px;
	font-size: 16px;
	font-weight:900;
	color: var(--main_color);
  height:auto;
}

#settings_popup ul > li.head:hover{
	background:transparent;
	color:var(--main_color, #F07746);
}

.theme_options{
  text-align: center;
  background: var(--background, #f1f1f1);
  border-top: 1px solid silver;
  border-radius: 0 0 0px 6px;
  padding: 4px 0 4px 0;
  width: 187px;
}



.select_theme{
  border-radius: 50%; 
  width:18px; 
  height:18px;
  margin: 3px 2px 3px 2px;
  display:inline-block;
  vertical-align: sub;
  border:2px solid transparent;
}

.select_theme:hover {
  border:2px solid white;
  box-shadow: 1px 1px 6px var(--my_anthrazit);
}

.active_theme{
  border:2px solid white;
  box-shadow: 1px 1px 6px var(--my_anthrazit);  
}


#button_logout{ 
  padding:0px 5px 0px 4px; 
  background:none;
  border: none;
  width:100%;
  text-align:left;
  font-size: 12px;
  height:26px;
  color:var(--my_anthrazit);	
  margin-left:0px;
  border-radius: 0;
}
#button_logout:hover{ 
  background:var(--second_color, #333);
  color:white;
  font-weight:bold;
}

#settings_popup ul li:last-child{
  border-bottom:none;
}


#settings_popup ul > li > a:hover{
  background:var(--second_color);
  color:white;
}


/*#settings_popup ul > li:active,
#settings_popup ul > li > a:active,
#settings_popup ul > li > button:active{
  background:var(--main_color);
  color:white;
}*/

.list_background{
  opacity:0.97;
  background:var(--background);
}

.list_view{
	padding:0px 0px 0px 0px;
	/*margin-left:180px;*/
	/*height:100%;*/
	min-height:calc(100vh - 116px);
  /*margin: 10px auto;*/
  position: relative;
}

#go_to_top{
  position: fixed;
  top: 200px;
  right: 0px;
  padding: 8px;
  border: 0;
  box-shadow: 2px 2px 8px;
  background: var(--my_sp_container_background);
  display:none;
  z-index: 10;
}


#go_to_bottom{
  top: 238px;
  right: 0px;
  position: fixed;
  padding: 8px;
  border: 0;
  box-shadow: 2px 2px 8px;
  display:none;
  z-index: 10;
}


.ads_view {
  display:flex;
  flex-wrap:wrap;
}

.ads_view > * {
  width:100%;
  /*padding:1rem;*/
}

.room_view{
  /*max-width: 1200px;*/
  margin: 0 auto;
}

.navigation_link{
  color:var(--main_color, #F07746);
  text-decoration: none;
}

.navigation_link:hover{
  text-decoration: underline;
}

.room_view_container{
  box-sizing: border-box;
	/*
    padding:10px 10px 10px 10px;
    box-shadow: 3px 3px 8px #888;*/
  /*background: linear-gradient(#fff, #d5d5d5);*/
}


#main_nav{
	width:100%;
	background: var(--my_sp_container_background);
  position: sticky;
  top: 0px;
  padding: 12px 0 12px 0;
  box-sizing: border-box;
  z-index: 5;
  border-bottom: 1px solid lightgray;
}

#list_nav li p,
#list_nav li,
#list_nav,
#list_nav a {
  margin: 0;
  padding: 0;
}


#main_nav > div {
    text-align: center;
}

.content_top_menu{
  width: 100%;
  background: var(--my_sp_container_background);
  position: sticky;
  top: 0px;
  padding: 15px 0 10px 0;
  text-align: center;
  min-width: 375px;
  z-index: 5;
  border-bottom: 1px solid lightgray;
  font-size:14px;
}

.content_top_menu *{
  vertical-align:middle;
}

.content_top_menu ul{
  list-style: none;
  margin:0 0 0 0px;
  padding:0;
}

.content_top_menu button{
  background:white;
}

.content_top_menu button:hover{
  background:lightgray;
}

.content_top_menu ul li{
  display: inline-block;
}


.content_top_menu ul li a{
  text-decoration: none;
  color:var(--second_color, #333);
  padding:6px; 
  border-radius: 8px; 
  border:1px solid gray;
}


.content_top_menu ul li a:hover{
  color: white;
  background: var(--second_color, #333);
}

ul li.main_nav_menu,
.main_nav_menu{
  display:none;
}

#list_nav {
	list-style:none;
	font-size:12px;
  display:inline-block;
  vertical-align: middle;
}

#list_nav:after {
    clear: both;
    content: " ";
    display: block;
}

#list_nav  li{
	float:left;
	margin: 0 1px 0 1px;
	border:1px solid silver;
	border-radius:8px;
	/*box-shadow:3px 3px 8px var(--second_color, #333);*/
}

#list_nav li span{
	font-size:16px;
	/*margin-right:5px;*/
	/*border:1px solid gray;*/
	border-radius:4px;
	/*box-shadow:3px 3px 8px #888;*/
}

#list_nav li a{
  text-decoration:none;
	color:var(--second_color, #333);
	padding:6px;
	display:block;
	/*background: #d5d5d5;*/
  background: white;
	border-radius:8px;
}


#list_nav li a:hover{
    color:white;
    background:var(--second_color, #333);
}

#list_nav  li:active,
#list_nav  li a:active{
    color:var(--main_color, #F07746);
}

#list_nav li.main_nav_menu{
  display: none;
	margin-right:3px;
	border-radius:8px;
  border:1px solid var(--main_color);
	/*box-shadow:2px 2px 4px #888;*/
}

#list_nav li.main_nav_menu a{
  text-decoration:none;
	color:var(--color_button);
	padding:6px;
	background:var(--background_button);
	border-radius:6px;
  /*border:1px solid var(--main_color);*/
}

#list_nav li.main_nav_menu a:hover{
	color:var(--color_button_hover);
	background:var(--background_button_hover);
}

.folder_label{
  padding:2px 2px 2px 5px;
  background:white;
  font-size:20px;
  font-family: open_sanscondensed_light, Arial;
  color:var(--main_color, #F07746);
  margin:0px;
  display: none;
}

.folder_label i{
  color:var(--second_color, #333);
}

#new_folder_button{
  font-size:14px;
  color: var(--my_anthrazit);
  vertical-align:middle;
  background: var(--background);
  border-radius: 4px;
  margin: 8px;
  text-align: left;
  border: 1px solid white;
}

#new_folder_button:hover{
  background: var(--second_color, #333);
  color:var(--color_nav_hover);
}



#language_select,
#folder_list_popup_single{
  position:absolute;
}

#folder_list_popup_multiple{
  position:absolute;
}

#language_select{
  display: none;
  padding:0 5px 4px 4px;
  margin:0;
  z-index:99999;
  width:fit-content;
  max-height: 200px;
  overflow-y: scroll;
  border-radius:4px;
  border: 1px solid var(--second_color, #333);
  background:lightgray;
}

#language_select ul{
  padding:0;
  margin:0;  
}

#language_select li{
  list-style:none;
  display:block;
  width:100%;
  margin-top:4px;
  /*border: 1px solid black;*/
  text-align: left;  
}

#language_select li a{
  text-decoration:none;
  background:lightgray;
  color:var(--second_color, #333);
  font-size:14px;
  width:auto;
  display:block;
  padding:5px;  
  border-radius: 4px;
}

#language_select li a:hover{
  background:var(--my_prussian_blue, #053F5C);
  color:white;
}

#language_select li a.lang_selected{
  background:var(--main_color, #F07746); 
  color:white
}

#language_select li a.lang_selected:hover{
  background:var(--my_prussian_blue, #053F5C); 
  color:white
}


.folder_list_popup{
  display: none;
  padding:5px;
  margin:0;
  z-index:3;
  width:max-content;
  max-height: 200px;
  overflow-y: scroll;
  /*box-shadow:3px 3px 8px #888;*/
  border-radius:6px;
  background:white;
  border: 1px solid gray;
}


.folder_list_popup ul{
  padding:0;
  margin:0;
}


.folder_list_popup li{
  list-style:none;
  display:block;
  width:100%;
  text-align: left;
  font-weight: normal;
}


.folder_list_popup li a span{
  margin-right:2px;
}


.folder_list_popup li a{
  font-size:14px;
  display:block;
  padding:5px;
  text-decoration:none;
  color: var(--my_anthrazit);
}

.folder_list_popup li:hover ,
.folder_list_popup li a:hover{
  background:var(--background_folder_list_hover);
  border-radius: 6px;
  color:white;
}


.main_view_cnt{
	min-height:100%;
}

#main_home_user{
	min-height:100%;
}


#side_nav{
	min-width:180px;
  max-width:180px;
	background: var(--main_color, #F07746);
	border-right:5px solid silver;
}

#side_welcome{
  min-width:220px;
  background: var(--main_color);
  height: 100vh;
  position: fixed;
  border-right: 1px solid var(--second_color, #333);
  left: -222px;
  transition: 0.5s ease-out;
  top: 0px;
  z-index: 10;		
}

#show_side_welcome{
  font-size: 45px; 
  z-index:10; 
  color:var(--main_color); 
  position:fixed; 
  border-radius: 0 20px 20px 0; 
  background:white; 
  padding:6px; 
  border:1px solid silver
}

.side_nav_inner_div{
  position: sticky;
  top: 0px;
  padding: 0px 0 0px 0;
  max-height: 100vh;
  overflow-y: auto;
  overflow-x:hidden;
  background: var(--main_color, #F07746);
}

.inner_div{
  position:sticky;
  top:10px;
}

#side_welcome ul,
#side_nav ul{
	color:white;
	list-style:none;
	margin:0;
	padding:0;
	text-align: left;
	font-size:14px;
}

#side_welcome ul li span,
#side_nav ul li span{
	vertical-align:middle; 
	margin-right:3px;
}


#side_nav ul li:hover{
	background:var(--second_color, #333);
}



#side_welcome ul li > a,
#side_nav ul li > a{
	color:white;
	text-decoration:none;
  flex:auto;
}

#side_welcome ul li > a:active,
#side_nav ul li > a:active{
	color:silver;
}

#side_welcome ul li,
#side_nav ul li{
  padding:0;
  display: flex;
  align-items: center;
  height:36px;
}


.side_menu_list *{
 vertical-align: middle;
}

.side_menu_list li a{
  display:block;
  padding:7px;
}

.side_menu_list li a span{
  vertical-align: middle;
}

.folder_list_table{
  width:98%;
}


.folder_list_table td a span{
  vertical-align:middle;
  margin:0;
  border: 1px solid white;
  border-radius:4px;
  font-size: large;
  padding: 4px;
}

.folder_list_table td:first-child{
  padding-left:4px;
  padding-right:4px;
  width:80%;
}

.folder_list_table td a{
  text-decoration:none;
  color:white;
  display:block;
  padding:8px 0 8px 0; 
}


.folder_list_table td a:hover{
  color:var(--my_beige); 
}

form.folder_cfg{
  display: flex;
  width: 100%;
}

form.folder_cfg button,
form.folder_cfg input{
  padding:8px;
  background:white;
  color:var(--second_color, #333);
  flex:auto;
  margin:3px;
}

form.folder_cfg button:hover{
  background:var(--main_color, #F07746);
  color:white;
}

form.folder_cfg input{
  min-width:72%;
}

form.input_search_form{
  display: flex;
  width: 100%;
  padding:10px;
  box-sizing: border-box;
  background:inherit;

}

.input_search_form button,
.input_search_form input{
  padding:9px;
  background:white;
  color:var(--second_color, #333);
  flex:auto;
  margin:3px;  
}

.input_search_form button{
  max-width: 50px;
}

.input_search_form button:hover{
  background:var(--main_color, #F07746);
  color:white;
}

.input_search_form input{
  min-width:70%;
}


#side_nav .side_menu_list {
	margin-top:10px;
}

#side_welcome p,
#side_nav div p{
  font-size:14px;
  color:var(--captions);
  font-weight:bold;
  padding-left:5px;
  margin-top:15px;
  margin-bottom:4px;
}

div#room_list{
  margin-top: 0px;
}

div.room_filters{
  font-size:13px; 
}

ul.filters_list{
  text-decoration:none; 
  padding:10px;
  margin:0px;
}

.filters_list li{
  display:inline-block; 
  text-align:left; 
  color:var(--my_anthrazit);
  margin-right: 7px;
}

.filters_list li a{
  text-decoration: none;
  color:var(--main_color);
}

.cat_image_icon{
  position:absolute;
  width:20px;
  right:-15px;
}

.table_list{
  width:100%;
  border-collapse:collapse;
  margin:0px 0 0px 0;
  padding:0;
  background:white;
  border-top: 1px solid silver;
  /*border-radius: 8px;*/
}

.room_schedule_table{
  position: absolute;
  display: none;
  width: 270px;
  left: -210px;
  background: var(--my_calendar_cell_color);
  border: 1px solid silver;
  z-index: 2;
  border-radius: 6px;
  padding:8px;
  max-height:135px;
  overflow-y: auto;
}

.table_list table{
  width:100%;
  border-collapse:collapse;
  margin:0px 0 0 0;
  padding:0;
}

.table_list th:first-child{
  border-right:0px solid silver;
}

.table_list th{
  border-bottom:1px solid silver;
  border-right:0px solid silver;
  font-size:13px;
  height:30px;
  color:var(--second_color, #333);
  text-align:left;
  font-weight: bold;
}


.table_row{
  height: 40px;
  border-bottom: 1px solid var(--background, #F1F1F1);
}

.table_list tr:last-child{
  border-bottom: 1px solid silver;
}

.table_list table tr:last-child{
  border-bottom: none;
}

.room_img_tile{
  border:1px solid silver; 
  border-radius:2px; 
  object-fit:cover;
}

.room_img_tile_inactive{
  position: absolute;
  opacity: 0.5;
  left: 13px;
  top:-20px;
}

.table_list_header{
  border-top:0px solid gray;
}

.tab_title{
  font-size: 15px;
  vertical-align: middle;
}  

.table_header th:first-child,
.table_list_header th{
  text-align: center;
}

.table_header th{
  text-align: center;
}

.table_header th a,
.table_row th a{
  text-decoration:none;
  color:var(--my_anthrazit);
}

.table_header th a:hover,
.table_row th a:hover{
  color:var(--main_color, #F07746);
}

.table_row th:first-child{
  /*border-right:1px solid silver;*/
  text-align:center;
}

tr.table_row_list:hover,
tr.table_row:hover{
  /*background: #dcdcdc;*/
  background: #eeeeee;
  color:var(--my_anthrazit);
}

.table_row_list_empty{
  height:auto;
  padding:5px;
}

.table_row_list_empty img{
  height:65px;
  opacity:0.5
}

.rooms_list_empty{
  padding:4px;
}

.rooms_list_empty div{
  text-align:center;
}

.rooms_list_empty div img{
  width:300px;
}


tr.table_row_list,
tr.table_row td{
  font-size:13px;
  height:60px;
  color:gray;
  vertical-align:middle;
  text-align:center;
  overflow-wrap: anywhere;
}

tr.table_header th,
tr.table_row td{
  padding:2px;
}


tr.last_row_list th,
tr.last_row_list td{
  font-size:14px;
  height:35px;
  color:gray;
  /*border-bottom:1px solid var(--main_color, #F07746);*/
  vertical-align:middle;
  text-align:center;
}
tr.last_row_list th{
  border-top:0px solid silver;
  background:var(--my_calendar_frame_color, #ECE9D8);
  color:var(--second_color, #333);
  font-weight:bold;
}

tr.table_row_list td:nth-child(1),
tr.last_row_list td:nth-child(1){
  border-right:1px solid silver;
}


tr.last_row_list td:last-child{
  border-left:1px solid silver;
}

tr.table_list_selected {
  /*background: rgba(240,119,70,0.8)*/
  background: var(--my_sp_container_background);
  border-bottom: 1px solid var(--background, #F1F1F1);
  /*background: rgba(192,192,192,0.7)*/
}

tr.todo_task_completed{
  background: #E9F7E4;
  border-bottom: 1px solid silver;
}


.task_status_box:disabled{
  cursor:not-allowed;
}

tr.todo_task_completed td,
tr.table_list_selected td{
  color:var(--my_anthrazit);
  font-size:13px;
  height:60px;
  /*border-bottom:1px solid black;*/
  vertical-align:middle;
  padding: 2px;
  text-align: center;
  overflow-wrap: anywhere;
}

tr.table_list_selected td a{
  text-decoration:none;
  color:var(--second_color, #333);
}

tr.table_list_selected td a:hover{
  color:var(--main_color, #F07746);
}

td.check_box_received,
td.check_box_sent,
td.check_box{
  border-right:1px solid silver;
  text-align: center;
}

td.check_todo_box{
  text-align: center;
}


tr.table_row td a{
  text-decoration:none;
  color:var(--color_notifications_link);
}

tr.table_row td a.external_event_link{
  text-decoration:none;
  color:gray;
}


tr.table_row td a.external_event_link:hover,
tr.table_row td a:hover{
  color:var(--second_color, #333);
}



.invitation_container,
.notification_container,
.room_container{
  background:white;
  box-shadow:3px 3px 8px var(--second_color, #333);
  border-radius: 8px;
  padding:5px;
}

.room_container{
  width:85%;
  min-width:360px;
  border: 1px solid transparent;
  margin:20px auto;
  /*float:left;*/
  table-layout: fixed;
  display:table;
  box-sizing: border-box;
}

.like_container{
  position: absolute;
  left: -10px;
  bottom: 228px;
  background: white;
  padding: 4px;
  border-radius: 4px;
  color: var(--main_color);
  border: 1px solid var(--main_color);
}

.room_container_selected{
  border: 1px solid var(--main_color, #F07746);
}

.invitation_container,
.notification_container{
  width:calc(100% - 30px);
  border: 0px solid gray;
  /*table-layout: fixed;*/
  display:table;
  max-width: 500px;
  margin: 20px auto;
}

.invitation_container_image,
.notification_container_image{
  display:table-cell;
  width:50px;
  vertical-align:top;
  box-sizing: border-box;
}

.invitation_container_image img,
.notification_container_image img{
  border-radius: 50%;
}

.room_entries_container{
  width:100%;
  height:100%;
  overflow:hidden;
  max-width: 810px; 
  margin: 0px auto;
  box-sizing: border-box;
  min-height:350px;
  /*max-height: 800px;
  overflow: scroll;*/
}

.room_container_image{
  display:table-cell;
  width:50%;
  vertical-align:middle;
  text-align: left;
  background: var(--background);
  border-radius: 6px 0 0 6px;
  position:relative;
}

.room_container_image img{
  width:98%;
  height: 252px;
  object-fit: cover;
  vertical-align: middle;
  border-radius: 6px 0 0 6px;
}

.room_container_info{
  display:table-cell;
  width:50%;
  vertical-align:middle;
  background:white;
  padding:0px
}

.room_full_container_image{
  vertical-align:middle;
  text-align: left;
  background: var(--background);
  border-radius: 6px;
  position:relative;
}

.room_full_container_image img{
  width:100%;
  height: 246px;
  object-fit: cover;
  vertical-align: middle;
  border-radius: 6px;
}

.room_full_container_info{
  vertical-align:middle;
  background:white;
  padding:0px
}

.room_full_container_nav{
  background:silver;
  padding:3px;
  border-radius: 6px;
}

.contact_room_full_container_nav{
  background:var(--my_sp_container_background);
  padding:5px;
  border-radius: 6px;
}

.room_full_container_text{
  padding:5px;
  overflow-y: auto;
  max-height: 200px;
  border-bottom: 5px solid white;
}

.room_container_selected div.room_full_container_info,
.room_container_selected div.room_container_info{
  background:#e7e7e7;
}


.room_container_text{
  height:203px;
  padding-left:2px;
  overflow-y: auto;
  margin-bottom: 4px;
}

.room_full_container_text i,
.room_container_text i{
  margin-right: 5px;
  font-size: 14px;
  color:var(--second_color, #333);
  padding-bottom:4px;
}

.invitation_mini_nav,
.notification_mini_nav{
  background:white;
  padding:0px;
}

table.mini_nav_entry{
  width:100%;
}

table.mini_nav_entry td{
  width:5%;
}

table.mini_nav_entry td:last-child{
  width:70%;
  text-align: end;
}

.notification_mini_nav button{
  color:gray;
  border-color: gray;
}

.room_container_nav{
  background:silver;
  padding:3px;
  border-radius: 0px 6px 6px 0px;
}

.contact_room_container_nav{
  background:var(--my_sp_container_background);
  padding:5px;
  border-radius: 0px 6px 6px 0px;
}

.room_full_container_nav button,
.contact_room_container_nav button,
.contact_room_full_container_nav button,
.room_container_nav button{
  color:#555;
  border-color: #555;
  position:relative;
  background:white;
}


.notification_mini_nav,
.contact_room_container_nav span:hover,
.room_container_nav span:hover{
  color:var(--main_color, #F07746);
}

.room_view_mini_nav{
  float:none;
  display:inline-block;
  vertical-align: baseline;
  padding-left: 10px;
}

.room_view_mini_nav button{
  color:gray;
  border-color: gray;
  /*color:var(--main_color);
  border-color: var(--main_color);*/
  border-radius: 50%;
}

.notification_mini_nav span:hover,
.room_view_mini_nav span:hover{
  color:var(--main_color, #F07746);
}

.room_container_text_subject{
  font-size:25px;
  padding-bottom:7px;
  font-weight: bold;
  text-align: left;
}

.room_container_text_subject a{
  /*text-decoration:none;*/
  color:var(--main_color, #333);
  font-family: open_sanscondensed_light, Arial;
  line-height: 90%;
  overflow-wrap: anywhere;
}

.room_container_text_subject a:hover{
  color:var(--main_color, #F07746);
}

.room_container_text_description{
  font-size:14px;
  padding-bottom:7px;
  white-space: pre-wrap;
  color: var(--second_color, #333);
}

.room_header{
  /*width: 100%;*/
  display: inline-block;
  vertical-align: bottom;
  font-size: 1.7em;
  font-family: open_sanscondensed_light, Arial;
  line-height: normal;
  overflow-wrap: anywhere;
  padding-right: 4px;
}

.invitation_container_text_description,
.notification_container_text_description{
  font-size:14px;
  padding-bottom:7px;
  color: gray;
  margin:0;
  font-weight: normal;
}

.invitation_container_text_description a,
.notification_container_text_description a{
  text-decoration: none;
  color: var(--color_notifications_link);
}


.invitation_container_text_description a:hover,
.notification_container_text_description a:hover{
  color: var(--second_color, #333);
  /*text-decoration: underline;*/
}


.room_container_text_place{
  font-size:14px;
  padding: 8px 0 8px 0;
  word-break: normal;
  overflow-wrap: anywhere;
  color: var(--second_color, #333);
}

tr.table_row td.room_container_text_date{
  font-size:13px;
  color:var(--second_color, #333);
  padding-bottom:0px;
  text-align: left;
}

td.room_container_text_date{
  font-size: 14px;
}

.invitation_container_text_date,
.notification_container_text_date{
  font-size:11px;
  color:var(--my_prussian_blue, #053F5C);
  margin-bottom:5px;
}


#feedback div.page_paragraph{
	margin:10px 0 0 0;
	font-size:14px;
}

div.page_paragraph p{
  margin-bottom:3px;
	font-size:13px;
	font-weight:bold;
	color:var(--second_color, #333);
}


.form{
	padding:0px;
}


#edit_room,
#new_room{
  box-sizing: border-box;
}

.right_ad_container{
  text-align: center;
  box-sizing: border-box;
  padding: 10px;
  border-left: 5px solid lightgray;
  background: white;

}

.right_ad_container p{
  font-size:20px;
  font-weight:bold;
  color:var(--main_color, #F07746);
}

.right_ad_container img{
  max-width: 90%;
  height: auto;
  margin-top:5px;
  margin-bottom:5px;
}

div.room_info > div,
#edit_room > div,
#new_room  > div{
  /*margin: 10px 10px 10px 10px;
  border: 1px solid var(--second_color, #333);
  border-radius: 8px;
  box-shadow: 3px 3px 3px var(--second_color, #333);
  background: white;*/
	padding:10px;
  vertical-align:top;
}

.delete_image_btn{
  position: absolute;
  right: 12px;
  top: 12px;
  opacity: 0.8;
}

.delete_comment_btn{
  opacity: 0.8;
  position: absolute;
  right: 2px;
  bottom: 2px;
  color:var(--second_color);
}

.image_item{
  display:inline-block;
  /*width: 45%;
  max-width: 300px;
  min-width: 100px;*/
  opacity:1;
  transition: opacity 300ms linear;    
  margin:2px;
}


.drag_over_img{
  background: rgba(var(--main_color_a),0.5) !important; 
}

.edit_room_image{
  border: 0px solid gray;
  border-radius: 10px;
  box-sizing: border-box;
  min-width: 180px;
  height:200px;
  background:white;
  padding:5px;
  object-fit: cover;
}

#add_room_image{
  border: 2px dashed silver;
  border-radius: 6px;
  opacity:0.6;
}

#room_images_list{
  padding: 10px 0 10px 0;
  border-radius: 6px;
  background: var(--my_sp_container_background);
  width:100%; 
  text-align:center; 
  font-size: 0  
}

.timeplan_delete{
  text-align:right;
  font-weight:normal;
}

.timeplan_delete > p{
  padding-right:3px;
  vertical-align:bottom;
}

.button_task_add,
#button_survey_add,
#button_timeplan_add,
#button_timeslot_add,
#button_timeslot_simple_add{
	padding:8px;
	color: gray;
	font-size:13px;
	cursor:pointer;
  box-shadow: 1px 1px 5px var(--my_anthrazit);
  border-radius: 4px;
  background: white;
}


.button_task_add:hover,
#button_survey_add:hover{
	color: var(--main_color, #F07746);
}


.day_label{
  margin-top: 4px;
  display:inline-block;
}

.todo_tasks_list,
#survey_options_list{
	list-style:none;
	padding:5px 0px 5px 5px;
	margin:0;
}


#timeslots_list, #cyclic_timeplan_list{
	list-style:none;
	padding:0 0 0px 0;
	margin:0;
}

#cyclic_timeplan_list p,
#timeslots_list p{
  display:flex;
}

#timeslots_list p{
  margin:4px;
}

#cyclic_timeplan_list p > *,
#timeslots_list p > *{
  margin:0 3px 0 0;
}

#survey_options_list button,
#cyclic_timeplan_list button{
  padding:2px;
} 

#survey_options_list li,
#timeslots_list li{
	margin-bottom:1px;
  vertical-align: middle;
}

#survey_options_list li p button,
#timeslots_list li p button{
	font-size: 12px;
  padding:2px;
  border-radius: 4px;
}


#timeslots_list li button{
	background: white;
  vertical-align: middle;
}

#survey_options_list li p span,
#timeplan_cyclic_view li p span,
#timeslots_list li p span{
	font-size: 18px;
  color:var(--second_color, #333);
}

div.page_paragraph > p.option_box_timeslot{
  margin:8px;
}

.schedule_labels{
	padding:0;
	margin:0;
}

.schedule_labels_list{
	padding:0;
	margin:0;
  list-style: none;
}

.embedded_calendar_link,
ul.schedule_labels_list li a.embedded_calendar_link{
  text-decoration: none;
  color: inherit;
}

.embedded_calendar_link:hover,
ul.schedule_labels_list li a.embedded_calendar_link:hover{
  text-decoration: underline;
  color: inherit;
}


.schedule_labels p {
	font-weight:lighter;
  font-size:inherit;
  margin:0;
}

.schedule_labels_list li {
  font-size: 13px;
  /*color: var(--my_prussian_blue, #053F5C);*/
}


.core_info_container{
  margin-top:0px;
  padding: 0px;
  width:100%;
}


div.core_side_img{
  width:100%;
  vertical-align: middle;
  text-align: center;
  padding: 0px;  
}


div.core_side_img img{
  width:100%;
  height:350px;
  object-fit: cover;  
  background: white;
  box-sizing: border-box;
  /*border-radius: 10px;
  box-shadow: 0 0 6px var(--my_anthrazit);*/
}

.core_side_info{
  padding: 10px;
  vertical-align: top;
  width:100%;
  box-sizing: border-box;
}


.two_column_container{
  margin-top:0px;
  padding: 0px;
  display:block;
  width:100%;
}


div.side_img{
  width:100%;
  display:block;
  padding: 0px;
  box-sizing: border-box;
}  


div.side_img img{
  width:100%;
  height: 350px;
  /*display:block;
  max-width: 100%;
  max-height:100%;*/
  object-fit: cover;  
  background: white;
  /*border: 1px solid silver;*/
  box-sizing: border-box;
  /*box-shadow: 0 0 6px var(--my_anthrazit);*/
}


img.full_image{
  width:100%;
  object-fit: contain;  
  background: white;
  border: 0px solid var(--main_color, #F07746);
  border-radius: 10px;
  box-sizing: border-box;
  box-shadow: 0 0 6px var(--my_anthrazit);
  overflow: hidden;
}

.side_info{
  padding: 10px;
  display:table-cell;
  vertical-align: top;
  width:100%;
}

.side_info_description p.subject_tag{
  margin-top: 5px;
  white-space: pre-wrap;
  color:var(--my_prussian_blue);
  padding: 4px;
  border-radius: 8px;
}


.side_info_mode span,
.side_info_description span,
.side_info_date span{
  padding-bottom: 3px;
}

.side_info_attachment{
  padding-bottom: 0px;
  font-size: 15px;
}

.side_info_subject{
  font-size: 35px;
  color:var(--main_color, #F07746);
  font-weight: bold;
  display:table;
}

.side_info_owner{
  font-size: 15px;
  margin-bottom:15px;
}

.side_info_date{
  font-size: 15px;
  padding-bottom: 15px;
}

.side_info_date p,
.side_info_date ul{
  font-size: 14px;
  padding-bottom: 3px;
  color:var(--second_color, #333);
  margin:5px 0 0 0;
}

.side_info_notice{
  font-size: 13px;
  padding-bottom: 0px;
  color:gray;
}

.side_note{
  margin: 10px;
  display: inline-block;
  font-size: 13px;
  color: gray;
  padding-left: 10px;
}

.warning_note{
  margin: 10px;
  display: inline-block;
  font-size: 14px;
  color: var(--my_yellow);
  padding-left: 10px;
}

.side_info_description{
  font-size: 15px;
  padding-bottom: 10px;
}

.side_info_description p{
  font-size: 14px;
  margin:0;
  color:var(--second_color, #333);
  padding-bottom: 3px;
}

.side_info_mode{
  font-size: 15px;
  padding-bottom: 3px;
}

.side_info_mode p{
  font-size: 14px;
  margin:0;
  color:var(--second_color, #333);
}


.map_container{
  margin: 10px 10px 20px 10px;
  /*background:silver;*/
  min-width:300px;
}


#map_canvas{
  /*box-shadow:3px 3px 8px var(--second_color, #333);*/
  border:1px solid silver;
  overflow:hidden;
  height:360px;
  box-sizing: border-box;
  border-radius: 8px;
  /*max-width:400px;*/
}

#room_view_calendar{
    box-shadow: 3px 3px 8px var(--second_color, #333);
    border:1px solid gray;
    display:none;
    z-index: 20;
    border-radius: 8px 8px 0 0;
}

.entry_mini_table a{
  text-decoration: none;
}

.mini_btn_list_s,
.mini_btn_list{
	border:none;
	background:none;
	padding:0px 1px 2px 1px;
}

.mini_btn_list{
	border:1px solid silver;
  color: gray;
  font-size:16px;
  padding:5px;
  position: relative;
}

.folder_btn_list:hover{
  color:var(--main_color, #F07746);
}

tr.mini_table td .mini_btn_list:hover,
.mini_btn_list:hover,
.mini_btn_list span:hover{
  color: white;
  background:var(--main_color, #F07746);
}


.mini_btn_list span{
  vertical-align: baseline;
}
  
tr.table_list_selected .mini_btn_list:hover{
  /*border:1px solid white;*/
}

.pagination{
  /*padding-left:20px;*/
  padding:10px;
  margin:10px;
  font-size: 16px;
  color:var(--main_color, #F07746);
  text-align: center;
}

.pagination a{
  font-size: 16px;
  text-decoration:none;
  color:var(--second_color, #333);
  padding: 8px 8px;
}

.pagination a.active{
  background: var(--main_color, #F07746);
  color: white;
}

.pagination a:hover {
  background: var(--second_color, #333);
  color: white;
}

.pagination a:active {
  color: var(--main_color, #F07746);
}


.arrow_left{
  padding-right: 2px;
  padding-left: 10px;
}
.arrow_right{
  padding-left: 8px;
}



.fav1{
  color: gold;
}


.self_tag{
  background: #555;
  color:white;
}

#folder_entry{
  width: 140px;
  background: none;
  border-top:none;
  z-index:99999;
  padding:1px;
  opacity:0;
  transition: opacity 400ms ease-in;
}

#folder_entry input{
  font-size:15px;
}

.rangepicker_icon span,
.datetimepicker_icon span{
  vertical-align:middle;
}


#contacts_page {
  padding:0px;
  margin:0px;
}

#contacts_page h1{
  color:var(--main_color, #F07746);
}


#side_network{
	min-width:180px;
  max-width:180px;
	background: var(--main_color, #F07746);
	/*height:100%;*/
	border-right:5px solid silver;
  /*box-sizing: border-box;*/
}

#side_network ul{
	color:white;
	list-style:none;
	margin:0;
	padding:0;
	text-align: left;
	font-size:14px;
}

#side_network ul li span{
	vertical-align:middle; 
	margin-left:5px;
  /*padding: 3px 5px 1px 5px;*/
}

#side_network ul li:hover{
	background:var(--second_color, #333);
}
#side_network ul li > a{
	color:white;
	text-decoration:none;
  flex:auto;
}
#side_network ul li > a:active{
	color:silver;
}

#side_network ul li{
	padding:0px;
  display: flex;
  align-items: center;
  height:36px;   
}


.side_menu_list li form input{
  width:100%;
}

#side_network .side_menu_list {
	margin-top:10px;  
}



#side_network p{
  font-size:14px;
  color: var(--captions);
  font-weight:bold;
  padding-left:5px;
  margin-top:15px;
  margin-bottom:4px;
}

#aside_div{
	padding:0px;
  min-height:100%;
	/*margin-left:0px;
  box-sizing: border-box;
  margin: 0px auto;  */
}

.header_contact_rooms{
  color:var(--main_color, #F07746); 
  padding-top:5px;
  padding-bottom:5px;
  font-size:18px; 
  font-family: open_sanscondensed_light, Arial;
  background:white;
}

.header_contact_rooms span{
  color:var(--second_color, #333)
}

 /*
#groups_view,
#contacts_view{
 margin:10px 10px 10px 5px;
	min-height:calc(100% - 40px);
	box-shadow:3px 3px 8px var(--second_color, #333);
  border:1px solid black;
  background: white;
  padding-bottom: 10px;
}*/


.contacts_view_menu{
    display: none;
    float:left;
}

.contacts_view_menu ul{
    color:var(--my_anthrazit);
}

li.network_nav_menu{
	list-style:none;
}

li.network_nav_menu a{
  background: #d5d5d5;
  padding: 6px;
  border-radius: 8px;
  border: 1px solid gray;
}

#show_side_nav,
#show_side_nav_network{
  text-decoration: none;
  color:white;
  background: var(--background_button);
  border-radius: 5px;
  border:1px solid gray;
}

#show_side_nav{
  padding: 6px;
}

#show_side_nav:hover,
#show_side_nav_network:hover{
  color:var(--color_button_hover);
  background:var(--background_button_hover);
}

.contacts_view_menu li{
    margin-right: 5px;
}


.contacts_view_menu ul,
.contacts_view_menu a{
    padding:0;
    margin:0;
}


.group_search_results,
.contact_search_results{
  font-size:16px;
  margin:0;
  /*max-height:400px;
  overflow-y: scroll;*/
}

.group_search_results p,
.contact_search_results p{
  margin-bottom:10px;
  font-weight:bold;
}


div.visit_card{
  border-radius:8px;  
  border: 0px solid var(--second_color, #333);
  margin:18px auto;
  display:table;
  box-shadow: 3px 3px 8px var(--second_color, #333);
}



div.visit_card div{
	display: table-cell;
  padding:10px;
	width:100px;
  background: lightgray;
  border-radius: 8px 0px 0px 8px;
}


div.visit_card nav{
	display: table-cell;
	vertical-align:top;
  width:195px;  
  border-left: 1px solid silver;
}

.background_visit_card_nav{
	background:white; 
  border-radius:0 8px 8px 0;
}


div.visit_card ul{
	list-style:none;
    padding:0;
    margin:0;
}


div.visit_card ul li.head{
    padding:5px 5px 5px 12px;
	font-size: 16px;
	font-weight:900;
	color: var(--main_color, #F07746);
	height:30px;
}

div.visit_card ul li{
  padding-left:0px;
  font-size: 14px;
}
div.visit_card ul > li button,
div.visit_card ul > li a {
  padding:3px 5px 3px 15px;  
  font-size: 14px;
  color:var(--my_anthrazit);
  text-align:left;
  text-decoration:none;
  display:block;
}

div.visit_card ul > li button{
  width:100%;
  background:none;
  border: none; 
  border-radius:0;   
}

div.visit_card ul > li > a:hover,
div.visit_card ul > li > button:hover{
  background:var(--second_color, #333);
  color:white;
}

div.visit_card ul > li:active,
div.visit_card ul > li > a:active,
div.visit_card ul > li > button:active{
  background:var(--main_color, #F07746);
  color:white;
}


.groups_nav{
  padding:0;
  margin-top:0px;
  list-style: none;
  display:inline-block;
}

.groups_nav li:last-child{
  padding:3px;
  margin-right: 0;
}


.groups_nav_menu{
  margin-right:5px;
  float:left;
  /*border:1px solid silver;
  border-radius: 4px;
  box-shadow: 3px 3px 8px #888;*/
  padding: 0px;
}

.groups_nav_menu a{
  text-decoration: none;
  color: var(--second_color, #333);
  border-radius: 4px;
  padding:9px;
  display:block;
}

.groups_nav_menu span {
  vertical-align: middle;
  font-size: 15px;
}

.groups_nav_menu a:hover{
  background:var(--second_color, #333);
  color: white;
}

.groups_nav > li:active,
.groups_nav > li > a:active{
  color:var(--main_color, #F07746);
}


.background_group_card{
  background:url("../images/groups_1.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right;
}


.background_group_card_nav{
  opacity:0.95;
  background:floralwhite;
  border-radius: 0 8px 8px 0;
}

.background_calendar_work_image{
  background:url("../images/calendar_work.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}


div.room_info{
  clear:both;
}

div.room_info{
  padding-left:0px;
  font-weight:normal;
  font-size:14px; 
}

div.room_info p{
  font-weight:bold;
  padding-left:0px;
  font-size:14px;   
}

div.room_info div.entry{
  margin-top:8px;
}

#room_todo_container,
#room_survey_container,
#room_comments_container,
#room_scheduling_container{
  width:100%;
  box-sizing: border-box;
  margin-bottom:20px;
  /*box-shadow: 0px 0px 6px var(--second_color, #333);
  background:var(--my_sp_container_background);*/
  /*border:1px solid silver;*/
}

#room_todo_container,
#room_survey_container,
#room_comments_container{
  border-radius: 8px;
}


#room_scheduling_container{
  background: var(--my_sp_container_background);
  /*border-radius: 8px 8px 0 0;*/
}

.scheduling_info{
  padding:10px;
  font-size: 15px;
}

.row_menu_room{
  display: flex;
  align-items: center;
  padding: 10px;
  /*
  border-bottom: 0px solid silver;
  border-radius: 8px 8px 0 0;   */
  background: silver;                    
}

.row_menu_nav{
  display:inline-block;
  flex:auto;
}

.prev_next_row_nav a,
.row_menu_nav a,
.row_menu_nav button{
  border:1px solid inherit;
  outline:none;
  color:var(--my_anthrazit);
  background:white;
  padding:6px;
  font-size:14px;
  border-radius: 4px;
  font-weight: normal;
  margin:2px;
  text-align: start;
}    

.prev_next_row_nav a,
.row_menu_nav a{
  text-decoration: none;
}                               
                      
.row_menu_nav span{
  color:white;
  font-size:14px;
}

.row_menu_subnav{
  display:none;
  position:absolute;
  border:1px solid gray;
  border-radius: 6px;
  padding:10px;
  background:white;
  z-index: 1;
}

.row_menu_subnav > a{
  display:block;
}

.row_menu_subnav > a:hover{
  color:white;
  background:gray; 
}

.row_menu_current_date{
  /*color: var(--main_color);*/
  font-weight: bold;
  font-size: 12px;
  padding: 4px;
  /*background: white;*/
  border-radius: 6px;
}

.prev_next_row{
  padding: 0px;
  background: var(--background);
  border-bottom: 0px solid silver;
  border-radius: 8px;  
  color: var(--my_prussian_blue);
  font-size: 14px;
}

.prev_next_row_nav{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.tab{
  width:100%;
  height:48px;
  background: white;
  /*border-bottom: 1px solid lightgray;
  border-top: 1px solid var(--second_color);*/
  box-sizing: border-box;
  display:flex;
}

#invited_contacts{
  display:block;
  max-height: 300px;
  overflow-y: auto;
}

.icon_invitation{
  color:goldenrod; 
}

.icon_request{
  color:var(--second_color, #333); 
}

.icon_accepted{
  color:var(--my_green, #5C9E67) ; 
}

.icon_maybe{
  color:var(--my_prussian_blue, #053F5C); 
}

.icon_rejected{
  color:var(--my_red, #D32F23);
}


.tab a {
  background-color: inherit;
  cursor: pointer;
  padding: 14px 2px 14px 2px;
  transition: 0.3s;
  font-size:14px;
  flex-grow: 1;
  text-align: center;
}


.tabslink{
  background-color: #eeeeee;
}

.tablinks:hover, .tab a:hover {
  background-color: var(--color_tablinks_hover);
  color:white;
}


.tab a.active {
  background-color: var(--main_color, #F07746);
  color:white;
}

.tab_content{
  display:none;
  /*margin-top:5px;*/
  padding:10px;
}

.tab_content_contacts{
  display:none;
  margin-top:5px;
}

.date_in_tab{
  text-align:center; 
  background:var(--main_color, #F07746); 
  color:white; 
  margin-top:12px; 
  padding:3px 0 0 3px;
}

.open_modal_container{
  padding:0px;
  width:100%;
  height:28px;
  display:flex;
}

.states_table{
  /*border-collapse:separate;
  border-spacing: 10px;*/
  border-radius: 0 0 0px 0px;
  table-layout: fixed;
  
}

.states_table_container{
  width:100%; 
  margin-top:10px; 
  overflow-x:scroll;
  overflow-y:hidden;
  /*border:1px solid var(--second_color, #333);*/
  min-height:200px;
}

.table_container{
  background: var(--my_sp_container_background);
  opacity: 0.97;
}


#room_states_view{
  border:2px solid var(--main_color, #F07746);
  margin:0px 0 0px 0px;
  padding-top:0px;
  overflow-x:scroll;
  display:block;
  width:100%;
}


#room_states_list_view{
  margin:0px 0 0px 0px;
  padding-top:0px;
  display:table;
  /*border:1px solid var(--main_color, #F07746);*/
  width:100%;
  opacity: 0.97;
  background: var(--my_sp_container_background);  
}

.states_table td.state_label{
  /*border-right:1px solid silver;*/
  padding: 0px 5px 0px 5px;
  height:102px;
  text-align: right;
}

.table_timeslot_summary_head{
  min-width:96px;
  font-size: 13px;
  /*border-right:1px solid silver;
  border-bottom: 1px solid silver;*/
  border:0px solid silver;
  border-radius:5px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: left;  
  box-sizing: border-box;
  padding:4px;
}

.link_to_list{
  text-decoration: none;
  padding: 4px;
  border: 1px solid silver;
  height: 38px;
  box-shadow: 2px 2px 2px #333332;
  font-size: 13px;
  background: var(--my_calendar_cell_color);
}

.table_state_summary_head{
  min-width:148px;
  font-size: 13px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;  
  box-sizing: border-box;
}

.date_summary{
  color: var(--main_color);
  font-weight: bold;
}

.timeslot_summary{
  color: var(--my_prussian_blue);
}

div.state_container{
  min-height:30px;
  border-radius:4px;
  border: 1px solid gray;
  min-width:30px;
  font-size:13px;
  box-sizing: border-box;
  /*box-shadow: 2px 2px 2px var(--second_color, #333);*/
  display:flex;
  align-items: center;
  justify-content: center;
}

div.request_container{
  min-height:30px;
  border-radius:4px;
  min-width:30px;
  font-size:13px;
  box-sizing: border-box;
  display:flex;
  align-items: center;
  justify-content: center;
}


.state_row_td{
  height:90px; 
  border-radius:3px; 
  border: 0px solid var(--my_anthrazit);
  padding:6px;
}

.table_timeslot_head{
  margin:0px;
  font-size:13px;
  padding:10px 4px 10px 4px;
  height:52px;
  box-sizing: border-box;
}

.modal_dialog_cookies,
.modal_dialog {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 100;
	opacity:0;
  display:none;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
	overflow-y:scroll;
}

.modal_dialog_cookies:target,
.modal_dialog:target {
  display: block;
	opacity:1;
}

.modal_dialog_cookies > div.content,
.modal_dialog > div.content {
	width: 60%;
	min-width: 350px;
  max-width: 500px;
  height:fit-content;
  /*display:table;*/
  max-height:85%;
	position: absolute;
	right: 0;
  top:0;
	bottom: 0;
	left: 0;
	margin: auto;
	padding: 10px 10px 10px 10px;
	border-radius: 8px;
	background: var(--background, #F1F1F1);
  overflow-y:scroll;
	/*
  border:2px solid var(--main_color, #F07746);
  background: -moz-linear-gradient(#fff, #999);
	background: -webkit-linear-gradient(#fff, #999);
	background: -o-linear-gradient(#fff, #999);*/
}

.close_modal {
	background: white;
	color: var(--second_color, #333);
	line-height: 25px;
	text-decoration: none;
	font-weight: bold;
	border-radius: 4px;
	box-shadow: 2px 2px 5px var(--second_color, #333);
  padding: 2px 4px 0px 5px;
  border: 0px solid var(--second_color, #333);
}

.wrapper_close_modal{
  position:absolute; 
  right:6px; 
  top:10px;
  display:flex;
}

.wrapper_close_notification{
  position:absolute; 
  right:2px; 
  top:-12px;
  display:flex;  
}

[type="checkbox"]:disabled + label {
  color: #aaa;
}

[type="radio"]:disabled + label {
  color: var(--my_red, #D32F23);
}

.time_excuded + label {
  color: var(--my_red, #D32F23);
}

.marca{
  font-size:34px;
  color:var(--second_color, #333);
}

.close_modal:hover { 
  background: var(--main_color, #F07746);
  color:white;
}

.close_modal:active { 
  background: silver;
  color:white;
}

.open_modal_request_btn{
  text-decoration:none;
  padding:5px;
  color:white;
  border:0px solid var(--second_color, #333);
  border-radius:3px;
  background:var(--main_color, #F07746);
  box-shadow: 1px 1px 5px var(--second_color, #333);
}

.participation_status{
  font-size: 14px;
  padding:6px;
  height: 60px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;  
}

.open_modal_summary_request_btn{
  text-decoration:none;
  color:white;
  width: 100%;
  text-align: center;
  padding: 6px;  
  border-radius: 4px;
  font-weight: bold;
}

.open_modal_request_btn:hover{
  background:var(--main_color, #F07746);
  color:white;
}


.open_modal_container a{
  background:white;
  text-decoration: none;
  padding:7px 5px 4px 5px;
  color:var(--second_color, #333);
  border:0px solid var(--second_color, #333);
  box-shadow: 3px 3px 8px var(--second_color, #333);
  font-size:13px;
}


.dynamic_todo_contact_display,
.dynamic_contact_display{
	position: absolute;
  display:none;
  top: 1px;
  margin:0;
  max-height:150px;
  padding: 5px 0px 5px 0px;
  overflow-y: scroll;
  overflow-x: auto; 
  box-shadow: 3px 3px 6px #333;
  border-radius: 8px;
  background: whitesmoke;
  border:1px solid gray;    
  z-index:2;
}


.add_group_to_list,
.add_contact_to_list{
  display: inline-block;
  height: 100%;
}

.group_list table td,
.contact_list table td{
  padding:0;
}

.group_list table,
.contact_list table{
  width:100%;
}

.group_list table td a,
.contact_list table td a{
  text-decoration: none;
  padding: 8px;
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
  color:var(--my_anthrazit);
}

.group_list table td a:hover,
.contact_list table td a:hover{
  color:white;
}

.group_list table tr:hover,
.contact_list table tr:hover{
  background: var(--main_color, #F07746);
  color: white;
}

.selected_todo_contact,
#selected_contacts{
  border:1px solid silver;
  border-radius: 8px;
  max-height: 240px;
  overflow-y: scroll;
  display:flex;
  flex-direction: column-reverse;
}

.selected_todo_contact ul,
#selected_contacts ul{
  list-style:none;
  margin:0;
  padding:3px;
  background: white;
  border-radius: 8px;
}

.selected_todo_contact ul li,
#selected_contacts ul li{
  /*display:inline-block;*/
  font-size:14px;
  font-weight:normal;
  /*background: rgba(240,119,70,0.8);*/
  /*background:var(--background, #F1F1F1);*/
  border-radius:6px;
  margin:2px; 
  padding:5px 3px 3px 3px;
}

.selected_todo_contact ul li:last-child,
#selected_contacts ul li:last-child{
  background: none;
}

.selected_todo_contact ul li input,
#selected_contacts ul li input{
    border:none;
    font-size:12px;    
}

.selected_todo_contact ul li a,
#selected_contacts ul li a{
  display:inline-block;
  text-decoration:none;
  color:var(--my_anthrazit);
  padding:2px;
  border-radius:2px;
}

.selected_todo_contact ul li a:hover,
#selected_contacts ul li a:hover{
  color:var(--main_color, #F07746);
  border-radius:2px;
  /*background:var(--second_color, #333);*/
}

#selected_contacts > ul > li #search_contact_entry{
  border: 1px solid silver;
}

div.entry_container{
  min-height:100%;
  border-radius:4px;
  border: 0px solid gray;
  min-width:180px;
  overflow-y:auto;
  /*white-space: nowrap;*/
  font-size:12px;
  /*height: 100%;*/
  box-sizing: border-box;
  box-shadow: 2px 2px 4px var(--second_color, #333);
  padding:5px;
}


.entry_list,
div.entry_container ul{
  list-style:none;
  margin:5px;
  padding:0;
}

div.entry_container li{
  display:block;
  margin-right:0px;
  margin-bottom:10px;
}

div.room_entry{
   border:1px solid var(--second_color, #333); 
   background:var(--background);
   border-radius:4px;
   position:relative;
   box-sizing: border-box;
   min-height: 62px;
}


div.entry_info div{
  display:table-cell;
  padding: 4px;
  vertical-align:middle; 
  overflow:hidden;
  white-space: nowrap; 
}

.entry_nav_btn{
  position: absolute;
  top: 3px;
  right: 3px;
  border: 0;
  padding:4px;
}

.inv_nav_btn,
.participation_nav_btn{
  position: absolute;
  top: 4px;
  right: 4px;
  border: 0;
  padding: 4px;
}

.attendance_nav_btn{
  position: absolute;
  top: -2px;
  right: 0px;
  border: 0;
  padding: 4px;
}

div.entry_info p{
  padding:0px;
  margin:0;
  font-size: 13px;
  font-weight:900;
  color: var(--main_color, #F07746);  
}

.room_entry nav form,
.room_entry nav ul{
  padding:0;
  margin:0;
}

.room_entry nav{
  border: 1px solid silver;
  background: white;
  border-radius: 4px;
  position: absolute;
  right: 30px;
  top: 2px;
  display:none;
  z-index: 2;
  max-width: 115px;;
}

.room_entry nav ul{
  list-style:none;
  font-size:16px;
  text-align: center;
}

.room_entry nav ul li{
  list-style:none;
  padding:0px;
  display:inline-block;
  margin:0;
}

.room_entry nav ul li:hover{
  color:var(--second_color, #333);
  
}

.room_entry nav ul li a{
  text-decoration:none;
  display:block;
  padding:4px;
  color:var(--second_color);
}

.room_entry nav ul li a:hover{
  color:white;
  background:var(--main_color, #F07746);
}


.modal_dialog > div.entry_dialog{
  white-space:normal;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 350px;
  margin: auto;
  padding: 10px;
  height: fit-content;
  max-height: 85%;
  overflow-y:scroll;
  border-radius: 8px;
  border:2px solid var(--main_color, #F07746);
  background: var(--background, #F1F1F1);
  color:var(--my_anthrazit);
}


div.entry_dialog_avatar{
  display:table-row;
  font-size:14px;
}


.entry_dialog_avatar div{
  display:table-cell;
  vertical-align:middle;
  padding:10px;
}

div.entry_dialog div span p{
  color:var(--main_color, #F07746);
  font-size:16px;
  font-weight:bold;
  margin:0 0 10px 0;
}

div.entry_comments_container{
  margin-top:1px;
  padding: 5px;
  max-height:150px;
  overflow-y: scroll;
  display:block;
  background: var(--my_sp_container_background, #F1F1F1);
  word-break:break-word;
  border: 1px solid silver;
  border-radius: 4px;
}

div.room_comments_subcontainer{
  margin:12px;
  padding: 0px;
  max-height:250px;
  overflow-y: scroll;
  display:block;
  word-break:break-word;
  /*border: 1px solid silver;*/
  /*background: white;*/
}

.comments_counter{
  margin:4px;
  padding: 8px;
  font-size: 12px;
  color: gray;
}

div.comment_entry{
  /*display:table;
  table-layout: fixed;*/
  padding:10px;
  border: 0px solid gray;
  background: white;
  margin: 10px;
  border-radius: 6px; 
  width:fit-content; 
  max-height: 500px;
  box-shadow: 1px 1px 3px var(--second_color, #333);
  position: relative;
}

div.comment_entry > div{
  display:table-cell;
  vertical-align: top;
}


.avatar_comments{
  padding:0px;
  margin-right:8px;
  border-radius: 50%;
}

.date_comments{
  color:var(--main_color, #F07746);
  vertical-align:unset;
  display:inline;
  font-size:9px;
  padding:0;
}

.text_comments{
  color:gray;
  font-size:12px;
  padding:0;
}

.notification_cnt {
	background: white;
  margin-right:2px;
  padding:3px 5px 2px 5px;
	text-decoration: none;
	font-weight: bold;
  font-size: 11px;
	border-radius: 8px;
	box-shadow: 1px 1px 3px #000;
  color:var(--main_color, #F07746);
}

.total_cnt {
  margin-left:2px;
  padding:3px 5px 2px 5px;
	font-weight: bold;
  font-size: 13px;
  color:var(--my_anthrazit, #F07746);
}

.cnt {
	font-weight: bold;
  font-size: 14px;
  color:var(--main_color, #F07746);
}

#invitations_list,
#notifications_list{
  overflow:auto;
}

#attendance_list{
  max-width: 540px;
  margin:0 auto;
  border:1px solid silver;
  overflow:auto;
  background: var(--my_sp_container_background);
}

.notifications_delete_disclaimer{
  color:var(--my_anthrazit); 
  padding-top:5px;
  padding-bottom:8px;
  padding:5px 0 8px 5px;
  font-size:16px; 
  font-family: open_sanscondensed_light, Arial;
  background:white;
}

.notifications_delete_disclaimer span{
  color:var(--second_color, #333)
}

.notification_entries_container{
  margin: 0 auto;
  max-width: 768px;
}

#attendance_list h1,
#invitations_list h1,
#notifications_list h1{
  color:var(--main_color, #F07746);
  padding:4px;
}

div.row_menu{
  background:var(--background_row_menu);
  padding:10px;
  border-bottom: 0px solid silver;
  border-radius: 8px 8px 0 0;
}

div.invitations_row_menu,
div.notifications_row_menu{
  padding:4px;
  text-align:center;
}

div.invitations_row_menu button,
div.notifications_row_menu button{
  box-shadow: 2px 2px 5px var(--second_color, #333);
  background: white;
}


div.row_menu_calendar{
  background:transparent;
  padding:5px;
  border-bottom: 0px solid var(--second_color, #333);
  margin-bottom: 5px
}

div.row_menu_calendar ul,
div.row_menu  ul {
  padding:0;
  margin:0;
}

div.row_menu_calendar ul li,
div.row_menu  ul li{
  list-style:none;
  display:inline-block;
  margin-right: 0px;
  min-height:38px;
}

div.row_menu  ul li button,
div.row_menu  ul li a{
  text-decoration:none;
  color:white;
  font-size:20px;
  padding:4px;  
  border: 0px;
}

div.row_menu_calendar ul li button,
div.row_menu_calendar ul li a{
  text-decoration:none;
  padding:4px;  
  margin:1px;
  border: 1px solid gray;  
}

div.row_menu  ul li a {
  font-size:20px;
}


div.row_menu  ul li a:hover{
  background:var(--background_row_menu);
  color:var(--color_nav_hover);
}


div.row_menu  ul li button:hover{
  color:var(--color_button_hover);
}

div.row_menu_calendar ul li button:hover{
  background:var(--background_button_hover);
  color:var(--color_button_hover);
}

i.row_menu_icon,
span.row_menu_icon{
  /*padding:5px 6px 3px 5px;*/ 
  vertical-align:middle; 
  /*font-size:20px;*/
}

span.row_menu_icon_m{
  padding:3px 3px 2px 3px; 
  vertical-align:middle; 
  font-size:14px;
}

div.calendar_container{
  /*margin:10px;*/
  background:white;
}

div.calendar{
  box-shadow:1px 1px 8px var(--second_color, #333);
}

.calendar_select_rooms{
  margin:10px;
  /*box-shadow:3px 3px 8px var(--second_color, #333);*/
  padding:0px;
  font-size: 14px;
  background:none;
  color:var(--second_color, #333);
}

.calendar_select_rooms ul{
  min-width: 350px;
}

.select_room{
  /*box-shadow:3px 3px 8px var(--second_color, #333);*/
  width:300px;
  background: white;
  color: var(--main_color, #F07746);
  padding:6px;
}

.calendar_select_rooms ul{
  text-decoration: none;
  list-style: none;
  margin:0px;
  padding:0px;
  text-align: center;
}


.calendar_select_rooms ul li{
  display:inline-block;
  color:var(--my_prussian_blue, #053F5C);
  /*color:var(--main_color, #F07746);*/
  vertical-align: middle;
}

.calendar_select_rooms ul li button{
  color:var(--second_color, #333);
  /*font-size: 18px;*/
  background: white;
  padding:6px;
}

.calendar_table_navi{
    width:100%;
}

.left_navi ul li span,
.right_navi ul li span{
  font-size: 16px;
}

.left_navi{
  text-align:left;
  width:35%;
}

.center_navi{
  text-align:center;
  color:white;
  width:30%;
}

.right_navi{
  text-align:right;
  width:35%;
}


.calendar_table_header{
  width:100%;
  background:var(--my_calendar_frame_color, #ECE9D8);
  /*border-collapse: separate;
  border:1px solid var(--my_anthrazit);
  border-top: 1px solid #333;*/
}



.calendar_table_header th,
.calendar_table_header td{
  min-width:40px;
  border-right: 1px solid silver;
  padding-top: 4px;
  box-sizing: border-box;
  /*border-left: 1px solid silver;*/
  color: var(--second_color, #333);
}

.calendar_table_body th,
.calendar_table_header th{
  position:sticky;
  left:0;
  z-index:12;
}


tr.day_caption{
  font-size: 12px;
  text-align:center;
}

.cal_day_link_month,
.cal_day_link{
  /*text-decoration: none;*/
  color:var(--second_color, #333);
}

.cal_day_link_month:hover{
  /*color:#55bacf;*/ 
  color:var(--main_color, #F07746);
}

.cal_day_link:hover{
  color:var(--my_prussian_blue, #053F5C);
}

.cal_day_link_today{
  text-decoration: none;
  color:white;
}

.cal_day_link_today:hover{
  color:var(--color_settings_hover);
}


th.hour_caption{
  font-size: 14px;
  text-align:center;
  width:40px;
  vertical-align:middle;
  background: var(--my_calendar_frame_color, #ECE9D8);
  border-bottom:1px solid silver;
  border-right: 1px solid silver;
  box-sizing: border-box;
}

th.week_caption{
  font-size: 14px;
  text-align:center;
  min-width:30px;
  vertical-align:middle;
  background: var(--my_calendar_frame_color, #ECE9D8);
  border-right: 1px solid silver;  
  border-bottom: 1px solid silver; 
  box-sizing: border-box;
}

.calendar_div_body {
  /*height:70vh;*/
  padding:0px 0px 0px 0px;
  max-height: calc(100vh - 306px);
  overflow-y: auto;
}

.calendar_div_body_month {
  padding:0px 0px 0px 0px;
}

.calendar_div_head_month,
.calendar_div_head_multiday,
.calendar_div_head{
  padding:0px 0px 0px 0px;
  /*overflow:hidden;*/
}


.calendar_table_body {
  width:100%;
  /*border:1px solid silver;*/
  background: var(--my_calendar_cell_color, #FFFFD5);
  overflow:hidden;
}

.calendar_week_row{
  height:65px;
}

.calendar_table_body td{
  min-width:40px;
  vertical-align:top;
  border-right: 1px solid silver;
  border-left: 1px solid silver;
}

.calendar_cell{
  height:12px;
  /*border:1px solid #ead098;*/
  box-sizing: border-box;
}

.first_row td{
  border-top: 1px solid var(--my_calendar_subcell_border_color, #F3E4B1);
}
.second_row td{
  border-bottom: 1px solid var(--my_beige);
}
.fourth_row td{
  border-bottom: 1px solid var(--my_calendar_subcell_border_color, #F3E4B1);
}

td.calendar_dark_cell{
  background:var(--my_calendar_dark_cell_color, #FFF4BC);
}

th.calendar_highlight,
td.calendar_highlight{
  background:var(--main_color, #F07746);
  color:white;
}

th.calendar_highlight{
  border-right: 1px solid var(--main_color, #F07746);
  border-left: 1px solid var(--main_color, #F07746);
}

td.calendar_highlight{
  border-right: 1px solid var(--main_color, #F07746);
  border-left: 1px solid var(--main_color, #F07746);
  box-sizing: border-box;
}


td.calendar_today{
  border-right: 1px double var(--main_color, #F07746);
  border-left: 1px double var(--main_color, #F07746);
  height: 12px;
  box-sizing: border-box;
  /*background:rgba(240,119,70,0.2);*/
}

td.calendar_today_md{
  height:30px;
  /*border-right: 1px solid var(--main_color, #F07746);
  border-left: 1px solid var(--main_color, #F07746);*/
  background: rgba(192,192,192,0.7);
}

td.calendar_today_month{
  /*border: 1px solid var(--main_color, #F07746);*/
  vertical-align:top;
  background:rgba(240, 119, 70, 0.2);
  border-bottom: 1px solid silver;
  border-right: 1px solid silver;
  color:var(--main_color, #F07746);
  height:10vh;
}


tr.calendar_week_row p{
   text-align:right;
   margin:1px;
   padding:0;
}

td.calendar_day_cell{
  background: var(--my_calendar_cell_color, #FFFFD5);
  vertical-align:top;
  height:10vh;
  border-bottom: 1px solid silver;
}

td.calendar_cell_grayed{
  background: var(--background);
  height:10vh;
  border-bottom: 1px solid silver;
}
.calendar_table_body td > p{
  font-weight:bold
}

td.calendar_cell_grayed > p{
  color:gray;
  font-weight:normal;
}

li.calendar_center_date span{
  font-size:14px;
  font-weight:bold;
  color:var(--my_prussian_blue, #053F5C);
}


div.md_appointment_overlay,
div.appointment_overlay{
  margin:0;
  padding:0px;
  position:relative;
  height:0px;
}

div.appointment_overlay_month{
  height:45px;
  margin:0;
  padding:0px;
  position:relative;
  width:96%;
}

div.appointment_overlay{
  width:100%;
}

div.md_appointment_overlay{
  width:calc(100% + 4px);
}

div.multiday_container,
div.appointment_container{
  z-index:10;
  position:absolute;
  background:var(--background, #F1F1F1);
  border: 1px solid var(--second_color, #333);
  width:100%;
  font-size:11px;
  overflow:hidden;
  border-radius:4px;
  box-sizing: border-box;
  /*cursor: move;*/
}
div.multiday_container{
  /*position:relative;*/
  height:24px;
}

div.appointment_container_month{
  background:white;
  border: 1px solid gray;
  border-radius:5px;
  width:100%;
  font-size:10px;
  margin-bottom:1px;
  /*box-shadow:2px 2px 4px var(--second_color, #333);*/
  position:absolute;
  /*white-space: nowrap;*/
  overflow: hidden;
  /*cursor: move;*/
  height:40px;
}

div.calendar_date_color{
  width:6px;
  height:100%;
  border-right:0px solid var(--my_anthrazit);
  float:left;
}


div.appointment_color_month{
  height:8px;
  border-radius: 5px 5px 0 0;
  background:var(--main_color, #F07746);
  overflow:hidden;
  border-bottom:1px solid var(--my_anthrazit);
}

div.appointment_title{
  padding-left:8px;
  padding-top:1px;
}

div.appointment_info{
  padding-left:8px;
  font-style:italic; 
}

div.appointment_title a{
  color:var(--main_color, #F07746);
  font-style:italic; 
}

div.appointment_title a:hover{
  color:gray;
}

div#today_line{
  border-top: 2px solid var(--main_color, #F07746);
  position:absolute;
  width:100%;
  z-index:10;
  left: -2px;
}

div#today_line:after{
  right:0px;
  top:-6px;
  content:"";
  position:absolute;
  width: 0; 
  height: 0; 
  border-top: 5px solid transparent; 
  border-right: 10px solid var(--main_color, #F07746); 
  border-bottom: 5px solid transparent;  
}

.calendar_week_multiday_cell{
  height:40px;
  border-bottom:1px solid gray;
  background: rgba(192,192,192,0.7);
}


.calendar_month_multiday_cell{
  height:36px;
  background: rgba(192,192,192,0.7);
  /*background:white;
  background: rgba(240,119,70,0.6);
  background: rgba(192,192,192,0.7)*/
}

div#calendar_help{
  width:250px;
  padding:7px;
  top:50px;
  right:15px;
  font-size:10px;
  color:var(--my_anthrazit);
  background:whitesmoke;
  position:absolute;
  display:none;
  border:0px solid var(--my_anthrazit);
  border-radius:5px;
  box-shadow:0px 0px 8px var(--my_anthrazit, #333);
  z-index:25;
}
div#calendar_help table{
  width:100%;
}

div#calendar_help th,
div#calendar_help td{
  vertical-align:middle;
  text-align:center;
  border:1px solid gray;
}
 
div#calendar_help th{
  width:25px;
  font-size:12px;
  background:var(--second_color, #333);
  border-bottom:1px solid var(--main_color, #F07746);
  color:white;
} 


.scrollbar_measure {
	width: 100px;
	height: 100px;
	overflow: scroll;
	position: absolute;
	top: -9999px;
}

.availability_timeslot,
.delete_timeslot{
  /*cursor: pointer;*/
  position:absolute;
  right:1px;
  top:1px;
  /*background:var(--background, #F1F1F1);*/
  width:16px;
}

.delete_timeslot{
  cursor: pointer;
}

.availability_timeslot_month,
.delete_timeslot_month{
  cursor: pointer;
  position:absolute;
  right:2px;
  top:12px;  
  width:16px;
}

.spinner {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-left: -50px; /* half width of the spinner gif */
  margin-top: -50px; /* half height of the spinner gif */
  text-align:center;
  z-index:1234;
  overflow: auto;
  width: 100px; /* width of the spinner gif */
  height: 102px; /*hight of the spinner gif +2px to fix IE8 issue */
}


#progress_cursor
{
  position:fixed;
  top:45%;
  transform: translateY(-50%);
  left:25%;
  width:50%;
  z-index:3000;
}

#activity_indicator 
{
  height: 32px;
  width: 32px;
  -webkit-background-size: 32px 32px;
  -o-background-size: 32px 32px;
  -moz-background-size: 32px 32px;
  background-size: 32px 32px;
  margin: 0px auto;
  background-image: url("../images/spinner.svg");
  background-color: transparent; 
}				


.drag_over {
  background: rgba(192,192,192,0.5) !important; 
}

.disable_pointers *{
  pointer-events: none;
}


#standard_date_picker {
  /*box-shadow: 3px 3px 8px var(--second_color, #333);*/
  border-right: 1px solid silver;
  border-radius: 8px 8px 0 0;
}

#standard_time_picker{
  box-shadow: 3px 3px 8px var(--second_color, #333);
  border:1px solid var(--main_color, #F07746);
}

#group_image{
  border-radius: 6px;
  box-sizing: border-box;
}

.write_comment{
  margin:0px;
  border-radius: 4px;
  box-sizing: border-box;
  padding:12px;
}

.submit_comment{
  margin-left: 4px;
  padding:0 8px 8px 8px;
  border-radius: 4px;
  box-sizing: border-box;
}


.textarea_comment{
  width:100%;
  box-sizing: border-box;
  resize: vertical;
  background:white;
}

#create_todo_btn,
#create_survey_btn,
#send_comment_btn{
  background:white;
  text-decoration: none;
  padding:7px 5px 4px 5px;
  color:var(--second_color, #333);
  border:0px solid var(--second_color, #333);
  box-shadow: 1px 1px 3px var(--second_color, #333);
  font-size:13px;
  border-radius: 4px;
}

#create_todo_btn:hover,
#create_survey_btn:hover,
#send_comment_btn:hover{
  background:var(--main_color, #F07746);
  color:white;
}


#send_invitation_btn:disabled,
#send_request_btn:disabled,
#update_todo_task_btn:disabled,
#send_task_btn:disabled,
#create_survey_btn:disabled,
#send_comment_btn:disabled{
  background:lightgray;
  border: 1px solid silver;
  color:var(--second_color, #333);
}

.row_menu_sp_container{
  font-size:16px;
  color:white;
  background:#555;
  padding:10px;
  /*border-radius: 8px 8px 0 0;
  border:1px solid var(--my_anthrazit);*/
}

.row_menu_sp_container ul{
  padding:0;
  margin:0;
}

.row_menu_sp_container ul li{
  list-style:none;
  display:inline-block;
}


#dynamic_survey_container,
#dynamic_room_comments{
  /*background:var(--background, #F1F1F1);
  border-radius: 0 0 8px 8px;
  */
  border-bottom: 1px solid silver;
  background:var(--my_sp_container_background);
  padding:5px;
  opacity:0.97;
}

#dynamic_todo_container{
  background:var(--my_sp_container_background);
  /*border-radius: 0 0 8px 8px;*/
  opacity:0.97;
}

.add_todo button,
.add_survey button{
  margin:12px;
}

.delete_survey_btn,
.show_chart_btn,
.submit_vote_btn{
  box-sizing: border-box;
  padding:6px;
  margin:6px;
  border-radius: 4px;
}

.todos_container,
.surveys_container{
  /*display: flex;
  flex-wrap: wrap;
  align-items: stretch;*/
}


div.survey_entry{
  padding:10px;
  border: 0px solid gray;
  background: white;
  margin: 10px;
  border-radius: 6px; 
  width:fit-content; 
  max-height: 500px;
  overflow-y: auto;
  /*box-shadow: 1px 1px 3px var(--second_color, #333);*/
}

.survey_container{
  flex-grow: 1;
}

.todo_list_container{
  background: white;
  /*box-shadow: 2px 2px 6px var(--my_anthrazit);*/
  flex-grow: 1;
  border-top: 1px solid silver;
  border-bottom: 1px solid silver;
  margin-bottom: 15px;
  /*border-radius: 0 0px 8px 8px;*/
}

.surveys_container ul{
	padding:0;
	margin:0;
  list-style:none;
}


.buttons{
  padding-top:10px;
}

.buttons button{
  background:var(--main_color, #F07746);
  color:white;
  border:none;
}

.buttons button:disabled{
  background:silver;
  color:var(--second_color, #333);
  cursor:not-allowed;
}


.votee{
  padding-left:18px;
  display:flex;
  color:var(--my_prussian_blue, #053F5C);
}


.toggle_container{
  text-decoration: none;
}

.toggle_container:focus{
  outline-color: var(--main_color);
}

.toggle_container > i{
  display: inline-block;
  color:var(--my_anthrazit, #F07746);
  font-weight: bold;
  transform: rotate(-90deg);
  transition: transform 0.2s linear;
  font-size: 16px;
  vertical-align: baseline;
  padding:4px;
}

.toggle_container > i.open{
  transform: rotate(0deg);
  transition: transform 0.2s linear;
}

.toggle_container:hover{
  color:var(--main_color, #F07746);
}

.votee span{
  font-style: oblique;
  vertical-align: super;
}


.to_be_toggled{
  max-height: 370px;
  /*overflow-y:scroll;*/
  margin-top:8px;
  transition: all 0.3s ease-in;
  display: grid;
  grid-template-rows: 1fr;  
}

.to_be_toggled_content{
  /*overflow:hidden;*/
  overflow-y:scroll;
}

.fade_out{
  /*opacity:0;
  max-height:0px;*/
  grid-template-rows: 0fr;  
}


.hidden{
  display:none;
}

.surveys_container ul li{
	margin-bottom: 10px;
	font-size: 14px;
  padding-left: 8px;
}

.surveys_container ul > li a {
  padding:5px 5px 0px 5px;  
  font-size: 12px;
  height:21px;
  color:var(--my_anthrazit);
  text-decoration:none;
  display:block;
}

.survey_content > div.head,
.surveys_container ul > li.head{
  padding:25px 5px 5px 0px;
	font-size: 16px;
	font-weight:bold;
	color: var(--main_color, #F07746);
	height:100%;
}


.todo_head{
  padding:10px;
	font-size: 16px;
	font-weight:bold;
	color: var(--main_color, #F07746);
}


.surveys_container ul > li.head:hover{
	background:transparent;
	color:var(--main_color, #F07746);
}

.task_container{
  background: var(--background);
  padding: 10px;
  border-radius: 8px;
  box-shadow: 2px 2px 6px var(--my_anthrazit);
  margin: 4px;
}

.task_desc p{
  margin:0;
	font-size:13px;
	font-weight:bold;
	color:var(--second_color, #333);
}

.bar_container{
  color:white; 
  margin:10px 0 10px 0; 
  width:100%; 
  display:flex;
  background:var(--background);
  border-radius: 6px;
  /*box-shadow: 2px 2px 9px var(--my_anthrazit);*/
  border: 1px solid var(--my_anthrazit); 
  box-sizing: border-box;
}

.bar_full{
  background:var(--main_color);
  border-radius: 4px;
  width:0%;
  transition: width 1s linear;
}

.bar_empty{
  background:var(--background);
  border-radius: 4px;
}

#legal_doc{
  margin:10px;
  border:1px solid #ccc;
  box-shadow: 3px 3px 8px var(--my_anthrazit);
  background: white;
  line-height: 1.5;
}

#legal_doc h1{
  padding: 10px;
}

.cookie_card {
  background: #fff;
  padding: 20px;
  margin-bottom: 20px;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
  border-left: 5px solid var(--my_prussian_blue);
  position:relative;
}

.cookie_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
}

.cookie_header h3 {
  margin: 0;
  color: var(--main_color);
}

.cookie_description p {
  font-size: 0.9em;
  color: #555;
  margin-top: 10px;
}

/* Schalter-Styling (Placeholder für CMP-Funktion) */
.switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 28px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: .4s;
  border-radius: 28px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  transition: .4s;
  border-radius: 50%;
}

input:checked + .slider {
  background-color: var(--my_green); /* Grün für Aktiv */
}

input:focus + .slider {
  box-shadow: 0 0 1px var(--my_green);
}

input:checked + .slider:before {
  transform: translateX(20px);
}

/* Button-Styling */
.action_buttons {
  text-align: right;
  margin-top: 30px;
}

.action_buttons button {
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  font-size: 1em;
  cursor: pointer;
  margin-left: 10px;
  transition: background-color 0.3s;
}

.status_badge {
  font-size: 0.8em;
  padding: 3px 8px;
  border-radius: 4px;
  margin-left: 10px;
}

.status_badge.required {
  background-color: var(--my_red); /* Rot */
  color: white;
  position: absolute;
  top: -12px;
  right: 10px;  
}

.printable{
  display:none;
}


div.vote_container{
  min-height:30px;
  border-radius:4px;
  border: 0px solid gray;
  min-width:30px;
  overflow-y:auto;
  font-size:16px;
  box-sizing: border-box;
  box-shadow: 2px 2px 2px var(--second_color, #333);
  text-align: center;
  display:flex;
}


.delete_participant_btn,
.edit_participant_btn{
  padding:4px;
}

.table_timeslot_simple_head{
  margin:0px;
  font-size:13px;
  padding:10px 4px 10px 4px;
  min-width: 110px;
  max-width: 120px;
  box-sizing: border-box;
  overflow: hidden;
  height:130px;
}

.table_timeslot_simple_head p{
  overflow-wrap: anywhere;
  margin:0px;

}

.abo_feature_column,
.participant_column{
  white-space: nowrap;
  padding: 4px;
  height: 30px;
  width: 200px;
  overflow: hidden;  
}

.row_menu_simple{
  display:flex; 
  align-items: center; 
  background: var(--background_row_menu);
  padding: 10px;
  border-bottom: 0px solid silver;  
}

.row_menu_simple div{
  flex:auto;
}

.row_menu_simple a{
  color:white; 
  text-decoration:none;
  padding:4px;
}

.row_menu_simple a:focus{
  outline-color: var(--main_color);
}

.row_menu_simple div p{
  margin:2px; 
  color:white;
}

.date_simple{
  max-width: 100px; 
  display: inline-block; 
  color:var(--my_boston_blue, #053F5C);
  font-size:13px;
  height:60px;
}

.long_link_container{
  color: var(--main_color);
  background: white;
  padding: 0;
  word-break: normal;
  border-radius: 8px;
  overflow: hidden;
  max-width: calc(100vw - 20px);
  min-width: 255px;  
  border:1px solid silver;
}

.long_link_container code{
  background: none;
  white-space: pre;
  overflow-x: scroll;
  display: block;
  max-width: 100%;
  min-width: 100px;
  font-size: 16px;
  padding: 16px;
}

.timeslot_simple_description{
  display: flex;
  height: calc(100% - 60px);
  align-items: center;
  box-sizing: border-box;
  justify-content: center;
  font-size: 13px;
  font-weight: normal;
}

.timeslot_description{
  padding:4px; 
  height:50px; 
  font-size:13px; 
  font-weight:normal; 
  border-right:1px solid silver;
  min-width: 100px;
  overflow-wrap: anywhere;  
}

.background_calendar_image{
  background: url('../images/calendar.png'); 
}

.background_attendance_image{
  background: url('../images/attendance.png'); 
}

.background_comments_image{
  background: url('../images/comments.png');
  /*background-image: linear-gradient(rgba(226,233,238,0.96), rgba(226,233,238,0.96)), url('../images/todo_simple.png');*/
}

.background_surveys_image{
  background: url('../images/survey_simple.png'); 
}

.background_todo_image{
  background: url('../images/todo_simple.png');
}

.background_calendar_image,
.background_attendance_image,
.background_comments_image,
.background_surveys_image,
.background_todo_image{
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}



/* Slideshow container */
.slideshow_container {
  max-width: 1200px;
  position: relative;
  margin: auto;
  background:transparent;
}

/* Hide the images by default */
.slide_content {
  display: none;
  text-align: center;
}

.slideshow_img{
  max-width:250px; 
  max-height:250px; 
  object-fit: cover;
}

/* Next & previous buttons */
.slideshow_prev, .slideshow_next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: var(--my_anthrazit);
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  background: rgba(var(--background_a), 60%);
}

/* Position the "next button" to the right */
.slideshow_next {
  right: 0px;
  border-radius: 3px 0 0 3px;
}

.slideshow_prev {
  left: 0px;
}

/* On hover, add a black background color with a little bit see-through */
.slideshow_prev:hover, .slideshow_next:hover {
  /*background-color: #DF7D57cc;*/
  background-color: rgba(var(--main_color_a), 0.6)
}

/* Caption text */
.caption_text {
  color: var(--my_anthrazit);
  font-size: 15px;
  padding: 8px 12px;
  position: relative;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.slide_number {
  color: var(--my_anthrazit);
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 5px;
  left:5px;
  background: rgba(var(--background_a), 60%);
  border-radius: 6px;
}

/* The dots/bullets/indicators */
.slideshow_dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .slideshow_dot:hover {
  background-color: #717171;
}

.slide_transition {
  flex: 0 0 100%;
  transition: all 1s;
}


/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}


@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}  

.info_container{
  padding: 20px 20px 0 20px;
  display:flex;
  flex-wrap: wrap;
  justify-content: center;
}

div.info_intro{
  min-width:300px;
  flex: auto;
}

div.info_ads_sub,
div.info_intro,
div.info_ads p{
    font-size:26px;
    font-weight:bold;
    color:var(--main_color, #F07746);
    padding-left:4%;
    padding-right:4%;
}

.intro_question{
  font-family: open_sanscondensed_light, arial;
  font-size:55px;
  color:var(--main_color);
  font-weight: bold;
}

.intro_header{
  /*padding-left:10%;*/
  font-family: open_sanscondensed_light, arial;
  font-size:36px;
  color:var(--main_color);
  width: 400px;
  text-align: center;
}

.intro_header p{
  color:var(--my_anthrazit);
  font-size:16px;
  font-weight:normal;
  font-family: Arial;
}

.intro_header ul{
  color:var(--my_prussian_blue);
  font-size:18px;
  font-weight:normal;
  font-family: Arial;
  list-style-type: square;
  text-align: start;
}

.intro_header ul li{
  margin:10px;
}  

.intro_graphic img{
  max-width: 250px;
}

.intro_header{
  vertical-align: middle;
}

.intro_graphic{
  padding-right:10px;
}


td.check_todo_box > input[type^="checkbox"]:checked{
  background: white;
  background-image: url("../images/success.png");
}

td.check_todo_box > input[type^="checkbox"]:not(:checked){
  background-image: url("../images/del_style.png");
}

td.check_todo_box > input[type^="checkbox"]:checked,
td.check_todo_box > input[type^="checkbox"]:not(:checked){
  background-size: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  height: 20px;
  width: 20px;
}

.with_slash:after{
  position: absolute;
  content: "/";
  font-size: 26px;
  left: 7px;
  top: 0px;
  rotate:20deg;
}


.abo_table{
  /*border-collapse:separate;
  border-spacing: 10px;*/
  border-radius: 0 0 0px 0px;
  table-layout: fixed;
}

.abo_table th{
  height:140px;
}

.abo_table_head{
  margin:0px;
  font-size:13px;
  padding:10px 4px 10px 4px;
  height:140px;
  min-width: 90px;
  box-sizing: border-box;
  overflow: hidden;
}

.abo_table_price{
  display: flex;
  height: calc(100% - 20px);
  align-items: start;
  box-sizing: border-box;
  justify-content: center;
  font-size: 13px;
  font-weight: normal;
}

.abo_table_head p{
  overflow-wrap: anywhere;
  margin:0px;
  font-size:14px; 
  color:var(--my_anthrazit)
}

.abo_table_container{
  width:100%; 
  margin-top:10px; 
  overflow-x:scroll;
  overflow-y:hidden;
  /*border:1px solid var(--second_color, #333);*/
  min-height:200px;
}

div.abo_table_check_container{
  min-height:30px;
  border-radius:4px;
  border: 0px solid gray;
  min-width:30px;
  overflow-y:auto;
  font-size:16px;
  box-sizing: border-box;
  box-shadow: 2px 2px 2px var(--second_color, #333);
  padding:1px;
  text-align: center;
  display:flex;
}


#attachment_name{
  font-size: small;
  color:gray;
  margin-right: 3px;
  border: 1px solid silver;
  padding: 5px;
  border-radius: 4px;
  display: block;  
}

#attachment_icon{
  margin-right: 3px;
}

#attachment_container{
  padding: 4px;
  display:flex;
  align-items: center;
}

.side_info_attachment_name{
  font-size: small;
  color:gray;
  overflow-wrap: anywhere;
}


.add_container{
  background:white;
  box-shadow:3px 3px 8px var(--second_color, #333);
  border-radius: 8px;
  padding:5px;
  width:85%;
  min-width:355px;
  border: 1px solid var(--main_color);
  margin:20px auto;
  /*table-layout: fixed;
  display:table;*/
  box-sizing: border-box;
  max-width: 500px;
}

.add_container_image{
  display:table-cell;
  width:10%;
  vertical-align:middle;
  text-align: left;
  background: var(--background);
  border-radius: 6px 0 0 6px;
}


.add_container_info{
  display:table-cell;
  width:90%;
  vertical-align:middle;
  background:white;
  padding:5px;
  color:gray;
  font-size:13px;
}

.shopping_cart{
  width:100%;
}

.shopping_cart th{
  font-size:  13px;
  color: gray;
}

.shopping_cart td{
  font-size:  12px;
  color: var(--my_anthrazit);
  text-align: center;
  padding:4px;
}

.shopping_cart img{
  width: 50px;
  border-radius: 4px;
  margin-top: 10px; 
}

#impressum_container {
    padding: 20px;
    background-color: var(--background);
}


#impressum_container h1 {
    color: #333;
    border-bottom: 2px solid gray;
    padding-bottom: 10px;
    margin-bottom: 25px;
}

#impressum_container h2 {
    color: var(--second_color);
    font-size: 1.2em;
    margin-top: 20px;
    margin-bottom: 10px;
}

#impressum_container a{
	text-decoration:underline;
	color:gray;
}

#impressum_container a:hover{
	text-decoration:underline;
	color:var(--main_color, #F07746);
}

#impressum_container address p {
    margin: 5px 0;
}
#impressum_container address strong {
    display: block;
    margin-bottom: 5px;
}

.contact_details {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 5px 0px;
    margin-bottom: 20px;
}

.contact_details dt {
    font-weight: 700;
    color: var(--my_anthrazit);
    white-space: nowrap;
}

.contact_details dd {
    font-weight: 500;
    color: gray;
    white-space: nowrap;
}

.legal_links ul, .payment_list {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.legal_links li {
    margin-bottom: 5px;
}
.payment_list li {
    display: inline-block; 
    margin: 2px;
    font-size: 0.95em;
    padding: 5px 10px;
    border: 1px solid var(--my_anthrazit);
    border-radius: 4px;
    background-color: #fff;
}


#impressum_container i {
    margin-right: 5px;
    color: var(--main_color); 
}	


.message_show{
  z-index: 5;
  background: var(--my_light_yellow);
  border: 1px solid silver;
  padding: 10px;
  width: 350px;
  text-align: start;
  max-height: 400px;
  overflow-y: auto;  
  box-sizing: border-box;
}

#message_box{
  position: fixed;
  background: white;
  width: 350px;
  bottom: 0px;
  padding: 8px;
  right: 0px;
  display:none;
  box-shadow: 4px 4px 8px var(--my_anthrazit);
}

.sup_text{
  background: var(--main_color);
  color: white;
  padding: 3px;
  border: 1px solid #333;
  margin-left:-12px;
  top: -2.0em;
  left: -3px;  
}

.schedule_example{
  background: var(--background);
  margin: 5px;
  padding: 25px 10px 10px 10px;
  font-size: 13px;
  font-weight: bold;
  border: 1px solid silver;
  border-radius: 8px;  
}

button.link_room_image{
  background: unset;
  color: unset;
}

button.link_room_image:hover{
  background: unset;
  color: unset;
}

/* ---------------------------------------------------------
   Print styles
   ---------------------------------------------------------*/
   
@media print {

  * {
      /*color:#000 !important;*/
      box-shadow:none !important;
      text-shadow:none !important;
		  background:transparent !important;
  }

  @page {
    size: 210mm 297mm; /* landscape */
    /* you can also specify margins here: */
    margin: 25mm;
    margin-right: 45mm; /* for compatibility with both A4 and Letter */
  }
  
  /*
  .room_image{
    width:400px !important;
    height:400px !important;
  }*/

  div.side_img{
    background:white !important;
  }

  .brand{
    color:#333;
  }

	html, .modal_dialog > div.content { 
    background:#fff !important;
  }

  .header_wrapper{
    margin-bottom:40px !important;
  }

  .side_nav_inner_div{
    height:auto;
  }
	/* Hide navigation #room_table_states, */
	.add_container, nav, .right_ad_container, div.pagination, .header_sidemenu,  .row_menu_nav, .not_printable,
  #room_comments_container, .left_navi, .right_navi, .button_task_add, .row_menu, .row_menu_sp_container {
    content:"" !important; 
    display:none !important;
  }

  .table_timeslot_head{
    color:black !important;
  }

  .printable{
    display:block;
  }

  #room_states_list_view{
    display:table;
  }

  .ads_view > * {
    width:100% !important;
  }
  .ads_view > *:nth-child(2) {
    width:0% !important;
  }  

  .ads_view  {
    display:block !important;
  }  

  .main_wrapper, .footer_wrapper {
    display:block !important;
  }  

	/* Don't show link destinations for JavaScript or internal links */ 
	a[href^="javascript:"]:after, a[href^="#"]:after { 
    content:""; 
  }

  a.tablinks{ 
    display: none !important;
  }

  a.active{ 
    display: block !important;
  }

  .tab_title{ 
    display: block !important;
  }

  textarea.textarea_comment{ 
    display: none !important;
  }
	
	/* Show abbr title value in brackets after the text */
	abbr[title]:after {
    content: " (" attr(title) ")";
  }
     
  button, input[type^="submit"], input[type^="reset"], input[type^="file"]{ 
    display: none !important;
  }
    
  td.check_todo_box > input[checked]:after{
    display: block !important;
    font-family: 'fontello' !important;
    content: "\e814" !important;
    color:var(--my_green);
  }


  td.check_todo_box > input[type^="checkbox"]:not(:checked):after{
    display: block !important;
    font-family: 'fontello' !important;
    content: "\e817" !important;
    color:var(--my_red);
  }

    
  #settings, #side_network, .row_menu_icon, small a{ 
    content:"" !important; 
    display: none !important; 
  }

  .calendar_select_rooms{ 
    content:"" !important; 
    display: none !important; 
  }  

  .center_navi {
    color:var(--second_color, #333) !important;
  }

  .room_container, .footer_wrapper {
    page-break-inside: avoid !important;
  }  

  .visit_card  > nav{
    display:inline-block !important;
  }

  .footer_wrapper{
    position: fixed !important;
    bottom: 0 !important;
    display: none !important; 
  }

  .edit_vote_btn{
    display: inline-block !important;
  }

  #user_link_id{
    word-break: break-all !important;
    white-space: break-spaces !important;
  }

  div.slideshow_content_1 > button.link_room_image{
    display: block !important;
  }

}


/* ---------------------------------------------------------
   media queries
   ---------------------------------------------------------*/
/*Styles for viewports narrower than 630 pixels*/
@media (max-width: 500px) {

  .text_header_menu{
    display:none
  }

  #settings li a {
    height: 55px;
    padding:10px 3px 0 3px;
    font-size: 32px;
    color: lightgray;    
  }

  #settings li a:hover{
    background:var(--background_settings_hover);
    color:var(--color_settings_hover);
  }
  
  #form_settings{
    background:black;
    border-left:2px solid gray;
  }

  .header_wrapper{
    background: rgba(var(--main_color_a), 70%);
  }

  #trigger_settings{
    padding-left: 10px;
  }
 

  #button_login{
    background: var(--my_boston_blue);
}

}



/* ---------------------------------------------------------
   media queries
   ---------------------------------------------------------*/

/*Styles for viewports narrower than 950 pixels*/
@media (max-width: 949px) {

  .right_ad_container{
    display:none;
  }    
}

/*Styles for viewports narrower than 900 pixels*/
@media (max-width: 898px) {

  .room_container {
    margin: 20px auto;
  }  
}

/*Styles for viewports narrower than 850 pixels*/
@media (max-width: 850px) {

  #main_nav{
      min-width: 375px;
  }   
}


/*Styles for viewports narrower than 535 pixels*/
@media (max-width: 595px) {

  #form_login{
      /*margin: auto;*/
      float:right;
  }

  .brand h1{
    font-size:36px;
  }  

  .login_inputs li {
    display: block;
  }

  .login_options li{
      display:inline;
  }

  #icon_user{
      display: none;
  }

  #icon_password{
      display: none;
  }

  #button_login{
      width: 100%;
      margin-top:5px;
  }

  .input_holder{
      width: 100%;
      margin-top:5px;
  }

  div.info_ads_sub p,
  div.info_ads p{
      font-size:26px;
  }  

  .icon_field {
    margin-top: 15px;
  }

  .room_header{
    font-size: 1.0em;
  }  

  h1 {
    font-size: 2.0em;
  }   

  .filters_list li.table_view_hide{
    display: none;
  }  

}


/*Styles for viewports narrower than 760 pixels*/
@media (max-width: 760px) {

  .table_view_hide{
    display: none;
  } 

  div.register, div.profile {
    margin-bottom: 5px;
    margin-top: 15px;
    max-width:500px;
  }  
  
  div.info_ads_sub {
    margin: auto;
    width: 40%;
    float: none;
    text-align: center;
  }

  div.info_ads {
    margin: auto;
    width: 50%;
    float: none;
    text-align: center;
  }

  div.intro_header > div{
    height: 305px;
    vertical-align: middle;
    display:table-cell;
  }  

  div.info_footer{
    display: none;
  }

  div.info_ads_sub img, 
  div.info_ads img{
    max-width: 70%;
  }   

  #form_login{
    margin: 0 auto;
    float:none;
    max-width:595px;
    clear: both;
  }    
 
}


/*Styles for viewports narrower than 735 pixels*/
@media (max-width: 735px) {

  .room_header{
    font-size: 1.2em;
  }  

  .tab_title{
    display:none;
  }     

}

/*Styles for viewports narrower than 420 pixels*/
@media (max-width: 410px) {
  .login_options li a {
    font-family: open_sanscondensed_light, Arial;
    font-size: larger;
  }

}

/*Styles for viewports narrower than 560 pixels*/
@media (max-width: 560px) {

  #side_nav{
      border-right: 0px;
      height: 100vh;
      position:fixed;
      border:1px solid var(--second_color, #333);
      left:-182px;
      transition: 0.5s ease-out;
      top:0px;
      z-index: 10;
  }


  .side_nav_inner_div{
    height: auto;
  }    


  #side_network{
    border-right: 0px;
    height: 100vh;
    position:fixed;
    border-right:1px solid var(--second_color, #333);
    left:-182px;
    transition: 0.5s ease-out;
    top:0px;
    z-index: 10; 
  }

  .contacts_view_menu{
      display:block;
  }

  #list_nav li.main_nav_menu{
      display: block;
      float:left;
      margin-left: 0px;
  }

  #list_nav {
    margin-left: 0px;
  } 

  ul li.main_nav_menu,
  .main_nav_menu{
    display: inline-block;
  }

  #main_nav {
    margin:0px;
  }  

  #main_nav > div {
    text-align: center;
  }  
  
  .content_top_menu{
    margin:0px;
  }  

  .content_top_menu ul{
    margin:0px;
  }  

  div.list_view{
      margin-left: 0px;
      /*min-height:393px;*/
  }
  
  
  div.side_info{
    width:auto;
    display:block;
  } 

  .folder_label{
    display: block;
    margin-top:2px;
  }    

  .element_hide_narrow{
    display:none;
  }

  .select_room{
    width: 174px;
  }   

}


/* ---------------------------------------------------------
   media queries
   ---------------------------------------------------------*/
/*Styles for viewports wider than 950 pixels*/
@media (min-width: 950px) {
  .ads_view > * {
    width:70%;
  }

  .ads_view > *:nth-child(2) {
    width:30%;
  }  

  div.core_side_img img{
    height:450px;
  }  

  td.calendar_day_cell{
    height: 14vh;
  }
}

/*Styles for viewports wider than 800 pixels*/
@media (min-width: 800px) {
  .two_column_container{
    display:table;
  }

  div.side_img{
    width:55%;
    display:table-cell;
    padding:10px;
  }  

  div.side_img img{
    border-radius: 10px;
  }  
}


/*Styles for viewports wider than 1400 pixels*/
@media (min-width: 1400px) {
  .room_image{
    min-height: 400px;
  }

  #map_canvas{
    min-height: 400px;
  } 

  div.core_side_img img{
    height:550px;
  }    

  td.calendar_day_cell{
    height: 16vh;
  }

}



/*Styles for viewports wider than 1210 pixels*/
/*@media (min-width: 1210px) {
  .ads_view > * {
    width:60%;
  }
  .ads_view > *:nth-child(2) {
    width:40%;
  }  
  .right_ad_container img{
    max-width: 400px;
  }  
}*/