:root {
	--main-color: #30c7f4;
	--blue: #1e90ff;
	--white: #ffffff;
	--black: #000000;
}

@media print {
	@page {
	  size: A3;
	}
	body {
	  margin: 0;
	  padding: 0;
	  background: #fff !important; 
	  background-image: none !important;
	}

	.head_menu, #open-chatbot{
	  display: none !important;
	}
	
}


A:ACTIVE, A:LINK, A:VISITED {color : #424242; text-decoration : none;}

A:HOVER {color : var(--main-color); text-decoration : none;}

body {
	background:#e8eced;
	background-image: linear-gradient(to bottom, #C6C6C6 0%, #F5F5F5 51%);
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 13px;
	color: var(--black);
}

#form10{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 15px;
	color:var(--white);
	background:#BDBDBD;
	margin-left: 30px;
	vertical-align:top;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
}

#form11{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 15px;
	color:var(--black);
	background:#e8eced;
	margin-left: 30px;
	vertical-align:top;
}

#form21{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 13px;
	color:var(--black);
	background:#e8eced;
	vertical-align:top;
}

#form12{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 13px;
	color:var(--black);
	background:var(--white);
	margin-left: 30px;
	vertical-align:top;
}


/** colors - meetings**/
#form_green{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 16px;
	color:var(--black);
	background:var(--white);
	vertical-align:top;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-radius: 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  	border: 8px solid #addf3e;
}

#form_blue{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 16px;
	color:var(--black);
	background:var(--white);
	vertical-align:top;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-radius: 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  	border: 8px solid #bdd8e3;
}

#form_red{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 16px;
	color:var(--black);
	background:var(--white);
	vertical-align:top;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-radius: 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  	border: 8px solid #ed8b83;
}

#form_yellow{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 16px;
	color:var(--black);
	background:var(--white);
	vertical-align:top;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-radius: 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  	border: 8px solid #f7ef59;
}

#form_grey{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 16px;
	color:var(--black);
	background:var(--white);
	vertical-align:top;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-radius: 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  	border: 8px solid #D8D8D8;
}

#form_darkgreen{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 16px;
	color:var(--black);
	background:var(--white);
	vertical-align:top;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-radius: 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  	border: 8px solid #87AB83;
}

#form_lightgrey{
	font-family: arial, verdana, sans-serif, helvetica;
	font-size: 16px;
	color:var(--black);
	background:var(--white);
	vertical-align:top;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-radius: 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  	border: 8px solid #F2F2F2;
}
/** colors - meetings END**/

/** colors - meetings week**/
#week_red{
	background-color:#ed8b83;
	font-size: 13px;
	padding:4px;
}

#week_yellow{
	background-color:#f7ef59;
	;
	font-size: 13px;
	padding:4px;
}

#week_grey{
	background-color:#D8D8D8;
	font-size: 13px;
	padding:4px;
}

#week_lightgrey{
	background-color:#ededed;
	font-size: 13px;
	padding:4px;
}

#week_green{
	background-color:#addf3e;
	font-size: 13px;
	padding:4px;
}

#week_blue{
	background-color:#bdd8e3;
	font-size: 13px;
	padding:4px;
}

#week_darkgreen{
	background-color:#87AB83;
	font-size: 13px;
	padding:4px;
}
/** colors - meetings week END**/



#form_leer0{
	font-family: arial, verdana, sans-serif, helvetica;
	background:#ffffff;
	color:var(--black);
	font-size:1px;
}
#form_leer1{
	font-family: arial, verdana, sans-serif, helvetica;
	background:#e8eced;
	color:var(--black);
	font-size:1px;
}

#input_time{
   width:30%;
   height:50px;
   border:0px solid;
   border-radius: 8px;
   padding:7px;
   margin:3px;
   font-size:25px;
}

#input_big{
   width:80%;
   height:50px;
   border:0px solid;
   border-radius: 8px;
   padding:7px;
   margin:3px;
   font-size:25px;
}

.kalender_d{
   width:15%;
   height:50px;
   border:0px solid;
   border-radius: 8px;
   padding:7px;
   margin:3px;
   font-size:25px;
}

.kalender_m{
   width:30%;
   height:50px;
   border:0px solid;
   border-radius: 8px;
   padding:7px;
   margin:3px;
   font-size:25px;
}

.kalender_y{
   width:20%;
   height:50px;
   border:0px solid;
   border-radius: 8px;
   padding:7px;
   margin:3px;
   font-size:25px;
}

#input_gr{
   width:95%;
   height:50px;
   border:0px solid;
   border-radius: 8px;
   padding:7px;
   margin:3px;
   font-size:25px;
   display:block;
   background-color:var(--white);
}




#tasks{
   width:95%; 
   border:0px solid;
   border-radius: 8px;
   padding:7px;
   margin:3px;
   font-size:20px;
   background-color:var(--white);
}

#normal{
	font-size: 12px;
	color:var(--black);
	background-color:var(--white);
}
#red{
	font-size: 12px;
	color:var(--black);
	background-color:#eecbcb;
}

a.menu:active, a.menu:link, a.menu:visited, a.menu:hover, a.firstMenu:active, a.firstMenu:link, a.firstMenu:visited, a.firstMenu:hover {
  text-align: left;
  text-decoration: bold;
  color: var(--black);
  font-size: 13px;
}

a.menu:hover, a.firstMenu:hover{
  color: var(--white);
  background:#cd071e; 
  text-decoration: bold;
  font-size: 13px;
}


#ringerl{
	border:0px solid;
	border-radius: 8px;
	padding:5px;
	margin:3px;
	background: rgba(255, 255, 255, 0.7);
	border: 1px solid var(--main-color);
}

#ringerl_button{
	border:0px solid;
	border-radius: 8px;
	padding:7px;
	margin:3px;
	background: rgba(255, 255, 255, 0.7);
	float:left;
	width:18%;
	border: 1px solid var(--main-color);
}

#task_enable_checkbox{
	background-color:var(--white);
	display:block;
}

#button_submit{
	border:0px solid;
	border-radius: 8px;
	padding:7px;
	margin-top:10px;
	width:95%;
	height:50;
	font-size:25px;
	background-color:var(--white);
	cursor:pointer;
	display:block;
}

#frame{
	width:100%;
	height:100%;
}

body_termin_edit {
  width: 100%;
  height: 100%;  
  margin: 0;
  padding: 0;
  text-align: center;
}

input{
  display: none;
}

.button {
  display: inline-block;
  position: relative;
  width: 50px;
  height: 50px;
  margin: 10px;
  cursor: pointer;
}

.button span {
  display: block;
  position: absolute;
  width: 50px;
  height: 50px;
  padding: 0;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border-radius: 100%;
  background: #eeeeee;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  transition: ease .3s;
}

.button span:hover {
  padding: 10px;
}


/** colors - forms**/

.form_red .button span {
  background: #ed8b83;
}

.form_yellow .button span {
	background: #f7ef59;
  }
.form_green .button span {
  background: #addf3e;
}

.form_darkgreen .button span {
  background: #87AB83;
}

.form_blue .button span {
  background: #bdd8e3;
}

.form_grey .button span {
  background: #D8D8D8;
}

/** colors - forms END**/

.layer {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: transparent;
  /*transition: ease .3s;*/
  z-index: -1;
}

.form_red input:checked ~ .layer {
  background: #ed8b83;
}
.form_yellow input:checked ~ .layer {
	background: #f7ef59;
  }


.form_green input:checked ~ .layer {
  background: #addf3e;
}

.form_darkgreen input:checked ~ .layer {
  background: #87AB83;
}

.form_blue input:checked ~ .layer {
  background: #bdd8e3;
}

.form_grey input:checked ~ .layer {
  background: #D8D8D8;
}

#copyright_tag{
	display: block;
	margin: auto;
	text-align: center;
	font-size: 14px;
  	font-weight: bolder;
}

#copyright_tag:hover{
	color: #797979;
}


/*------New Styles-------*/
.flex{
	display: flex;
}
.subarea1{
	margin-left:5px;
}
.small_td{
	width: 30px;
}
.select_task_setting{
	width: 120px;
}
.color_line{
	width: 1px;
}
.mobile{
	display: none;
}
.action_symbols{
    padding: 2px;
    font-size: 16px;
    cursor:pointer; 
    background-color: transparent;
}


.head-td{
	width: 30%;
	text-align: center;
	vertical-align: middle;
}
.head-td:first-child{
	width: 10%;
	text-align: center;
}
.head-td > form > select{
	font-size: 18px; 
	width: 200px; 
	margin: auto;
	margin-top: 20px;
	padding: 20px 10px;
	border: 1px solid var(--main-color);
	border-radius: 8px;
	background: #fff;
	color: var(--main-color);
	font-weight: bold;
	box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}
.kalender-button{
	font-size: 18px; 
	padding: 12px 10px 8px 10px;
	border: 1px solid var(--main-color);
	border-radius: 8px;
	background: #fff;
	color: var(--main-color);
	  font-weight: bold;
	 
}

.button-blue{
	border: 1px solid var(--main-color);
	background: var(--main-color);
	color: #fff !important;
}


.modern-card{
	min-height: 500px;
	box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
	border-radius: 10px;
	padding: 1%;
	background-color: var(--white);
}

.login_div{
	max-width: 380px;
  	margin: auto;
	text-align: center;
	margin-top: 20px;
}
.login_div > h3{
	text-transform: uppercase;
}
.input_login{
	width:320px;
	display:inline-block;
	background: #fff;
	border: 1px solid #000;
	border-radius: 10px;
	padding: 10px;
}
 
.black_button{
	font-weight: bold;
	color: #fff;
	background: #000;
	border: 1px solid #000;
	border-radius: 10px;
	padding: 10px;
	text-transform: uppercase;
	cursor: pointer;
}
 
lable{
	font-weight: bold;
}

.input_fields input{
	display: block;
}


  /* customizable snowflake styling */
.snowflake {
  color: #c3eff7;
  font-size: 1.5em;
  font-family: Arial;
  text-shadow: 0 0 1px #fff;
}

@-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}
@-webkit-keyframes snowflakes-shake{0%{-webkit-transform:translateX(0px);transform:translateX(0px)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}100%{-webkit-transform:translateX(0px);transform:translateX(0px)}}
@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}
@keyframes snowflakes-shake{0%{transform:translateX(0px)}50%{transform:translateX(80px)}100%{transform:translateX(0px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}



@media screen and (min-width: 0px) and (max-width: 720px){
    main{
        width: 90% !important;
        padding: 5% !important;
    }
	
	.mobile{
		display: inline;
	}
    .flex{
        display: flex;
    }
    .desktop {
		display: none;
	}
	.subarea1{
		margin-left:5px;
	}
	.hidden_fields{
		display: none;
	}
	.select_task_setting{
		width: 80px;
	}
    .action_symbols{
        padding: 2px;
        font-size: 22px;  
    }
    .position_as{
        margin-top: -5px;
        margin-bottom: 5px;
    }
	
}